release the client into the wild

1 files changed, 54 insertions, 41 deletions

diff --git a/html/wasm.html b/html/wasm.html
index 7b135308..939f96eb 100644
--- a/html/wasm.html
+++ b/html/wasm.html
@@ -1,6 +1,7 @@
 <!doctype html>
 <!--
 Copyright 2018 The Go Authors. All rights reserved.
+Copyright 2025 Florian Fischer
 Use of this source code is governed by a BSD-style
 license that can be found in the LICENSE file.
 -->
@@ -9,56 +10,68 @@ license that can be found in the LICENSE file.
 <head>
 	<meta charset="utf-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
-	<title>Go wasm</title>
+	<!-- <title>Go wasm</title> -->
 	<script src="eruda.js"></script>
 	<script>eruda.init();</script>
-</head>
-
-<body>
 	<script src="js/wasm_exec.js"></script>
-	<script>
-		if (!WebAssembly.instantiateStreaming) { // polyfill
-			WebAssembly.instantiateStreaming = async (resp, importObject) => {
-				const source = await (await resp).arrayBuffer();
-				return await WebAssembly.instantiate(source, importObject);
-			};
-		}
+	<style>
+.loader {
+	border: 16px solid #f3f3f3;
+	border-top: 16px solid;
+	border-radius: 50%;
+	width: 120px;
+	height: 120px;
+	animation: spin 2s linear infinite;
+}
 
-		const go = new Go();
-		let mod, inst;
-		let url = new URLSearchParams(window.location.search).get("wasm");
-		if (!url) {
-			// url = "dummy-ui/dummy-ui.wasm";
-			// url = "client/client.wasm";
-			url = "ai-companion.wasm";
-		}
-		
-		
-		WebAssembly.instantiateStreaming(fetch(url), go.importObject).then((result) => {
-			document.getElementById("wasmName").innerHTML = url;
-			mod = result.module;
-			inst = result.instance;
-			document.getElementById("runButton").disabled = false;
-		}).catch((err) => {
-			console.error(err);
-		});
+@keyframes spin {
+	0% { transform: rotate(0deg); }
+	100% { transform: rotate(360deg); }
+}
 
-		async function run() {
-			let wN = document.getElementById("wasmName");
-			let rB = document.getElementById("runButton");
-			document.body.removeChild(wN);
-			document.body.removeChild(rB);
+.container {
+	height: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+	</style>
+</head>
 
-			console.clear();
-			await go.run(inst);
-		}
-	</script>
+<body>
 	<div style="width:0; height:0; overflow:hidden;">
 	<input id="hiddenInput"></input>
 	</div>
-	<div id="wasmName"></div>
+	<div class="container" id="loader">
+		<div class="loader"></div>
+		<div id="url"></div>
+	</div>
 
-	<button onClick="run();" id="runButton" disabled>Run</button>
-</body>
+	<script>
+if (!WebAssembly.instantiateStreaming) { // polyfill
+	WebAssembly.instantiateStreaming = async (resp, importObject) => {
+		const source = await (await resp).arrayBuffer();
+		return await WebAssembly.instantiate(source, importObject);
+	};
+}
 
+const go = new Go();
+let mod, inst;
+let url = new URLSearchParams(window.location.search).get("wasm");
+if (!url) {
+	url = "client.wasm";
+}
+document.getElementById("url").innerHTML = url;
+
+WebAssembly.instantiateStreaming(fetch(url), go.importObject).then((result) => {
+	mod = result.module;
+	inst = result.instance;
+	let loader = document.getElementById("loader");
+	loader.remove();
+	go.run(inst);
+}).catch((err) => {
+	console.error(err);
+});
+	</script>
+</body>
 </html>