diff --git a/src/import/index.html b/src/import/index.html index 1a1179d9..fe0bc443 100644 --- a/src/import/index.html +++ b/src/import/index.html @@ -4,48 +4,17 @@ + Importer
- +
- - diff --git a/src/import/index.js b/src/import/index.js new file mode 100644 index 00000000..125994d3 --- /dev/null +++ b/src/import/index.js @@ -0,0 +1,36 @@ +/* eslint-env browser */ + +const onAction = () => { + fetch("/status") + .then((response) => response.json()) + .then((data) => { + const status = data.idle ? "Idling" : "Running"; + const percentage = data.total ? (100 * data.done) / data.total : 0; + const text = `${status} ${percentage.toFixed(2)} (${data.done} of ${ + data.total + })`; + const el = document.getElementById("statusEl"); + el.textContent = text; + + if (!data.idle || data.done !== data.total) { + setTimeout(() => onAction(), 500); + } + }); +}; + +const onFileSelect = () => { + const el = document.getElementById("fileEl"); + el.setAttribute("disabled", "disabled"); + + fetch("/import", { + method: "POST", + body: el.files[0], + }) + .then(() => onAction()) + .finally(() => el.removeAttribute("disabled")); +}; + +// Attaching event handlers +document + .querySelector("#fileEl") + .addEventListener("onchange", () => onFileSelect()); diff --git a/src/scripts/chart.ts b/src/scripts/chart.ts index 34a12968..d19ace9f 100644 --- a/src/scripts/chart.ts +++ b/src/scripts/chart.ts @@ -1,36 +1,20 @@ import { createServer as createHttps } from "node:https"; import { createServer as createHttp } from "node:http"; -import { resolve as resolvePath } from "node:path"; -import { fileURLToPath } from "node:url"; import express from "express"; import { Logger } from "../logger/index.js"; import * as envy from "../env.js"; import { sSuffix } from "../text/index.js"; import { httpsOptions } from "../../certs/index.js"; import { DbClient } from "../db/index.js"; +import { initStaticServer } from "../server/static.js"; const logger = new Logger("chart-script"); export const run = async (): Promise => { - const currentDir = fileURLToPath(new URL(".", import.meta.url)); - const files = { - html: resolvePath(currentDir, "../chart/index.html"), - js: resolvePath(currentDir, "../chart/index.js"), - }; + const app = initStaticServer("chart"); let db: DbClient | null = null; - const app = express(); - app.use(express.json()); - - app.get("/", (req: express.Request, res: express.Response) => { - res.status(200).sendFile(files.html); - }); - - app.get("/index.js", (req: express.Request, res: express.Response) => { - res.status(200).sendFile(files.js); - }); - app.post("/login", (req: express.Request, res: express.Response) => { if (db) { res.status(200).send({}); @@ -54,10 +38,6 @@ export const run = async (): Promise => { res.status(200).send({}); }); - app.get("/favicon.ico", (_req, res: express.Response) => { - res.status(204).send(""); - }); - app.get("/stat", (req: express.Request, res: express.Response) => { const usageCount = Number(req.query.usage); diff --git a/src/scripts/import.ts b/src/scripts/import.ts index a6f1d98f..57013810 100644 --- a/src/scripts/import.ts +++ b/src/scripts/import.ts @@ -1,26 +1,17 @@ import { createServer as createHttps } from "node:https"; import { createServer as createHttp } from "node:http"; -import { resolve as resolvePath } from "node:path"; -import { fileURLToPath } from "node:url"; import express from "express"; import { Logger } from "../logger/index.js"; import * as envy from "../env.js"; import { sSuffix } from "../text/index.js"; import { httpsOptions } from "../../certs/index.js"; import { DbClient } from "../db/index.js"; +import { initStaticServer } from "../server/static.js"; const logger = new Logger("import-script"); export const run = async (): Promise => { - const currentDir = fileURLToPath(new URL(".", import.meta.url)); - const chartHtml = resolvePath(currentDir, "../import/index.html"); - - const app = express(); - app.use(express.json({ limit: "10240kb" })); - - app.get("/", (req: express.Request, res: express.Response) => { - res.status(200).sendFile(chartHtml); - }); + const app = initStaticServer("import"); const db = new DbClient({ user: envy.dbPostgres.user, diff --git a/src/server/static.ts b/src/server/static.ts new file mode 100644 index 00000000..9497e182 --- /dev/null +++ b/src/server/static.ts @@ -0,0 +1,30 @@ +import { fileURLToPath } from "node:url"; +import { resolve as resolvePath } from "node:path"; +import express from "express"; + +export const initStaticServer = ( + script: "import" | "chart", +): express.Express => { + const currentDir = fileURLToPath(new URL(".", import.meta.url)); + const files = { + html: resolvePath(currentDir, `../${script}/index.html`), + js: resolvePath(currentDir, `../${script}/index.js`), + }; + + const app = express(); + app.use(express.json({ limit: "102400kb" })); + + app.get("/", (req: express.Request, res: express.Response) => { + res.status(200).sendFile(files.html); + }); + + app.get("/index.js", (req: express.Request, res: express.Response) => { + res.status(200).sendFile(files.js); + }); + + app.get("/favicon.ico", (_req, res: express.Response) => { + res.status(204).send(""); + }); + + return app; +};