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

Merge branch 'main' of github.com:monochrome-music/monochrome

Browse source
This commit is contained in:
Samidy 2026-03-11 08:23:30 +03:00
commit d167a9c869
1 changed files with 25 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
js/ui-interactions.js
View file

@ -253,9 +253,7 @@ export function initializeUIInteractions(player, api, ui) {
const isVideo = track.type === 'video'; const isVideo = track.type === 'video';
const coverUrl = const coverUrl =
isVideo && track.imageId isVideo && track.imageId ? api.getVideoCoverUrl(track.imageId) : api.getCoverUrl(track.album?.cover);
? api.getVideoCoverUrl(track.imageId)
: api.getCoverUrl(track.album?.cover);
return ` return `
<div class="queue-track-item ${isPlaying ? 'playing' : ''} ${isBlocked ? 'blocked' : ''}" data-queue-index="${index}" data-track-id="${track.id}" draggable="${isBlocked ? 'false' : 'true'}" ${blockedTitle}> <div class="queue-track-item ${isPlaying ? 'playing' : ''} ${isBlocked ? 'blocked' : ''}" data-queue-index="${index}" data-track-id="${track.id}" draggable="${isBlocked ? 'false' : 'true'}" ${blockedTitle}>
@ -313,9 +311,7 @@ export function initializeUIInteractions(player, api, ui) {
? SVG_HEART.replace('class="heart-icon"', 'class="heart-icon filled"') ? SVG_HEART.replace('class="heart-icon"', 'class="heart-icon filled"')
: SVG_HEART; : SVG_HEART;
showNotification( showNotification(added ? `Added to Liked: ${track.title}` : `Removed from Liked: ${track.title}`);
added ? `Added to Liked: ${track.title}` : `Removed from Liked: ${track.title}`
);
} }
return; return;
} }
@ -425,25 +421,31 @@ export function initializeUIInteractions(player, api, ui) {
if (topObserver) topObserver.disconnect(); if (topObserver) topObserver.disconnect();
if (bottomObserver) bottomObserver.disconnect(); if (bottomObserver) bottomObserver.disconnect();
bottomObserver = new IntersectionObserver((entries) => { bottomObserver = new IntersectionObserver(
if (entries[0].isIntersecting && !isQueueRendering && queueEndIndex < currentQueue.length) { (entries) => {
queueEndIndex = Math.min(currentQueue.length, queueEndIndex + QUEUE_CHUNK_SIZE); if (entries[0].isIntersecting && !isQueueRendering && queueEndIndex < currentQueue.length) {
if (queueEndIndex - queueStartIndex > QUEUE_MAX_RENDERED) { queueEndIndex = Math.min(currentQueue.length, queueEndIndex + QUEUE_CHUNK_SIZE);
queueStartIndex += QUEUE_CHUNK_SIZE; if (queueEndIndex - queueStartIndex > QUEUE_MAX_RENDERED) {
queueStartIndex += QUEUE_CHUNK_SIZE;
}
renderQueueContent(container, true);
} }
renderQueueContent(container, true); },
} { root: container, rootMargin: '200px' }
}, { root: container, rootMargin: '200px' }); );
topObserver = new IntersectionObserver((entries) => { topObserver = new IntersectionObserver(
if (entries[0].isIntersecting && !isQueueRendering && queueStartIndex > 0) { (entries) => {
queueStartIndex = Math.max(0, queueStartIndex - QUEUE_CHUNK_SIZE); if (entries[0].isIntersecting && !isQueueRendering && queueStartIndex > 0) {
if (queueEndIndex - queueStartIndex > QUEUE_MAX_RENDERED) { queueStartIndex = Math.max(0, queueStartIndex - QUEUE_CHUNK_SIZE);
queueEndIndex -= QUEUE_CHUNK_SIZE; if (queueEndIndex - queueStartIndex > QUEUE_MAX_RENDERED) {
queueEndIndex -= QUEUE_CHUNK_SIZE;
}
renderQueueContent(container, true);
} }
renderQueueContent(container, true); },
} { root: container, rootMargin: '200px' }
}, { root: container, rootMargin: '200px' }); );
topObserver.observe(container.querySelector('#queue-top-sentinel')); topObserver.observe(container.querySelector('#queue-top-sentinel'));
bottomObserver.observe(container.querySelector('#queue-bottom-sentinel')); bottomObserver.observe(container.querySelector('#queue-bottom-sentinel'));
@ -465,7 +467,7 @@ export function initializeUIInteractions(player, api, ui) {
: SVG_HEART; : SVG_HEART;
} }
}); });
isQueueRendering = false; isQueueRendering = false;
}; };