some code for streamed downloads

3 files changed, 178 insertions, 0 deletions

diff --git a/client-web/source/sw/download_stream.ts b/client-web/source/sw/download_stream.ts
new file mode 100644
index 0000000..4eaf382
--- /dev/null
+++ b/client-web/source/sw/download_stream.ts
@@ -0,0 +1,57 @@
+import { SW } from "./init.ts"
+
+// export function StreamDownload(size: number, filename?: string, progress?: (position: number) => void) {
+//     let position = 0
+//     const buffer = new Uint8Array(size)
+//     return {
+//         close() {
+//             const a = document.createElement("a")
+//             a.href = URL.createObjectURL(new Blob([buffer], { type: "text/plain" }))
+//             a.download = filename ?? "file"
+//             a.click()
+//         },
+//         write(chunk: Blob) {
+//             const reader = new FileReader();
+//             reader.onload = function (event) {
+//                 const arr = new Uint8Array(event.target!.result as ArrayBuffer);
+//                 for (let i = 0; i < arr.length; i++, position++) {
+//                     buffer[position] = arr[i]
+//                 }
+//                 if (progress) progress(position)
+//             };
+//             reader.readAsArrayBuffer(chunk);
+//         }
+//     }
+// }
+
+export function StreamDownload(size: number, filename?: string, progress?: (position: number) => void) {
+    let position = 0
+
+    const path = `/download/${encodeURIComponent(filename ?? "file")}`
+
+    const { port1, port2 } = new MessageChannel()
+    SW!.postMessage({ path, size }, [port2])
+
+    const a = document.createElement("a")
+    a.href = path
+    a.download = filename ?? "file"
+    a.target = "_blank"
+    a.click()
+
+    return {
+        close() {
+            port1.postMessage("end")
+        },
+        write(chunk: Blob) {
+            const reader = new FileReader();
+            reader.onload = function (event) {
+                const arr = new Uint8Array(event.target!.result as ArrayBuffer);
+                console.log("send", arr);
+                port1.postMessage(arr)
+                position += arr.length
+                if (progress) progress(position)
+            };
+            reader.readAsArrayBuffer(chunk);
+        }
+    }
+}
diff --git a/client-web/source/sw/init.ts b/client-web/source/sw/init.ts
new file mode 100644
index 0000000..d082038
--- /dev/null
+++ b/client-web/source/sw/init.ts
@@ -0,0 +1,35 @@
+/*
+    This file is part of keks-meet (https://codeberg.org/metamuffin/keks-meet)
+    which is licensed under the GNU Affero General Public License (version 3); see /COPYING.
+    Copyright (C) 2022 metamuffin <metamuffin@disroot.org>
+*/
+/// <reference lib="dom" />
+
+import { log } from "../logger.ts"
+
+export let SW: ServiceWorker | undefined
+export async function init_serviceworker() {
+    let reg = await globalThis.navigator.serviceWorker.getRegistration()
+    if (reg) {
+        log("sw", "service worker already installed")
+    } else {
+        log("sw", "registering service worker")
+        await globalThis.navigator.serviceWorker.register("/sw.js", { scope: "/", type: "module" })
+        log("sw", "worker installed")
+        reg = await globalThis.navigator.serviceWorker.getRegistration();
+        if (!reg) throw new Error("we just registered the sw!?");
+    }
+    const i = setInterval(() => {
+        if (reg!.active) {
+            SW = reg!.active
+            clearInterval(i)
+        }
+    }, 100)
+}
+
+export async function update_serviceworker() {
+    const regs = await globalThis.navigator.serviceWorker.getRegistrations()
+    for (const r of regs) await r.unregister()
+    log("sw", "cleared all workers")
+    setTimeout(() => window.location.reload(), 500)
+}
diff --git a/client-web/source/sw/worker.ts b/client-web/source/sw/worker.ts
new file mode 100644
index 0000000..25f6bab
--- /dev/null
+++ b/client-web/source/sw/worker.ts
@@ -0,0 +1,86 @@
+/*
+    This file is part of keks-meet (https://codeberg.org/metamuffin/keks-meet)
+    which is licensed under the GNU Affero General Public License (version 3); see /COPYING.
+    Copyright (C) 2022 metamuffin <metamuffin@disroot.org>
+*/
+/// <reference no-default-lib="true"/>
+
+/// <reference lib="esnext" />
+/// <reference lib="webworker" />
+declare const self: ServiceWorkerGlobalScope; export { };
+
+console.log("hello from the keks-meet service worker");
+console.log(self.origin)
+
+// let cache: Cache;
+
+self.addEventListener("install", event => {
+    console.log("install");
+    self.skipWaiting()
+    event.waitUntil(caches.delete("v1"))
+})
+self.addEventListener("activate", _event => {
+    console.log("activate");
+    self.clients.claim()
+    // event.waitUntil((async () => {
+    //     cache = await caches.open("v1")
+    //     cache.addAll([
+    //         "/assets/bundle.js",
+    //         "/assets/sw.js",
+    //     ])
+    // })())
+})
+self.addEventListener("unload", () => {
+    console.log("unload")
+})
+
+const streams = new Map<string, { readable: ReadableStream, size: number }>()
+
+self.addEventListener("message", ev => {
+    console.log(ev);
+    const { path, size } = ev.data, port = ev.ports[0]
+    const readable = port_to_readable(port)
+    streams.set(path, { readable, size })
+})
+
+function port_to_readable(port: MessagePort): ReadableStream {
+    return new ReadableStream({
+        start(controller) {
+            console.log("ReadableStream started");
+            port.addEventListener("message", event => {
+                console.log(event.data);
+                if (event.data === "end") { controller.close() }
+                else if (event.data === "abort") controller.error("aborted")
+                else controller.enqueue(event.data)
+            })
+        },
+        cancel() { console.log("ReadableStream cancelled"); port.postMessage({ abort: true }) },
+    })
+}
+
+self.addEventListener("fetch", event => {
+    const { request } = event;
+    if (!request.url.startsWith(self.origin)) return
+    const path = request.url.substring(self.origin.length)
+    console.log(request.method, path);
+
+    const stream = streams.get(path)
+    if (stream) {
+        streams.delete(path)
+        console.log(`-> stream response`);
+        return event.respondWith(
+            new Response(
+                stream.readable,
+                {
+                    headers: new Headers({
+                        "Content-Type": "application/octet-stream; charset=utf-8", // TODO transmit and set accordingly
+                        "Content-Security-Policy": "default-src 'none'",
+                        "Content-Length": `${stream.size}`,
+                    })
+                }
+            )
+        )
+    }
+
+    event.respondWith(fetch(request))
+})