From a51e2c24a927fea0af92677d8fba7015bd4e4ccd Mon Sep 17 00:00:00 2001 From: Maks Jopek Date: Sat, 11 Jul 2026 00:48:14 +0200 Subject: Initial commit --- public/index.html | 48 ++++++++++++++++++++++ public/script.js | 116 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 164 insertions(+) create mode 100644 public/index.html create mode 100644 public/script.js (limited to 'public') diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..c7a2291 --- /dev/null +++ b/public/index.html @@ -0,0 +1,48 @@ + + + + + + + + + + + +

+ + +

+ Aktualne pliki +

+ + diff --git a/public/script.js b/public/script.js new file mode 100644 index 0000000..0bfe734 --- /dev/null +++ b/public/script.js @@ -0,0 +1,116 @@ +const DB_DIR_KEY = "DIR_HANDLE"; +const bar = document.querySelector("#bar"); +const btn = document.querySelector("#btn"); +const stdoutEl = document.querySelector("#stdout"); +const fileListEl = document.querySelector("#fileList"); +const db = await idb(); + +const stdout = (msg) => (stdoutEl.textContent = msg); + +if (await db.has(DB_DIR_KEY)) { + btn.textContent = "Wgraj pliki z folderu " + (await db.get(DB_DIR_KEY)).name; +} else { + btn.textContent = "Wybierz folder"; +} + +async function handleUpload() { + let dirHandle; + if (await db.has(DB_DIR_KEY)) { + dirHandle = await db.get(DB_DIR_KEY); + dirHandle.requestPermission(); + } else { + dirHandle = await window.showDirectoryPicker(); + } + + const filesUploaded = []; + const formData = new FormData(); + for await (const [_, fileHandle] of dirHandle.entries()) { + if (fileHandle.kind !== "file") continue; + formData.append("files", await fileHandle.getFile()); + filesUploaded.push(fileHandle.name); + } + + await upload(formData); + + if ((await db.has(DB_DIR_KEY)) === false) { + await db.set(DB_DIR_KEY, dirHandle); + } + stdout( + `Pliki\n\n[${filesUploaded.join(", ")}]\n\nz folderu\n\n${dirHandle.name}\n\nwgrane`, + ); +} +btn.onclick = handleUpload; + +async function listFiles() { + const files = await fetch("./cgi-bin/list-files.py").then((res) => + res.json(), + ); + const children = []; + for (const file of files) { + const li = document.createElement("li"); + li.textContent = file; + const b = document.createElement("button"); + b.textContent = "Usun"; + b.onclick = () => deleteFile(file); + li.appendChild(b); + children.push(li); + } + fileListEl.replaceChildren(...children); +} +listFiles(); + +async function deleteFile(fileName) { + await fetch( + "./cgi-bin/delete-file.py?filename=" + encodeURIComponent(fileName), + { + method: "POST", + }, + ); + await listFiles(); +} + +async function upload(formData, onProgress) { + return new Promise((resolve, reject) => { + const xhr = new XMLHttpRequest(); + + bar.value = 0; + + xhr.upload.addEventListener("progress", (e) => { + if (e.lengthComputable) { + const percent = (e.loaded / e.total) * 100; + bar.value = percent; + } + }); + + xhr.addEventListener("load", resolve); + + xhr.open("POST", "./cgi-bin/upload.py"); + xhr.send(formData); + }); +} + +async function idb(dbName = "app", store = "kv") { + const db = await new Promise((resolve, reject) => { + const req = indexedDB.open(dbName, 1); + req.onupgradeneeded = () => req.result.createObjectStore(store); + req.onsuccess = () => resolve(req.result); + req.onerror = () => reject(req.error); + }); + + const run = (mode, fn) => + new Promise((resolve, reject) => { + const t = db.transaction(store, mode); + const req = fn(t.objectStore(store)); + t.oncomplete = () => resolve(req?.result); + t.onerror = () => reject(t.error); + }); + + return { + get: (k) => run("readonly", (s) => s.get(k)), + set: (k, v) => run("readwrite", (s) => s.put(v, k)), + del: (k) => run("readwrite", (s) => s.delete(k)), + keys: () => run("readonly", (s) => s.getAllKeys()), + clear: () => run("readwrite", (s) => s.clear()), + has: (k) => run("readonly", (s) => s.count(k)).then((n) => n > 0), + }; +} -- cgit v1.3.1