mirror of https://github.com/freeCodeCamp/devdocs
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
129 lines
3.6 KiB
129 lines
3.6 KiB
/*
|
|
* decaffeinate suggestions:
|
|
* DS002: Fix invalid constructor
|
|
* DS101: Remove unnecessary use of Array.from
|
|
* DS102: Remove unnecessary code created because of implicit returns
|
|
* DS206: Consider reworking classes to avoid initClass
|
|
* Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
|
|
*/
|
|
const Cls = (app.views.OfflinePage = class OfflinePage extends app.View {
|
|
constructor(...args) {
|
|
this.onClick = this.onClick.bind(this);
|
|
super(...args);
|
|
}
|
|
|
|
static initClass() {
|
|
this.className = '_static';
|
|
|
|
this.events = {
|
|
click: 'onClick',
|
|
change: 'onChange'
|
|
};
|
|
}
|
|
|
|
deactivate() {
|
|
if (super.deactivate(...arguments)) {
|
|
this.empty();
|
|
}
|
|
}
|
|
|
|
render() {
|
|
if (app.cookieBlocked) {
|
|
this.html(this.tmpl('offlineError', 'cookie_blocked'));
|
|
return;
|
|
}
|
|
|
|
app.docs.getInstallStatuses(statuses => {
|
|
if (!this.activated) { return; }
|
|
if (statuses === false) {
|
|
this.html(this.tmpl('offlineError', app.db.reason, app.db.error));
|
|
} else {
|
|
let html = '';
|
|
for (var doc of Array.from(app.docs.all())) { html += this.renderDoc(doc, statuses[doc.slug]); }
|
|
this.html(this.tmpl('offlinePage', html));
|
|
this.refreshLinks();
|
|
}
|
|
});
|
|
}
|
|
|
|
renderDoc(doc, status) {
|
|
return app.templates.render('offlineDoc', doc, status);
|
|
}
|
|
|
|
getTitle() {
|
|
return 'Offline';
|
|
}
|
|
|
|
refreshLinks() {
|
|
for (var action of ['install', 'update', 'uninstall']) {
|
|
this.find(`[data-action-all='${action}']`).classList[this.find(`[data-action='${action}']`) ? 'add' : 'remove']('_show');
|
|
}
|
|
}
|
|
|
|
docByEl(el) {
|
|
let slug;
|
|
while (!(slug = el.getAttribute('data-slug'))) { el = el.parentNode; }
|
|
return app.docs.findBy('slug', slug);
|
|
}
|
|
|
|
docEl(doc) {
|
|
return this.find(`[data-slug='${doc.slug}']`);
|
|
}
|
|
|
|
onRoute(context) {
|
|
this.render();
|
|
}
|
|
|
|
onClick(event) {
|
|
let action;
|
|
let el = $.eventTarget(event);
|
|
if (action = el.getAttribute('data-action')) {
|
|
const doc = this.docByEl(el);
|
|
if (action === 'update') { action = 'install'; }
|
|
doc[action](this.onInstallSuccess.bind(this, doc), this.onInstallError.bind(this, doc), this.onInstallProgress.bind(this, doc));
|
|
el.parentNode.innerHTML = `${el.textContent.replace(/e$/, '')}ing…`;
|
|
} else if (action = el.getAttribute('data-action-all') || el.parentElement.getAttribute('data-action-all')) {
|
|
if ((action === 'uninstall') && !window.confirm('Uninstall all docs?')) { return; }
|
|
app.db.migrate();
|
|
for (el of Array.from(this.findAll(`[data-action='${action}']`))) { $.click(el); }
|
|
}
|
|
}
|
|
|
|
onInstallSuccess(doc) {
|
|
if (!this.activated) { return; }
|
|
doc.getInstallStatus(status => {
|
|
let el;
|
|
if (!this.activated) { return; }
|
|
if (el = this.docEl(doc)) {
|
|
el.outerHTML = this.renderDoc(doc, status);
|
|
$.highlight(el, {className: '_highlight'});
|
|
this.refreshLinks();
|
|
}
|
|
});
|
|
}
|
|
|
|
onInstallError(doc) {
|
|
let el;
|
|
if (!this.activated) { return; }
|
|
if (el = this.docEl(doc)) {
|
|
el.lastElementChild.textContent = 'Error';
|
|
}
|
|
}
|
|
|
|
onInstallProgress(doc, event) {
|
|
let el;
|
|
if (!this.activated || !event.lengthComputable) { return; }
|
|
if (el = this.docEl(doc)) {
|
|
const percentage = Math.round((event.loaded * 100) / event.total);
|
|
el.lastElementChild.textContent = el.lastElementChild.textContent.replace(/(\s.+)?$/, ` (${percentage}%)`);
|
|
}
|
|
}
|
|
|
|
onChange(event) {
|
|
if (event.target.name === 'autoUpdate') {
|
|
app.settings.set('manualUpdate', !event.target.checked);
|
|
}
|
|
}
|
|
});
|
|
Cls.initClass();
|