From 6d0689718d8990cabc96c0fffd9ded61fc9cee2f Mon Sep 17 00:00:00 2001
From: Dark Steveneq <dark.steveneq@protonmail.com>
Date: Tue, 14 Oct 2025 23:03:38 +0200
Subject: [PATCH] Improve title pan animation, add slideout animation

---
 Main.qml   | 86 +++++++++++++++++++++++++++++++++++-------------------
 Player.qml |  9 +++---
 2 files changed, 60 insertions(+), 35 deletions(-)

diff --git a/Main.qml b/Main.qml
index 7f77792..8bc2f8c 100755
--- a/Main.qml
+++ b/Main.qml
@@ -31,43 +31,69 @@ ApplicationWindow {
                     // font.bold: true
                 }
 
-                Rectangle {
+                Item {
                     Layout.leftMargin: 5
-                    visible: Player.currentIndex != null
-                    color: Colors.primary
-                    radius: 5
-                    clip: true
                     width: 320
                     height: 36
+                    Rectangle {
+                        anchors.fill: parent
+                        id: nowplaying_root
+                        // visible: Player.currentIndex != null
+                        visible: anchors.bottomMargin < 42
+                        color: Colors.primary
+                        radius: 5
+                        clip: true
 
-                    Label {
-                        anchors.top: parent.top
-                        anchors.left: parent.left
-                        anchors.right: parent.right
-                        anchors.topMargin: 1
-                        anchors.leftMargin: 4
-                        anchors.rightMargin: 4
-                        text: (Player.loading ? "Loading " : "Playing ") + (Player.currentIndex != null ? qsTr(Player.currentStream.name) : "")
-                        heading: "h5"
-                    }
+                        NumberAnimation {
+                            running: Player.currentIndex != null
+                            target: nowplaying_root
+                            property: "anchors.bottomMargin"
+                            from: 42
+                            to: 0
+                            duration: 160
+                        }
 
-                    Label {
-                        id: nowplaying_title
-                        anchors.bottom: parent.bottom
-                        anchors.left: parent.left
-                        anchors.right: parent.right
-                        anchors.bottomMargin: 1
-                        anchors.leftMargin: 4
-                        anchors.rightMargin: 4
-                        text: (Player.currentIndex != null ? qsTr(Player.currentStream.title) : "")
-                        heading: "h3"
+                        NumberAnimation {
+                            running: Player.currentIndex == null
+                            target: nowplaying_root
+                            property: "anchors.bottomMargin"
+                            from: 0
+                            to: 42
+                            duration: 160
+                        }
 
-                        SequentialAnimation {
-                            running: true
-                            loops: Animation.Infinite
+                        Label {
+                            anchors.top: parent.top
+                            anchors.left: parent.left
+                            anchors.right: parent.right
+                            anchors.topMargin: 1
+                            anchors.leftMargin: 4
+                            anchors.rightMargin: 4
+                            text: (Player.loading ? "Loading " : "Playing ") + (Player.currentIndex != null ? qsTr(Player.currentStream.name) : "")
+                            heading: "h5"
+                        }
 
-                            NumberAnimation { target: nowplaying_title; property: "anchors.rightMargin"; from: 0; to: 320; duration: 5000 }
-                            NumberAnimation { target: nowplaying_title; property: "anchors.leftMargin"; from: 0; to: 320; duration: 5000 }
+                        Label {
+                            id: nowplaying_title
+                            anchors.bottom: parent.bottom
+                            anchors.left: parent.left
+                            // anchors.right: parent.right
+                            anchors.bottomMargin: 1
+                            anchors.leftMargin: 4
+                            // anchors.rightMargin: 4
+                            text: (Player.currentIndex != null ? qsTr(Player.currentStream.title) : "")
+                            heading: "h3"
+
+
+                            SequentialAnimation {
+                                running: nowplaying_title.width > 320
+                                loops: Animation.Infinite
+
+                                NumberAnimation { target: nowplaying_title; property: "anchors.leftMargin"; from: 4; to: 4; duration: 10000 }
+                                NumberAnimation { target: nowplaying_title; property: "anchors.leftMargin"; from: 4; to: -nowplaying_title.width + 324; duration: nowplaying_title.width * 4 }
+                                NumberAnimation { target: nowplaying_title; property: "anchors.leftMargin"; from: -nowplaying_title.width + 324; to: -nowplaying_title.width + 324; duration: 10000 }
+                                NumberAnimation { target: nowplaying_title; property: "anchors.leftMargin"; from: -nowplaying_title.width + 324; to: 4; duration: nowplaying_title.width * 4 }
+                            }
                         }
                     }
                 }
diff --git a/Player.qml b/Player.qml
index 20ef2a4..44e1139 100644
--- a/Player.qml
+++ b/Player.qml
@@ -35,7 +35,7 @@ Item {
 
     property alias playing: player.playing
     property alias volume: output.volume
-    readonly property var loading: player.mediaStatus == Qt.LoadingMedia
+    property var loading: player.mediaStatus == Qt.LoadingMedia
 
     property var currentIndex: null
     property var currentStream: null
@@ -71,7 +71,7 @@ Item {
 
         audioOutput: AudioOutput {
             id: output
-            volume: 0.4
+            volume: 0.3
         }
 
         onErrorOccurred: function(error, errorString) {
@@ -99,11 +99,10 @@ Item {
                                 console.warn("Unknown slug encountered in metadata: " + station.server_name);
                                 return
                             }
-                            parent.streams[index].title = station.title;
+                            parent.streams[index].title = station.title.replace(/\[[a-zA-Z0-9]{11}\]/, "");
                             parent.streams[index].listeners = station.listeners;
                             if (index == parent.currentIndex) {
-                                parent.currentStream.title = station.title;
-                                parent.currentStream.listeners = station.listeners;
+                                parent.currentStream = parent.streams[index];
                             }
                         });
                     // } catch {