From f9f4f32109c89062b04fa2aad744c84ca50b3db3 Mon Sep 17 00:00:00 2001 From: "Felix W. Dekker" Date: Sun, 3 May 2020 18:09:57 +0200 Subject: [PATCH] Use shared template for common elements --- Gruntfile.js | 26 +++++---- README.md | 30 ++++++++++ package-lock.json | Bin 226579 -> 229397 bytes package.json | 6 +- src/main/index.html | 131 +++++++++++++++++++----------------------- src/main/js/Main.js | 21 ++++++- src/main/js/Shared.js | 24 -------- 7 files changed, 127 insertions(+), 111 deletions(-) diff --git a/Gruntfile.js b/Gruntfile.js index 0ad7280..bb5e94e 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -4,24 +4,27 @@ module.exports = grunt => { grunt.initConfig({ pkg: grunt.file.readJSON("package.json"), clean: { - default: ["build/"], + default: ["dist/"], }, copy: { html: { - files: [{expand: true, cwd: "src/main/", src: "**/*.html", dest: "build/"}] + files: [{expand: true, cwd: "src/main/", src: "**/*.html", dest: "dist/"}] }, css: { - files: [{expand: true, cwd: "src/main/", src: "**/*.css", dest: "build/"}] + files: [{expand: true, cwd: "src/main/", src: "**/*.css", dest: "dist/"}] }, }, focus: { dev: { include: ["css", "html", "js"], }, + devLink: { + include: ["css", "html", "js", "link"], + } }, replace: { dev: { - src: ["./build/*.html", "./build/*.js"], + src: ["./dist/*.html", "./dist/*.js"], replacements: [ { from: "%%VERSION_NUMBER%%", @@ -31,7 +34,7 @@ module.exports = grunt => { overwrite: true }, deploy: { - src: ["./build/*.html", "./build/*.js"], + src: ["./dist/*.html", "./dist/*.js"], replacements: [ { from: "%%VERSION_NUMBER%%", @@ -57,7 +60,7 @@ module.exports = grunt => { }, output: { filename: "bundle.js", - path: path.resolve(__dirname, "build/"), + path: path.resolve(__dirname, "dist/"), }, }, dev: { @@ -72,21 +75,19 @@ module.exports = grunt => { css: { files: ["src/main/**/*.css"], tasks: ["copy:css"], - options: { - spawn: false, - }, }, html: { files: ["src/main/**/*.html"], tasks: ["copy:html"], - options: { - spawn: false, - }, }, js: { files: ["src/main/**/*.js"], tasks: ["webpack:dev", "replace:dev"], }, + link: { + files: ["node_modules/@fwdekker/*/dist/**"], + tasks: ["webpack:dev", "replace:dev"], + }, }, }); @@ -109,6 +110,7 @@ module.exports = grunt => { "replace:dev" ]); grunt.registerTask("dev:server", ["dev", "focus:dev"]); + grunt.registerTask("dev:server:link", ["dev", "focus:devLink"]); grunt.registerTask("deploy", [ // Pre "clean", diff --git a/README.md b/README.md index 1c98032..847e7eb 100644 --- a/README.md +++ b/README.md @@ -22,3 +22,33 @@ For **Fandom** wikis, this is <wiki>.fandom.com/api.php. If you need **help**, have a **question**, or found a **bug**, please [open an issue](https://git.fwdekker.com/FWDekker/interlanguage-checker/issues/new) or [leave a talk message](https://fallout.fandom.com/wiki/User_talk:FDekker). + +## Development +### Requirements +* [npm](https://www.npmjs.com/) + +### Setting up +```shell script +# Install dependencies (only needed once) +$> npm ci +``` + +### Building +```shell script +# Build the template in `dist/` for development +$> npm run dev +# Same as above, but automatically rerun it whenever files are changed +$> npm run dev:server +# Same as above, but also rerun when linked `@fwdekker` dependencies change +$> npm run dev:server:link +# Build the template in `dist/` for deployment +$> npm run deploy +``` + +### Publishing +```shell script +# Log in to npm +$> npm login +# Push to npm +$> npm publish --access public +``` diff --git a/package-lock.json b/package-lock.json index 85d2725042e1d98443fb672e78627dc6232c4663..a7b6124fb72de7da9432a6db852ced6e36120edc 100644 GIT binary patch delta 1204 zcmah{TWDK#80UZ5wYJ+zOI^Dex3u-r(r}VVm*k{vPLmX-BM>K&ZQ}grY0CBXGofb?tTd_4JeWEPVlQrLG8*B*C>-7!LS9?XJX}!w&v(a?)!~sh z)Ve7c2R%-}hjX*GH8#o_HD2R4%No5IUEcC1tM!$vvP>_cz!@+OAD2$w|FrmY20cuI zbDhJ(=%=&5H^#|1)5K-T>>fUD&`lY0zUbj2(Tzq>$Y*k)0!hWGG?R>lGqP!3nS!9@ zI>ieORYa3cFph}3*x0)_TJ0Mx@X0Ivii``gpupVC2{^&^!aGi%y=Wayg-RFe*%qgq zG+djWWgC@Ta{C|O>wMU-GF77O@UGGTd( zt87|KQ;fsAA-jweS&Xf?l2T0;GIWv;E*}{3zJ27FYFF@Ugp-6jPhUk}U+oz|g+H(t z+Dse#4o>ac2Ibo?!3m-l{rU~&vpwTv_wy59aSHwQ1kBh;oC#M}wa6x06Wx`nI~IzB zh;%VoNTq9RN30#yiT2*a`uYw$Lxip8JldVb`kp)b3BC0Nm>4{f2tAtaxd0#BA46YV z2DWYx+RXPL)qkKleCG!{`c}Z^N2SWX37xkNt4a49`)wlB-aibhv%2d|UMqFc* zY^35}BZ>Vyv_F3U{@Ln33?$Tt?C`xi^W(=6?HoL=aT1XuSeK>7D}gz;w=o5eae`dozetGcZR2O5kb?*%D z!O34<`yUWrN2eLM+uO_P()LCo$@poD%(7Lsn53w@6=hVKD{{4PM33Z3RBFAMPZHsH zqa0&Gscc=NE3{h_WOt4xne|N5t&ka=h&FXC?@?%4UqbpecHslh0@n5{^z6C+1(3v} AX8-^I delta 74 zcmV-Q0JZ;>fDV)D4UjwmHIY42vsVHMXtP0U`Y3~6mA7A&0h1-CUc3PUx81)1eFwKG g$N~LYw}T}DmL!uZ@(!125&;^AU`qnGU`qqFG+ELd%>V!Z diff --git a/package.json b/package.json index b1beee0..efe922d 100644 --- a/package.json +++ b/package.json @@ -1,9 +1,9 @@ { "name": "interlanguage-checker", - "version": "1.10.5", + "version": "1.10.6", "description": "Check the consistency of MediaWiki interlanguage links in a simple overview.", "author": "Felix W. Dekker", - "browser": "bundle.js", + "browser": "dist/bundle.js", "repository": { "type": "git", "url": "git@git.fwdekker.com:FWDekker/interlanguage-checker.git" @@ -13,9 +13,11 @@ "clean": "grunt clean", "dev": "grunt dev", "dev:server": "grunt dev:server", + "dev:server:link": "grunt dev:server:link", "deploy": "grunt deploy" }, "dependencies": { + "@fwdekker/template": "^0.0.8", "fetch-jsonp": "^1.1.3", "htm": "^3.0.3", "js-cookie": "^2.2.1", diff --git a/src/main/index.html b/src/main/index.html index 2bb9334..7fcb143 100644 --- a/src/main/index.html +++ b/src/main/index.html @@ -12,36 +12,32 @@ - -
- -
-
-

Interlanguage Checker

- -

Check the consistency of MediaWiki interlanguage links in a simple overview.

-
-
+ +
+ +
+ - -
-
-
-
- About - + + +
+
+
+
+ About + Interlanguage links allow wikis to tell users where to find translations of articles. Without the @@ -64,57 +60,48 @@ open an issue or leave a talk message. -
-

+
+

+
-
- - - -
-
-
-
- - - - - -
- -
-
-
-
- - -
-
-
-
-
-
-
-
- - - - + + +
+
+
+
+ + + + + +
+ +
+
+
+
+ + +
+
+
+
+
+
+
+
+ + + +
diff --git a/src/main/js/Main.js b/src/main/js/Main.js index 01fa357..6081d22 100644 --- a/src/main/js/Main.js +++ b/src/main/js/Main.js @@ -1,8 +1,27 @@ +import {$, doAfterLoad, footer, header, nav} from "@fwdekker/template"; import {html, render} from "htm/preact"; import Cookies from "js-cookie"; import {InterlangTable, MessageHandler, ValidatableInput} from "./DOM"; import {discoverNetwork, InterlangNetwork, MediaWiki, MediaWikiManager} from "./MediaWiki"; -import {$, doAfterLoad} from "./Shared"; + + +doAfterLoad(() => { + $("#nav").appendChild(nav()); + $("#header").appendChild(header({ + title: "Interlanguage Checker", + description: "Check the consistency of MediaWiki interlanguage links in a simple overview." + })); + $("#footer").appendChild(footer({ + author: "Felix W. Dekker", + authorURL: "https://fwdekker.com/", + license: "MIT License", + licenseURL: "https://git.fwdekker.com/FWDekker/interlanguage-checker/src/branch/master/LICENSE", + vcs: "git", + vcsURL: "https://git.fwdekker.com/FWDekker/interlanguage-checker/", + version: "v%%VERSION_NUMBER%%" + })); + $("main").style.display = null; +}); doAfterLoad(async () => { diff --git a/src/main/js/Shared.js b/src/main/js/Shared.js index 9efc856..855d118 100644 --- a/src/main/js/Shared.js +++ b/src/main/js/Shared.js @@ -1,27 +1,3 @@ -/** - * Alias for `document.querySelector`. - * - * @param q {string} the query string - * @returns {HTMLElement} the element identified by the query - */ -export const $ = q => document.querySelector(q); - -/** - * Runs the given function once the page is loaded. - * - * This function can be used multiple times. It does not overwrite existing callbacks for the page load event. - * - * @param fun {function(...*): *} the function to run - */ -export const doAfterLoad = fun => { - const oldOnLoad = window.onload || (() => {}); - - window.onload = (() => { - oldOnLoad(); - fun(); - }); -}; - /** * Returns the status that has the lowest index in the given list of statuses. *