From 92edaa9da4081f89d97c7e4788ca4f3843bf43d5 Mon Sep 17 00:00:00 2001
From: Honey <me_honeyy@proton.me>
Date: Tue, 19 May 2026 00:03:20 +0200
Subject: [PATCH] feat: show album above artist in bottom bar; close ctx menu
 on scroll

- Player bar sub-line now shows album (clickable) on first row, artist below
- Context menu now closes on scroll and touchmove (was staying open on mobile)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 index.html | 5 ++++-
 src/ui.js  | 2 ++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 6799b12..9b44cd2 100644
--- a/index.html
+++ b/index.html
@@ -410,8 +410,11 @@
             <svg id="star-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--text3)" stroke-width="2" style="transition:fill .2s,stroke .2s"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
           </button>
         </div>
+        <div class="player-artist">
+          <span id="player-album-name" onclick="playerBarGoAlbum()" style="cursor:pointer" title="Zum Album"></span>
+        </div>
         <div class="player-artist" id="player-artist">
-          <span id="player-artist-name">—</span><span id="player-album-sep" style="color:var(--text3)"> · </span><span id="player-album-name" onclick="playerBarGoAlbum()" style="cursor:pointer" title="Zum Album"></span>
+          <span id="player-artist-name">—</span>
         </div>
         <div class="player-status-row">
           <span class="status-badge badge-shuffle" id="badge-shuffle">🔀 Shuffle</span>
diff --git a/src/ui.js b/src/ui.js
index 7d7dfbf..0c719c2 100644
--- a/src/ui.js
+++ b/src/ui.js
@@ -158,6 +158,8 @@ export function hideCtxMenu() {
 document.addEventListener('click', e => {
   if(!document.getElementById('ctx-menu').contains(e.target)) hideCtxMenu();
 });
+document.addEventListener('scroll', () => hideCtxMenu(), { passive: true, capture: true });
+document.addEventListener('touchmove', () => hideCtxMenu(), { passive: true, capture: true });
 document.addEventListener('keydown', e => { if(e.key==='Escape') hideCtxMenu(); });
 
 // ─── PLAYLIST MODAL (Add to / Create) ───