vndangkhoa/kv-music
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ability to hide homepage sections

Browse source
This commit is contained in:
Eduard Prigoana 2026-02-03 17:42:39 +00:00
parent 03b5bebebf
commit 3d5da2f3e1
4 changed files with 181 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
index.html
View file

@ -2106,6 +2106,51 @@
</div>
</div>
<div class="settings-group">
<div class="setting-item">
<div class="info">
<span class="label">Show Recommended Songs</span>
<span class="description">Display recommended songs on the home page</span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="show-recommended-songs-toggle" checked />
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="info">
<span class="label">Show Recommended Albums</span>
<span class="description">Display recommended albums on the home page</span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="show-recommended-albums-toggle" checked />
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="info">
<span class="label">Show Recommended Artists</span>
<span class="description">Display recommended artists on the home page</span>
</div>
<label class="toggle-switch">
<input type="checkbox" id="show-recommended-artists-toggle" checked />
<span class="slider"></span>
</label>
</div>
<div class="setting-item">
<div class="info">
<span class="label">Show Jump Back In</span>
<span class="description"
>Display recent albums, playlists, and mixes on the home page</span
>
</div>
<label class="toggle-switch">
<input type="checkbox" id="show-jump-back-in-toggle" checked />
<span class="slider"></span>
</label>
</div>
</div>
<div class="settings-group">
<div class="setting-item">
<div class="info">

34
js/settings.js
View file

@ -17,6 +17,7 @@ import {
playlistSettings,
equalizerSettings,
listenBrainzSettings,
homePageSettings,
} from './storage.js';
import { audioContextManager, EQ_PRESETS } from './audio-context.js';
import { db } from './db.js';
@ -674,6 +675,39 @@ export function initializeSettings(scrobbler, player, api, ui) {
});
}
// Home Page Section Toggles
const showRecommendedSongsToggle = document.getElementById('show-recommended-songs-toggle');
if (showRecommendedSongsToggle) {
showRecommendedSongsToggle.checked = homePageSettings.shouldShowRecommendedSongs();
showRecommendedSongsToggle.addEventListener('change', (e) => {
homePageSettings.setShowRecommendedSongs(e.target.checked);
});
}
const showRecommendedAlbumsToggle = document.getElementById('show-recommended-albums-toggle');
if (showRecommendedAlbumsToggle) {
showRecommendedAlbumsToggle.checked = homePageSettings.shouldShowRecommendedAlbums();
showRecommendedAlbumsToggle.addEventListener('change', (e) => {
homePageSettings.setShowRecommendedAlbums(e.target.checked);
});
}
const showRecommendedArtistsToggle = document.getElementById('show-recommended-artists-toggle');
if (showRecommendedArtistsToggle) {
showRecommendedArtistsToggle.checked = homePageSettings.shouldShowRecommendedArtists();
showRecommendedArtistsToggle.addEventListener('change', (e) => {
homePageSettings.setShowRecommendedArtists(e.target.checked);
});
}
const showJumpBackInToggle = document.getElementById('show-jump-back-in-toggle');
if (showJumpBackInToggle) {
showJumpBackInToggle.checked = homePageSettings.shouldShowJumpBackIn();
showJumpBackInToggle.addEventListener('change', (e) => {
homePageSettings.setShowJumpBackIn(e.target.checked);
});
}
// Filename template setting
const filenameTemplate = document.getElementById('filename-template');
if (filenameTemplate) {

59
js/storage.js
View file

@ -899,6 +899,65 @@ export const listenBrainzSettings = {
},
};
export const homePageSettings = {
SHOW_RECOMMENDED_SONGS_KEY: 'home-show-recommended-songs',
SHOW_RECOMMENDED_ALBUMS_KEY: 'home-show-recommended-albums',
SHOW_RECOMMENDED_ARTISTS_KEY: 'home-show-recommended-artists',
SHOW_JUMP_BACK_IN_KEY: 'home-show-jump-back-in',
shouldShowRecommendedSongs() {
try {
const val = localStorage.getItem(this.SHOW_RECOMMENDED_SONGS_KEY);
return val === null ? true : val === 'true';
} catch {
return true;
}
},
setShowRecommendedSongs(enabled) {
localStorage.setItem(this.SHOW_RECOMMENDED_SONGS_KEY, enabled ? 'true' : 'false');
},
shouldShowRecommendedAlbums() {
try {
const val = localStorage.getItem(this.SHOW_RECOMMENDED_ALBUMS_KEY);
return val === null ? true : val === 'true';
} catch {
return true;
}
},
setShowRecommendedAlbums(enabled) {
localStorage.setItem(this.SHOW_RECOMMENDED_ALBUMS_KEY, enabled ? 'true' : 'false');
},
shouldShowRecommendedArtists() {
try {
const val = localStorage.getItem(this.SHOW_RECOMMENDED_ARTISTS_KEY);
return val === null ? true : val === 'true';
} catch {
return true;
}
},
setShowRecommendedArtists(enabled) {
localStorage.setItem(this.SHOW_RECOMMENDED_ARTISTS_KEY, enabled ? 'true' : 'false');
},
shouldShowJumpBackIn() {
try {
const val = localStorage.getItem(this.SHOW_JUMP_BACK_IN_KEY);
return val === null ? true : val === 'true';
} catch {
return true;
}
},
setShowJumpBackIn(enabled) {
localStorage.setItem(this.SHOW_JUMP_BACK_IN_KEY, enabled ? 'true' : 'false');
},
};
// System theme listener
if (typeof window !== 'undefined' && window.matchMedia) {
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {

44
js/ui.js
View file

@ -19,7 +19,13 @@ import {
escapeHtml,
} from './utils.js';
import { openLyricsPanel } from './lyrics.js';
import { recentActivityManager, backgroundSettings, cardSettings, visualizerSettings } from './storage.js';
import {
recentActivityManager,
backgroundSettings,
cardSettings,
visualizerSettings,
homePageSettings,
} from './storage.js';
import { db } from './db.js';
import { getVibrantColorFromImage } from './vibrant-color.js';
import { syncManager } from './accounts/pocketbase.js';
@ -1253,6 +1259,15 @@ export class UIRenderer {
async renderHomeSongs(forceRefresh = false) {
const songsContainer = document.getElementById('home-recommended-songs');
const section = songsContainer?.closest('.content-section');
if (!homePageSettings.shouldShowRecommendedSongs()) {
if (section) section.style.display = 'none';
return;
}
if (section) section.style.display = '';
if (songsContainer) {
if (forceRefresh) songsContainer.innerHTML = this.createSkeletonTracks(5, true);
else if (songsContainer.children.length > 0 && !songsContainer.querySelector('.skeleton')) return; // Already loaded
@ -1278,6 +1293,15 @@ export class UIRenderer {
async renderHomeAlbums(forceRefresh = false) {
const albumsContainer = document.getElementById('home-recommended-albums');
const section = albumsContainer?.closest('.content-section');
if (!homePageSettings.shouldShowRecommendedAlbums()) {
if (section) section.style.display = 'none';
return;
}
if (section) section.style.display = '';
if (albumsContainer) {
if (forceRefresh) albumsContainer.innerHTML = this.createSkeletonCards(6);
else if (albumsContainer.children.length > 0 && !albumsContainer.querySelector('.skeleton')) return;
@ -1316,6 +1340,15 @@ export class UIRenderer {
async renderHomeArtists(forceRefresh = false) {
const artistsContainer = document.getElementById('home-recommended-artists');
const section = artistsContainer?.closest('.content-section');
if (!homePageSettings.shouldShowRecommendedArtists()) {
if (section) section.style.display = 'none';
return;
}
if (section) section.style.display = '';
if (artistsContainer) {
if (forceRefresh) artistsContainer.innerHTML = this.createSkeletonCards(6, true);
else if (artistsContainer.children.length > 0 && !artistsContainer.querySelector('.skeleton')) return;
@ -1358,6 +1391,15 @@ export class UIRenderer {
renderHomeRecent() {
const recentContainer = document.getElementById('home-recent-mixed');
const section = recentContainer?.closest('.content-section');
if (!homePageSettings.shouldShowJumpBackIn()) {
if (section) section.style.display = 'none';
return;
}
if (section) section.style.display = '';
if (recentContainer) {
const recents = recentActivityManager.getRecents();
const items = [];