close modals on navigation
This commit is contained in:
parent
03a7dcda52
commit
64ff09910b
4 changed files with 52 additions and 19 deletions
|
|
@ -3097,14 +3097,14 @@
|
||||||
<div class="settings-group">
|
<div class="settings-group">
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">Close Queue on Navigation</span>
|
<span class="label">Close Modals on Navigation</span>
|
||||||
<span class="description"
|
<span class="description"
|
||||||
>Close the queue panel when navigating back or to a new page (useful for
|
>Close open modals and panels (like lyrics, queue) when navigating back or
|
||||||
mobile)</span
|
to a new page</span
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<label class="toggle-switch">
|
<label class="toggle-switch">
|
||||||
<input type="checkbox" id="queue-close-on-navigation-toggle" />
|
<input type="checkbox" id="close-modals-on-navigation-toggle" />
|
||||||
<span class="slider"></span>
|
<span class="slider"></span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ import {
|
||||||
downloadQualitySettings,
|
downloadQualitySettings,
|
||||||
sidebarSettings,
|
sidebarSettings,
|
||||||
pwaUpdateSettings,
|
pwaUpdateSettings,
|
||||||
queueBehaviorSettings,
|
modalSettings,
|
||||||
} from './storage.js';
|
} from './storage.js';
|
||||||
import { UIRenderer } from './ui.js';
|
import { UIRenderer } from './ui.js';
|
||||||
import { Player } from './player.js';
|
import { Player } from './player.js';
|
||||||
|
|
@ -2117,9 +2117,10 @@ document.addEventListener('DOMContentLoaded', async () => {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Close side panel (queue/lyrics) on navigation if setting is enabled
|
// Close side panel (queue/lyrics) and modals on navigation if setting is enabled
|
||||||
if (queueBehaviorSettings.shouldCloseOnNavigation()) {
|
if (modalSettings.shouldCloseOnNavigation()) {
|
||||||
sidePanelManager.close();
|
sidePanelManager.close();
|
||||||
|
modalSettings.closeAllModals();
|
||||||
}
|
}
|
||||||
|
|
||||||
await router();
|
await router();
|
||||||
|
|
|
||||||
|
|
@ -32,7 +32,7 @@ import {
|
||||||
contentBlockingSettings,
|
contentBlockingSettings,
|
||||||
musicProviderSettings,
|
musicProviderSettings,
|
||||||
analyticsSettings,
|
analyticsSettings,
|
||||||
queueBehaviorSettings,
|
modalSettings,
|
||||||
} from './storage.js';
|
} from './storage.js';
|
||||||
import { audioContextManager, EQ_PRESETS } from './audio-context.js';
|
import { audioContextManager, EQ_PRESETS } from './audio-context.js';
|
||||||
import { getButterchurnPresets } from './visualizers/butterchurn.js';
|
import { getButterchurnPresets } from './visualizers/butterchurn.js';
|
||||||
|
|
@ -1910,12 +1910,12 @@ export function initializeSettings(scrobbler, player, api, ui) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// Queue Close on Navigation Toggle
|
// Close Modals on Navigation Toggle
|
||||||
const queueCloseOnNavigationToggle = document.getElementById('queue-close-on-navigation-toggle');
|
const closeModalsOnNavigationToggle = document.getElementById('close-modals-on-navigation-toggle');
|
||||||
if (queueCloseOnNavigationToggle) {
|
if (closeModalsOnNavigationToggle) {
|
||||||
queueCloseOnNavigationToggle.checked = queueBehaviorSettings.shouldCloseOnNavigation();
|
closeModalsOnNavigationToggle.checked = modalSettings.shouldCloseOnNavigation();
|
||||||
queueCloseOnNavigationToggle.addEventListener('change', (e) => {
|
closeModalsOnNavigationToggle.addEventListener('change', (e) => {
|
||||||
queueBehaviorSettings.setCloseOnNavigation(e.target.checked);
|
modalSettings.setCloseOnNavigation(e.target.checked);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2208,16 +2208,15 @@ export const musicProviderSettings = {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export const queueBehaviorSettings = {
|
export const modalSettings = {
|
||||||
STORAGE_KEY: 'queue-close-on-navigation',
|
STORAGE_KEY: 'close-modals-on-navigation',
|
||||||
|
|
||||||
shouldCloseOnNavigation() {
|
shouldCloseOnNavigation() {
|
||||||
try {
|
try {
|
||||||
// Default to true on mobile, false on desktop
|
// Default to false to preserve existing behavior
|
||||||
const saved = localStorage.getItem(this.STORAGE_KEY);
|
const saved = localStorage.getItem(this.STORAGE_KEY);
|
||||||
if (saved === null) {
|
if (saved === null) {
|
||||||
// Auto-detect: default to true for mobile/touch devices
|
return false;
|
||||||
return window.matchMedia('(pointer: coarse)').matches;
|
|
||||||
}
|
}
|
||||||
return saved === 'true';
|
return saved === 'true';
|
||||||
} catch {
|
} catch {
|
||||||
|
|
@ -2228,6 +2227,39 @@ export const queueBehaviorSettings = {
|
||||||
setCloseOnNavigation(enabled) {
|
setCloseOnNavigation(enabled) {
|
||||||
localStorage.setItem(this.STORAGE_KEY, enabled ? 'true' : 'false');
|
localStorage.setItem(this.STORAGE_KEY, enabled ? 'true' : 'false');
|
||||||
},
|
},
|
||||||
|
|
||||||
|
closeAllModals() {
|
||||||
|
// Close all modal overlays
|
||||||
|
document.querySelectorAll('.modal-overlay').forEach((modal) => {
|
||||||
|
modal.remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close all modals with active class
|
||||||
|
document.querySelectorAll('.modal.active').forEach((modal) => {
|
||||||
|
modal.classList.remove('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close specific modals by ID
|
||||||
|
const modalIds = [
|
||||||
|
'playlist-modal',
|
||||||
|
'folder-modal',
|
||||||
|
'playlist-select-modal',
|
||||||
|
'shortcuts-modal',
|
||||||
|
'missing-tracks-modal',
|
||||||
|
'sleep-timer-modal',
|
||||||
|
'discography-download-modal',
|
||||||
|
'custom-db-modal',
|
||||||
|
'tracker-modal',
|
||||||
|
'epilepsy-warning-modal',
|
||||||
|
];
|
||||||
|
|
||||||
|
modalIds.forEach((id) => {
|
||||||
|
const modal = document.getElementById(id);
|
||||||
|
if (modal) {
|
||||||
|
modal.classList.remove('active');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
||||||
export const contentBlockingSettings = {
|
export const contentBlockingSettings = {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue