diff --git a/index.html b/index.html
index 894a637..e1d58d1 100644
--- a/index.html
+++ b/index.html
@@ -55,11 +55,7 @@
-
+
diff --git a/js/ui-interactions.js b/js/ui-interactions.js
index 88d235c..851286a 100644
--- a/js/ui-interactions.js
+++ b/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
diff --git a/styles.css b/styles.css
index 3cda4b7..c176aa8 100644
--- a/styles.css
+++ b/styles.css
@@ -1243,8 +1243,7 @@ input:checked + .slider::before {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}
-#context-menu,
-.queue-track-menu {
+#context-menu {
display: none;
position: fixed;
background-color: var(--card);
@@ -1256,19 +1255,11 @@ input:checked + .slider::before {
min-width: 160px;
}
-.queue-track-menu.show {
- display: block;
- z-index: 1001;
- min-width: 120px;
-}
-
-#context-menu ul,
-.queue-track-menu ul {
+#context-menu ul {
list-style: none;
}
-#context-menu li,
-.queue-track-menu li {
+#context-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,
-.queue-track-menu li:hover {
+#context-menu li:hover {
background-color: var(--secondary);
}