flickable register

about popup
fix new call ui
fix temp text visibility
fix login layout ui
dialog

Linphone/data/image/check-square-offset.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#4e6074" viewBox="0 0 256 256"><path d="M224,48V208a16,16,0,0,1-16,16H136a8,8,0,0,1,0-16h72V48H48v96a8,8,0,0,1-16,0V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48ZM125.66,154.34a8,8,0,0,0-11.32,0L64,204.69,45.66,186.34a8,8,0,0,0-11.32,11.32l24,24a8,8,0,0,0,11.32,0l56-56A8,8,0,0,0,125.66,154.34Z"></path></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M224,48V208a16,16,0,0,1-16,16H136a8,8,0,0,1,0-16h72V48H48v96a8,8,0,0,1-16,0V48A16,16,0,0,1,48,32H208A16,16,0,0,1,224,48ZM125.66,154.34a8,8,0,0,0-11.32,0L64,204.69,45.66,186.34a8,8,0,0,0-11.32,11.32l24,24a8,8,0,0,0,11.32,0l56-56A8,8,0,0,0,125.66,154.34Z"></path></svg>

Linphone/data/image/copyright.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="#000000" viewBox="0 0 256 256"><path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216ZM96,128a32,32,0,0,0,57.6,19.2,8,8,0,0,1,12.8,9.61,48,48,0,1,1,0-57.62,8,8,0,0,1-12.8,9.61A32,32,0,0,0,96,128Z"></path></svg>

Linphone/view/CMakeLists.txt

@@ -34,6 +34,7 @@ list(APPEND _LINPHONEAPP_QML_FILES
 
 	view/Control/Display/BusyIndicator.qml
 	view/Control/Display/EffectImage.qml
+	view/Control/Display/Flickable.qml
 	view/Control/Display/TemporaryText.qml
 	view/Control/Display/ProgressBar.qml
 	view/Control/Display/RoundedPane.qml

Linphone/view/Control/Container/FormItemLayout.qml

@@ -1,5 +1,4 @@
 import QtQuick
-import QtQuick.Controls.Basic as Control
 import QtQuick.Layouts
 import QtQuick.Effects
 import Linphone
@@ -41,8 +40,8 @@ FocusScope{
 		}
 	
 		Item {
-			Layout.preferredHeight: contentItem.height
+			Layout.preferredHeight: childrenRect.height
-			Layout.preferredWidth: contentItem.width
+			Layout.preferredWidth: childrenRect.width
 			Item {
 				id: contentItem
 				height: childrenRect.height
@@ -52,7 +51,6 @@ FocusScope{
 				id: errorText
 				anchors.top: contentItem.bottom
 				color: DefaultStyle.danger_500main
-				Layout.preferredWidth: implicitWidth
 			}
 		}
 	

Linphone/view/Control/Display/TemporaryText.qml

@@ -7,23 +7,21 @@ import Linphone
 Text {
 	id: mainItem
 	color: DefaultStyle.danger_500main
-	visible: false
+	visible: text.length > 0
 	function clear() {
 		autoHideErrorMessage.stop()
 		text = ""
-		mainItem.visible = false
 	}
 	function setText(text) {
 		if (text.length === 0) {
 			clear()
 		} else {
-			mainItem.visible = true
 			mainItem.text = text
 		}
 	}
 	font {
-		pixelSize: 12 * DefaultStyle.dp
+		pixelSize: 13 * DefaultStyle.dp
-		weight: 300 * DefaultStyle.dp
+		weight: 600 * DefaultStyle.dp
 	}
 	Timer {
 		id: autoHideErrorMessage

Linphone/view/Control/Form/Login/LoginForm.qml

@@ -6,7 +6,7 @@ import ConstantsCpp 1.0
 
 ColumnLayout {
 	id: mainItem
-	spacing: 25 * DefaultStyle.dp
+	spacing: 10 * DefaultStyle.dp
 	signal connectionSucceed()
 
 	FormItemLayout {
@@ -35,11 +35,9 @@ ColumnLayout {
 				Layout.preferredHeight: 49 * DefaultStyle.dp
 				hidden: true
 			}
-		}
-
 			TemporaryText {
 				id: errorText
-			anchors.top: password.bottom
+				anchors.bottom: parent.bottom
 				Connections {
 					target: LoginPageCpp
 					function onErrorMessageChanged() {
@@ -54,6 +52,8 @@ ColumnLayout {
 			}
 		}
 
+	}
+
 	RowLayout {
 		Layout.topMargin: 7 * DefaultStyle.dp
 		spacing: 29 * DefaultStyle.dp
@@ -101,6 +101,7 @@ ColumnLayout {
 			function trigger() {
 				username.errorMessage = ""
 				password.errorMessage = ""
+				errorText.text = ""
 
 				if (usernameEdit.text.length == 0 || passwordEdit.text.length == 0) {
 					if (usernameEdit.text.length == 0)

Linphone/view/Control/Popup/Dialog/Dialog.qml

@@ -16,6 +16,7 @@ Popup {
 	underlineColor: DefaultStyle.main1_500_main
 	radius: title.length === 0 ? 16 * DefaultStyle.dp : 0
 	property string title
+	property var titleColor: DefaultStyle.main2_600
 	property string text
 	property string details
 	property string firstButtonText: firstButtonAccept ? qsTr("Oui") : qsTr("Annuler")
@@ -52,7 +53,7 @@ Popup {
 				Layout.fillWidth: true
 				visible: text.length != 0
 				text: mainItem.title
-				color: DefaultStyle.main1_500_main
+				color: mainItem.titleColor
 				font {
 					pixelSize: 22 * DefaultStyle.dp
 					weight: 800 * DefaultStyle.dp

Linphone/view/Page/Form/Login/LoginPage.qml

@@ -84,11 +84,6 @@ LoginLayout {
 			anchors.leftMargin: 127 * DefaultStyle.dp
 			anchors.topMargin: 70 * DefaultStyle.dp
 			anchors.bottom: parent.bottom
-			width: contentWidth
-			contentWidth: content.implicitWidth
-			contentHeight: content.implicitHeight
-			clip: true
-			flickableDirection: Flickable.VerticalFlick
 			ColumnLayout {
 				id: content
 				spacing: 0

Linphone/view/Page/Form/Register/RegisterPage.qml

@@ -16,6 +16,7 @@ LoginLayout {
 	Connections {
 		target: RegisterPageCpp
 		function onErrorInField(field, errorMessage) {
+			console.log("set error message", errorMessage)
 			if (field == "username") usernameItem.errorMessage = errorMessage
 			else if (field == "password") pwdItem.errorMessage = errorMessage
 			else if (field == "phone") phoneNumberInput.errorMessage = errorMessage
@@ -23,6 +24,7 @@ LoginLayout {
 			else otherErrorText.text = errorMessage
 		}
 		function onRegisterNewAccountFailed(errorMessage) {
+			console.log("register failed", errorMessage)
 			otherErrorText.text = errorMessage
 		}
 	}
@@ -77,9 +79,7 @@ LoginLayout {
 
 	centerContent: [
 		ColumnLayout {
-			anchors.top: parent.top
+			anchors.fill: parent
-			anchors.left: parent.left
-			anchors.right: parent.right
 			anchors.topMargin: 51 * DefaultStyle.dp
 			anchors.leftMargin: 127 * DefaultStyle.dp
 			anchors.rightMargin: 127 * DefaultStyle.dp
@@ -89,6 +89,9 @@ LoginLayout {
 				id: bar
 				model: [qsTr("Register with phone number"), qsTr("Register with email")]
 			}
+			Flickable {
+				Layout.fillWidth: true
+				Layout.fillHeight: true
 				ColumnLayout {
 					spacing: 22 * DefaultStyle.dp
 					ColumnLayout {
@@ -99,6 +102,7 @@ LoginLayout {
 								id: usernameItem
 								label: qsTr("Username")
 								mandatory: true
+								enableErrorText: true
 								contentItem: TextField {
 									id: usernameInput
 									Layout.preferredWidth: 346 * DefaultStyle.dp
@@ -129,6 +133,7 @@ LoginLayout {
 								id: phoneNumberInput
 								property string completePhoneNumber: countryCode + phoneNumber
 								label: qsTr("Numéro de téléphone")
+								enableErrorText: true
 								mandatory: true
 								placeholderText: "Phone number"
 								defaultCallingCode: "33"
@@ -187,6 +192,7 @@ LoginLayout {
 								id: otherErrorText
 								Layout.fillWidth: true
 								Layout.topMargin: 5 * DefaultStyle.dp
+								onTextChanged: console.log("set error", text) 
 							}
 						}
 					}
@@ -319,6 +325,7 @@ LoginLayout {
 						}
 					}
 				}
+			}
 		},
 		Image {
 			z: -1

Linphone/view/Page/Layout/Login/LoginLayout.qml

@@ -7,20 +7,116 @@ import QtQuick.Layouts
 import QtQuick.Controls.Basic as Control
 
 import Linphone
+import ConstantsCpp
 
 Rectangle {
 	id: mainItem
 	property alias titleContent : titleLayout.children
 	property alias centerContent : centerLayout.children
 	color: DefaultStyle.grey_0
+
+	component AboutLine: RowLayout {
+		id: line
+		spacing: 20 * DefaultStyle.dp
+		property var imageSource
+		property string title
+		property string text
+		signal contentClicked()
+		EffectImage {
+			Layout.preferredWidth: 32 * DefaultStyle.dp
+			Layout.preferredHeight: 32 * DefaultStyle.dp
+			imageSource: parent.imageSource
+			colorizationColor: DefaultStyle.main1_500_main
+		}
 		ColumnLayout {
-		// anchors.leftMargin: 119 * DefaultStyle.dp
+			spacing: 0
-		id: contentLayout
+			Text {
-		// anchors.top: parent.top
+				Layout.fillWidth: true
-		// anchors.left: parent.left
+				text: line.title
-		// anchors.right: parent.right
+				color: DefaultStyle.main2_600
+				font {
+					pixelSize: 15 * DefaultStyle.dp
+					weight: 600 * DefaultStyle.dp
+				}
+				horizontalAlignment: Layout.AlignLeft
+			}
+			Text {
+				id: content
+				Layout.fillWidth: true
+				text: line.text
+				color: DefaultStyle.main2_500main
+				font.pixelSize: 14 * DefaultStyle.dp
+				horizontalAlignment: Layout.AlignLeft
+				Keys.onPressed: (event)=> {
+					if (event.key == Qt.Key_Space || event.key == Qt.Key_Enter || event.key == Qt.Key_Return) {
+						line.contentClicked(undefined)
+						event.accepted = true;
+					}
+				}
+				MouseArea {
+					id: privateMouseArea
+					anchors.fill: parent
+					hoverEnabled: true
+					cursorShape: containsMouse ? Qt.PointingHandCursor : Qt.ArrowCursor
+					onClicked: line.contentClicked()
+				}
+			}
+		}
+		// Item {Layout.fillWidth: true}
+	}
+
+	Dialog {
+		id: aboutPopup
+		anchors.centerIn: parent
+		width: 637 * DefaultStyle.dp
+		title: qsTr("À propos de Linphone")
+		bottomPadding: 10 * DefaultStyle.dp
+		buttons: []
+		content: RowLayout {
+			ColumnLayout {
+				spacing: 17 * DefaultStyle.dp
+				Layout.alignment: Qt.AlignTop | Qt.AlignLeft
+				AboutLine {
+					imageSource: AppIcons.detective
+					title: qsTr("Politique de confidentialité")
+					text: qsTr("Visiter notre potilique de confidentialité")
+					onContentClicked: Qt.openUrlExternally(ConstantsCpp.PrivatePolicyUrl)
+				}
+				AboutLine {
+					imageSource: AppIcons.info
+					title: qsTr("Version")
+					text: Qt.application.version
+				}
+				AboutLine {
+					imageSource: AppIcons.checkSquareOffset
+					title: qsTr("Licence")
+					text: applicationLicence
+				}
+				AboutLine {
+					imageSource: AppIcons.copyright
+					title: qsTr("Copyright")
+					text: applicationVendor
+				}
+				Item {
+					// Item to shift close button
+					Layout.preferredHeight: 10 * DefaultStyle.dp
+				}
+			}
+			Button {
+				Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+				text: qsTr("Fermer")
+				leftPadding: 16 * DefaultStyle.dp
+				rightPadding: 16 * DefaultStyle.dp
+				topPadding: 10 * DefaultStyle.dp
+				bottomPadding: 10 * DefaultStyle.dp
+				onClicked: aboutPopup.close()
+			}
+		}
+	}
+
+	ColumnLayout {
+		id: contentLayout
 		anchors.fill: parent
-		// anchors.bottom: bottomMountains.top
 		spacing: 0
 		RowLayout {
 			Layout.fillWidth: true
@@ -40,7 +136,7 @@ Rectangle {
 				textSize: 14 * DefaultStyle.dp
 				textWeight: 400 * DefaultStyle.dp
 				textColor: DefaultStyle.main2_500main
-				onClicked: console.debug("[LoginLayout]User: open about popup")
+				onClicked: aboutPopup.open()
 				
 				background: Item{}
 			}
@@ -59,7 +155,6 @@ Rectangle {
 		}
 		Image {
 			id: bottomMountains
-			z: -1
 			source: AppIcons.belledonne
 			fillMode: Image.Stretch
 			Layout.fillWidth: true

Linphone/view/Page/Main/Start/WelcomePage.qml

@@ -42,16 +42,12 @@ LoginLayout {
 			Layout.rightMargin: 50 * DefaultStyle.dp
 			Layout.alignment: Qt.AlignVCenter | Layout.AlignRight
 			background: Item {
-				visible: false
 			}
-			contentItem: Text {
 			text: qsTr("Passer")
-				font {
+			textColor: DefaultStyle.main2_600
 			underline: true
-					pixelSize: 13 * DefaultStyle.dp
+			textSize: 13 * DefaultStyle.dp
-					weight: 600 * DefaultStyle.dp
+			textWeight: 600 * DefaultStyle.dp
-				}
-			}
 			onClicked: {
 				console.debug("[WelcomePage] User: Click skip")
 				mainItem.startButtonPressed()

Linphone/view/Page/Window/Call/CallsWindow.qml

@@ -623,6 +623,7 @@ AbstractWindow {
 					searchBarBorderColor: DefaultStyle.grey_200
 					numPadPopup: numericPad
 					onContactClicked: (contact) => {
+						rightPanel.visible = false
 						mainWindow.startCallWithContact(contact, false, rightPanel)
 					}
 					
@@ -637,6 +638,7 @@ AbstractWindow {
 						topPadding: 41 * DefaultStyle.dp
 						bottomPadding: 18 * DefaultStyle.dp
 						onLaunchCall: {
+							rightPanel.visible = false
 							UtilsCpp.createCall(newCallForm.searchBar.text)
 						}
 						Component.onCompleted: parent.height = height
@@ -1016,7 +1018,8 @@ AbstractWindow {
 				visible: middleItemStackView.currentItem.objectName == "inCallItem"
 
 				function refreshLayout() {
-					if (mainWindow.callState === LinphoneEnums.CallState.Connected || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning) {
+					if (mainWindow.callState === LinphoneEnums.CallState.Connected || mainWindow.callState === LinphoneEnums.CallState.StreamsRunning
+					|| mainWindow.callState === LinphoneEnums.CallState.Paused || mainWindow.callState === LinphoneEnums.CallState.PausedByRemote) {
 						connectedCallButtons.visible = bottomButtonsLayout.visible
 						moreOptionsButton.visible = bottomButtonsLayout.visible
 						bottomButtonsLayout.layoutDirection = Qt.RightToLeft
@@ -1103,6 +1106,7 @@ AbstractWindow {
 						icon.height: 32 * DefaultStyle.dp
 						contentImageColor: enabled ? DefaultStyle.grey_0 : DefaultStyle.grey_500
 						onCheckedChanged: {
+							console.log("checked transfer changed", checked)
 							if (checked) {
 								rightPanel.visible = true
 								rightPanel.replace(callTransferPanel)
@@ -1123,8 +1127,8 @@ AbstractWindow {
 						Layout.preferredHeight: 55 * DefaultStyle.dp
 						icon.width: 32 * DefaultStyle.dp
 						icon.height: 32 * DefaultStyle.dp
-						checked: rightPanel.visible && rightPanel.currentItem ? rightPanel.currentItem.objectName === "newCallPanel" : false
 						onCheckedChanged: {
+							console.log("checked newcall changed", checked)
 							if (checked) {
 								rightPanel.visible = true
 								rightPanel.replace(newCallPanel)
@@ -1132,6 +1136,10 @@ AbstractWindow {
 								rightPanel.visible = false
 							}
 						}
+						Connections {
+							target: rightPanel
+							function onVisibleChanged() { if(!rightPanel.visible) newCallButton.checked = false}
+						}
 					}
 				}
 				RowLayout {

Linphone/view/Page/Window/Main/MainWindow.qml

@@ -14,6 +14,8 @@ AbstractWindow {
 	property bool firstConnection: true
 
 	color: DefaultStyle.grey_0
+	minimumWidth: 1020
+	minimumHeight: 700
 
 	signal callCreated()
 	property var accountProxy

Linphone/view/Style/AppIcons.qml

@@ -21,6 +21,9 @@ QtObject {
 	property string reloadArrow: "image://internal/arrow-clockwise.svg"
 	property string arrowsMerge: "image://internal/arrows-merge.svg"
 	property string info: "image://internal/info.svg"
+	property string detective: "image://internal/detective.svg"
+	property string copyright: "image://internal/copyright.svg"
+	property string checkSquareOffset: "image://internal/check-square-offset.svg"
 	property string loginImage: "image://internal/login_image.svg"
 	property string belledonne: "image://internal/belledonne.svg"
 	property string profile: "image://internal/user-circle.svg"
@@ -103,7 +106,6 @@ QtObject {
 	property string license: "image://internal/license.svg"
 	property string debug: "image://internal/debug.svg"
 	property string world: "image://internal/world.svg"
-	property string detective: "image://internal/detective.svg"
 	property string warningCircle: "image://internal/warning-circle.svg"
 	property string fullscreen: "image://internal/fullscreen.svg"
 	property string cellSignalFull: "image://internal/cell-signal-full.svg"