Add flashy spiral timer to cover

[harbour-pedalo.git] / qml / cover / ClockView.qml

diff --git a/qml/cover/ClockView.qml b/qml/cover/ClockView.qml
new file mode 100644 (file)
index 0000000..88652b2
--- /dev/null
+++ b/qml/cover/ClockView.qml
@@ -0,0 +1,99 @@
+import QtQuick 2.0
+import Sailfish.Silica 1.0
+
+Item {
+    id: root
+
+    property QtObject timerClock
+
+    // Size of the clock border decoration as a fraction of the radius
+    property real _faceRadiusBase: 84
+    property real _faceHourLength: 14.736 / _faceRadiusBase
+
+    Image {
+        id: clockFace
+
+        anchors.fill: parent
+        fillMode: Image.PreserveAspectFit
+        source: "image://theme/graphic-clock-face-3"
+    }
+
+    ShaderEffect {
+        id: timerVisualization
+
+        anchors.fill: clockFace
+
+        visible: stopwatch.update
+
+        onVisibleChanged: {
+            _updateTimerVisualization()
+        }
+
+        property int _seconds: stopwatch.seconds
+        on_SecondsChanged: _updateTimerVisualization()
+
+        property real outerRadius: 1
+        property real innerRadius: 1 - _faceHourLength
+        property real endAngle
+        property real loopRadius: outerRadius / 10
+        property real count
+
+        property color highlightColor: Theme.rgba(Theme.highlightColor, 0.75)
+
+        function _updateTimerVisualization() {
+            if (stopwatch.fast) {
+                count = _seconds
+            }
+            else {
+                count = Math.floor(_seconds / 60)
+            }
+
+            endAngle = 2 * Math.PI * count / 60
+            innerRadius = outerRadius - loopRadius * (parseInt(count / 60) + 1)
+        }
+
+        vertexShader: "
+            uniform highp mat4 qt_Matrix;
+            attribute highp vec4 qt_Vertex;
+            attribute highp vec2 qt_MultiTexCoord0;
+            varying highp vec2 coord;
+            void main() {
+                coord = qt_MultiTexCoord0;
+                gl_Position = qt_Matrix * qt_Vertex;
+            }"
+        fragmentShader: "
+            varying highp vec2 coord;
+            uniform lowp float qt_Opacity;
+            uniform lowp float outerRadius;
+            uniform lowp float innerRadius;
+            uniform lowp float endAngle;
+            uniform lowp float loopRadius;
+            uniform lowp vec4 highlightColor;
+            uniform lowp float count;
+
+            lowp float PI = 3.14159265358979323846264;
+
+            void main() {
+                highp vec2 vector = 2.0*(coord - vec2(0.5, 0.5));
+                lowp float radius = length(vector);
+                lowp float angle = atan(vector.y, vector.x) + PI/2.0;
+                angle += angle < 0.0 ? 2.0*PI : 0.0;
+
+                lowp float minRadius = outerRadius - ((count / 60.0) + 1.0) * loopRadius + (loopRadius * angle / (2.0 * PI));
+                lowp float maxRadius = outerRadius - ((mod(count, 60.0) / 60.0) + 1.0) * loopRadius + (loopRadius * angle / (2.0 * PI));
+
+                if (angle < 2.0 * PI * mod(count, 60.0) / 60.0) {
+                    maxRadius += loopRadius;
+                }
+
+                if (radius >= minRadius && radius < maxRadius) {
+                    if (mod(radius - minRadius, loopRadius) > 0.2 * loopRadius) {
+                        gl_FragColor = highlightColor;
+                        return;
+                    }
+                }
+                gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);
+                return;
+            }"
+    }
+}