1 files changed, 56 insertions, 14 deletions

diff --git a/wayland/democompositor/qml/TimedButton.qml b/wayland/democompositor/qml/TimedButton.qml
index 012875a..af023c4 100644
--- a/wayland/democompositor/qml/TimedButton.qml
+++ b/wayland/democompositor/qml/TimedButton.qml
@@ -39,8 +39,12 @@ import QtQuick 2.6
 Rectangle {
     id: theButton
 
-    radius: 10
-    color: "lightgray"
+    //radius: 10
+    color: "magenta"
+    property color grooveColor: "cyan"
+    property color textColor: "#777"
+    property alias icon: iconImage
+    property double iconSize: 32
 
     property alias text: buttonText.text
     signal triggered()
@@ -54,7 +58,11 @@ Rectangle {
         },
         State {
             name: "PRESSED"
+        },
+        State {
+            name: "TRIGGERED"
         }
+
     ]
 
     transitions: [ Transition {
@@ -79,24 +87,56 @@ Rectangle {
                 }
     ]
     Rectangle {
-        radius: 10
-        color: "red"
-        anchors.left: parent.left
+        id: timeIndicator
         anchors.top: parent.top
-        anchors.bottom: parent.bottom
-        width: parent.width * percent / 100
-        visible: percent > 0
+        anchors.left: parent.left
+        anchors.right: parent.right
+        height: 10
+        color: grooveColor
+        Rectangle {
+            color: "#e41e25"
+            anchors.left: parent.left
+            anchors.top: parent.top
+            anchors.bottom: parent.bottom
+            width: parent.width * percent / 100
+            visible: percent > 0
+        }
     }
 
-    Text {
-        id: buttonText
-        anchors.verticalCenter: parent.verticalCenter
+    Item {
+        anchors.top: timeIndicator.bottom
+        anchors.bottom: parent.bottom
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.margins: 10
-        text: "[Uninitialized]"
+        Item {
+            id: iconRect
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left: parent.left
+            anchors.leftMargin: 5
+            width: iconSize
+            height: iconSize
+            Image {
+                anchors.centerIn: parent
+                id: iconImage
+            }
+        }
+
+
+        Text {
+            id: buttonText
+            anchors.verticalCenter: parent.verticalCenter
+            anchors.left: iconRect.right
+            anchors.right: parent.right
+            anchors.leftMargin: 10
+
+            color: textColor
+            text: "[Uninitialized]"
+            font.bold: true
+        }
+
     }
 
+
     MouseArea {
         id: mouser
         anchors.fill: parent
@@ -111,8 +151,10 @@ Rectangle {
         onReleased: {
             if (containsMouse && parent.percent >= 100) {
                 parent.triggered()
+                parent.state = "TRIGGERED"
+            } else {
+                parent.state = "UNPRESSED"
             }
-            parent.state = "UNPRESSED"
         }
 
         onPositionChanged: {