Refactor, add types, increase retry delay

jsconfig.json

@@ -1,6 +1,7 @@
 {
 	"compilerOptions": {
 		"checkJs": true,
-		"target": "es2021"
+		"target": "es2021",
+		"noImplicitAny": false
 	}
 }

main.js

@@ -2,14 +2,25 @@
 // https://github.com/hardcpp/BeatSaberPlus/wiki/%5BEN%5D-Song-Overlay
 
 const bspUrl = "ws://localhost:2947/socket";
-const retryMs = 5000;
+const retryMs = 10000;
 let retries = 0;
 
 function connect() {
 	console.log(`Connecting to ${bspUrl} (attempt ${retries++})`);
 	const ws = new WebSocket(bspUrl);
-	ws.onopen = () => console.log("Connection open.");
+	ws.onopen = onOpen;
-	ws.onmessage = (e) => {
+	ws.onmessage = onMessage;
+	ws.onclose = onClose;
+}
+
+function onOpen() {
+	console.log("Connection open.");
+	retries = 0;
+}
+
+/** @param {MessageEvent<string>} e */
+function onMessage(e) {
+	/** @type {BeatSaberPlusEvent} */
 	const data = JSON.parse(e.data);
 	switch (data._type) {
 		case "event":
@@ -28,11 +39,12 @@ function connect() {
 			console.log("message", e.data);
 			break;
 	}
-	};
+}
-	ws.onclose = (e) => {
+
+/** @param {CloseEvent} e */
+function onClose(e) {
 	console.log(`Connection closed. code: ${e.code}, reason: ${e.reason}, clean: ${e.wasClean}`);
 	setTimeout(connect, retryMs);
-	};
 }
 
 const cover = document.getElementById("cover");
@@ -56,10 +68,11 @@ function updateMapInfo(data) {
 	mapper.textContent = data.mapper || "";
 	difficulty.textContent = data.difficulty.replace("Plus", " +") || "";
 	characteristicIcon.setAttribute("src", `images/characteristic/${data.characteristic}.svg`);
-	difficultyLabel.textContent = "";
+	difficultyLabel.textContent = ""; // BS+ does not provide label
-	bsrKey.textContent = data.BSRKey || "";
+	bsrKey.textContent = data.BSRKey || ""; // Always empty?
 	type.textContent = !custom ? "OST" : data.level_id.endsWith(" WIP") ? "WIP" : "";
 
+	// Fetch extra info from BeatSaver
 	if (custom) {
 		fetch(`https://api.beatsaver.com/maps/hash/${data.level_id.substring(13, 53)}`)
 			.then(response => response.json())

types.d.ts

@@ -1,8 +1,35 @@
-interface Document {
+// https://github.com/hardcpp/BeatSaberPlus/wiki/%5BEN%5D-Song-Overlay
-	getElementById(elementId: string): HTMLElement;
+
+interface HandshakeEvent {
+	"_type": "handshake";
+	"protocolVersion": number;
+	"gameVersion": string;
+	"playerName": string;
+	"playerPlatformId": string;
 }
 
-interface MapInfoChanged {
+interface GameStateEvent {
+	"_type": "event";
+	"_event": "gameState";
+	"gameStateChanged": "Menu" | "Playing";
+}
+
+interface ResumeEvent {
+	"_type": "event";
+	"_event": "resume";
+	"resumeTime": number;
+}
+
+interface PauseEvent {
+	"_type": "event";
+	"_event": "pause";
+	"pauseTime": number;
+}
+
+interface MapInfoChangedEvent {
+	"_type": "event";
+	"_event": "mapInfo";
+	"mapInfoChanged": {
 		"level_id": string;
 		"name": string;
 		"sub_name": string;
@@ -17,4 +44,25 @@ interface MapInfoChanged {
 		"coverRaw": string;
 		"time": number;
 		"timeMultiplier": number;
+	};
+}
+
+interface ScoreEvent {
+	"_type": "event";
+	"_event": "score";
+	"scoreEvent": {
+		"time": number;
+		"score": number;
+		"accuracy": number;
+		"combo": number;
+		"missCount": number;
+		"currentHealth": number;
+	};
+}
+
+type BeatSaberPlusEvent = HandshakeEvent | GameStateEvent | ResumeEvent | PauseEvent | MapInfoChangedEvent | ScoreEvent;
+type MapInfoChanged = MapInfoChangedEvent["mapInfoChanged"];
+
+interface Document {
+	getElementById(elementId: string): HTMLElement; // Assume non-null
 }