From 0e4f9735532bf3e2a22c5408fd4540c667c558c6 Mon Sep 17 00:00:00 2001 From: "Felix W. Dekker" Date: Fri, 26 Mar 2021 02:58:50 +0100 Subject: [PATCH] Rewrite without hyperscript Fixes #5. Reduces bundle by 6kB. --- package-lock.json | Bin 313289 -> 144379 bytes package.json | 1 - src/main/js/Template.js | 118 +++++++++++++++++++++++----------------- 3 files changed, 68 insertions(+), 51 deletions(-) diff --git a/package-lock.json b/package-lock.json index 03771c860288fd69ce96cf6daf27c4aa7d43a6a8..b74eda91d2a5c5c29c4a524252e8255d79c6930c 100644 GIT binary patch delta 5074 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 DaH_n5 delta 30817 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 diff --git a/package.json b/package.json index 9f3a12d..0227bd5 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,6 @@ "prepare": "grunt clean deploy" }, "dependencies": { - "hyperscript": "^2.0.2", "milligram": "^1.4.1" }, "devDependencies": { diff --git a/src/main/js/Template.js b/src/main/js/Template.js index 0f5bb43..48b1a8e 100644 --- a/src/main/js/Template.js +++ b/src/main/js/Template.js @@ -1,4 +1,3 @@ -import h from "hyperscript"; import "../css/normalize.css"; import "milligram/dist/milligram.min.css"; import "../css/common.css"; @@ -6,6 +5,17 @@ import "../css/nav.css"; import "../css/overrides.css"; +/** + * Converts the given string to an HTML element. + * + * @param string the string to convert to an HTML element + * @param query the type of element to return + * @returns {HTMLElement} the HTML element described by the given string + */ +const stringToHtml = function (string, query) { + return new DOMParser().parseFromString(string, "text/html").body.querySelector(query); +} + /** * Alias for `document.querySelector`. * @@ -41,22 +51,28 @@ export const doAfterLoad = function (fun) { * @returns {HTMLElement} a base navigation element that will eventually be filled with contents */ export const nav = function (highlightPath = "") { - const base = h("ul", - h("li", h("a", {href: "https://fwdekker.com/"}, - h("div.logo", h("img.logo", {src: "https://fwdekker.com/favicon.png"})), - h("b", "FWDekker") - )) - ); + const base = stringToHtml(` + + `, "ul"); fetch("https://fwdekker.com/api/nav/") .then(it => it.json()) - .then(json => json.entries.forEach(entry => base.appendChild(unpackEntry(entry, "/", highlightPath)))) + .then(json => { + json.entries.forEach(entry => base.appendChild(stringToHtml(unpackEntry(entry, "/", highlightPath), "li"))) + }) .catch(e => { console.error("Failed to fetch navigation elements", e); return []; }); - return h("nav.nav", base); + const nav = stringToHtml(``, "nav"); + nav.appendChild(base); + return nav; }; /** @@ -66,25 +82,23 @@ export const nav = function (highlightPath = "") { * @param [path] {number} the current path traversed, found by joining the names of the entries with `/`s; always starts * and ends with a `/` * @param [highlightPath] {String} the path to highlight together with its parents - * @returns {HTMLElement} the navigation list entry as HTML, described by its children + * @returns {string} the navigation list entry as HTML, described by its children */ const unpackEntry = function (entry, path = "/", highlightPath = "") { const shouldHighlight = highlightPath.startsWith(`${path + entry.name}/`); if (entry.entries.length === 0) - return h("li", - h("a", {href: entry.link, innerHTML: entry.name}), - {className: shouldHighlight ? "currentPage" : ""} - ); + return `
  • ${entry.name}
  • `; - const depth = path.split("/").length - 2; // -1 because count parts, then another -1 because of leading `/` + const depth = path.split("/").length - 2; // -1 because count parts, then another -1 because of leading `/` const arrow = depth === 0 ? "▾" : "▸"; - return h("li", - h("a", {href: entry.link, innerHTML: `${entry.name} ${arrow}`}), - h("ul", entry.entries.map(it => unpackEntry(it, `${path + entry.name}/`, highlightPath))), - {className: shouldHighlight ? "currentPage" : ""} - ); + return ` +
  • + ${entry.name} ${arrow} +
      ${entry.entries.map(it => unpackEntry(it, `${path + entry.name}/`, highlightPath)).join("")}
    +
  • + `; }; @@ -97,14 +111,16 @@ const unpackEntry = function (entry, path = "/", highlightPath = "") { */ export const header = function ({title, description}) { if (title === undefined && description === undefined) - return h("header.header"); + return stringToHtml(`
    `, "header"); - return h("header.header", - h("section.container", - title !== undefined ? h("h1", {innerHTML: title}) : undefined, - description !== undefined ? h("p", h("em", {innerHTML: description})) : undefined - ) - ); + return stringToHtml(` +
    +
    + ${(title !== undefined ? `

    ${title}

    ` : "")} + ${(description !== undefined ? `

    ${description}

    ` : "")} +
    +
    + `, "header"); }; @@ -127,20 +143,22 @@ export const footer = function ( author, authorURL, license, licenseURL, vcs, vcsURL, version, privacyPolicyURL = undefined }) { - return h("footer.footer", - h("section.container", - footerLink("Made by ", author, authorURL, ". "), - footerLink("Licensed under the ", license, licenseURL, ". "), - footerLink("Source code available on ", vcs, vcsURL, ". "), - footerLink( - "Consider reading the ", - privacyPolicyURL === null ? undefined : "privacy policy", - privacyPolicyURL === undefined ? "https://fwdekker.com/privacy/" : privacyPolicyURL, - ". " - ), - h("div", version || "", {style: {"float": "right"}}) - ) - ); + return stringToHtml(` +
    +
    + ${footerLink("Made by ", author, authorURL, ". ")} + ${footerLink("Licensed under the ", license, licenseURL, ". ")} + ${footerLink("Source code available on ", vcs, vcsURL, ". ")} + ${footerLink( + "Consider reading the ", + privacyPolicyURL === null ? undefined : "privacy policy", + privacyPolicyURL === undefined ? "https://fwdekker.com/privacy/" : privacyPolicyURL, + ". " + )} +
    ${version || ""}
    +
    +
    + `, "footer"); }; /** @@ -150,18 +168,18 @@ export const footer = function ( * @param text {string|undefined} the text to display, or `undefined` if the returned element should be empty * @param url {string|undefined} the URL to link the text to, or `undefined` if the text should not be a link * @param suffix {string} the text to display after the text if the text is not undefined - * @returns {HTMLElement} a footer link element + * @returns {string} a footer link element */ const footerLink = function (prefix, text, url, suffix) { - if (text === undefined) return h("span"); + if (text === undefined) return ""; - return h("span", - h("span", prefix), - url !== undefined - ? h("a", text, {href: url}) - : h("span", text), - h("span", suffix) - ); + return ` + + ${prefix} + ${url !== undefined ? `${text}` : text} + ${suffix} + + `; };