a

.gitignore

@@ -1 +1,3 @@
-node_modules
+node_modules
+tmp
+pack.tar

index.html

@@ -186,16 +186,25 @@ class Cursor {
 
 
 var client = {
+	ws: null,
 	connect() {
-		this.ws = new WebSocket(window.location.origin.replace("http", "ws") + `?color=${selfCursor.color}`);
-		this.ws.binaryType = "arraybuffer";
-		this.onmessage = event => {
+		return new Promise((resolve, reject) => {
+			this.ws = new WebSocket("ws://localhost:2834");
+			this.ws.binaryType = "arraybuffer";
+			this.ws.onopen = () => {
+				resolve();
+			};
+			this.ws.onmessage = event => {
 
-		};
-		this.onclose = () => {
-
-		};
-		this.onerror = console.error;
+			};
+			this.ws.onclose = () => {
+				thing.stop();
+				reject();
+			};
+			this.ws.onerror = error => {
+				reject(error);
+			}
+		});
 	},
 	send(data) {
 		if (this.ws?.readyState == WebSocket.OPEN) this.ws.send(data);
@@ -272,9 +281,10 @@ var thing = {
 
 	
 	async load() {
-		var data = await fetch("pack.tar.gz").then(res => res.blob());
+		var data = await fetch("pack.tar").then(res => res.arrayBuffer());
 		var extractedFiles = await untar(data);
 		for (var file of extractedFiles) {
+			if (!file.buffer.byteLength) continue;
 			this.records.push(file.buffer);
 		}
 	},
@@ -282,15 +292,16 @@ var thing = {
 		var cursor = new Cursor();
 		var dv = new DataView(data);
 		(function readLoop(offset){
+			if (offset >= data.byteLength) return;
 			var timestamp = dv.getUint32(offset); offset += 4;
 			setTimeout(() => {
-				if (!this.running) return;
+				if (!thing.running) return;
 				var opcode = dv.getUint8(offset); offset += 1;
 				switch (opcode) {
 					case 0:
 						// move
-						let x = dv.getUint16(offset); offset += 2;
-						let y = dv.getUint16(offset); offset += 2;
+						let x = dv.getInt16(offset); offset += 2;
+						let y = dv.getInt16(offset); offset += 2;
 						cursor.move(x, y);
 						break;
 					case 1:
@@ -316,7 +327,7 @@ var thing = {
 						break;
 				}
 				readLoop(offset);
-			}, timestamp - this.elapsed);
+			}, timestamp - thing.elapsed);
 		})(0);
 	}
 
@@ -332,6 +343,7 @@ var selfCursor = new Cursor();
 selfCursor.color = localStorage.color ||= `rgb(${[Math.floor(Math.random()*256),Math.floor(Math.random()*256),Math.floor(Math.random()*256)]})`;
 
 onmousemove = ({x, y}) => {
+	if (!thing.running) return;
 	x = x - innerWidth / 2;
 	y = y - innerHeight / 2;
 	selfCursor.move(x, y);
@@ -340,18 +352,22 @@ onmousemove = ({x, y}) => {
 	thing.recordCoordinates(x, y);
 };
 onmousedown = event => {
+	if (!thing.running) return;
 	selfCursor.pressed = true;
 	thing.recordPress();
 };
 onmouseup = event => {
+	if (!thing.running) return;
 	selfCursor.pressed = false;
 	thing.recordRelease();
 };
 onblur = event => {
+	if (!thing.running) return;
 	selfCursor.blurred = true;
 	thing.recordBlur();
 }
 onfocus = event => {
+	if (!thing.running) return;
 	selfCursor.blurred = false;
 	thing.recordFocus();
 };
@@ -366,11 +382,11 @@ onfocus = event => {
 
 
 
-try {
-	client.connect();
-} catch (error) {
-	console.error(error);
-}
+client.connect().then(() => {
+	thing.load().then(() => {
+		thing.start();
+	});
+});
 
 
 

server.mjs

@@ -7,9 +7,9 @@ var wss = new WebSocketServer({
 	port: 2834
 });
 
-wss.on("connection", ws => {
+wss.on("connection", (ws, req) => {
 
-	var filepath = path.join("tmp", `${new Date().toISOString()}-${color}-${Math.random().toString(36).slice(2)}`);
+	var filepath = path.join("tmp", Math.random().toString(36).slice(2));
 	var writestream = fs.createWriteStream(filepath);
 
 	ws.on("message", (data, isBinary) => {
@@ -25,8 +25,8 @@ wss.on("connection", ws => {
 
 function pack(file) {
 	tar.r({
-		file: "pack.tar.gz",
-		gzip: true,
+		file: "pack.tar",
+		gzip: false,
 		sync: true
 	}, [file]);
 }