Refactor code structure for improved readability and maintainability

public/js/ws.js

@@ -1,53 +1,58 @@
-import { state } from './state.js';
-
-let ws;
-let reconnectAttempts = 0;
-let reconnectTimer = null;
+// Assumes socket.io client library is loaded globally as io
+let socket;
 const outbox = [];
 let sessionId = localStorage.getItem('sessionId') || null;
-let lastRoomId = localStorage.getItem('lastRoomId') || null;
+let _lastRoomId = localStorage.getItem('lastRoomId') || null;
 
-export function wsIsOpen() { return ws && ws.readyState === WebSocket.OPEN; }
-export function sendMsg(obj) { if (wsIsOpen()) ws.send(JSON.stringify(obj)); else outbox.push(obj); }
-
-function scheduleReconnect(connect) {
-  if (reconnectTimer) return;
-  const delay = Math.min(30000, 1000 * Math.pow(2, reconnectAttempts));
-  reconnectAttempts++;
-  reconnectTimer = setTimeout(() => { reconnectTimer = null; connect(); }, delay);
+export function wsIsOpen() {
+  return !!socket?.connected;
+}
+export function sendMsg(obj) {
+  if (wsIsOpen()) socket.emit('message', obj);
+  else outbox.push(obj);
 }
 
 export function connectWS(onMessage) {
-  const url = (location.protocol === 'https:' ? 'wss://' : 'ws://') + location.host;
-  ws = new WebSocket(url);
-  ws.addEventListener('open', () => {
-    reconnectAttempts = 0;
+  // Establish Socket.IO connection in websocket-only mode
+  socket = window.io({ transports: ['websocket'] });
+  socket.on('connect', () => {
     // Try to resume session immediately on (re)connect
     if (sessionId) {
-      try { ws.send(JSON.stringify({ type: 'resume', sessionId })); } catch {}
+      try {
+        socket.emit('message', { type: 'resume', sessionId });
+      } catch {}
     }
-    setTimeout(() => { while (outbox.length && wsIsOpen()) { try { ws.send(JSON.stringify(outbox.shift())); } catch { break; } } }, 100);
+    // flush queued
+    setTimeout(() => {
+      while (outbox.length && wsIsOpen()) {
+        try {
+          socket.emit('message', outbox.shift());
+        } catch {
+          break;
+        }
+      }
+    }, 50);
   });
-  ws.addEventListener('message', (ev) => onMessage(ev));
-  ws.addEventListener('close', () => { scheduleReconnect(() => connectWS(onMessage)); });
-  ws.addEventListener('error', () => { try { ws.close(); } catch {} });
+  socket.on('message', (msg) => {
+    // Adapt to previous onmessage(ev) signature used by main.js
+    const ev = { data: JSON.stringify(msg) };
+    onMessage(ev);
+  });
+  // Socket.IO handles reconnection internally; no manual timers required
 }
 
-window.addEventListener('online', () => {
-  if (!wsIsOpen()) {
-    if (reconnectTimer) { clearTimeout(reconnectTimer); reconnectTimer = null; }
-    // Kick off a reconnect by calling connectWS from app main again
-  }
-});
-
 // Helpers to update cached ids from other modules
 export function cacheSessionId(id) {
   if (!id) return;
   sessionId = id;
-  try { localStorage.setItem('sessionId', id); } catch {}
+  try {
+    localStorage.setItem('sessionId', id);
+  } catch {}
 }
 export function cacheLastRoomId(id) {
   if (!id) return;
-  lastRoomId = id;
-  try { localStorage.setItem('lastRoomId', id); } catch {}
+  _lastRoomId = id;
+  try {
+    localStorage.setItem('lastRoomId', id);
+  } catch {}
 }