feat(ui/views/App/Calls/ZrtpTokenAuthentication): coding style & refactoring

linphone-desktop/assets/languages/en.ts

@@ -833,7 +833,7 @@ your friend&apos;s SIP address or username.</translation>
     <name>MessageMenu</name>
     <message>
         <source>copy</source>
-        <translation type="unfinished"></translation>
+        <translation>Copy</translation>
     </message>
 </context>
 <context>
@@ -1362,23 +1362,23 @@ your friend&apos;s SIP address or username.</translation>
 <context>
     <name>ZrtpTokenAuthentication</name>
     <message>
-        <source>Confirm the following SAS with peer:</source>
-        <translation>Confirm the following SAS with peer:</translation>
+        <source>confirmSas</source>
+        <translation>Confirm the following SAS with peer.</translation>
     </message>
     <message>
-        <source>Say:</source>
+        <source>codeA</source>
         <translation>Say:</translation>
     </message>
     <message>
-        <source>Your correspondent should say:</source>
+        <source>codeB</source>
         <translation>Your correspondent should say:</translation>
     </message>
     <message>
-        <source>Deny</source>
+        <source>deny</source>
         <translation>DENY</translation>
     </message>
     <message>
-        <source>Accept</source>
+        <source>accept</source>
         <translation>ACCEPT</translation>
     </message>
 </context>

linphone-desktop/assets/languages/fr.ts

@@ -1361,24 +1361,24 @@ un chat ou ajouter un contact.</translation>
 <context>
     <name>ZrtpTokenAuthentication</name>
     <message>
-        <source>Confirm the following SAS with peer:</source>
-        <translation>Confirmez le SAS suivant avec votre interlocuteur :</translation>
+        <source>confirmSas</source>
+        <translation>Confirmez le SAS suivant avec votre interlocuteur.</translation>
     </message>
     <message>
-        <source>Say:</source>
+        <source>codeA</source>
         <translation>Dites :</translation>
     </message>
     <message>
-        <source>Your correspondent should say:</source>
+        <source>codeB</source>
         <translation>Votre interlocuteur devrait dire :</translation>
     </message>
     <message>
-        <source>Deny</source>
-        <translation>REJETER</translation>
+        <source>deny</source>
+        <translation>REFUSER</translation>
     </message>
     <message>
-        <source>Accept</source>
-        <translation>VALIDER</translation>
+        <source>accept</source>
+        <translation>ACCEPTER</translation>
     </message>
 </context>
 </TS>

linphone-desktop/ui/views/App/Calls/Incall.js

@@ -9,7 +9,7 @@
 // =============================================================================
 
 function computeAvatarSize (maxSize) {
-  var height = zrtp.visible ? container.height - zrtp.height : container.height
+  var height = container.height
   var width = container.width
 
   var size = height < maxSize && height > 0 ? height : maxSize

linphone-desktop/ui/views/App/Calls/Incall.qml

@@ -249,8 +249,19 @@ Rectangle {
       }
     }
 
+    // -------------------------------------------------------------------------
+    // Zrtp.
+    // -------------------------------------------------------------------------
+
     ZrtpTokenAuthentication {
       id: zrtp
+
+      Layout.fillWidth: true
+      Layout.margins: CallStyle.container.margins
+      Layout.preferredHeight: CallStyle.zrtpArea.height
+
+      call: incall.call
+      z: Constants.zPopup
     }
 
     // -------------------------------------------------------------------------

linphone-desktop/ui/views/App/Calls/ZrtpTokenAuthentication.qml

 import QtQuick 2.7
-import QtQuick.Controls 2.1
 import QtQuick.Layouts 1.3
 
 import Common 1.0
-import Common.Styles 1.0
-import Linphone 1.0
-import LinphoneUtils 1.0
-import Utils 1.0
 
 import App.Styles 1.0
 
-Item {
-    height: CallStyle.zrtpArea.height
+// =============================================================================
+
+ColumnLayout {
+  id: zrtp
+
+  // ---------------------------------------------------------------------------
+
+  property var call
+
+  // ---------------------------------------------------------------------------
+
   visible: false
-    Layout.fillWidth: true
-    anchors.top: container.bottom
-    Layout.margins: CallStyle.container.margins
 
-    GridLayout {
-        anchors.centerIn: parent
-        columns: 1
+  // ---------------------------------------------------------------------------
+  // Main text.
+  // ---------------------------------------------------------------------------
 
   Text {
     Layout.fillWidth: true
-            anchors.horizontalCenter: parent.horizontalCenter
+
     horizontalAlignment: Text.AlignHCenter
     verticalAlignment: Text.AlignVCenter
-            text: qsTr("Confirm the following SAS with peer:")
+
+    text: qsTr('confirmSas')
+
+    color: CallStyle.zrtpArea.text.colorA
     elide: Text.ElideRight
-            font.pointSize: CallStyle.zrtpArea.fontSize
-            font.bold: true
-            color: Colors.j
+
+    font {
+      bold: true
+      pointSize: CallStyle.zrtpArea.text.fontSize
+    }
   }
 
-        RowLayout {
-            anchors.horizontalCenter: parent.horizontalCenter
-            spacing: CallStyle.zrtpArea.vu.spacing
-            Layout.fillWidth: true
+  // ---------------------------------------------------------------------------
+  // Rules.
+  // ---------------------------------------------------------------------------
+
+  Row {
+    Layout.alignment: Qt.AlignHCenter
+
+    spacing: CallStyle.zrtpArea.text.wordsSpacing
 
     Text {
-                text: qsTr("Say:")
-                font.pointSize: CallStyle.zrtpArea.fontSize
-                color: Colors.j
+      color: CallStyle.zrtpArea.text.colorA
+      font.pointSize: CallStyle.zrtpArea.text.fontSize
+      text: qsTr('codeA')
     }
 
     Text {
-                text: incall.call.localSAS
-                font.pointSize: CallStyle.zrtpArea.fontSize
-                font.bold: true
-                color: Colors.i
+      color: CallStyle.zrtpArea.text.colorB
+
+      font {
+        bold: true
+        pointSize: CallStyle.zrtpArea.text.fontSize
+      }
+
+      text: zrtp.call.localSAS
     }
 
     Text {
-                text: "-"
-                font.pointSize: CallStyle.zrtpArea.fontSize
-                color: Colors.j
+      color: CallStyle.zrtpArea.text.colorA
+      font.pointSize: CallStyle.zrtpArea.text.fontSize
+      text: '-'
     }
 
     Text {
-                text: qsTr("Your correspondent should say:")
-                font.pointSize: CallStyle.zrtpArea.fontSize
-                color: Colors.j
+      color: CallStyle.zrtpArea.text.colorA
+      font.pointSize: CallStyle.zrtpArea.text.fontSize
+      text: qsTr('codeB')
     }
 
     Text {
-                text: incall.call.remoteSAS
-                font.pointSize: CallStyle.zrtpArea.fontSize
-                font.bold: true
-                color: Colors.i
+      color: CallStyle.zrtpArea.text.colorB
+
+      font {
+        bold: true
+        pointSize: CallStyle.zrtpArea.text.fontSize
+      }
+
+      text: zrtp.call.remoteSAS
     }
   }
 
-        RowLayout {
-            anchors.horizontalCenter: parent.horizontalCenter
-            spacing: CallStyle.zrtpArea.vu.spacing
-            Layout.fillWidth: true
+  // ---------------------------------------------------------------------------
+  // Buttons.
+  // ---------------------------------------------------------------------------
+
+  Row {
+    Layout.alignment: Qt.AlignHCenter
+
+    spacing: CallStyle.zrtpArea.buttons.spacing
 
     TextButtonA {
-                text: qsTr('Deny')
+      text: qsTr('deny')
       onClicked: {
         zrtp.visible = false
-                    incall.call.verifyAuthenticationToken(false)
+        zrtp.call.verifyAuthenticationToken(false)
       }
     }
 
     TextButtonB {
-                text: qsTr('Accept')
+      text: qsTr('accept')
       onClicked: {
         zrtp.visible = false
-                    incall.call.verifyAuthenticationToken(true)
-                }
+        zrtp.call.verifyAuthenticationToken(true)
       }
     }
   }

linphone-desktop/ui/views/App/Styles/Calls/CallStyle.qml

@@ -79,10 +79,16 @@ QtObject {
 
   property QtObject zrtpArea: QtObject {
     property int height: 50
-    property int fontSize: 12
 
-    property QtObject vu: QtObject {
-      property int spacing: 5
+    property QtObject buttons: QtObject {
+      property int spacing: 10
+    }
+
+    property QtObject text: QtObject {
+      property color colorA: Colors.j
+      property color colorB: Colors.i
+      property int fontSize: 12
+      property int wordsSpacing: 5
     }
   }
 }