feat: add UI manager module for handling interactive controls, HUD, and modals
This commit is contained in:
parent
4d81e6ccdd
commit
480051c14f
1 changed files with 51 additions and 4 deletions
55
js/ui.js
55
js/ui.js
|
|
@ -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');
|
||||
|
|
|
|||
Loading…
Reference in a new issue