[vlc-commits] qml: add timeIndicator on top of sliderBar

[Abel Tesfaye]

vlc | branch: master | Abel Tesfaye <Abeltesfaye45 at gmail.com> | Fri May 31 14:00:56 2019 +0300| [21010e6a8675ddb602c50f06d34c3dd43a7b1780] | committer: Thomas Guillem

qml: add timeIndicator on top of sliderBar

Fixes #22198

Signed-off-by: Thomas Guillem <thomas at gllm.fr>
Signed-off-by: Pierre Lamot <pierre at videolabs.io>

> http://git.videolan.org/gitweb.cgi/vlc.git/?a=commit;h=21010e6a8675ddb602c50f06d34c3dd43a7b1780
---

 modules/gui/qt/qml/player/SliderBar.qml | 37 ++++++++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

diff --git a/modules/gui/qt/qml/player/SliderBar.qml b/modules/gui/qt/qml/player/SliderBar.qml
index 6135f81b9b..884c00375f 100644
--- a/modules/gui/qt/qml/player/SliderBar.qml
+++ b/modules/gui/qt/qml/player/SliderBar.qml
@@ -30,7 +30,41 @@ Slider {
     Keys.onRightPressed: player.jumpFwd()
     Keys.onLeftPressed: player.jumpBwd()
 
-    Connections {
+    Item {
+        id: timeTooltip
+        property real location: 0
+        property real position: location/control.width
+
+        y: -35 * VLCStyle.scale
+        x: location - (timeIndicatorRect.width / 2)
+        visible: control.hovered
+
+        Rectangle {
+            width: 10 * VLCStyle.scale
+            height: 10 * VLCStyle.scale
+
+            anchors.horizontalCenter: timeIndicatorRect.horizontalCenter
+            anchors.verticalCenter: timeIndicatorRect.bottom
+
+            rotation: 45
+            color: VLCStyle.colors.bgAlt
+        }
+
+        Rectangle {
+            id: timeIndicatorRect
+            width: childrenRect.width
+            height: 20 * VLCStyle.scale
+            color: VLCStyle.colors.bgAlt
+
+            Text {
+                anchors.centerIn: parent
+                text: (player.length.scale(timeTooltip.position).toString())
+                color: VLCStyle.colors.text
+            }
+        }
+    }
+
+    Connections {    
         /* only update the control position when the player position actually change, this avoid the slider
          * to jump around when clicking
          */
@@ -72,6 +106,7 @@ Slider {
                     control.value = event.x / control.width
                     player.position = control.value
                 }
+                timeTooltip.location = event.x
             }
         }