update: Playlist mode toggle und Mini player bar für Audiobücher

fix: Music starts → ABS pauses: ABS starts → Music pauses

src/abs.js

@@ -185,6 +185,10 @@ function _updateChapter() {
     ap.chapterIdx = idx;
     _renderChapterName();
     _renderChapterList();
+    if (_playlistMode) {
+      const cl = document.getElementById('abs-chapter-list');
+      setTimeout(() => cl?.querySelector('.abs-ch-item.active')?.scrollIntoView({ block: 'nearest', behavior: 'smooth' }), 30);
+    }
   }
 }
 
@@ -203,6 +207,7 @@ export async function absPlayItem(item) {
   const ap = S.absPlayer;
   const audio = _getAudio();
 
+  if (!S.audio.paused) S.audio.pause(); // stop music if playing
   if (ap._sessionId) { absCloseSession(ap._sessionId); ap._sessionId = null; }
   _stopSync();
   audio.pause();
@@ -255,6 +260,11 @@ export function absTogglePlay() {
   S.absPlayer.playing ? audio.pause() : audio.play().catch(() => {});
 }
 
+export function absInterrupt() {
+  if (!S.absPlayer.item || !S.absPlayer.playing) return;
+  _getAudio().pause(); // triggers the pause listener which calls _doSync()
+}
+
 export function absSeek(globalTime) {
   const ap = S.absPlayer;
   globalTime = Math.max(0, Math.min(globalTime, ap.duration || Infinity));
@@ -334,6 +344,7 @@ export function absClosePlayer() {
 }
 
 export function absToggleChapters() {
+  if (_playlistMode) return;
   document.getElementById('abs-chapter-list')?.classList.toggle('open');
   _renderChapterList();
 }
@@ -353,6 +364,30 @@ export function absSeekToChapter(idx) {
   if (ch) absSeek(ch.start);
 }
 
+// ─── PLAYLIST MODE ───
+let _playlistMode = localStorage.getItem('ns_abs_pl_mode') === '1';
+
+export function absTogglePlaylistMode() {
+  _playlistMode = !_playlistMode;
+  localStorage.setItem('ns_abs_pl_mode', _playlistMode ? '1' : '0');
+  _applyPlaylistMode();
+}
+
+function _applyPlaylistMode() {
+  const overlay = document.getElementById('abs-player');
+  overlay?.classList.toggle('playlist-mode', _playlistMode);
+  document.getElementById('abs-playlist-btn')?.classList.toggle('active', _playlistMode);
+  const cl = document.getElementById('abs-chapter-list');
+  if (!cl) return;
+  if (_playlistMode) {
+    cl.classList.add('open');
+    _renderChapterList();
+    setTimeout(() => cl.querySelector('.abs-ch-item.active')?.scrollIntoView({ block: 'nearest', behavior: 'smooth' }), 50);
+  } else {
+    cl.classList.remove('open');
+  }
+}
+
 // ─── PROGRESS SCRUB ───
 let _scrubbing = false;
 export function absProgDown(e) { _scrubbing = true; _scrub(e); }
@@ -367,6 +402,33 @@ function _scrub(e) {
 }
 
 // ─── RENDER HELPERS ───
+function _renderMiniBar() {
+  const ap = S.absPlayer;
+  const bar = document.getElementById('abs-mini-bar');
+  if (!bar) return;
+  if (!ap.item) { bar.classList.remove('visible'); return; }
+  bar.classList.add('visible');
+  const meta = ap.item?.media?.metadata || {};
+  const cover = absCoverUrl(ap.item?.id);
+  const coverEl = document.getElementById('abs-mini-cover');
+  if (coverEl) {
+    coverEl.innerHTML = cover
+      ? `<img src="${cover}" alt="" style="width:100%;height:100%;object-fit:cover;border-radius:6px" onerror="this.style.display='none'">`
+      : '📚';
+  }
+  const titleEl = document.getElementById('abs-mini-title');
+  if (titleEl) titleEl.textContent = meta.title || 'Unbekannt';
+  const ch = ap.chapters[ap.chapterIdx];
+  const chEl = document.getElementById('abs-mini-chapter');
+  if (chEl) chEl.textContent = ch?.title || meta.authorName || '';
+  const playBtn = document.getElementById('abs-mini-play');
+  if (playBtn) {
+    playBtn.innerHTML = ap.playing
+      ? `<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="4" width="4" height="16" rx="1"/><rect x="14" y="4" width="4" height="16" rx="1"/></svg>`
+      : `<svg width="22" height="22" viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>`;
+  }
+}
+
 function _fmt(secs) {
   if (!isFinite(secs) || secs < 0) secs = 0;
   const h = Math.floor(secs / 3600);
@@ -393,6 +455,8 @@ function _renderPlayer() {
   _renderControls();
   _renderChapterName();
   _renderSleepBtn();
+  _renderMiniBar();
+  _applyPlaylistMode();
 }
 
 function _renderProgress() {
@@ -417,12 +481,14 @@ function _renderControls() {
     : `<svg width="28" height="28" viewBox="0 0 24 24" fill="currentColor"><polygon points="5 3 19 12 5 21 5 3"/></svg>`;
   const sv = document.getElementById('abs-speed-val');
   if (sv) sv.textContent = `${ap.speed}×`;
+  _renderMiniBar();
 }
 
 function _renderChapterName() {
   const ch = S.absPlayer.chapters[S.absPlayer.chapterIdx];
   const el = document.getElementById('abs-chapter-name');
   if (el) el.textContent = ch?.title || '';
+  _renderMiniBar();
 }
 
 function _renderChapterList() {

src/main.js

@@ -24,7 +24,7 @@ import {
   absSetSpeed, absSleepIn, absOpenPlayer, absClosePlayer, absToggleChapters,
   absToggleSpeedPicker, absToggleSleepPicker, absSeekToChapter, absProgDown, absProgMove,
   absProgUp, loadAbsBooks, absOpenBook, loadAbsBookDetail, absPlayChapter,
-  absLoadSettingsLibraries,
+  absLoadSettingsLibraries, absTogglePlaylistMode, absInterrupt,
 } from './abs.js';
 import {
   openNowPlaying, closeNowPlaying, switchNpTab, npGoArtist, npGoAlbum,
@@ -126,6 +126,7 @@ window.addEventListener('load', () => {
   S.audio.addEventListener('timeupdate', updateProgress);
   S.audio.addEventListener('ended', onEnded);
   S.audio.addEventListener('play', () => {
+    absInterrupt();
     setPlayIcon(true);
     document.getElementById('player-art').classList.add('spinning');
     if(navigator.mediaSession) navigator.mediaSession.playbackState = 'playing';
@@ -270,7 +271,7 @@ Object.assign(window, {
   absSetSpeed, absSleepIn, absOpenPlayer, absClosePlayer, absToggleChapters,
   absToggleSpeedPicker, absToggleSleepPicker, absSeekToChapter,
   absProgDown, absProgMove, absProgUp,
-  absOpenBook, absPlayChapter, absConnectSettings, absSetLibrary, absDisconnect,
+  absOpenBook, absPlayChapter, absConnectSettings, absSetLibrary, absDisconnect, absTogglePlaylistMode,
   absOnSearch: (val) => {
     clearTimeout(window._absSearchTimer);
     window._absSearchTimer = setTimeout(() => {