Zauberwald/src/main.ts

import "./styles/main.css";
import { getDB, initApp } from "./app";
import { initAudioOnInteraction } from "./audio/sounds";
import { getSettings, saveSettings } from "./storage/db";

window.addEventListener("error", (event) => {
	console.error("Global error:", event.error);
	const overlay = document.getElementById("error-overlay");
	if (overlay) overlay.style.display = "flex";
});

window.addEventListener("unhandledrejection", (event) => {
	console.error("Unhandled rejection:", event.reason);
	const overlay = document.getElementById("error-overlay");
	if (overlay) overlay.style.display = "flex";
});

document.addEventListener("DOMContentLoaded", async () => {
	await initApp();

	const db = getDB();

	// Wire mute button
	const muteBtn = document.getElementById("mute-btn");
	const muteIcon = document.getElementById("mute-icon");
	if (muteBtn && muteIcon) {
		// Set initial state from settings
		const settings = await getSettings(db);
		const audioEnabled = settings?.audioEnabled !== false;
		muteIcon.textContent = audioEnabled ? "\u{1F50A}" : "\u{1F507}";
		if (!audioEnabled) {
			muteBtn.classList.add("mute-btn--muted");
		}

		muteBtn.onclick = async () => {
			// Initialize AudioContext on first click (autoplay policy)
			initAudioOnInteraction();

			const current = await getSettings(db);
			const nowEnabled = !(current?.audioEnabled !== false);
			const updated = current ?? {
				id: 1 as const,
				audioEnabled: false,
				speechEnabled: false,
				apiKey: "",
				apiCallsToday: { text: 0, image: 0 },
				lastApiCallDate: "",
			};
			updated.audioEnabled = nowEnabled;
			await saveSettings(db, updated);

			muteIcon.textContent = nowEnabled ? "\u{1F50A}" : "\u{1F507}";
			muteBtn.classList.toggle("mute-btn--muted", !nowEnabled);
		};
	}

	// Initialize AudioContext on first user interaction (autoplay policy D-02)
	const initAudioOnce = () => {
		initAudioOnInteraction();
		document.removeEventListener("click", initAudioOnce);
		document.removeEventListener("keydown", initAudioOnce);
	};
	document.addEventListener("click", initAudioOnce);
	document.addEventListener("keydown", initAudioOnce);
});