Skip to content

Commit

Permalink
mostly unified the functions (named,unnamed, arrow) used by JS
Browse files Browse the repository at this point in the history 
gulpfile.js is the odd one out.
  • Loading branch information
@CommanderStorm
CommanderStorm committed Jul 19, 2022
1 parent 84f6aa6 commit f244057
Show file tree
Hide file tree
Showing 11 changed files with 161 additions and 160 deletions.
105 changes: 53 additions & 52 deletions webclient/gulpfile.js
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
/* eslint func-names: ["error", "always"] */

import gulp from "gulp";
import addsrc from "gulp-add-src";
import babel from "gulp-babel";
Expand Down Expand Up @@ -33,9 +35,9 @@ import { configRelease, configLocal } from "./config.js"; // eslint-disable-line

// from https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-task-steps-per-folder.md
function getFolders(dir) {
return fs.readdirSync(dir).filter(function (file) {
return fs.statSync(path.join(dir, file)).isDirectory();
});
return fs
.readdirSync(dir)
.filter((file) => fs.statSync(path.join(dir, file)).isDirectory());
}

// Selected at the bottom of the script
Expand Down Expand Up @@ -83,48 +85,50 @@ function cleanBuild(cb) {
// --- Main CSS Pipeline ---
function compileMainScss() {
return merge(
["light", "dark"].map(function (theme) {
return gulp
["light", "dark"].map((theme) =>
gulp
.src("src/main.scss")
.pipe(injectStr.prepend(`$theme: "${theme}";\n`))
.pipe(sass().on("error", sass.logError))
.pipe(rename(`main-${theme}.css`))
.pipe(gulp.dest("build/tmp"));
})
.pipe(gulp.dest("build/tmp"))
)
);
}

function compileSpectreScss() {
return merge(
["light", "dark"].map(function (theme) {
return (
gulp
.src("src/spectre-all.scss")
.pipe(injectStr.prepend(`$theme: "${theme}";\n`))
.pipe(sass().on("error", sass.logError))
.pipe(
purgecss({
content: ["src/index.html", "src/views/*/*.inc"],
})
)
// .pipe(csso())
.pipe(rename(`spectre-all-purged-${theme}.css`))
.pipe(gulp.dest("build/tmp"))
);
})
["light", "dark"].map((theme) =>
gulp
.src("src/spectre-all.scss")
.pipe(injectStr.prepend(`$theme: "${theme}";\n`))
.pipe(sass().on("error", sass.logError))
.pipe(
purgecss({
content: ["src/index.html", "src/views/*/*.inc"],
})
)
// .pipe(csso())
.pipe(rename(`spectre-all-purged-${theme}.css`))
.pipe(gulp.dest("build/tmp"))
)
);
}

/* function mergeMainCss() {
return merge(["light", "dark"].map(function(theme) {
return gulp.src(['build/tmp/main-' + theme + '.css',
'build/tmp/spectre-all-purged-' + theme + '.css'])
.pipe(concat('app-main-merged-' + theme + '.css'))
.pipe(gulp.dest('build/css'))
.pipe(csso())
.pipe(rename('app-main-merged-' + theme + '.min.css'))
.pipe(gulp.dest('build/css'));
}));
return merge(["light", "dark"].map((theme) =>
gulp
.src([
`build/tmp/main-${theme}.css`,
`build/tmp/spectre-all-purged-${theme}.css`,
])
.pipe(concat(`app-main-merged-${theme}.css`))
.pipe(gulp.dest("build/css"))
.pipe(csso())
.pipe(rename(`app-main-merged-${theme}.min.css`))
.pipe(gulp.dest("build/css"))
)
);
} */
gulp.task(
"main_css",
Expand Down Expand Up @@ -224,22 +228,22 @@ gulp.task(
);

// --- Views compilation pipeline ---
gulp.task("views", function (done) {
gulp.task("views", (done) => {
const viewsSrcPath = "src/views";

const folders = getFolders(viewsSrcPath);
if (folders.length === 0) return done(); // nothing to do!

const tasks = folders.map(function (folder) {
const tasks = folders.map((folder) => {
const cssTask = merge(
["light", "dark"].map(function (theme) {
return gulp
["light", "dark"].map((theme) =>
gulp
.src(path.join(viewsSrcPath, folder, `/view-${folder}.scss`))
.pipe(injectStr.prepend(`$theme: "${theme}";\n`))
.pipe(sass().on("error", sass.logError))
.pipe(rename(`view-${theme}.css`))
.pipe(gulp.dest(`build/tmp/views/${folder}`));
})
.pipe(gulp.dest(`build/tmp/views/${folder}`))
)
);

const jsTask = gulp
Expand Down Expand Up @@ -281,15 +285,15 @@ gulp.task("views", function (done) {
});

// --- Build pages sources ---
gulp.task("pages_src", function (done) {
gulp.task("pages_src", (done) => {
const viewsBuildPath = "build/tmp/views";

const folders = getFolders(viewsBuildPath);
if (folders.length === 0) return done(); // nothing to do!

const tasks = folders.map(function (folder) {
const tasks = folders.map((folder) => {
const viewCSS = merge(
["light", "dark"].map(function (theme) {
["light", "dark"].map((theme) => {
// Extract used spectre classes for this view and merge with core & view css
const viewCSSCore = gulp
.src(`build/tmp/spectre-all-purged-${theme}.css`)
Expand Down Expand Up @@ -338,15 +342,15 @@ gulp.task("pages_src", function (done) {
});

// --- Build pages output ---
gulp.task("pages_out", function (done) {
gulp.task("pages_out", (done) => {
const viewsBuildPath = "build/tmp/views";

const folders = getFolders(viewsBuildPath);
if (folders.length === 0) return done(); // nothing to do!

const tasks = folders.map(function (folder) {
const tasks = folders.map((folder) => {
const themedTasks = merge(
["light", "dark"].map(function (theme) {
["light", "dark"].map((theme) => {
const viewHtml = gulp
.src("src/index.html")
.pipe(rename(`index-view-${folder}-${theme}.html`))
Expand Down Expand Up @@ -375,9 +379,7 @@ gulp.task("pages_out", function (done) {
),
{
starttag: "<!-- inject:core:{{ext}} -->",
transform: function (filePath, file) {
return file.contents.toString("utf8");
},
transform: (filePath, file) => file.contents.toString("utf8"),
quiet: true,
removeTags: true,
}
Expand Down Expand Up @@ -544,10 +546,9 @@ function i18nCompileLangfiles() {

// --- Markdown Pipeline ---
const renderer = {
code: function (code, infostring) {
return `<pre class="code" data-lang="${infostring}"><code>${code}</code></pre>`;
},
link: function (href, title, text) {
code: (code, infostring) =>
`<pre class="code" data-lang="${infostring}"><code>${code}</code></pre>`,
link: (href, title, text) => {
if (href.startsWith("http"))
return `<a href="${href}" target="_blank">${text}</a>`;
return `<router-link to="${href}">${text}</router-link>`;
Expand Down Expand Up @@ -584,7 +585,7 @@ function revisionAssets(done) {
// css is deferred using preload, which revAll currently doesn't detect
includeFilesInManifest: [".js", ".webp", ".svg", ".png", ".ico"],
dontRenameFile: [".html"],
transformFilename: function (file, hash) {
transformFilename: (file, hash) => {
const ext = path.extname(file.path);
return `cache_${hash.substr(0, 8)}.${path.basename(
file.path,
Expand Down
7 changes: 7 additions & 0 deletions webclient/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@
"extends": [
"@paulhfischer/eslint-config-javascript"
],
"ignorePatterns": [
"**/googlebef9161f1176c5e0.html"
],
"env": {
"browser": true
},
Expand All @@ -34,6 +37,10 @@
"error",
"never"
],
"func-names": [
"error",
"as-needed"
],
"no-template-curly-in-string": "off",
"no-console": [
"error",
Expand Down
112 changes: 55 additions & 57 deletions webclient/src/core.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,65 +7,63 @@ let navigatum;
// This is a wrapper around fetch that avoids duplicate requests if the
// same resource is requested another time before the first request has
// returned.
const cachedFetch = (function () {
return {
fetch: function (url, options) {
return new Promise((resolve) => {
if (url in this.cache) {
resolve(this.cache[url]);
} else if (url in this.promise_callbacks) {
this.promise_callbacks[url].push(resolve);
} else {
this.promise_callbacks[url] = [resolve];
if (!options.headers) options.headers = {};
fetch(url, options)
.then((response) => {
if (!response.ok) {
if (response.status === 404)
throw new Error("${{_.core_js.error.404}}$");
else if (response.status === 500)
throw new Error("${{_.core_js.error.500}}$");
else if (response.status === 503)
throw new Error("${{_.core_js.error.503}}$");
else {
const errorStatus = "${{_.core_js.error.status}}$";
throw new Error(`${errorStatus}$${response.status}`);
}
const cachedFetch = (() => ({
fetch: function (url, options) {
return new Promise((resolve) => {
if (url in this.cache) {
resolve(this.cache[url]);
} else if (url in this.promise_callbacks) {
this.promise_callbacks[url].push(resolve);
} else {
this.promise_callbacks[url] = [resolve];
if (!options.headers) options.headers = {};
fetch(url, options)
.then((response) => {
if (!response.ok) {
if (response.status === 404)
throw new Error("${{_.core_js.error.404}}$");
else if (response.status === 500)
throw new Error("${{_.core_js.error.500}}$");
else if (response.status === 503)
throw new Error("${{_.core_js.error.503}}$");
else {
const errorStatus = "${{_.core_js.error.status}}$";
throw new Error(`${errorStatus}$${response.status}`);
}
navigatum.app.error.msg = null;
return options.as_text ? response.text() : response.json();
})
.catch((error) => {
let msg;
if (error instanceof TypeError)
msg = "${{_.core_js.error.network}}$";
else msg = error.message;
}
navigatum.app.error.msg = null;
return options.as_text ? response.text() : response.json();
})
.catch((error) => {
let msg;
if (error instanceof TypeError)
msg = "${{_.core_js.error.network}}$";
else msg = error.message;

if (!msg) msg = "${{_.core_js.error.unknown}}$";
if (!msg) msg = "${{_.core_js.error.unknown}}$";

console.warn("Error on fetch:", error);
console.warn("Error on fetch:", error);

if (navigatum && navigatum.app) navigatum.app.error.msg = msg;
if (navigatum && navigatum.app) navigatum.app.error.msg = msg;

return null;
})
.then((data) => {
if (data !== null) this.cache[url] = data;
return null;
})
.then((data) => {
if (data !== null) this.cache[url] = data;

this.promise_callbacks[url].forEach((callback) => {
callback(data);
});
delete this.promise_callbacks[url];
this.promise_callbacks[url].forEach((callback) => {
callback(data);
});
}
});
},
cache: {},
promise_callbacks: {},
};
})();
delete this.promise_callbacks[url];
});
}
});
},
cache: {},
promise_callbacks: {},
}))();

navigatum = (function () {
navigatum = (() => {
const apiBase = "/* @echo api_prefix */";
const cache = {};

Expand Down Expand Up @@ -145,7 +143,7 @@ navigatum = (function () {
},
searchBlur: function () {
if (this.search.keep_focus) {
window.setTimeout(function () {
window.setTimeout(() => {
// This is relevant if the call is delayed and focused has
// already been disabled e.g. when clicking on an entry.
if (this.search.focused)
Expand All @@ -157,12 +155,12 @@ navigatum = (function () {
}
},
searchInput: function (e) {
navigatum.getModule("autocomplete").then(function (c) {
navigatum.getModule("autocomplete").then((c) => {
c.onInput(e.srcElement.value);
});
},
searchKeydown: function (e) {
navigatum.getModule("autocomplete").then(function (c) {
navigatum.getModule("autocomplete").then((c) => {
c.onKeyDown(e);
});
},
Expand Down Expand Up @@ -266,12 +264,12 @@ navigatum = (function () {
}
},
getView: function (name) {
return function (resolve, reject) {
return (resolve, reject) => {
if (name in navigatum.views) {
resolve(navigatum.views[name]);
} else {
viewsResolveCallbacks[name] = resolve;
window.setTimeout(function () {
window.setTimeout(() => {
if (name in viewsResolveCallbacks) {
if (navigatum.app)
navigatum.app.error.msg =
Expand Down Expand Up @@ -360,7 +358,7 @@ navigatum = (function () {

// This timeout is required because else the browser might skip to
// transition if the change is too fast (if resources are in cache)
window.setTimeout(function () {
window.setTimeout(() => {
document.getElementById("content").classList.add("visible");
document.getElementById("content").style.opacity = "";
document.getElementById("loading-page").classList.remove("show");
Expand Down
Loading

0 comments on commit f244057

Please sign in to comment.