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

feat: right clicking context menu on miniplayer

Browse source
This commit is contained in:
edideaur 2026-04-02 18:52:28 +00:00 committed by GitHub
parent 1345943a0b
commit 2ddf26ec4c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 47 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
index.html
View file

@ -5207,6 +5207,21 @@
</button>
</div>
</div>
<div id="blocked-content-list" style="display: none">
<p id="blocked-empty-message" style="display: none; color: var(--muted-foreground); font-size: 0.875rem; padding: 0.5rem 0;">Nothing blocked yet.</p>
<div id="blocked-artists-section" style="display: none">
<h4 style="font-size: 0.75rem; text-transform: uppercase; color: var(--muted-foreground); margin: 0.75rem 0 0.25rem;">Artists</h4>
<ul id="blocked-artists-list" class="blocked-items-list"></ul>
</div>
<div id="blocked-albums-section" style="display: none">
<h4 style="font-size: 0.75rem; text-transform: uppercase; color: var(--muted-foreground); margin: 0.75rem 0 0.25rem;">Albums</h4>
<ul id="blocked-albums-list" class="blocked-items-list"></ul>
</div>
<div id="blocked-tracks-section" style="display: none">
<h4 style="font-size: 0.75rem; text-transform: uppercase; color: var(--muted-foreground); margin: 0.75rem 0 0.25rem;">Tracks</h4>
<ul id="blocked-tracks-list" class="blocked-items-list"></ul>
</div>
</div>
</div>
<p
id="settings-commit-info"

32
js/events.js
View file

@ -2380,6 +2380,38 @@ export function initializeTrackInteractions(player, api, mainContent, contextMen
}
});
document.querySelector('.now-playing-bar')?.addEventListener('contextmenu', async (e) => {
if (!player.currentTrack) return;
const track = player.currentTrack;
if (track.isLocal) return;
const target = e.target.closest('.cover, .title, .album, .artist');
if (!target) return;
e.preventDefault();
e.stopPropagation();
if (contextMenu._originalHTML) {
contextMenu.innerHTML = contextMenu._originalHTML;
contextMenu._originalHTML = null;
}
contextTrack = track;
contextMenu._contextTrack = track;
contextMenu._contextType = track.type || 'track';
contextMenu._selectedTracks = [];
const unavailableActions = ['play-next', 'add-to-queue', 'download', 'track-mix'];
contextMenu.querySelectorAll('[data-action]').forEach((btn) => {
if (unavailableActions.includes(btn.dataset.action)) {
btn.style.display = track.isUnavailable ? 'none' : 'block';
}
});
await updateContextMenuLikeState(contextMenu, track);
positionMenu(contextMenu, e.clientX, e.clientY);
});
document.addEventListener('click', (e) => {
if (contextMenu.style.display === 'block') {
if (contextMenu._originalHTML) {