Store API URL in cookie for re-use

Fixes #25.

package.json

@@ -1,6 +1,6 @@
 {
     "name": "interlanguage-checker",
-    "version": "1.7.0",
+    "version": "1.8.0",
     "description": "Check the consistency of MediaWiki interlanguage links in a simple overview.",
     "author": "Felix W. Dekker",
     "browser": "bundle.js",
@@ -17,9 +17,11 @@
     "dependencies": {
         "fetch-jsonp": "^1.1.3",
         "htm": "^3.0.3",
+        "js-cookie": "^2.2.1",
         "preact": "^10.4.0"
     },
     "devDependencies": {
+        "@types/js-cookie": "^2.2.6",
         "grunt": "^1.1.0",
         "grunt-cli": "^1.3.2",
         "grunt-contrib-clean": "^2.0.0",

src/main/index.html

@@ -79,7 +79,7 @@
                         API 
                         <i class="fa fa-question-circle-o" title="The URL to the wiki's api.php"></i>
                     </label>
-                    <input id="url" type="url" value="https://fallout.fandom.com/api.php" />
+                    <input id="url" type="url" autofocus />
 
                     <label for="article">
                         Article&nbsp;

src/main/js/DOM.js

@@ -31,6 +31,15 @@ export class ValidatableInput {
         return this.input.value;
     }
 
+    /**
+     * Sets the value of the underlying input element.
+     *
+     * @param value {string} the value to set
+     */
+    setValue(value) {
+        this.input.value = value;
+    }
+
     /**
      * Validates the input.
      *

src/main/js/Main.js

@@ -1,4 +1,5 @@
 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";
@@ -31,6 +32,8 @@ doAfterLoad(async () => {
     let mwm = undefined;
 
     const submit = async () => {
+        Cookies.set("api-url", urlInput.getValue(), {expires: 10 * 365});
+
         // Clean up
         urlInput.showBlank();
         articleInput.showBlank();
@@ -95,8 +98,18 @@ doAfterLoad(async () => {
     });
     checkButton.addEventListener("click", () => submit());
 
+    // Read inputs from cookies
+    if (Cookies.get("api-url") !== undefined) {
+        urlInput.setValue(Cookies.get("api-url"));
+        articleInput.input.focus();
+    }
+
+    // Read inputs from URL
     const currentParams = new URLSearchParams(window.location.search);
-    if (currentParams.has("api")) urlInput.input.value = currentParams.get("api");
-    if (currentParams.has("article")) articleInput.input.value = currentParams.get("article");
+    if (currentParams.has("api")) {
+        urlInput.setValue(currentParams.get("api"));
+        articleInput.input.focus();
+    }
+    if (currentParams.has("article")) articleInput.setValue(currentParams.get("article"));
     if (currentParams.has("api") && currentParams.has("article")) await submit();
 });