static/app.js

@@ -267,7 +267,7 @@ function renderContent(data) {
           contentHTML += `<li class="directory-item"><a href="#" class="directory-link" data-path="gestern"><i class="bi bi-calendar2-day"></i> Gestern</a></li>`;
         }
         if (data.breadcrumbs.length === 1 && data.toplist_enabled) {
-          contentHTML += `<li class="directory-item"><a href="#" class="directory-link" data-path="toplist"><i class="bi bi-graph-up"></i> häufig angehört</a></li>`;
+          contentHTML += `<li class="directory-item"><a href="#" class="directory-link" data-path="toplist"><i class="bi bi-graph-up"></i> oft angehört</a></li>`;
         }
         
         data.directories.forEach(dir => {

static/audioplayer.css

@@ -175,8 +175,8 @@
 /* Minimize button */
 .minimize-button {
   position: absolute;
-  top: 2px;
+  top: 6px;
-  right: 2px;
+  right: 6px;
   width: 18px;
   height: 18px;
   border-radius: 8px;
@@ -187,6 +187,7 @@
   align-items: center;
   justify-content: center;
   cursor: pointer;
+  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
   padding: 0;
 }
 

static/audioplayer.js

@@ -24,8 +24,6 @@ class SimpleAudioPlayer {
     this.rafId        = null;
     this.abortCtrl    = null;
     this._hasMetadata = false;
-    this._posInterval = null;
-    this._posIntervalMs = 1000;
 
     // Pre-compute icons once
     const fill = getComputedStyle(document.documentElement)
@@ -89,21 +87,6 @@ class SimpleAudioPlayer {
     </svg>`;
   }
 
-  _startPositionSync() {
-    if (this._posInterval) return;
-    this._posInterval = setInterval(() => {
-      if (!this.audio.paused) {
-        this._pushPositionState();
-      }
-    }, this._posIntervalMs);
-  }
-
-  _stopPositionSync() {
-    if (!this._posInterval) return;
-    clearInterval(this._posInterval);
-    this._posInterval = null;
-  }
-
   _bindEvents() {
     this.playBtn.addEventListener('click', () => this.togglePlay());
     if (this.minBtn) {
@@ -112,7 +95,6 @@ class SimpleAudioPlayer {
 
     this.audio.addEventListener('loadstart', () => {
       this._hasMetadata = false;
-      this._stopPositionSync();
       this.timeline.min = 0;
       this.timeline.max = 0;
       this.timeline.value = 0;
@@ -132,7 +114,6 @@ class SimpleAudioPlayer {
     this.audio.addEventListener('play', () => {
       this._updatePlayState();
       this._pushPositionState(true);
-      this._startPositionSync();
     });
 
     this.audio.addEventListener('playing',  () => this._pushPositionState(true));
@@ -140,14 +121,12 @@ class SimpleAudioPlayer {
     this.audio.addEventListener('pause', () => {
       this._updatePlayState();
       this._pushPositionState(true);
-      this._stopPositionSync();
     });
 
     this.audio.addEventListener('ratechange', () => this._pushPositionState(true));
     this.audio.addEventListener('ended', () => {
       this.playBtn.innerHTML = this.icons.play;
       this._pushPositionState(true);
-      this._stopPositionSync();
       if ('mediaSession' in navigator) navigator.mediaSession.playbackState = 'paused';
     });
 
@@ -155,15 +134,7 @@ class SimpleAudioPlayer {
     this.audio.addEventListener('timeupdate', () => this.updateTimeline());
 
     // Keep position in sync when page visibility changes
-    document.addEventListener('visibilitychange', () => {
+    document.addEventListener('visibilitychange', () => this._pushPositionState(true));
-      this._pushPositionState(true);
-      if (document.visibilityState === 'visible' && !this.audio.paused) {
-        this._startPositionSync();
-      }
-    });
-
-    window.addEventListener('pageshow', () => this._pushPositionState(true));
-    window.addEventListener('focus', () => this._pushPositionState(true));
 
     // Unified seek input
     this.timeline.addEventListener('input', () => {

templates/permission.html

@@ -7,6 +7,6 @@
 {# page content #}
 {% block content %}
   <div class="container">
-      <div class="alert alert-warning">Du hast keine gültige Freigabe.<br>Bitte über einen Freigabelink oder QR-Code freischalten.</div>
+      <div class="alert alert-warning">Du hast keine gültige Freigaben.<br>Bitte über einen Freigabelink oder QR-Code freischalten.</div>
   </div>
 {% endblock %}