diff --git a/src/views.js b/src/views.js index d439307..38f9739 100644 --- a/src/views.js +++ b/src/views.js @@ -558,16 +558,22 @@ function _initPlaylistDragDrop(container, songs, pl) { handle.innerHTML = ''; item.insertBefore(handle, item.firstChild); item._songRef = songs[i]; - item.draggable = true; // set upfront so browser registers it before any event + + // Track whether drag started from the handle (e.target in dragstart is always the item, not the handle) + let fromHandle = false; + handle.addEventListener('mousedown', () => { fromHandle = true; item.draggable = true; }); item.addEventListener('dragstart', e => { - if (!e.target.closest('.pl-drag-handle')) { e.preventDefault(); return; } + if (!fromHandle) { e.preventDefault(); item.draggable = false; return; } + fromHandle = false; dragSrc = item; e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.setData('text/plain', ''); // required by Firefox setTimeout(() => item.classList.add('dragging'), 0); }); item.addEventListener('dragend', () => { + fromHandle = false; + item.draggable = false; dragSrc = null; item.classList.remove('dragging'); container.querySelectorAll('.drag-over').forEach(el => el.classList.remove('drag-over')); @@ -591,15 +597,12 @@ function _initPlaylistDragDrop(container, songs, pl) { const fromIdx = allItems.indexOf(dragSrc); const toIdx = allItems.indexOf(item); container.insertBefore(dragSrc, fromIdx < toIdx ? item.nextSibling : item); - // Sync songs array to new DOM order const newOrder = Array.from(container.children).map(el => el._songRef); songs.splice(0, songs.length, ...newOrder); - // Update track numbers Array.from(container.children).forEach((el, idx) => { const n = el.querySelector('.song-num'); if (n) n.textContent = idx + 1; }); - // Debounced save to Navidrome clearTimeout(saveTimer); saveTimer = setTimeout(() => _savePlaylistOrder(pl, songs), 800); });