mirror of https://github.com/freeCodeCamp/devdocs
parent
bbadf5f228
commit
5f63145de1
@ -1,252 +1,216 @@
|
||||
// TODO: This file was created by bulk-decaffeinate.
|
||||
// Sanity-check the conversion and remove this comment.
|
||||
/*
|
||||
* decaffeinate suggestions:
|
||||
* DS101: Remove unnecessary use of Array.from
|
||||
* DS102: Remove unnecessary code created because of implicit returns
|
||||
* DS103: Rewrite code to no longer use __guard__, or convert again using --optional-chaining
|
||||
* DS104: Avoid inline assignments
|
||||
* 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 PREFERENCE_KEYS = undefined;
|
||||
let INTERNAL_KEYS = undefined;
|
||||
app.Settings = class Settings {
|
||||
static initClass() {
|
||||
PREFERENCE_KEYS = [
|
||||
"hideDisabled",
|
||||
"hideIntro",
|
||||
"manualUpdate",
|
||||
"fastScroll",
|
||||
"arrowScroll",
|
||||
"analyticsConsent",
|
||||
"docs",
|
||||
"dark", // legacy
|
||||
"theme",
|
||||
"layout",
|
||||
"size",
|
||||
"tips",
|
||||
"noAutofocus",
|
||||
"autoInstall",
|
||||
"spaceScroll",
|
||||
"spaceTimeout",
|
||||
];
|
||||
|
||||
INTERNAL_KEYS = ["count", "schema", "version", "news"];
|
||||
|
||||
this.prototype.LAYOUTS = [
|
||||
"_max-width",
|
||||
"_sidebar-hidden",
|
||||
"_native-scrollbars",
|
||||
"_text-justify-hyphenate",
|
||||
];
|
||||
|
||||
this.defaults = {
|
||||
count: 0,
|
||||
hideDisabled: false,
|
||||
hideIntro: false,
|
||||
news: 0,
|
||||
manualUpdate: false,
|
||||
schema: 1,
|
||||
analyticsConsent: false,
|
||||
theme: "auto",
|
||||
spaceScroll: 1,
|
||||
spaceTimeout: 0.5,
|
||||
};
|
||||
}
|
||||
|
||||
constructor() {
|
||||
this.store = new CookiesStore();
|
||||
this.cache = {};
|
||||
this.autoSupported =
|
||||
window.matchMedia("(prefers-color-scheme)").media !== "not all";
|
||||
if (this.autoSupported) {
|
||||
this.darkModeQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
this.darkModeQuery.addListener(() => this.setTheme(this.get("theme")));
|
||||
}
|
||||
}
|
||||
|
||||
get(key) {
|
||||
let left;
|
||||
if (this.cache.hasOwnProperty(key)) {
|
||||
return this.cache[key];
|
||||
}
|
||||
this.cache[key] =
|
||||
(left = this.store.get(key)) != null
|
||||
? left
|
||||
: this.constructor.defaults[key];
|
||||
if (
|
||||
key === "theme" &&
|
||||
this.cache[key] === "auto" &&
|
||||
!this.darkModeQuery
|
||||
) {
|
||||
return (this.cache[key] = "default");
|
||||
} else {
|
||||
return this.cache[key];
|
||||
}
|
||||
}
|
||||
|
||||
set(key, value) {
|
||||
this.store.set(key, value);
|
||||
delete this.cache[key];
|
||||
if (key === "theme") {
|
||||
this.setTheme(value);
|
||||
}
|
||||
}
|
||||
|
||||
del(key) {
|
||||
this.store.del(key);
|
||||
delete this.cache[key];
|
||||
}
|
||||
|
||||
hasDocs() {
|
||||
try {
|
||||
return !!this.store.get("docs");
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
getDocs() {
|
||||
return (
|
||||
__guard__(this.store.get("docs"), (x) => x.split("/")) ||
|
||||
app.config.default_docs
|
||||
);
|
||||
}
|
||||
|
||||
setDocs(docs) {
|
||||
this.set("docs", docs.join("/"));
|
||||
}
|
||||
|
||||
getTips() {
|
||||
return __guard__(this.store.get("tips"), (x) => x.split("/")) || [];
|
||||
}
|
||||
|
||||
setTips(tips) {
|
||||
this.set("tips", tips.join("/"));
|
||||
}
|
||||
|
||||
setLayout(name, enable) {
|
||||
this.toggleLayout(name, enable);
|
||||
|
||||
const layout = (this.store.get("layout") || "").split(" ");
|
||||
$.arrayDelete(layout, "");
|
||||
|
||||
if (enable) {
|
||||
if (layout.indexOf(name) === -1) {
|
||||
layout.push(name);
|
||||
}
|
||||
} else {
|
||||
$.arrayDelete(layout, name);
|
||||
}
|
||||
|
||||
if (layout.length > 0) {
|
||||
this.set("layout", layout.join(" "));
|
||||
} else {
|
||||
this.del("layout");
|
||||
}
|
||||
}
|
||||
|
||||
hasLayout(name) {
|
||||
const layout = (this.store.get("layout") || "").split(" ");
|
||||
return layout.indexOf(name) !== -1;
|
||||
}
|
||||
|
||||
setSize(value) {
|
||||
this.set("size", value);
|
||||
}
|
||||
|
||||
dump() {
|
||||
return this.store.dump();
|
||||
}
|
||||
app.Settings = class Settings {
|
||||
static PREFERENCE_KEYS = [
|
||||
"hideDisabled",
|
||||
"hideIntro",
|
||||
"manualUpdate",
|
||||
"fastScroll",
|
||||
"arrowScroll",
|
||||
"analyticsConsent",
|
||||
"docs",
|
||||
"dark", // legacy
|
||||
"theme",
|
||||
"layout",
|
||||
"size",
|
||||
"tips",
|
||||
"noAutofocus",
|
||||
"autoInstall",
|
||||
"spaceScroll",
|
||||
"spaceTimeout",
|
||||
];
|
||||
|
||||
static INTERNAL_KEYS = ["count", "schema", "version", "news"];
|
||||
|
||||
static LAYOUTS = [
|
||||
"_max-width",
|
||||
"_sidebar-hidden",
|
||||
"_native-scrollbars",
|
||||
"_text-justify-hyphenate",
|
||||
];
|
||||
|
||||
static defaults = {
|
||||
count: 0,
|
||||
hideDisabled: false,
|
||||
hideIntro: false,
|
||||
news: 0,
|
||||
manualUpdate: false,
|
||||
schema: 1,
|
||||
analyticsConsent: false,
|
||||
theme: "auto",
|
||||
spaceScroll: 1,
|
||||
spaceTimeout: 0.5,
|
||||
};
|
||||
|
||||
export() {
|
||||
const data = this.dump();
|
||||
for (var key of Array.from(INTERNAL_KEYS)) {
|
||||
delete data[key];
|
||||
constructor() {
|
||||
this.store = new CookiesStore();
|
||||
this.cache = {};
|
||||
this.autoSupported =
|
||||
window.matchMedia("(prefers-color-scheme)").media !== "not all";
|
||||
if (this.autoSupported) {
|
||||
this.darkModeQuery = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
this.darkModeQuery.addListener(() => this.setTheme(this.get("theme")));
|
||||
}
|
||||
}
|
||||
|
||||
get(key) {
|
||||
let left;
|
||||
if (this.cache.hasOwnProperty(key)) {
|
||||
return this.cache[key];
|
||||
}
|
||||
this.cache[key] =
|
||||
(left = this.store.get(key)) != null
|
||||
? left
|
||||
: this.constructor.defaults[key];
|
||||
if (key === "theme" && this.cache[key] === "auto" && !this.darkModeQuery) {
|
||||
return (this.cache[key] = "default");
|
||||
} else {
|
||||
return this.cache[key];
|
||||
}
|
||||
}
|
||||
|
||||
set(key, value) {
|
||||
this.store.set(key, value);
|
||||
delete this.cache[key];
|
||||
if (key === "theme") {
|
||||
this.setTheme(value);
|
||||
}
|
||||
}
|
||||
|
||||
del(key) {
|
||||
this.store.del(key);
|
||||
delete this.cache[key];
|
||||
}
|
||||
|
||||
hasDocs() {
|
||||
try {
|
||||
return !!this.store.get("docs");
|
||||
} catch (error) {}
|
||||
}
|
||||
|
||||
getDocs() {
|
||||
return this.store.get("docs")?.split("/") || app.config.default_docs;
|
||||
}
|
||||
|
||||
setDocs(docs) {
|
||||
this.set("docs", docs.join("/"));
|
||||
}
|
||||
|
||||
getTips() {
|
||||
return this.store.get("tips")?.split("/") || [];
|
||||
}
|
||||
|
||||
setTips(tips) {
|
||||
this.set("tips", tips.join("/"));
|
||||
}
|
||||
|
||||
setLayout(name, enable) {
|
||||
this.toggleLayout(name, enable);
|
||||
|
||||
const layout = (this.store.get("layout") || "").split(" ");
|
||||
$.arrayDelete(layout, "");
|
||||
|
||||
if (enable) {
|
||||
if (layout.indexOf(name) === -1) {
|
||||
layout.push(name);
|
||||
}
|
||||
return data;
|
||||
} else {
|
||||
$.arrayDelete(layout, name);
|
||||
}
|
||||
|
||||
import(data) {
|
||||
let key, value;
|
||||
const object = this.export();
|
||||
for (key in object) {
|
||||
value = object[key];
|
||||
if (!data.hasOwnProperty(key)) {
|
||||
this.del(key);
|
||||
}
|
||||
}
|
||||
for (key in data) {
|
||||
value = data[key];
|
||||
if (PREFERENCE_KEYS.indexOf(key) !== -1) {
|
||||
this.set(key, value);
|
||||
}
|
||||
}
|
||||
if (layout.length > 0) {
|
||||
this.set("layout", layout.join(" "));
|
||||
} else {
|
||||
this.del("layout");
|
||||
}
|
||||
}
|
||||
|
||||
reset() {
|
||||
this.store.reset();
|
||||
this.cache = {};
|
||||
}
|
||||
hasLayout(name) {
|
||||
const layout = (this.store.get("layout") || "").split(" ");
|
||||
return layout.indexOf(name) !== -1;
|
||||
}
|
||||
|
||||
initLayout() {
|
||||
if (this.get("dark") === 1) {
|
||||
this.set("theme", "dark");
|
||||
this.del("dark");
|
||||
}
|
||||
this.setTheme(this.get("theme"));
|
||||
for (var layout of Array.from(this.LAYOUTS)) {
|
||||
this.toggleLayout(layout, this.hasLayout(layout));
|
||||
}
|
||||
this.initSidebarWidth();
|
||||
}
|
||||
setSize(value) {
|
||||
this.set("size", value);
|
||||
}
|
||||
|
||||
setTheme(theme) {
|
||||
if (theme === "auto") {
|
||||
theme = this.darkModeQuery.matches ? "dark" : "default";
|
||||
}
|
||||
const { classList } = document.documentElement;
|
||||
classList.remove("_theme-default", "_theme-dark");
|
||||
classList.add("_theme-" + theme);
|
||||
this.updateColorMeta();
|
||||
}
|
||||
dump() {
|
||||
return this.store.dump();
|
||||
}
|
||||
|
||||
updateColorMeta() {
|
||||
const color = getComputedStyle(document.documentElement)
|
||||
.getPropertyValue("--headerBackground")
|
||||
.trim();
|
||||
$("meta[name=theme-color]").setAttribute("content", color);
|
||||
export() {
|
||||
const data = this.dump();
|
||||
for (var key of Settings.INTERNAL_KEYS) {
|
||||
delete data[key];
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
toggleLayout(layout, enable) {
|
||||
const { classList } = document.body;
|
||||
// sidebar is always shown for settings; its state is updated in app.views.Settings
|
||||
if (
|
||||
layout !== "_sidebar-hidden" ||
|
||||
!(app.router != null ? app.router.isSettings : undefined)
|
||||
) {
|
||||
classList.toggle(layout, enable);
|
||||
import(data) {
|
||||
let key, value;
|
||||
const object = this.export();
|
||||
for (key in object) {
|
||||
value = object[key];
|
||||
if (!data.hasOwnProperty(key)) {
|
||||
this.del(key);
|
||||
}
|
||||
classList.toggle("_overlay-scrollbars", $.overlayScrollbarsEnabled());
|
||||
}
|
||||
|
||||
initSidebarWidth() {
|
||||
const size = this.get("size");
|
||||
if (size) {
|
||||
document.documentElement.style.setProperty(
|
||||
"--sidebarWidth",
|
||||
size + "px",
|
||||
);
|
||||
for (key in data) {
|
||||
value = data[key];
|
||||
if (Settings.PREFERENCE_KEYS.indexOf(key) !== -1) {
|
||||
this.set(key, value);
|
||||
}
|
||||
}
|
||||
};
|
||||
app.Settings.initClass();
|
||||
return app.Settings;
|
||||
})();
|
||||
|
||||
function __guard__(value, transform) {
|
||||
return typeof value !== "undefined" && value !== null
|
||||
? transform(value)
|
||||
: undefined;
|
||||
}
|
||||
}
|
||||
|
||||
reset() {
|
||||
this.store.reset();
|
||||
this.cache = {};
|
||||
}
|
||||
|
||||
initLayout() {
|
||||
if (this.get("dark") === 1) {
|
||||
this.set("theme", "dark");
|
||||
this.del("dark");
|
||||
}
|
||||
this.setTheme(this.get("theme"));
|
||||
for (var layout of app.Settings.LAYOUTS) {
|
||||
this.toggleLayout(layout, this.hasLayout(layout));
|
||||
}
|
||||
this.initSidebarWidth();
|
||||
}
|
||||
|
||||
setTheme(theme) {
|
||||
if (theme === "auto") {
|
||||
theme = this.darkModeQuery.matches ? "dark" : "default";
|
||||
}
|
||||
const { classList } = document.documentElement;
|
||||
classList.remove("_theme-default", "_theme-dark");
|
||||
classList.add("_theme-" + theme);
|
||||
this.updateColorMeta();
|
||||
}
|
||||
|
||||
updateColorMeta() {
|
||||
const color = getComputedStyle(document.documentElement)
|
||||
.getPropertyValue("--headerBackground")
|
||||
.trim();
|
||||
$("meta[name=theme-color]").setAttribute("content", color);
|
||||
}
|
||||
|
||||
toggleLayout(layout, enable) {
|
||||
const { classList } = document.body;
|
||||
// sidebar is always shown for settings; its state is updated in app.views.Settings
|
||||
if (
|
||||
layout !== "_sidebar-hidden" ||
|
||||
!(app.router != null ? app.router.isSettings : undefined)
|
||||
) {
|
||||
classList.toggle(layout, enable);
|
||||
}
|
||||
classList.toggle("_overlay-scrollbars", $.overlayScrollbarsEnabled());
|
||||
}
|
||||
|
||||
initSidebarWidth() {
|
||||
const size = this.get("size");
|
||||
if (size) {
|
||||
document.documentElement.style.setProperty("--sidebarWidth", size + "px");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
Loading…
Reference in new issue