feat(ui/modules/Linphone/TelKeypad/TelKeypad): supports color on click

linphone-desktop/src/components/call/CallModel.cpp

@@ -385,5 +385,6 @@ bool CallModel::getRecording () const {
 // -----------------------------------------------------------------------------
 
 void CallModel::sendDtmf (const QString &dtmf) {
+  qInfo() << QStringLiteral("Send dtmf: `%1`.").arg(dtmf);
   mLinphoneCall->sendDtmf(dtmf.constData()[0].toLatin1());
 }

linphone-desktop/ui/modules/Linphone/TelKeypad/TelKeypad.qml

@@ -3,6 +3,7 @@ import QtQuick.Layouts 1.3
 
 import Common 1.0
 import Linphone.Styles 1.0
+import Utils 1.0
 
 // =============================================================================
 
@@ -71,11 +72,7 @@ Rectangle {
         icon: modelData.icon || ''
         text: modelData.text
 
-        onClicked: {
-          var text = modelData.text
-          console.info('Send dtmf: ' + text)
-          telKeypad.call.sendDtmf(text)
-        }
+        onClicked: telKeypad.call.sendDtmf(modelData.text)
       }
     }
   }
@@ -87,6 +84,8 @@ Rectangle {
 
     readonly property int delta: 5
 
+    property var _timeout
+    property int _id
     property var _mouseX
     property var _mouseY
 
@@ -103,12 +102,22 @@ Rectangle {
     onPressed: {
       _mouseX = mouse.x
       _mouseY = mouse.y
+      _id = parseInt(_mouseX / (parent.width / grid.columns)) + parseInt(_mouseY / (parent.height / grid.rows)) * grid.columns
     }
 
     onReleased: {
       if (Math.abs(_mouseX - mouse.x) <= delta && Math.abs(_mouseY - mouse.y) <= delta) {
-        var id = parseInt(_mouseX / (parent.width / grid.columns)) + parseInt(_mouseY / (parent.height / grid.rows)) * grid.columns
-        grid.children[id].clicked()
+        grid.children[_id].color = TelKeypadStyle.button.color.pressed
+
+        grid.children[_id].clicked()
+
+        if (_timeout) {
+          Utils.clearTimeout(_timeout)
+        }
+
+        _timeout = Utils.setTimeout(this, 100, (function (id) {
+          grid.children[id].color = TelKeypadStyle.button.color.normal
+        }).bind(this, _id))
       }
     }
   }

linphone-desktop/ui/modules/Linphone/TelKeypad/TelKeypadButton.qml

@@ -8,6 +8,7 @@ import Linphone.Styles 1.0
 Item {
   id: button
 
+  property color color: TelKeypadStyle.button.color.normal
   property string icon: ''
   property string text: ''
 
@@ -19,7 +20,7 @@ Item {
     anchors.fill: parent
 
     background: Rectangle {
-      color: TelKeypadStyle.button.color.normal
+      color: button.color
     }
 
     contentItem: Text {