From 056bdb8298a66a40e7d1466d178e2ce5ce9d81d8 Mon Sep 17 00:00:00 2001
From: Anika Raemer <anika@raemer.net>
Date: Fri, 7 Dec 2018 08:31:44 +0100
Subject: [PATCH] added component for media progress bar

idea: add components PlayerButtons.qml and PlayerControlPannel.qml
---
 LenaPi/MediaProgress.qml | 41 ++++++++++++++++++++++++++++++++++++++++
 LenaPi/MusicPlayer.qml   | 40 +++++++--------------------------------
 LenaPi/qml.qrc           |  1 +
 3 files changed, 49 insertions(+), 33 deletions(-)
 create mode 100644 LenaPi/MediaProgress.qml

diff --git a/LenaPi/MediaProgress.qml b/LenaPi/MediaProgress.qml
new file mode 100644
index 0000000..3a124f9
--- /dev/null
+++ b/LenaPi/MediaProgress.qml
@@ -0,0 +1,41 @@
+import QtQuick 2.0
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Item {
+    id: container
+    property var model
+
+    Label{
+        anchors.right: progress.right
+        anchors.bottom: progress.top
+        font.pointSize: 9
+        color: "grey"
+        text: model.pTime + " / " + model.pMediaLength
+    }
+
+    ProgressBar{
+        id: progress
+        anchors.top: parent.top
+        anchors.left: parent.left
+
+        value: model.pProgress
+
+        style:ProgressBarStyle {
+            background: Rectangle {
+                radius: 5
+                color: "white"
+                border.color: "grey"
+                border.width: 1
+                implicitWidth: container.width
+                implicitHeight: 10
+            }
+            progress: Rectangle {
+                color: "blue"
+                border.color: "blue"
+                radius: 5
+                implicitHeight: 8
+            }
+        }
+    }
+}
diff --git a/LenaPi/MusicPlayer.qml b/LenaPi/MusicPlayer.qml
index 9da8fce..e060de7 100644
--- a/LenaPi/MusicPlayer.qml
+++ b/LenaPi/MusicPlayer.qml
@@ -1,6 +1,4 @@
 import QtQuick 2.0
- import QtQuick.Controls 1.4
- import QtQuick.Controls.Styles 1.4
 import QtGraphicalEffects 1.0
 
 Item{
@@ -49,38 +47,14 @@ Item{
         color: "#99ffffff"
         height: 140
 
-        Label{
-            anchors.right: progress.right
-            anchors.bottom: progress.top
-            font.pointSize: 9
-            color: "grey"
-            text: musicModel.pTime + " / " + musicModel.pMediaLength
-        }
+        MediaProgress{
+           id: progress
+           anchors.top: parent.top
+           anchors.left: parent.left
+           anchors.right: parent.right
+           anchors.margins: container.margins
 
-        ProgressBar{
-            id: progress
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.margins: container.margins
-
-            value: musicModel.pProgress
-
-            style:ProgressBarStyle {
-                background: Rectangle {
-                    radius: 5
-                    color: "lightgrey"
-                    border.color: "grey"
-                    border.width: 1
-                    implicitWidth: controlPannel.width - 2*container.margins
-                    implicitHeight: 10
-                }
-                progress: Rectangle {
-                    color: "blue"
-                    border.color: "blue"
-                    radius: 5
-                    implicitHeight: 8
-                }
-            }
+           model: musicModel
         }
 
         Item{
diff --git a/LenaPi/qml.qrc b/LenaPi/qml.qrc
index a874956..47671ef 100644
--- a/LenaPi/qml.qrc
+++ b/LenaPi/qml.qrc
@@ -7,5 +7,6 @@
         <file>RoundButton.qml</file>
         <file>Navigation.qml</file>
         <file>MusicPlayer.qml</file>
+        <file>MediaProgress.qml</file>
     </qresource>
 </RCC>