diff --git a/package-lock.json b/package-lock.json index 4da0315..2d3cff3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2738,8 +2738,8 @@ "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==" }, "pinski": { - "version": "github:cloudrac3r/pinski#059bfb3c07f36b7e175bce52e4715646b6acfebd", - "from": "github:cloudrac3r/pinski#059bfb3c07f36b7e175bce52e4715646b6acfebd", + "version": "github:cloudrac3r/pinski#6273f81facd1e753e021910f7aa6e4384cf60631", + "from": "github:cloudrac3r/pinski#6273f81facd1e753e021910f7aa6e4384cf60631", "requires": { "mime": "^2.4.4", "pug": "^2.0.3", @@ -4909,9 +4909,9 @@ } }, "ws": { - "version": "7.2.5", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.2.5.tgz", - "integrity": "sha512-C34cIU4+DB2vMyAbmEKossWq2ZQDr6QEyuuCzWrM9zfw1sGc0mYiJ0UnG9zzNykt49C2Fi34hvr2vssFQRS6EA==" + "version": "7.3.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.3.0.tgz", + "integrity": "sha512-iFtXzngZVXPGgpTlP1rBqsUK82p9tKqsWRPg5L56egiljujJT3vGAYnHANvFxBieXrTFavhzhxW52jnaWV+w2w==" }, "xml-js": { "version": "1.6.11", diff --git a/package.json b/package.json index fb68c2c..ae69428 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,7 @@ "mixin-deep": "^2.0.1", "node-dir": "^0.1.17", "node-fetch": "^2.6.0", - "pinski": "github:cloudrac3r/pinski#059bfb3c07f36b7e175bce52e4715646b6acfebd", + "pinski": "github:cloudrac3r/pinski#6273f81facd1e753e021910f7aa6e4384cf60631", "pug": "^2.0.4", "semver": "^7.2.1", "sharp": "^0.25.2", diff --git a/src/lib/constants.js b/src/lib/constants.js index 80bd776..61bea63 100644 --- a/src/lib/constants.js +++ b/src/lib/constants.js @@ -68,20 +68,39 @@ let constants = { feed_disabled_max_age: 2*24*60*60 // 2 days }, - // Enabled themes. `file` is the filename without extension. `name` is the display name on the settings page. + // Themes. `file` is the filename without extension. `name` is the display name on the settings page. // If you make your own theme, I encourage you to submit a pull request for it! - themes: [ - {file: "classic", name: "Classic"}, - {file: "blue", name: "Classic blue"} - ], + themes: { + // If you want to disable some official themes, then create an entry that replaces this array in config.js. + // Format: `{file: string, name: string}[]` + official: [ + {file: "classic", name: "Classic"}, + {file: "blue", name: "Classic blue"} + ], + // To add your own theme, create an entry that replaces this array in config.js, then add your theme to it. + // Format: `{file: string, name: string}[]` + custom: [ + ], + // If you want your custom theme to be the default for your instance, don't forget to set it here! + // For good UI, you probably also want the default entry to be the first thing in the selection box. + default: "classic", + // This sets which order the themes appear in in the list on the settings page. + sort: { + // This sets whether the order is custom + official, or official + custom + order: "custom_first", // "custom_first", "official_first" + // To selectively override that order, add things to this array. + // If you set it to `["blue", "midnight"]` then the theme with file name `blue` will be hoisted to the top, + // the theme with file name `midnight` will be below it, and all other themes will appear below those. + // Format: `string[]` + manual: [] + }, + // These arrays should be empty, do not edit them! + collated: [], + collatedFiles: [] + }, user_settings: [ { - name: "theme", - default: "classic", - boolean: false, - replaceEmptyWithDefault: true - },{ name: "language", default: "en", boolean: false, @@ -245,4 +264,28 @@ if (process.env.BIBLIOGRAM_CONFIG) { // presence of environment variable BIBLIOG const config = require("../../config") constants = md(constants, config) } + +// Set theme settings +constants.user_settings.push({ + name: "theme", + default: constants.themes.default, + boolean: false, + replaceEmptyWithDefault: true +}) +let pool +if (constants.themes.sort.order === "custom_first") { + pool = [].concat(constants.themes.custom, constants.themes.official) +} else if (constants.themes.sort.order === "official_first") { + pool = [].concat(constants.themes.official, constants.themes.custom) +} +for (const file of constants.themes.sort.manual) { + const index = pool.findIndex(row => row.file === file) + if (index !== -1) { + const removed = pool.splice(index, 1)[0] + constants.themes.collated.push(removed) + } +} +constants.themes.collated = constants.themes.collated.concat(pool) +constants.themes.collatedFiles = constants.themes.collatedFiles.concat(pool.map(row => row.file)) + module.exports = constants diff --git a/src/site/pug/includes/head.pug b/src/site/pug/includes/head.pug index a335a5f..1a03cba 100644 --- a/src/site/pug/includes/head.pug +++ b/src/site/pug/includes/head.pug @@ -1,8 +1,4 @@ meta(charset="utf-8") - -- let theme = settings ? settings.theme : "classic" -link(rel="stylesheet" type="text/css" href=getStaticURL("sass", `${theme}.sass`)) - meta(name="viewport" content="width=device-width, initial-scale=1") link(rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png") link(rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png") @@ -11,3 +7,25 @@ link(rel="manifest" href="/site.webmanifest") link(rel="mask-icon" href="/safari-pinned-tab.svg" color="#303030") meta(name="msapplication-TileColor" content="#00aba9") meta(name="theme-color" content="#ffffff") + +- + let themeURL + let theme = + settings + ? settings.theme + : constants + ? constants.themes.default + : "classic" + try { + themeURL = getStaticURL("sass", `${theme}.sass`) + } catch (e) {} + +if themeURL + link(rel="stylesheet" type="text/css" href=themeURL) +else + div(style="font-size: 22px; padding: 40px 20px; white-space: pre-line; border-bottom: 3px solid black"). + Your theme value "#{theme}" wasn't understood. + There is no loaded theme with that name. + Please #[a(href="/settings") go to the settings page] and select a different theme. + If that doesn't help, #[a(href="https://github.com/cloudrac3r/bibliogram/issues/new") report a bug.] + In your bug report, tell us which website address you saw this on, and what your theme value is. diff --git a/src/site/pug/settings.pug b/src/site/pug/settings.pug index e58fc24..5ad0425 100644 --- a/src/site/pug/settings.pug +++ b/src/site/pug/settings.pug @@ -65,7 +65,7 @@ html +checkbox("spa", "Fast navigation", "Enabled", false) +fieldset("Appearance") - +select("theme", "Theme", false, constants.themes.map(entry => ({value: entry.file, text: entry.name}))) + +select("theme", "Theme", false, constants.themes.collated.map(entry => ({value: entry.file, text: entry.name}))) +checkbox("display_top_nav", "Display top bar", "Always", false) diff --git a/src/site/server.js b/src/site/server.js index fb20682..8e6d23e 100644 --- a/src/site/server.js +++ b/src/site/server.js @@ -21,8 +21,9 @@ subdirs("pug", async (err, dirs) => { await require("../lib/utils/upgradedb")() pinski.setNotFoundTarget("/404") - for (const theme of constants.themes) { - pinski.addRoute(`/static/css/${theme.file}.css`, `sass/${theme.file}.sass`, "sass") + Object.assign(pinski.pugDefaultLocals, {constants}) + for (const file of constants.themes.collatedFiles) { + pinski.addRoute(`/static/css/${file}.css`, `sass/${file}.sass`, "sass") } pinski.addRoute("/settings", "pug/settings.pug", "pug") pinski.addPugDir("pug", dirs)