fix: convert ES modules to classic scripts for file:// compatibility

Browsers block ES module imports over the file:// protocol due to CORS.
Users opening the overlay by double-clicking the HTML file saw all JS
fail to load. Replace import/export with a window.OBS global namespace
and classic <script> tags so the overlay works without a local server.

Made-with: Cursor
This commit is contained in:
cottongin
2026-03-20 22:20:12 -04:00
parent a8b7df48a6
commit fa7363bc78
7 changed files with 54 additions and 33 deletions

12
js/controls.js vendored
View File

@@ -2,8 +2,6 @@
* Debug dashboard, manual overrides, and bindings for the controls panel.
*/
import { OVERRIDE_MODES } from './state-manager.js';
const STATE_COLORS = Object.freeze({
idle: '#888',
lobby: '#4CAF50',
@@ -20,7 +18,7 @@ const STORAGE_API_KEY = 'jackbox-api-key';
* @param {import('./websocket-client.js').WebSocketClient} wsClient
* @param {{ roomCode?: unknown, audio?: unknown, playerList?: unknown }} components
*/
export function initControls(manager, wsClient, components) {
function initControls(manager, wsClient, components) {
const stateEl = document.getElementById('manager-state');
const roomCodeEl = document.getElementById('manager-room-code');
const sessionIdEl = document.getElementById('manager-session-id');
@@ -34,7 +32,7 @@ export function initControls(manager, wsClient, components) {
const select = document.getElementById(`override-${name}`);
if (!select) continue;
if (select.options.length === 0) {
for (const mode of Object.values(OVERRIDE_MODES)) {
for (const mode of Object.values(window.OBS.OVERRIDE_MODES)) {
const opt = document.createElement('option');
opt.value = mode;
opt.textContent = mode.replace(/_/g, ' ');
@@ -335,7 +333,7 @@ export function initControls(manager, wsClient, components) {
/**
* @returns {(state: string, message?: string) => void}
*/
export function initConnectionStatusHandler() {
function initConnectionStatusHandler() {
const wsStatusDot = document.getElementById('ws-status-dot');
const wsStatusText = document.getElementById('ws-status-text');
const wsConnectBtn = document.getElementById('ws-connect-btn');
@@ -360,3 +358,7 @@ export function initConnectionStatusHandler() {
}
};
}
window.OBS = window.OBS || {};
window.OBS.initControls = initControls;
window.OBS.initConnectionStatusHandler = initConnectionStatusHandler;