small cleanup

routes.ts

@@ -14,14 +14,14 @@ export const site = async (ctx: RouterContext) => {
 	if(ctx.params.filename == "sw.js" || ctx.params.filename == "script.js"){
 		ctx.response.type = "text/javascript"
 	}
+	if(ctx.params.filename == "style.css"){
+		ctx.response.type = "text/css"
+	}
 	ctx.response.body = await renderFileToString(`${Deno.cwd()}/site/${ctx.params.filename}`, {})
 }
 
 export const icons = async (ctx: RouterContext, next: any) => {
 	const identifier = ctx.params.filename
-
-	console.log(["t_192.png", "t_48.png", "t_96.png"].indexOf(identifier))
-
 	if (["t_192.png", "t_48.png", "t_96.png"].indexOf(identifier) != -1){
 		const img = await Deno.readFile(`${Deno.cwd()}/site/i/${ctx.params.filename}`);
 		ctx.response.type = "image/png";

site/index.html

@@ -25,12 +25,7 @@
 	  <link rel="apple-touch-startup-image" href="./i/t_192.png" />
 	  <link rel="manifest" href="manifest.json" />
 
-	  <style type="text/css">
+	  <link rel="stylesheet" href="./style.css">
-		:root {
-			color-scheme: light dark;
-		}
-
-	  </style>
 
 	  <script>
 		if ("serviceWorker" in navigator) {
@@ -73,112 +68,7 @@
 	<div id="results"></div>
 
 
-	<script type="text/javascript">
+	<script src="./script.js" type="text/javascript"></script>
-const form = document.getElementById("userform")
-const submit = document.getElementById("submit")
-const results = document.getElementById("results")
-
-const chunksize = 1000000;
-
-const splitter = (file, hash) => {
-	let numberofChunks = Math.ceil(file.byteLength/chunksize);
-	let left = 0
-	let chunks = []
-
-	for (let i = 0; i < numberofChunks; i++) {
-		const chunkForm = new FormData();
-		let contentRange = "";
-		let chunk;
-		if(left+chunksize <= file.byteLength){
-			contentRange = `${left}-${left+chunksize}`
-			chunk = file.slice(left,left+chunksize)
-			left += chunksize
-		} else {
-			contentRange = `${left}-${file.byteLength}`
-			chunk = file.slice(left,file.byteLength)
-		}
-		chunkForm.append('file', new Blob([chunk], {type:"video/webm"}))
-
-		chunks.push(
-			fetch("/uploadchunk", {
-				method: "POST",
-				headers: {
-					"Content-Number": i,
-					"Content-Range": `bytes ${contentRange}/${file.byteLength}`,
-					"File-Hash": hash
-				},
-				body: chunkForm
-			}).then(res => Promise.resolve(res.status))
-		)
-
-	}
-	return chunks
-}
-
-async function digest(data){
-	
-	const hash = await crypto.subtle.digest("SHA-256", data);
-	return hash
-
-}
-
-const processFile = file => {
-	const fr = new FileReader()
-	fr.readAsArrayBuffer(file)
-
-	fr.addEventListener("loadend", e => {
-		digest(e.target.result).then(digestBuffer => {
-  			const hashAsString = Array.from(new Uint8Array(digestBuffer)).map((b) => b.toString(16).padStart(2, "0")).join(""); // hex the buffer for readability
-
-  			let details = JSON.stringify({"usercode": "anonymous", "hash": hashAsString, "size": file.size, "type": file.type})
-
-  			fetch(`/announce`, {
-  				method: "POST",
-  				headers:{
-  					"Content-Type": "json",
-  				},
-  				body: details
-  			})
-  			.then(res => {
-  				if(res.status == 200){
-					Promise.all(splitter(e.target.result,hashAsString))
-					.then((values) => {
-						if(values.every(x => x === 200)){
-							fetch(`/finish`, {
-								method: "POST",
-								headers: {
-									"Content-Type": "json",
-								},
-								body: details
-							}).then(res => res.json())
-							.then(res => {
-								console.log(res)
-								results.innerHTML += `<a href="/${res.file}">https://i.hjmt.xyz/${res.file}</a><br>`
-							})							
-						}else{
-							alert("upload failed")
-						}
-					})
-				}else if(res.status == 409){
-					alert("file exists!")
-				}else if(res.status == 403){
-					alert("get a usertoken for bigger files")
-				}
-			})
-  		})
-
-	})
-
-}
-
-submit.addEventListener("click", e => {
-	e.preventDefault();	
-	for (const file of form.media.files){
-		processFile(file)
-	}
-})
-
-	</script>
 
 </body>
 </html>

site/script.js

@@ -24,7 +24,7 @@ const splitter = (file, hash) => {
 		chunkForm.append('file', new Blob([chunk], {type:"video/webm"}))
 
 		chunks.push(
-			fetch("/test", {
+			fetch("/uploadchunk", {
 				method: "POST",
 				headers: {
 					"Content-Number": i,
@@ -32,7 +32,8 @@ const splitter = (file, hash) => {
 					"File-Hash": hash
 				},
 				body: chunkForm
-		}))
+			}).then(res => Promise.resolve(res.status))
+		)
 
 	}
 	return chunks
@@ -50,35 +51,54 @@ const processFile = file => {
 	fr.readAsArrayBuffer(file)
 
 	fr.addEventListener("loadend", e => {
-
 		digest(e.target.result).then(digestBuffer => {
-
   			const hashAsString = Array.from(new Uint8Array(digestBuffer)).map((b) => b.toString(16).padStart(2, "0")).join(""); // hex the buffer for readability
 
-			Promise.all(splitter(e.target.result,hashAsString))
+  			let details = JSON.stringify({"usercode": "anonymous", "hash": hashAsString, "size": file.size, "type": file.type})
-			.then((values) => {
+
-				fetch(`/finish`, {
+  			fetch(`/announce`, {
-					method: "POST",
+  				method: "POST",
-					headers: {
+  				headers:{
-						"Content-Type": "json",
+  					"Content-Type": "json",
-					},
+  				},
-					body: JSON.stringify({"hash": hashAsString, "type": file.type})
+  				body: details
-				})
+  			})
+  			.then(res => {
+  				if(res.status == 200){
+					Promise.all(splitter(e.target.result,hashAsString))
+					.then((values) => {
+						if(values.every(x => x === 200)){
+							fetch(`/finish`, {
+								method: "POST",
+								headers: {
+									"Content-Type": "json",
+								},
+								body: details
+							}).then(res => res.json())
+							.then(res => {
+								console.log(res)
+								results.innerHTML += `<a href="/${res.file}">https://i.hjmt.xyz/${res.file}</a><br>`
+							})							
+						}else{
+							alert("upload failed")
+						}
+					})
+				}else if(res.status == 409){
+					alert("file exists!")
+				}else if(res.status == 403){
+					alert("get a usertoken for bigger files")
+				}
 			})
-		})
+  		})
+
 	})
 
 }
 
 submit.addEventListener("click", e => {
 	e.preventDefault();	
-	let fd = new FormData();
-	
 	for (const file of form.media.files){
-
 		processFile(file)
-
-		fd.append('file', file)
-		console.log(file)
 	}
 })
+

site/style.css

@@ -0,0 +1,3 @@
+:root {
+	color-scheme: light dark;
+}