feat: add UI manager module for handling interactive controls, HUD, and modals

This commit is contained in:
Ben Miller 2026-10-20 13:31:43 -05:00
parent 4d81e6ccdd
commit 480051c14f

View file

@ -13,6 +13,7 @@ export class UIManager {
this.bindEvents();
this.syncSlidersFromConfig();
this.updateAudioButtons();
this.applyURLParams();
}
cacheDOMElements() {
@ -326,7 +327,8 @@ export class UIManager {
// Keyboard ESC & browser fullscreenchange listener
document.addEventListener('fullscreenchange', () => {
if (!document.fullscreenElement && this.isFullscreen) {
if (!document.fullscreenElement && this.hadDOMFullscreen) {
this.hadDOMFullscreen = false;
this.exitFullscreen(false);
}
});
@ -371,7 +373,47 @@ export class UIManager {
}
}
enterFullscreen() {
applyURLParams() {
try {
const params = new URLSearchParams(window.location.search);
const isScreensaver = params.get('screensaver') === '1' || params.get('screensaver') === 'true' ||
params.get('wallpaper') === '1' || params.get('wallpaper') === 'true';
const isFullscreen = isScreensaver || params.get('fullscreen') === '1' || params.get('fullscreen') === 'true';
const isContinuous = isScreensaver || params.get('continuous') === '1' || params.get('continuous') === 'true';
if (isContinuous) {
if (this.checkContinuous) {
this.checkContinuous.checked = true;
}
this.sim.config.continuousMode = true;
this.configManager.save({ continuousMode: true });
}
if (isFullscreen) {
setTimeout(() => {
this.enterFullscreen(false);
}, 120);
}
if (params.get('sound') === '0' || params.get('mute') === '1') {
if (this.sim.audio && this.sim.audio.sfxEnabled) {
this.sim.audio.toggleSfx();
this.updateAudioButtons();
}
}
if (params.get('music') === '1') {
if (this.sim.audio && !this.sim.audio.musicEnabled) {
this.sim.audio.toggleMusic();
this.updateAudioButtons();
}
}
} catch (e) {
console.warn('URL params check skipped:', e);
}
}
enterFullscreen(requestDOMFullscreen = true) {
this.isFullscreen = true;
const appLayout = document.querySelector('.app-layout');
if (appLayout) {
@ -381,8 +423,12 @@ export class UIManager {
this.btnExitFullscreen.classList.remove('hidden');
}
if (document.documentElement.requestFullscreen && !document.fullscreenElement) {
document.documentElement.requestFullscreen().catch(() => {});
if (requestDOMFullscreen && document.documentElement.requestFullscreen && !document.fullscreenElement) {
document.documentElement.requestFullscreen().then(() => {
this.hadDOMFullscreen = true;
}).catch(() => {
this.hadDOMFullscreen = false;
});
}
setTimeout(() => {
@ -392,6 +438,7 @@ export class UIManager {
exitFullscreen(requestExit = true) {
this.isFullscreen = false;
this.hadDOMFullscreen = false;
const appLayout = document.querySelector('.app-layout');
if (appLayout) {
appLayout.classList.remove('fullscreen-mode');