[vlc-commits] qml: add buffer indicator

[Abel Tesfaye]

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

qml: add buffer indicator

Fixes #22197

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=5ebc2ca574540f31580f01105efd3da6927c267e
---

 modules/gui/qt/qml/player/SliderBar.qml | 74 +++++++++++++++++++++++++++++++++
 modules/gui/qt/qml/style/VLCColors.qml  |  1 +
 2 files changed, 75 insertions(+)

diff --git a/modules/gui/qt/qml/player/SliderBar.qml b/modules/gui/qt/qml/player/SliderBar.qml
index d790e18683..b9a4f3248f 100644
--- a/modules/gui/qt/qml/player/SliderBar.qml
+++ b/modules/gui/qt/qml/player/SliderBar.qml
@@ -40,6 +40,7 @@ Slider {
     property int barHeight: 5
 
     background: Rectangle {
+        id: sliderRect
         width: control.availableWidth
         implicitHeight: control.implicitHeight
         height: implicitHeight
@@ -52,6 +53,79 @@ Slider {
             radius: control.barHeight
         }
 
+        Rectangle {
+            id: bufferRect    
+            property int bufferAnimWidth: 100 * VLCStyle.scale
+            property int bufferAnimPosition: 0
+            property int bufferFrames: 1000
+            property alias animateLoading: loadingAnim.running
+
+            height: control.barHeight
+            opacity: 0.4
+            color: VLCStyle.colors.buffer
+            radius: control.barHeight
+
+            states: [
+                State {
+                    name: "buffering not started"
+                    when: player.buffering === 0
+                    PropertyChanges {
+                        target: bufferRect
+                        width: bufferAnimWidth
+                        visible: true
+                        x: (bufferAnimPosition / bufferFrames)* (parent.width - bufferAnimWidth)
+                        animateLoading: true
+                    }
+                },
+                State {
+                    name: "time to start playing known"
+                    when: player.buffering < 1
+                    PropertyChanges {
+                        target: bufferRect
+                        width: player.buffering * parent.width
+                        visible: true
+                        x: 0
+                        animateLoading: false
+                    }
+                },
+                State {
+                    name: "playing from buffer"
+                    when: player.buffering === 1
+                    PropertyChanges {
+                        target: bufferRect
+                        width: player.buffering * parent.width
+                        visible: false
+                        x: 0
+                        animateLoading: false
+                    }
+                }
+            ]
+
+            SequentialAnimation on bufferAnimPosition {
+                id: loadingAnim
+                running: bufferRect.animateLoading
+                loops: Animation.Infinite
+                PropertyAnimation {
+                    from: 0.0
+                    to: bufferRect.bufferFrames
+                    duration: 2000
+                    easing.type: "OutBounce"
+                }
+                PauseAnimation {
+                    duration: 500
+                }
+                PropertyAnimation {
+                    from: bufferRect.bufferFrames
+                    to: 0.0
+                    duration: 2000
+                    easing.type: "OutBounce"
+                }
+                PauseAnimation {
+                    duration: 500
+                }
+            }
+        }
+
         Text {
             text: player.time.toString()
             color: VLCStyle.colors.text
diff --git a/modules/gui/qt/qml/style/VLCColors.qml b/modules/gui/qt/qml/style/VLCColors.qml
index c8d645db76..ef3df59a4d 100644
--- a/modules/gui/qt/qml/style/VLCColors.qml
+++ b/modules/gui/qt/qml/style/VLCColors.qml
@@ -77,6 +77,7 @@ Item {
 
     property color lightText: "#747474";
 
+    property color buffer: "#696969";
 
     property var colorSchemes: ["system", "day", "night"]