style: auto-fix linting issues
This commit is contained in:
JulienMaille
github-actions[bot]
parent
9fe689db53
commit
71ed8c7c1f
3 changed files with 369 additions and 334 deletions
679
index.html
679
index.html
|
|
@ -3876,7 +3876,9 @@
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">Compact Artists</span>
|
<span class="label">Compact Artists</span>
|
||||||
<span class="description">Show artist cards in a compact, horizontal layout</span>
|
<span class="description"
|
||||||
|
>Show artist cards in a compact, horizontal layout</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<label class="toggle-switch">
|
<label class="toggle-switch">
|
||||||
<input type="checkbox" id="compact-artist-toggle" />
|
<input type="checkbox" id="compact-artist-toggle" />
|
||||||
|
|
@ -3886,7 +3888,9 @@
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">Compact Albums</span>
|
<span class="label">Compact Albums</span>
|
||||||
<span class="description">Show album cards in a compact, horizontal layout</span>
|
<span class="description"
|
||||||
|
>Show album cards in a compact, horizontal layout</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<label class="toggle-switch">
|
<label class="toggle-switch">
|
||||||
<input type="checkbox" id="compact-album-toggle" />
|
<input type="checkbox" id="compact-album-toggle" />
|
||||||
|
|
@ -4637,7 +4641,11 @@
|
||||||
class="playback-speed-number-input"
|
class="playback-speed-number-input"
|
||||||
/>
|
/>
|
||||||
<span class="playback-speed-unit">x</span>
|
<span class="playback-speed-unit">x</span>
|
||||||
<button id="playback-speed-reset" class="btn-secondary" title="Reset to default">
|
<button
|
||||||
|
id="playback-speed-reset"
|
||||||
|
class="btn-secondary"
|
||||||
|
title="Reset to default"
|
||||||
|
>
|
||||||
Reset
|
Reset
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -4915,349 +4923,370 @@
|
||||||
</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 class="settings-group">
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Zipped Bulk Downloads</span>
|
|
||||||
<span class="description"
|
|
||||||
>Download multiple tracks as a single ZIP file (requires browser support)</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="zipped-bulk-downloads-toggle" checked />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Download Lyrics</span>
|
|
||||||
<span class="description">Include .lrc files when downloading tracks/albums</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="download-lyrics-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Romaji Lyrics</span>
|
|
||||||
<span class="description"
|
|
||||||
>Convert Japanese lyrics to Romaji (Latin characters)</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="romaji-lyrics-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</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 FLAC (24-bit)</option>
|
|
||||||
<option value="LOSSLESS">FLAC (Lossless)</option>
|
|
||||||
<option value="MP3_320">MP3 320kbps</option>
|
|
||||||
<option value="HIGH">AAC 320kbps</option>
|
|
||||||
<option value="LOW">AAC 96kbps</option>
|
|
||||||
</select>
|
|
||||||
</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="flac">FLAC</option>
|
|
||||||
<option value="alac">Apple Lossless</option>
|
|
||||||
<option value="nochange">Don't change</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Cover Art Size</span>
|
|
||||||
<span class="description">Size for downloaded/embedded cover art</span>
|
|
||||||
</div>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="cover-art-size-setting"
|
|
||||||
class="template-input"
|
|
||||||
style="width: 120px; text-align: right"
|
|
||||||
placeholder="1280x1280"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Filename Template</span>
|
|
||||||
<span class="description"
|
|
||||||
>Customize download filenames. Available: {trackNumber}, {artist}, {title},
|
|
||||||
{album}</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="filename-template"
|
|
||||||
class="template-input"
|
|
||||||
placeholder="{trackNumber} - {artist} - {title}"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">ZIP Folder Template</span>
|
|
||||||
<span class="description"
|
|
||||||
>Customize album folder names. Available: {albumTitle}, {albumArtist},
|
|
||||||
{year}</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="zip-folder-template"
|
|
||||||
class="template-input"
|
|
||||||
placeholder="{albumTitle} - {albumArtist} - monochrome.tf"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-group">
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Generate M3U</span>
|
|
||||||
<span class="description">Include M3U playlist files in downloads</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="generate-m3u-toggle" checked />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Generate M3U8</span>
|
|
||||||
<span class="description">Include extended M3U8 playlist files in downloads</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="generate-m3u8-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Generate CUE</span>
|
|
||||||
<span class="description"
|
|
||||||
>Include CUE sheets for gapless playback in downloads</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="generate-cue-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Generate NFO</span>
|
|
||||||
<span class="description">Include NFO files for media center compatibility</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="generate-nfo-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Generate JSON</span>
|
|
||||||
<span class="description">Include JSON files with rich metadata</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="generate-json-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-group">
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Relative Paths</span>
|
|
||||||
<span class="description">Use relative paths in playlist files</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="relative-paths-toggle" checked />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Separate Discs in ZIP</span>
|
|
||||||
<span class="description"
|
|
||||||
>Put tracks in Disc folders when a release has multiple discs</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="separate-discs-zip-toggle" />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-tab-content" id="settings-tab-instances">
|
|
||||||
<div class="settings-list">
|
|
||||||
<div class="settings-group">
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">ADVANCED: Custom Database/Auth</span>
|
|
||||||
<span class="description">Configure custom PocketBase and Firebase instances</span>
|
|
||||||
</div>
|
|
||||||
<button id="custom-db-btn" class="btn-secondary">Configure</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-group">
|
|
||||||
<div id="api-instance-manager">
|
|
||||||
<div class="setting-item">
|
<div class="setting-item">
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span class="label">API Instances</span>
|
<span class="label">Zipped Bulk Downloads</span>
|
||||||
<span class="description">Manage and prioritize API instances.</span>
|
<span class="description"
|
||||||
|
>Download multiple tracks as a single ZIP file (requires browser
|
||||||
|
support)</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<button id="refresh-speed-test-btn" class="btn-secondary">
|
<label class="toggle-switch">
|
||||||
Refresh Instance List
|
<input type="checkbox" id="zipped-bulk-downloads-toggle" checked />
|
||||||
</button>
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<ul id="api-instance-list"></ul>
|
<div class="setting-item">
|
||||||
</div>
|
<div class="info">
|
||||||
</div>
|
<span class="label">Download Lyrics</span>
|
||||||
</div>
|
<span class="description"
|
||||||
</div>
|
>Include .lrc files when downloading tracks/albums</span
|
||||||
|
>
|
||||||
<div class="settings-tab-content" id="settings-tab-system">
|
</div>
|
||||||
<div class="settings-list">
|
<label class="toggle-switch">
|
||||||
<div class="settings-group">
|
<input type="checkbox" id="download-lyrics-toggle" />
|
||||||
<div class="setting-item">
|
<span class="slider"></span>
|
||||||
<div class="info">
|
</label>
|
||||||
<span class="label">Keyboard Shortcuts</span>
|
|
||||||
<span class="description">View and customize keyboard shortcuts</span>
|
|
||||||
</div>
|
</div>
|
||||||
<button id="customize-shortcuts-btn" class="btn-secondary">Customize</button>
|
<div class="setting-item">
|
||||||
</div>
|
<div class="info">
|
||||||
<div class="setting-item">
|
<span class="label">Romaji Lyrics</span>
|
||||||
<div class="info">
|
<span class="description"
|
||||||
<span class="label">Cache</span>
|
>Convert Japanese lyrics to Romaji (Latin characters)</span
|
||||||
<span class="description" id="cache-info"
|
>
|
||||||
>Stores API responses to reduce requests</span
|
</div>
|
||||||
>
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="romaji-lyrics-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<button id="clear-cache-btn" class="btn-secondary">Clear Cache</button>
|
<div class="setting-item">
|
||||||
</div>
|
<div class="info">
|
||||||
<div class="setting-item">
|
<span class="label">Download Quality</span>
|
||||||
<div class="info">
|
<span class="description">Quality for track downloads</span>
|
||||||
<span class="label">Auto-Update App</span>
|
</div>
|
||||||
<span class="description"
|
<select id="download-quality-setting">
|
||||||
>Automatically reload when a new version is available</span
|
<option value="HI_RES_LOSSLESS">Hi-Res FLAC (24-bit)</option>
|
||||||
>
|
<option value="LOSSLESS">FLAC (Lossless)</option>
|
||||||
|
<option value="MP3_320">MP3 320kbps</option>
|
||||||
|
<option value="HIGH">AAC 320kbps</option>
|
||||||
|
<option value="LOW">AAC 96kbps</option>
|
||||||
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<label class="toggle-switch">
|
<div class="setting-item">
|
||||||
<input type="checkbox" id="pwa-auto-update-toggle" checked />
|
<div class="info">
|
||||||
<span class="slider"></span>
|
<span class="label">Lossless Container</span>
|
||||||
</label>
|
<span class="description">Container format for lossless downloads</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="setting-item" id="desktop-update-container" style="display: none">
|
<select id="lossless-container-setting">
|
||||||
<div class="info">
|
<option value="flac">FLAC</option>
|
||||||
<span class="label">Desktop Update</span>
|
<option value="alac">Apple Lossless</option>
|
||||||
<span class="description">Check for updates to the desktop application</span>
|
<option value="nochange">Don't change</option>
|
||||||
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<button id="check-desktop-updates-btn" class="btn-secondary">Check for Updates</button>
|
<div class="setting-item">
|
||||||
</div>
|
<div class="info">
|
||||||
<div class="setting-item">
|
<span class="label">Cover Art Size</span>
|
||||||
<div class="info">
|
<span class="description">Size for downloaded/embedded cover art</span>
|
||||||
<span class="label">Analytics</span>
|
</div>
|
||||||
<span class="description">Send anonymous usage data to help improve the app</span>
|
|
||||||
</div>
|
|
||||||
<label class="toggle-switch">
|
|
||||||
<input type="checkbox" id="analytics-toggle" checked />
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-group">
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Reset Local Data</span>
|
|
||||||
<span class="description"
|
|
||||||
>Clear all local storage and cached data (does not affect cloud sync)</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<button id="reset-local-data-btn" class="btn-secondary danger">Reset</button>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Clear Cloud Data</span>
|
|
||||||
<span class="description"
|
|
||||||
>Delete all your data from the cloud (cannot be undone)</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<button id="firebase-clear-cloud-btn" class="btn-secondary danger">
|
|
||||||
Clear Cloud Data
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="settings-group">
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Backup & Restore</span>
|
|
||||||
<span class="description">Export or import your library and history as JSON</span>
|
|
||||||
</div>
|
|
||||||
<div style="display: flex; gap: 0.5rem">
|
|
||||||
<button id="export-library-btn" class="btn-secondary">Export</button>
|
|
||||||
<button id="import-library-btn" class="btn-secondary">Import</button>
|
|
||||||
<input type="file" id="import-library-input" style="display: none" accept=".json" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="setting-item">
|
|
||||||
<div class="info">
|
|
||||||
<span class="label">Export All Settings</span>
|
|
||||||
<span class="description">Export all app settings as JSON</span>
|
|
||||||
</div>
|
|
||||||
<div style="display: flex; gap: 0.5rem">
|
|
||||||
<button id="export-settings-btn" class="btn-secondary">Export</button>
|
|
||||||
<button id="import-settings-btn" class="btn-secondary">Import</button>
|
|
||||||
<input
|
<input
|
||||||
type="file"
|
type="text"
|
||||||
id="import-settings-input"
|
id="cover-art-size-setting"
|
||||||
style="display: none"
|
class="template-input"
|
||||||
accept=".json"
|
style="width: 120px; text-align: right"
|
||||||
|
placeholder="1280x1280"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Filename Template</span>
|
||||||
|
<span class="description"
|
||||||
|
>Customize download filenames. Available: {trackNumber}, {artist}, {title},
|
||||||
|
{album}</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="filename-template"
|
||||||
|
class="template-input"
|
||||||
|
placeholder="{trackNumber} - {artist} - {title}"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">ZIP Folder Template</span>
|
||||||
|
<span class="description"
|
||||||
|
>Customize album folder names. Available: {albumTitle}, {albumArtist},
|
||||||
|
{year}</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
id="zip-folder-template"
|
||||||
|
class="template-input"
|
||||||
|
placeholder="{albumTitle} - {albumArtist} - monochrome.tf"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<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">Blocked Content</span>
|
<span class="label">Generate M3U</span>
|
||||||
<span class="description"
|
<span class="description">Include M3U playlist files in downloads</span>
|
||||||
>Manage artists, albums, and tracks you've blocked from recommendations</span
|
</div>
|
||||||
>
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="generate-m3u-toggle" checked />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex; gap: 0.5rem">
|
<div class="setting-item">
|
||||||
<button id="manage-blocked-btn" class="btn-secondary">Manage</button>
|
<div class="info">
|
||||||
<button
|
<span class="label">Generate M3U8</span>
|
||||||
id="clear-all-blocked-btn"
|
<span class="description"
|
||||||
class="btn-secondary danger"
|
>Include extended M3U8 playlist files in downloads</span
|
||||||
style="display: none"
|
>
|
||||||
>
|
</div>
|
||||||
Clear All
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="generate-m3u8-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Generate CUE</span>
|
||||||
|
<span class="description"
|
||||||
|
>Include CUE sheets for gapless playback in downloads</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="generate-cue-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Generate NFO</span>
|
||||||
|
<span class="description"
|
||||||
|
>Include NFO files for media center compatibility</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="generate-nfo-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Generate JSON</span>
|
||||||
|
<span class="description">Include JSON files with rich metadata</span>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="generate-json-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Relative Paths</span>
|
||||||
|
<span class="description">Use relative paths in playlist files</span>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="relative-paths-toggle" checked />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Separate Discs in ZIP</span>
|
||||||
|
<span class="description"
|
||||||
|
>Put tracks in Disc folders when a release has multiple discs</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="separate-discs-zip-toggle" />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-tab-content" id="settings-tab-instances">
|
||||||
|
<div class="settings-list">
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">ADVANCED: Custom Database/Auth</span>
|
||||||
|
<span class="description"
|
||||||
|
>Configure custom PocketBase and Firebase instances</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<button id="custom-db-btn" class="btn-secondary">Configure</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-group">
|
||||||
|
<div id="api-instance-manager">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">API Instances</span>
|
||||||
|
<span class="description">Manage and prioritize API instances.</span>
|
||||||
|
</div>
|
||||||
|
<button id="refresh-speed-test-btn" class="btn-secondary">
|
||||||
|
Refresh Instance List
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<ul id="api-instance-list"></ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-tab-content" id="settings-tab-system">
|
||||||
|
<div class="settings-list">
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Keyboard Shortcuts</span>
|
||||||
|
<span class="description">View and customize keyboard shortcuts</span>
|
||||||
|
</div>
|
||||||
|
<button id="customize-shortcuts-btn" class="btn-secondary">Customize</button>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Cache</span>
|
||||||
|
<span class="description" id="cache-info"
|
||||||
|
>Stores API responses to reduce requests</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<button id="clear-cache-btn" class="btn-secondary">Clear Cache</button>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Auto-Update App</span>
|
||||||
|
<span class="description"
|
||||||
|
>Automatically reload when a new version is available</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="pwa-auto-update-toggle" checked />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item" id="desktop-update-container" style="display: none">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Desktop Update</span>
|
||||||
|
<span class="description">Check for updates to the desktop application</span>
|
||||||
|
</div>
|
||||||
|
<button id="check-desktop-updates-btn" class="btn-secondary">
|
||||||
|
Check for Updates
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Analytics</span>
|
||||||
|
<span class="description"
|
||||||
|
>Send anonymous usage data to help improve the app</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<label class="toggle-switch">
|
||||||
|
<input type="checkbox" id="analytics-toggle" checked />
|
||||||
|
<span class="slider"></span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Reset Local Data</span>
|
||||||
|
<span class="description"
|
||||||
|
>Clear all local storage and cached data (does not affect cloud sync)</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<button id="reset-local-data-btn" class="btn-secondary danger">Reset</button>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Clear Cloud Data</span>
|
||||||
|
<span class="description"
|
||||||
|
>Delete all your data from the cloud (cannot be undone)</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<button id="firebase-clear-cloud-btn" class="btn-secondary danger">
|
||||||
|
Clear Cloud Data
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Backup & Restore</span>
|
||||||
|
<span class="description"
|
||||||
|
>Export or import your library and history as JSON</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; gap: 0.5rem">
|
||||||
|
<button id="export-library-btn" class="btn-secondary">Export</button>
|
||||||
|
<button id="import-library-btn" class="btn-secondary">Import</button>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
id="import-library-input"
|
||||||
|
style="display: none"
|
||||||
|
accept=".json"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Export All Settings</span>
|
||||||
|
<span class="description">Export all app settings as JSON</span>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; gap: 0.5rem">
|
||||||
|
<button id="export-settings-btn" class="btn-secondary">Export</button>
|
||||||
|
<button id="import-settings-btn" class="btn-secondary">Import</button>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
id="import-settings-input"
|
||||||
|
style="display: none"
|
||||||
|
accept=".json"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="settings-group">
|
||||||
|
<div class="setting-item">
|
||||||
|
<div class="info">
|
||||||
|
<span class="label">Blocked Content</span>
|
||||||
|
<span class="description"
|
||||||
|
>Manage artists, albums, and tracks you've blocked from
|
||||||
|
recommendations</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; gap: 0.5rem">
|
||||||
|
<button id="manage-blocked-btn" class="btn-secondary">Manage</button>
|
||||||
|
<button
|
||||||
|
id="clear-all-blocked-btn"
|
||||||
|
class="btn-secondary danger"
|
||||||
|
style="display: none"
|
||||||
|
>
|
||||||
|
Clear All
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="page-about" class="page">
|
<div id="page-about" class="page">
|
||||||
<h2 class="section-title" style="text-align: center">About Monochrome</h2>
|
<h2 class="section-title" style="text-align: center">About Monochrome</h2>
|
||||||
<div class="about-content">
|
<div class="about-content">
|
||||||
<p class="about-description">
|
<p class="about-description">
|
||||||
|
|
|
||||||
|
|
@ -7646,7 +7646,7 @@ textarea:focus {
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
mask-image: linear-gradient(to bottom, rgb(0, 0, 0, 1) 50%, rgb(0, 0, 0, 0));
|
mask-image: linear-gradient(to bottom, rgb(0, 0, 0, 1) 50%, rgb(0, 0, 0, 0));
|
||||||
-webkit-mask-image: linear-gradient(to bottom, rgb(0, 0, 0, 1) 50%, rgb(0, 0, 0, 0));
|
mask-image: linear-gradient(to bottom, rgb(0, 0, 0, 1) 50%, rgb(0, 0, 0, 0));
|
||||||
}
|
}
|
||||||
|
|
||||||
.profile-info-section {
|
.profile-info-section {
|
||||||
|
|
|
||||||
|
|
@ -9,11 +9,11 @@ export default function uploadPlugin() {
|
||||||
const handler = async (req, res, next) => {
|
const handler = async (req, res, next) => {
|
||||||
if (req.url === '/upload' && req.method === 'POST') {
|
if (req.url === '/upload' && req.method === 'POST') {
|
||||||
const form = formidable({});
|
const form = formidable({});
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const [_fields, files] = await form.parse(req);
|
const [_fields, files] = await form.parse(req);
|
||||||
const uploadedFile = files.file?.[0];
|
const uploadedFile = files.file?.[0];
|
||||||
|
|
||||||
if (!uploadedFile) {
|
if (!uploadedFile) {
|
||||||
res.statusCode = 400;
|
res.statusCode = 400;
|
||||||
res.end(JSON.stringify({ success: false, error: 'No file provided' }));
|
res.end(JSON.stringify({ success: false, error: 'No file provided' }));
|
||||||
|
|
@ -26,7 +26,7 @@ export default function uploadPlugin() {
|
||||||
let url;
|
let url;
|
||||||
|
|
||||||
if (useR2) {
|
if (useR2) {
|
||||||
// We could implement R2 upload here too, but for simplicity in dev
|
// We could implement R2 upload here too, but for simplicity in dev
|
||||||
// we'll stick to catbox unless specifically requested to match R2 perfectly.
|
// we'll stick to catbox unless specifically requested to match R2 perfectly.
|
||||||
// However, to be helpful, let's at least mention it.
|
// However, to be helpful, let's at least mention it.
|
||||||
console.log('R2 upload detected in env, but dev plugin is using catbox fallback for now.');
|
console.log('R2 upload detected in env, but dev plugin is using catbox fallback for now.');
|
||||||
|
|
@ -35,7 +35,11 @@ export default function uploadPlugin() {
|
||||||
// Forward to catbox.moe (default production behavior when R2 is disabled)
|
// Forward to catbox.moe (default production behavior when R2 is disabled)
|
||||||
const formData = new FormData();
|
const formData = new FormData();
|
||||||
formData.append('reqtype', 'fileupload');
|
formData.append('reqtype', 'fileupload');
|
||||||
formData.append('fileToUpload', new Blob([fileData], { type: uploadedFile.mimetype }), uploadedFile.originalFilename);
|
formData.append(
|
||||||
|
'fileToUpload',
|
||||||
|
new Blob([fileData], { type: uploadedFile.mimetype }),
|
||||||
|
uploadedFile.originalFilename
|
||||||
|
);
|
||||||
|
|
||||||
const response = await fetch('https://catbox.moe/user/api.php', {
|
const response = await fetch('https://catbox.moe/user/api.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
|
|
@ -49,10 +53,12 @@ export default function uploadPlugin() {
|
||||||
}
|
}
|
||||||
|
|
||||||
res.setHeader('Content-Type', 'application/json');
|
res.setHeader('Content-Type', 'application/json');
|
||||||
res.end(JSON.stringify({
|
res.end(
|
||||||
success: true,
|
JSON.stringify({
|
||||||
url: url.trim(),
|
success: true,
|
||||||
}));
|
url: url.trim(),
|
||||||
|
})
|
||||||
|
);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('Local upload error:', err);
|
console.error('Local upload error:', err);
|
||||||
res.statusCode = 500;
|
res.statusCode = 500;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue