sip account creation: radiobutton for TLS/UDP

- created MaterialRadioButton
- added tls/udp options in sip wizard
- Fix some focus issues and some spacing

Change-Id: I18c5b7205bbe1c8178a5c3a966c9bfa0cffa93b4

src/app/accountadapter.cpp

@@ -183,7 +183,8 @@ AccountAdapter::createSIPAccount(const QVariantMap& settings)
             confProps.hostname = settings["hostname"].toString();
             confProps.username = settings["username"].toString();
             confProps.password = settings["password"].toString();
-            confProps.routeset = settings["proxy"].toString();
+            confProps.TLS.enable = settings["tls"].toBool();
+
 #ifdef Q_OS_WIN
             confProps.Ringtone.ringtonePath = Utils::GetRingtonePath();
 #endif

src/app/commoncomponents/MaterialRadioButton.qml

@@ -0,0 +1,89 @@
+/*
+ * Copyright (C) 2023 Savoir-faire Linux Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import QtQuick
+import QtQuick.Controls
+import QtQuick.Layouts
+import Qt5Compat.GraphicalEffects
+
+import net.jami.Constants 1.1
+import net.jami.Models 1.1
+
+RadioButton {
+    id: root
+
+    property string color: JamiTheme.textColor
+
+    font.pointSize: JamiTheme.textFontSize
+
+    indicator: Rectangle {
+        id: rect
+        anchors.left: parent.left
+        anchors.verticalCenter: parent.verticalCenter
+
+        border {
+            id: border
+            color: JamiTheme.buttonTintedBlue
+            width: 2
+        }
+
+        implicitWidth: 20
+        implicitHeight: 20
+        radius: 10
+
+        Rectangle {
+
+            id: innerRect
+
+            anchors.horizontalCenter: parent.horizontalCenter
+            anchors.verticalCenter: parent.verticalCenter
+            width: 10
+            height: 10
+            radius: 10
+            visible : checked || hovered
+
+            color: JamiTheme.buttonTintedBlue
+
+            HoverHandler {
+                target: parent
+            }
+        }
+    }
+
+    contentItem: Text {
+        text: root.text
+        color: "white"
+        leftPadding: root.indicator.width + root.spacing
+        verticalAlignment: Text.AlignVCenter
+    }
+
+    Keys.onPressed: function (event) {
+        if (event.key === Qt.Key_Enter
+                || event.key === Qt.Key_Return) {
+            root.checked = true
+        }
+    }
+
+    onActiveFocusChanged: {
+        if (focus && !root.checked) {
+            border.width = 2.5
+        } else {
+            border.width = 2
+        }
+    }
+
+}

src/app/commoncomponents/ModalTextEdit.qml

@@ -77,6 +77,7 @@ Loader {
     Component {
         id: editComp
 
+
         MaterialTextField {
             id: editCompField
 
@@ -97,7 +98,7 @@ Loader {
             text: staticText
             inputIsValid: root.inputIsValid
             onFocusChanged: {
-                if (!focus) {
+                if (!focus && root.editMode) {
                     root.editMode = false
                     root.accepted()
                 }

src/app/constant/JamiStrings.qml

@@ -415,6 +415,10 @@ Item {
     property string configureExistingSIP: qsTr("Configure an existing SIP account")
     property string personalizeAccount: qsTr("Personalize account")
     property string addSip: qsTr("Add SIP account")
+    property string tls: qsTr("TLS")
+    property string udp: qsTr("UDP")
+    property string displayName: qsTr("Display Name")
+
 
     // CurrentAccountSettings && AdvancedSettings
     property string backupSuccessful: qsTr("Backup successful")

src/app/settingsview/components/CurrentAccountSettings.qml

@@ -184,6 +184,7 @@ Rectangle {
 
         MaterialButton {
             Layout.alignment: Qt.AlignHCenter
+            Layout.topMargin: CurrentAccount.type === Profile.Type.SIP ? JamiTheme.preferredMarginSize  : 0
             Layout.leftMargin: JamiTheme.preferredMarginSize
             Layout.rightMargin: JamiTheme.preferredMarginSize
 

src/app/settingsview/components/SIPUserIdentity.qml

@@ -58,6 +58,19 @@ ColumnLayout {
         onEditFinished: CurrentAccount.hostname = dynamicText
     }
 
+    SettingsMaterialTextEdit {
+        id: passSIPlineEdit
+
+        Layout.fillWidth: true
+        Layout.preferredHeight: JamiTheme.preferredFieldHeight
+
+        staticText: CurrentAccount.password
+
+        titleField: JamiStrings.password
+        itemWidth: root.itemWidth
+        isPassword: true
+    }
+
     SettingsMaterialTextEdit {
         id: proxySIP
 
@@ -72,18 +85,4 @@ ColumnLayout {
         onEditFinished: CurrentAccount.routeset = dynamicText
     }
 
-    SettingsMaterialTextEdit {
-        id: passSIPlineEdit
-
-        Layout.fillWidth: true
-        Layout.preferredHeight: JamiTheme.preferredFieldHeight
-
-        staticText: CurrentAccount.password
-
-        titleField: JamiStrings.password
-        itemWidth: root.itemWidth
-        isPassword: true
-
-        onEditFinished: CurrentAccount.password = dynamicText
-    }
 }

src/app/wizardview/components/CreateSIPAccountPage.qml

@@ -47,6 +47,7 @@ Rectangle {
                     WizardViewStepModel.AccountCreationOption.CreateSipAccount) {
                 clearAllTextFields()
                 root.showThisPage()
+                sipServernameEdit.focus = true
             }
         }
     }
@@ -109,33 +110,13 @@ Rectangle {
                     Layout.alignment: Qt.AlignCenter
                     Layout.preferredWidth: Math.min(440, root.width - JamiTheme.preferredMarginSize * 2)
 
-                    focus: visible
                     placeholderText: JamiStrings.server
 
+                    KeyNavigation.tab: KeyNavigation.down
                     KeyNavigation.up: backButton
-                    KeyNavigation.down: sipProxyEdit
-                    KeyNavigation.tab: KeyNavigation.down
-
-                    onAccepted: sipProxyEdit.forceActiveFocus()
-
-                }
-
-                ModalTextEdit {
-                    id: sipProxyEdit
-
-                    objectName: "sipProxyEdit"
-
-                    Layout.alignment: Qt.AlignCenter
-                    Layout.preferredWidth: Math.min(440, root.width - JamiTheme.preferredMarginSize * 2)
-
-                    placeholderText: JamiStrings.proxy
-
-                    KeyNavigation.up: sipServernameEdit
                     KeyNavigation.down: sipUsernameEdit
-                    KeyNavigation.tab: KeyNavigation.down
 
                     onAccepted: sipUsernameEdit.forceActiveFocus()
-
                 }
 
                 ModalTextEdit {
@@ -148,9 +129,9 @@ Rectangle {
 
                     placeholderText: JamiStrings.username
 
-                    KeyNavigation.up: sipProxyEdit
-                    KeyNavigation.down: sipPasswordEdit
                     KeyNavigation.tab: KeyNavigation.down
+                    KeyNavigation.up: sipServernameEdit
+                    KeyNavigation.down: sipPasswordEdit
 
                     onAccepted: sipPasswordEdit.forceActiveFocus()
                 }
@@ -165,12 +146,45 @@ Rectangle {
 
                     placeholderText: JamiStrings.password
 
-                    KeyNavigation.up: sipUsernameEdit
-                    KeyNavigation.down: createAccountButton
                     KeyNavigation.tab: KeyNavigation.down
+                    KeyNavigation.up: sipUsernameEdit
+                    KeyNavigation.down: tlsRadioButton
 
-                    onAccepted: createAccountButton.forceActiveFocus()
+                    onAccepted: tlsRadioButton.forceActiveFocus()
+                }
 
+                ButtonGroup { id: optionsB }
+
+                RowLayout{
+
+                    Layout.alignment: Qt.AlignHCenter
+                    Layout.preferredWidth: Math.min(440, root.width - JamiTheme.preferredMarginSize * 2)
+
+                    MaterialRadioButton {
+                        id: tlsRadioButton
+                        Layout.alignment: Qt.AlignHCenter
+                        text: JamiStrings.tls
+                        ButtonGroup.group: optionsB
+                        checked: true
+
+                        KeyNavigation.up: sipPasswordEdit
+                        KeyNavigation.down: udpRadioButton
+                        KeyNavigation.tab: KeyNavigation.down
+
+                    }
+
+                    MaterialRadioButton {
+                        id: udpRadioButton
+                        Layout.alignment: Qt.AlignHCenter
+                        text: JamiStrings.udp
+                        ButtonGroup.group: optionsB
+                        color: JamiTheme.textColor
+
+                        KeyNavigation.up: tlsRadioButton
+                        KeyNavigation.down: createAccountButton
+                        KeyNavigation.tab: KeyNavigation.down
+
+                    }
                 }
 
                 MaterialButton {
@@ -185,7 +199,7 @@ Rectangle {
 
                     text: JamiStrings.addSip
 
-                    KeyNavigation.up: sipPasswordEdit
+                    KeyNavigation.up: udpRadioButton
                     KeyNavigation.down: personalizeAccount
                     KeyNavigation.tab: KeyNavigation.down
 
@@ -196,7 +210,7 @@ Rectangle {
                                         alias: displayNameLineEdit.dynamicText,
                                         username : sipUsernameEdit.dynamicText,
                                         password : sipPasswordEdit.dynamicText,
-                                        proxy : sipProxyEdit.dynamicText,
+                                        tls: tlsRadioButton.checked,
                                         avatar: UtilsAdapter.tempCreationImage()})
                         WizardViewStepModel.nextStep()
                     }