mirror of https://github.com/freeCodeCamp/devdocs
Simon Legner
1 year ago
parent
1995d8a3bb
commit
7fa81665df
@ -1,266 +1,247 @@
|
|||||||
// TODO: This file was created by bulk-decaffeinate.
|
app.views.EntryPage = class EntryPage extends app.View {
|
||||||
// Sanity-check the conversion and remove this comment.
|
static className = "_page";
|
||||||
/*
|
static errorClass = "_page-error";
|
||||||
* decaffeinate suggestions:
|
|
||||||
* DS101: Remove unnecessary use of Array.from
|
|
||||||
* DS102: Remove unnecessary code created because of implicit returns
|
|
||||||
* DS205: Consider reworking code to avoid use of IIFEs
|
|
||||||
* DS206: Consider reworking classes to avoid initClass
|
|
||||||
* DS207: Consider shorter variations of null checks
|
|
||||||
* Full docs: https://github.com/decaffeinate/decaffeinate/blob/main/docs/suggestions.md
|
|
||||||
*/
|
|
||||||
(function () {
|
|
||||||
let LINKS = undefined;
|
|
||||||
app.views.EntryPage = class EntryPage extends app.View {
|
|
||||||
static initClass() {
|
|
||||||
this.className = "_page";
|
|
||||||
this.errorClass = "_page-error";
|
|
||||||
|
|
||||||
this.events = { click: "onClick" };
|
|
||||||
|
|
||||||
this.shortcuts = {
|
|
||||||
altC: "onAltC",
|
|
||||||
altO: "onAltO",
|
|
||||||
};
|
|
||||||
|
|
||||||
this.routes = { before: "beforeRoute" };
|
|
||||||
|
|
||||||
LINKS = {
|
|
||||||
home: "Homepage",
|
|
||||||
code: "Source code",
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
init() {
|
|
||||||
this.cacheMap = {};
|
|
||||||
this.cacheStack = [];
|
|
||||||
}
|
|
||||||
|
|
||||||
deactivate() {
|
|
||||||
if (super.deactivate(...arguments)) {
|
|
||||||
this.empty();
|
|
||||||
this.entry = null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
loading() {
|
|
||||||
this.empty();
|
|
||||||
this.trigger("loading");
|
|
||||||
}
|
|
||||||
|
|
||||||
render(content, fromCache) {
|
|
||||||
if (content == null) {
|
|
||||||
content = "";
|
|
||||||
}
|
|
||||||
if (fromCache == null) {
|
|
||||||
fromCache = false;
|
|
||||||
}
|
|
||||||
if (!this.activated) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.empty();
|
|
||||||
this.subview = new (this.subViewClass())(this.el, this.entry);
|
|
||||||
|
|
||||||
$.batchUpdate(this.el, () => {
|
static events = { click: "onClick" };
|
||||||
this.subview.render(content, fromCache);
|
|
||||||
if (!fromCache) {
|
|
||||||
this.addCopyButtons();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
if (app.disabledDocs.findBy("slug", this.entry.doc.slug)) {
|
static shortcuts = {
|
||||||
this.hiddenView = new app.views.HiddenPage(this.el, this.entry);
|
altC: "onAltC",
|
||||||
}
|
altO: "onAltO",
|
||||||
|
};
|
||||||
setFaviconForDoc(this.entry.doc);
|
|
||||||
this.delay(this.polyfillMathML);
|
|
||||||
this.trigger("loaded");
|
|
||||||
}
|
|
||||||
|
|
||||||
addCopyButtons() {
|
static routes = { before: "beforeRoute" };
|
||||||
if (!this.copyButton) {
|
|
||||||
this.copyButton = document.createElement("button");
|
|
||||||
this.copyButton.innerHTML = '<svg><use xlink:href="#icon-copy"/></svg>';
|
|
||||||
this.copyButton.type = "button";
|
|
||||||
this.copyButton.className = "_pre-clip";
|
|
||||||
this.copyButton.title = "Copy to clipboard";
|
|
||||||
this.copyButton.setAttribute("aria-label", "Copy to clipboard");
|
|
||||||
}
|
|
||||||
for (var el of Array.from(this.findAllByTag("pre"))) {
|
|
||||||
el.appendChild(this.copyButton.cloneNode(true));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
polyfillMathML() {
|
static LINKS = {
|
||||||
if (
|
home: "Homepage",
|
||||||
window.supportsMathML !== false ||
|
code: "Source code",
|
||||||
!!this.polyfilledMathML ||
|
};
|
||||||
!this.findByTag("math")
|
|
||||||
) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.polyfilledMathML = true;
|
|
||||||
$.append(
|
|
||||||
document.head,
|
|
||||||
`<link rel="stylesheet" href="${app.config.mathml_stylesheet}">`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
prepareContent(content) {
|
init() {
|
||||||
if (!this.entry.isIndex() || !this.entry.doc.links) {
|
this.cacheMap = {};
|
||||||
return content;
|
this.cacheStack = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
const links = (() => {
|
deactivate() {
|
||||||
const result = [];
|
if (super.deactivate(...arguments)) {
|
||||||
for (var link in this.entry.doc.links) {
|
this.empty();
|
||||||
var url = this.entry.doc.links[link];
|
this.entry = null;
|
||||||
result.push(
|
|
||||||
`<a href="${url}" class="_links-link">${LINKS[link]}</a>`,
|
|
||||||
);
|
|
||||||
}
|
|
||||||
return result;
|
|
||||||
})();
|
|
||||||
|
|
||||||
return `<p class="_links">${links.join("")}</p>${content}`;
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
empty() {
|
loading() {
|
||||||
if (this.subview != null) {
|
this.empty();
|
||||||
this.subview.deactivate();
|
this.trigger("loading");
|
||||||
}
|
}
|
||||||
this.subview = null;
|
|
||||||
|
|
||||||
if (this.hiddenView != null) {
|
|
||||||
this.hiddenView.deactivate();
|
|
||||||
}
|
|
||||||
this.hiddenView = null;
|
|
||||||
|
|
||||||
this.resetClass();
|
render(content, fromCache) {
|
||||||
super.empty(...arguments);
|
if (content == null) {
|
||||||
|
content = "";
|
||||||
}
|
}
|
||||||
|
if (fromCache == null) {
|
||||||
subViewClass() {
|
fromCache = false;
|
||||||
return (
|
|
||||||
app.views[`${$.classify(this.entry.doc.type)}Page`] ||
|
|
||||||
app.views.BasePage
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
getTitle() {
|
|
||||||
return (
|
|
||||||
this.entry.doc.fullName +
|
|
||||||
(this.entry.isIndex() ? " documentation" : ` / ${this.entry.name}`)
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
if (!this.activated) {
|
||||||
beforeRoute() {
|
return;
|
||||||
this.cache();
|
|
||||||
this.abort();
|
|
||||||
}
|
}
|
||||||
|
this.empty();
|
||||||
|
this.subview = new (this.subViewClass())(this.el, this.entry);
|
||||||
|
|
||||||
onRoute(context) {
|
$.batchUpdate(this.el, () => {
|
||||||
const isSameFile =
|
this.subview.render(content, fromCache);
|
||||||
context.entry.filePath() ===
|
if (!fromCache) {
|
||||||
(this.entry != null ? this.entry.filePath() : undefined);
|
this.addCopyButtons();
|
||||||
this.entry = context.entry;
|
|
||||||
if (!isSameFile) {
|
|
||||||
this.restore() || this.load();
|
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
|
||||||
load() {
|
if (app.disabledDocs.findBy("slug", this.entry.doc.slug)) {
|
||||||
this.loading();
|
this.hiddenView = new app.views.HiddenPage(this.el, this.entry);
|
||||||
this.xhr = this.entry.loadFile(
|
|
||||||
(response) => this.onSuccess(response),
|
|
||||||
() => this.onError(),
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
abort() {
|
setFaviconForDoc(this.entry.doc);
|
||||||
if (this.xhr) {
|
this.delay(this.polyfillMathML);
|
||||||
this.xhr.abort();
|
this.trigger("loaded");
|
||||||
this.xhr = this.entry = null;
|
}
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onSuccess(response) {
|
addCopyButtons() {
|
||||||
if (!this.activated) {
|
if (!this.copyButton) {
|
||||||
return;
|
this.copyButton = document.createElement("button");
|
||||||
}
|
this.copyButton.innerHTML = '<svg><use xlink:href="#icon-copy"/></svg>';
|
||||||
this.xhr = null;
|
this.copyButton.type = "button";
|
||||||
this.render(this.prepareContent(response));
|
this.copyButton.className = "_pre-clip";
|
||||||
|
this.copyButton.title = "Copy to clipboard";
|
||||||
|
this.copyButton.setAttribute("aria-label", "Copy to clipboard");
|
||||||
}
|
}
|
||||||
|
for (var el of this.findAllByTag("pre")) {
|
||||||
onError() {
|
el.appendChild(this.copyButton.cloneNode(true));
|
||||||
this.xhr = null;
|
|
||||||
this.render(this.tmpl("pageLoadError"));
|
|
||||||
this.resetClass();
|
|
||||||
this.addClass(this.constructor.errorClass);
|
|
||||||
if (app.serviceWorker != null) {
|
|
||||||
app.serviceWorker.update();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
cache() {
|
polyfillMathML() {
|
||||||
let path;
|
if (
|
||||||
if (
|
window.supportsMathML !== false ||
|
||||||
this.xhr ||
|
!!this.polyfilledMathML ||
|
||||||
!this.entry ||
|
!this.findByTag("math")
|
||||||
this.cacheMap[(path = this.entry.filePath())]
|
) {
|
||||||
) {
|
return;
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.cacheMap[path] = this.el.innerHTML;
|
|
||||||
this.cacheStack.push(path);
|
|
||||||
|
|
||||||
while (this.cacheStack.length > app.config.history_cache_size) {
|
|
||||||
delete this.cacheMap[this.cacheStack.shift()];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
this.polyfilledMathML = true;
|
||||||
|
$.append(
|
||||||
|
document.head,
|
||||||
|
`<link rel="stylesheet" href="${app.config.mathml_stylesheet}">`,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
restore() {
|
prepareContent(content) {
|
||||||
let path;
|
if (!this.entry.isIndex() || !this.entry.doc.links) {
|
||||||
if (this.cacheMap[(path = this.entry.filePath())]) {
|
return content;
|
||||||
this.render(this.cacheMap[path], true);
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onClick(event) {
|
const links = (() => {
|
||||||
const target = $.eventTarget(event);
|
const result = [];
|
||||||
if (target.hasAttribute("data-retry")) {
|
for (var link in this.entry.doc.links) {
|
||||||
$.stopEvent(event);
|
var url = this.entry.doc.links[link];
|
||||||
this.load();
|
result.push(
|
||||||
} else if (target.classList.contains("_pre-clip")) {
|
`<a href="${url}" class="_links-link">${EntryPage.LINKS[link]}</a>`,
|
||||||
$.stopEvent(event);
|
|
||||||
target.classList.add(
|
|
||||||
$.copyToClipboard(target.parentNode.textContent)
|
|
||||||
? "_pre-clip-success"
|
|
||||||
: "_pre-clip-error",
|
|
||||||
);
|
);
|
||||||
setTimeout(() => (target.className = "_pre-clip"), 2000);
|
|
||||||
}
|
}
|
||||||
|
return result;
|
||||||
|
})();
|
||||||
|
|
||||||
|
return `<p class="_links">${links.join("")}</p>${content}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
empty() {
|
||||||
|
if (this.subview != null) {
|
||||||
|
this.subview.deactivate();
|
||||||
|
}
|
||||||
|
this.subview = null;
|
||||||
|
|
||||||
|
if (this.hiddenView != null) {
|
||||||
|
this.hiddenView.deactivate();
|
||||||
|
}
|
||||||
|
this.hiddenView = null;
|
||||||
|
|
||||||
|
this.resetClass();
|
||||||
|
super.empty(...arguments);
|
||||||
|
}
|
||||||
|
|
||||||
|
subViewClass() {
|
||||||
|
return (
|
||||||
|
app.views[`${$.classify(this.entry.doc.type)}Page`] || app.views.BasePage
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
getTitle() {
|
||||||
|
return (
|
||||||
|
this.entry.doc.fullName +
|
||||||
|
(this.entry.isIndex() ? " documentation" : ` / ${this.entry.name}`)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
beforeRoute() {
|
||||||
|
this.cache();
|
||||||
|
this.abort();
|
||||||
|
}
|
||||||
|
|
||||||
|
onRoute(context) {
|
||||||
|
const isSameFile =
|
||||||
|
context.entry.filePath() ===
|
||||||
|
(this.entry != null ? this.entry.filePath() : undefined);
|
||||||
|
this.entry = context.entry;
|
||||||
|
if (!isSameFile) {
|
||||||
|
this.restore() || this.load();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
load() {
|
||||||
|
this.loading();
|
||||||
|
this.xhr = this.entry.loadFile(
|
||||||
|
(response) => this.onSuccess(response),
|
||||||
|
() => this.onError(),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
abort() {
|
||||||
|
if (this.xhr) {
|
||||||
|
this.xhr.abort();
|
||||||
|
this.xhr = this.entry = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onSuccess(response) {
|
||||||
|
if (!this.activated) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.xhr = null;
|
||||||
|
this.render(this.prepareContent(response));
|
||||||
|
}
|
||||||
|
|
||||||
|
onError() {
|
||||||
|
this.xhr = null;
|
||||||
|
this.render(this.tmpl("pageLoadError"));
|
||||||
|
this.resetClass();
|
||||||
|
this.addClass(this.constructor.errorClass);
|
||||||
|
if (app.serviceWorker != null) {
|
||||||
|
app.serviceWorker.update();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
cache() {
|
||||||
|
let path;
|
||||||
|
if (
|
||||||
|
this.xhr ||
|
||||||
|
!this.entry ||
|
||||||
|
this.cacheMap[(path = this.entry.filePath())]
|
||||||
|
) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.cacheMap[path] = this.el.innerHTML;
|
||||||
|
this.cacheStack.push(path);
|
||||||
|
|
||||||
|
while (this.cacheStack.length > app.config.history_cache_size) {
|
||||||
|
delete this.cacheMap[this.cacheStack.shift()];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
restore() {
|
||||||
|
let path;
|
||||||
|
if (this.cacheMap[(path = this.entry.filePath())]) {
|
||||||
|
this.render(this.cacheMap[path], true);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onClick(event) {
|
||||||
|
const target = $.eventTarget(event);
|
||||||
|
if (target.hasAttribute("data-retry")) {
|
||||||
|
$.stopEvent(event);
|
||||||
|
this.load();
|
||||||
|
} else if (target.classList.contains("_pre-clip")) {
|
||||||
|
$.stopEvent(event);
|
||||||
|
target.classList.add(
|
||||||
|
$.copyToClipboard(target.parentNode.textContent)
|
||||||
|
? "_pre-clip-success"
|
||||||
|
: "_pre-clip-error",
|
||||||
|
);
|
||||||
|
setTimeout(() => (target.className = "_pre-clip"), 2000);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
onAltC() {
|
onAltC() {
|
||||||
let link;
|
let link;
|
||||||
if (!(link = this.find("._attribution:last-child ._attribution-link"))) {
|
if (!(link = this.find("._attribution:last-child ._attribution-link"))) {
|
||||||
return;
|
return;
|
||||||
}
|
|
||||||
console.log(link.href + location.hash);
|
|
||||||
navigator.clipboard.writeText(link.href + location.hash);
|
|
||||||
}
|
}
|
||||||
|
console.log(link.href + location.hash);
|
||||||
|
navigator.clipboard.writeText(link.href + location.hash);
|
||||||
|
}
|
||||||
|
|
||||||
onAltO() {
|
onAltO() {
|
||||||
let link;
|
let link;
|
||||||
if (!(link = this.find("._attribution:last-child ._attribution-link"))) {
|
if (!(link = this.find("._attribution:last-child ._attribution-link"))) {
|
||||||
return;
|
return;
|
||||||
}
|
|
||||||
this.delay(() => $.popup(link.href + location.hash));
|
|
||||||
}
|
}
|
||||||
};
|
this.delay(() => $.popup(link.href + location.hash));
|
||||||
app.views.EntryPage.initClass();
|
}
|
||||||
return app.views.EntryPage;
|
};
|
||||||
})();
|
|
||||||
|
|||||||
Loading…
Reference in new issue