Cleanup unused queue-track-menu

index.html

@@ -55,11 +55,7 @@
         </div>
     </div>
 
-    <div class="queue-track-menu" id="queue-track-menu">
+
-        <ul>
-            <li data-action="remove">Remove from Queue</li>
-        </ul>
-    </div>
     <div id="sidebar-overlay"></div>
 
     <div class="app-container">

js/ui-interactions.js

@@ -126,78 +126,6 @@ export function initializeUIInteractions(player, api) {
             });
         });
 
-        queueList.querySelectorAll('.track-menu-btn').forEach(btn => {
-            btn.addEventListener('click', (e) => {
-                e.stopPropagation();
-                const index = parseInt(btn.dataset.trackIndex);
-                showQueueTrackMenu(e, index);
-            });
-        });
-    }
-
-    function showQueueTrackMenu(e, trackIndex) {
-        const menu = document.getElementById('queue-track-menu');
-        menu.style.top = `${e.pageY}px`;
-        menu.style.left = `${e.pageX}px`;
-        menu.classList.add('show');
-        menu.dataset.trackIndex = trackIndex;
-        positionContextMenu(menu, e.pageX, e.pageY, true);
-        document.addEventListener('click', hideQueueTrackMenu);
-    }
-
-    function hideQueueTrackMenu() {
-        const menu = document.getElementById('queue-track-menu');
-        menu.classList.remove('show');
-        document.removeEventListener('click', hideQueueTrackMenu);
-    }
-
-    document.getElementById('queue-track-menu').addEventListener('click', (e) => {
-        e.stopPropagation();
-        const action = e.target.dataset.action;
-        const menu = document.getElementById('queue-track-menu');
-        const trackIndex = parseInt(menu.dataset.trackIndex);
-
-        if (action === 'remove') {
-            player.removeFromQueue(trackIndex);
-            renderQueue();
-        }
-
-        hideQueueTrackMenu();
-    });
-
-    function positionContextMenu(menu, x, y, preferLeft = false) {
-        menu.style.display = 'block';
-        menu.style.visibility = 'hidden';
-
-        const menuRect = menu.getBoundingClientRect();
-        const viewportWidth = window.innerWidth;
-        const viewportHeight = window.innerHeight;
-
-        let finalX = x;
-        let finalY = y;
-
-        if (preferLeft || (x + menuRect.width > viewportWidth)) {
-            finalX = x - menuRect.width;
-            if (finalX < 0) {
-                finalX = Math.min(x, viewportWidth - menuRect.width - 10);
-            }
-        }
-
-        if (finalX < 10) finalX = 10;
-        if (finalX + menuRect.width > viewportWidth - 10) {
-            finalX = viewportWidth - menuRect.width - 10;
-        }
-        if (y + menuRect.height > viewportHeight) {
-            finalY = Math.max(10, y - menuRect.height);
-        }
-        if (finalY + menuRect.height > viewportHeight - 10) {
-            finalY = viewportHeight - menuRect.height - 10;
-        }
-        if (finalY < 10) finalY = 10;
-
-        menu.style.left = `${finalX}px`;
-        menu.style.top = `${finalY}px`;
-        menu.style.visibility = 'visible';
     }
 
     // Make renderQueue available globally for other modules

styles.css

@@ -1243,8 +1243,7 @@ input:checked + .slider::before {
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
 }
 
-#context-menu,
+#context-menu {
-.queue-track-menu {
     display: none;
     position: fixed;
     background-color: var(--card);
@@ -1256,19 +1255,11 @@ input:checked + .slider::before {
     min-width: 160px;
 }
 
-.queue-track-menu.show {
+#context-menu ul {
-    display: block;
-    z-index: 1001;
-    min-width: 120px;
-}
-
-#context-menu ul,
-.queue-track-menu ul {
     list-style: none;
 }
 
-#context-menu li,
+#context-menu li {
-.queue-track-menu li {
     padding: 0.5rem 0.75rem;
     cursor: pointer;
     border-radius: 4px;
@@ -1276,8 +1267,7 @@ input:checked + .slider::before {
     font-size: 0.9rem;
 }
 
-#context-menu li:hover,
+#context-menu li:hover {
-.queue-track-menu li:hover {
     background-color: var(--secondary);
 }