Use shared template for common elements
This commit is contained in:
parent
8795e4393c
commit
f9f4f32109
GPG Key ID:
B1B567AF58D6EE0F
26
Gruntfile.js
26
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",
|
||||
|
|
|
|||
30
README.md
30
README.md
|
|
@ -22,3 +22,33 @@ For **Fandom** wikis, this is <code><wiki>.fandom.com/api.php</code>.
|
|||
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
|
||||
```
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -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",
|
||||
|
|
|
|||
|
|
@ -12,36 +12,32 @@
|
|||
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,300italic,700,700italic"
|
||||
crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://static.fwdekker.com/css/milligram-bundle.min.css" crossorigin="anonymous" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fork-awesome/1.1.7/css/fork-awesome.min.css"
|
||||
integrity="sha256-gsmEoJAws/Kd3CjuOQzLie5Q3yshhvmo7YNtBG7aaEY=" crossorigin="anonymous" />
|
||||
|
||||
<link rel="stylesheet" href="css/main.css" />
|
||||
</head>
|
||||
<body>
|
||||
<main class="wrapper">
|
||||
<!-- Header -->
|
||||
<header class="header">
|
||||
<section class="container">
|
||||
<h1>Interlanguage Checker</h1>
|
||||
<noscript>
|
||||
<span style="color: red; font-weight: bold;">
|
||||
This website does not function if JavaScript is disabled.
|
||||
Please check the <a href="https://www.enable-javascript.com/">
|
||||
instructions on how to enable JavaScript in your web browser</a>.
|
||||
</span>
|
||||
</noscript>
|
||||
<p><em>Check the consistency of MediaWiki interlanguage links in a simple overview.</em></p>
|
||||
</section>
|
||||
</header>
|
||||
<noscript>
|
||||
<span style="color: red; font-weight: bold;">
|
||||
This website does not function if JavaScript is disabled.
|
||||
Please check the <a href="https://www.enable-javascript.com/">
|
||||
instructions on how to enable JavaScript in your web browser</a>.
|
||||
</span>
|
||||
</noscript>
|
||||
<main style="display: none;">
|
||||
<div id="nav"></div>
|
||||
<div id="contents">
|
||||
<div id="header"></div>
|
||||
|
||||
<!-- About -->
|
||||
<section class="container">
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<details>
|
||||
<summary><b>About</b></summary>
|
||||
<span>
|
||||
|
||||
<!-- About -->
|
||||
<section class="container">
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<details>
|
||||
<summary><b>About</b></summary>
|
||||
<span>
|
||||
<a href="https://community.fandom.com/wiki/Help:Interlanguage_link">Interlanguage links</a>
|
||||
allow wikis to tell users where to find translations of articles.
|
||||
Without the
|
||||
|
|
@ -64,57 +60,48 @@
|
|||
<a href="https://git.fwdekker.com/FWDekker/interlanguage-checker/issues/new">open an issue</a>
|
||||
or <a href="https://fallout.fandom.com/wiki/User_talk:FDekker">leave a talk message</a>.
|
||||
</span>
|
||||
</details>
|
||||
<p></p>
|
||||
</details>
|
||||
<p></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Input -->
|
||||
<section class="container">
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<form>
|
||||
<label for="url">
|
||||
API
|
||||
<i class="fa fa-question-circle-o" title="The URL to the wiki's api.php"></i>
|
||||
</label>
|
||||
<input id="url" type="url" autofocus />
|
||||
|
||||
<label for="article">
|
||||
Article
|
||||
<i class="fa fa-question-circle-o" title="The title of the article to check"></i>
|
||||
</label>
|
||||
<input id="article" type="text" autofocus />
|
||||
<br />
|
||||
<button id="check" type="button">Check</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Output -->
|
||||
<section> <!-- No `container` class, to allow use of whole width -->
|
||||
<hr />
|
||||
<div id="messages"></div>
|
||||
<hr />
|
||||
<form id="networkTableForm">
|
||||
<table id="networkTable"></table>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<section class="container">
|
||||
Made by <a href="https://fwdekker.com/">Felix W. Dekker</a>.
|
||||
Licensed under the
|
||||
<a href="https://git.fwdekker.com/FWDekker/interlanguage-checker/src/branch/master/LICENSE">MIT License</a>.
|
||||
Source code available on <a href="https://git.fwdekker.com/FWDekker/interlanguage-checker/">git</a>.
|
||||
|
||||
<div style="float: right;">v%%VERSION_NUMBER%%</div>
|
||||
</section>
|
||||
</footer>
|
||||
|
||||
<!-- Input -->
|
||||
<section class="container">
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<form>
|
||||
<label for="url">
|
||||
API
|
||||
<i class="fa fa-question-circle-o" title="The URL to the wiki's api.php"></i>
|
||||
</label>
|
||||
<input id="url" type="url" autofocus />
|
||||
|
||||
<label for="article">
|
||||
Article
|
||||
<i class="fa fa-question-circle-o" title="The title of the article to check"></i>
|
||||
</label>
|
||||
<input id="article" type="text" autofocus />
|
||||
<br />
|
||||
<button id="check" type="button">Check</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Output -->
|
||||
<section> <!-- No `container` class, to allow use of whole width -->
|
||||
<hr />
|
||||
<div id="messages"></div>
|
||||
<hr />
|
||||
<form id="networkTableForm">
|
||||
<table id="networkTable"></table>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
|
||||
<div id="footer"></div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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 () => {
|
||||
|
|
|
|||
|
|
@ -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.
|
||||
*
|
||||
|
|
|
|||
Loading…
Reference in New Issue