fix(settings): organize downloads tab
This commit is contained in:
Daniel
parent
9c34dd4b9d
commit
2923757029
2 changed files with 66 additions and 44 deletions
86
index.html
86
index.html
|
|
@ -4075,6 +4075,49 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="settings-tab-content" id="settings-tab-downloads">
|
<div class="settings-tab-content" id="settings-tab-downloads">
|
||||||
<div class="settings-list">
|
<div class="settings-list">
|
||||||
|
<div class="settings-group">
|
||||||
|
<div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Download Quality</span>
|
||||||
|
<span class="description">Quality for track downloads</span>
|
||||||
|
</div>
|
||||||
|
<select id="download-quality-setting">
|
||||||
|
<option value="HI_RES_LOSSLESS">Hi-Res Lossless (24-bit)</option>
|
||||||
|
<option value="LOSSLESS">Lossless (16-bit)</option>
|
||||||
|
<option value="HIGH">AAC 320kbps</option>
|
||||||
|
<option value="LOW">AAC 96kbps</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item" id="hi-res-download-warning" style="display: none">
|
||||||
|
<div class="info setting-details">
|
||||||
|
<span class="description">
|
||||||
|
24-bit downloads may crash the browser on some devices, or be missing
|
||||||
|
metadata.
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Dolby Atmos</span>
|
||||||
|
<span class="description">Prefer Dolby Atmos tracks when available</span>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="dolby-atmos-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Lossless Container</span>
|
||||||
|
<span class="description">Container format for lossless downloads</span>
|
||||||
|
</div>
|
||||||
|
<select id="lossless-container-setting">
|
||||||
|
<option value="nochange">Don't change</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="settings-group">
|
<div class="settings-group">
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
|
|
@ -4135,6 +4178,8 @@
|
||||||
<span class="slider"></span>
|
<span class="slider"></span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="settings-group">
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">Download Lyrics</span>
|
<span class="label">Download Lyrics</span>
|
||||||
|
|
@ -4159,47 +4204,6 @@
|
||||||
<span class="slider"></span>
|
<span class="slider"></span>
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Download Quality</span>
|
|
||||||
<span class="description">Quality for track downloads</span>
|
|
||||||
</div>
|
|
||||||
<select id="download-quality-setting">
|
|
||||||
<option value="HI_RES_LOSSLESS">Hi-Res Lossless (24-bit)</option>
|
|
||||||
<option value="LOSSLESS">Lossless (16-bit)</option>
|
|
||||||
<option value="HIGH">AAC 320kbps</option>
|
|
||||||
<option value="LOW">AAC 96kbps</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item" id="hi-res-download-warning" style="display: none">
|
|
||||||
<div class="info setting-details">
|
|
||||||
<span class="description">
|
|
||||||
24-bit downloads may crash the browser on some devices, or be missing
|
|
||||||
metadata.
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Dolby Atmos</span>
|
|
||||||
<span class="description">Prefer Dolby Atmos tracks when available</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="dolby-atmos-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Lossless Container</span>
|
|
||||||
<span class="description">Container format for lossless downloads</span>
|
|
||||||
</div>
|
|
||||||
<select id="lossless-container-setting">
|
|
||||||
<option value="nochange">Don't change</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">Cover Art Size</span>
|
<span class="label">Cover Art Size</span>
|
||||||
|
|
|
||||||
|
|
@ -1004,7 +1004,7 @@ export async function initializeSettings(scrobbler, player, api, ui) {
|
||||||
if (resetSavedFolderSetting) {
|
if (resetSavedFolderSetting) {
|
||||||
let showReset = false;
|
let showReset = false;
|
||||||
if (isFolderMethod && hasFolderPicker && modernSettings.rememberBulkDownloadFolder) {
|
if (isFolderMethod && hasFolderPicker && modernSettings.rememberBulkDownloadFolder) {
|
||||||
const savedHandle = await db.getSetting('bulk_download_folder_handle');
|
const savedHandle = modernSettings.bulkDownloadFolder;
|
||||||
showReset = !!savedHandle;
|
showReset = !!savedHandle;
|
||||||
}
|
}
|
||||||
resetSavedFolderSetting.style.display = showReset ? '' : 'none';
|
resetSavedFolderSetting.style.display = showReset ? '' : 'none';
|
||||||
|
|
@ -1102,7 +1102,8 @@ export async function initializeSettings(scrobbler, player, api, ui) {
|
||||||
|
|
||||||
if (resetSavedFolderBtn) {
|
if (resetSavedFolderBtn) {
|
||||||
resetSavedFolderBtn.addEventListener('click', async () => {
|
resetSavedFolderBtn.addEventListener('click', async () => {
|
||||||
await db.saveSetting('bulk_download_folder_handle', null);
|
modernSettings.bulkDownloadFolder = null;
|
||||||
|
await modernSettings.waitPending();
|
||||||
await updateFolderMethodVisibility();
|
await updateFolderMethodVisibility();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -1122,7 +1123,7 @@ export async function initializeSettings(scrobbler, player, api, ui) {
|
||||||
}
|
}
|
||||||
|
|
||||||
updateForceZipBlobVisibility();
|
updateForceZipBlobVisibility();
|
||||||
updateFolderMethodVisibility();
|
await updateFolderMethodVisibility();
|
||||||
|
|
||||||
const includeCoverToggle = document.getElementById('include-cover-toggle');
|
const includeCoverToggle = document.getElementById('include-cover-toggle');
|
||||||
if (includeCoverToggle) {
|
if (includeCoverToggle) {
|
||||||
|
|
@ -2619,6 +2620,23 @@ export async function initializeSettings(scrobbler, player, api, ui) {
|
||||||
observer.observe(appearanceTabContent, { attributes: true });
|
observer.observe(appearanceTabContent, { attributes: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Watch for downloads tab becoming active and update setting visibility
|
||||||
|
const downloadsTabContent = document.getElementById('settings-tab-downloads');
|
||||||
|
if (downloadsTabContent) {
|
||||||
|
const observer = new MutationObserver(async (mutations) => {
|
||||||
|
for (const mutation of mutations) {
|
||||||
|
if (mutation.type === 'attributes' && mutation.attributeName === 'class') {
|
||||||
|
if (downloadsTabContent.classList.contains('active')) {
|
||||||
|
console.log('[Settings] Downloads tab became active, updating setting visibility');
|
||||||
|
updateForceZipBlobVisibility();
|
||||||
|
await updateFolderMethodVisibility();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
observer.observe(downloadsTabContent, { attributes: true });
|
||||||
|
}
|
||||||
|
|
||||||
// Visualizer Mode Select
|
// Visualizer Mode Select
|
||||||
const visualizerModeSelect = document.getElementById('visualizer-mode-select');
|
const visualizerModeSelect = document.getElementById('visualizer-mode-select');
|
||||||
if (visualizerModeSelect) {
|
if (visualizerModeSelect) {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue