fix #LINQT-1250 call group form ui

Linphone/view/Control/Display/Contact/ContactListView.qml

@@ -58,7 +58,8 @@ ListView {
 
 	signal contactStarredChanged()
 	signal contactDeletionRequested(FriendGui contact)
-	signal contactAddedToSelection()
+	signal contactAddedToSelection(string address)
+	signal contactRemovedFromSelection(string address)
 	signal clicked()
 
 	function selectContact(address) {
@@ -73,15 +74,25 @@ ListView {
 			var indexInSelection = selectedContacts.indexOf(address)
 			if (indexInSelection == -1) {
 				selectedContacts.push(address)
-				contactAddedToSelection()
+				contactAddedToSelection(address)
 			}
 		}
 	}
 	function removeContactFromSelection(indexInSelection) {
+		var addressToRemove = selectedContacts[indexInSelection]
 		if (indexInSelection != -1) {
 			selectedContacts.splice(indexInSelection, 1)
+			contactRemovedFromSelection(addressToRemove)
 		}
 	}
+	function removeSelectedContactByAddress(address) {
+		var index = selectedContacts.indexOf(address)
+		if (index != -1) {
+			selectedContacts.splice(index, 1)
+			contactRemovedFromSelection(address)
+		}
+	}
+
 	onActiveFocusChanged: if(activeFocus && (!footerItem || !footerItem.activeFocus)) {
 		currentIndex = 0
 	}
@@ -159,6 +170,7 @@ ListView {
 			id: contactDelegate
 			anchors.left: initial.visible ? initial.right : parent.left
 			anchors.right: parent.right
+			anchors.rightMargin: 5 * DefaultStyle.dp
 			anchors.verticalCenter: parent.verticalCenter
 			spacing: 16 * DefaultStyle.dp
 			z: 1
@@ -189,32 +201,30 @@ ListView {
 					}
 				}
 			}
-			EffectImage {
-				id: isSelectedCheck
-				// visible: mainItem.multiSelectionEnabled && (mainItem.confInfoGui.core.getParticipantIndex(modelData.core.defaultAddress) != -1)
-				visible: mainItem.multiSelectionEnabled && (mainItem.selectedContacts.indexOf(modelData.core.defaultAddress) != -1)
-				Layout.preferredWidth: 24 * DefaultStyle.dp
-				Layout.preferredHeight: 24 * DefaultStyle.dp
-				imageSource: AppIcons.check
-				colorizationColor: DefaultStyle.main1_500_main
-				Connections {
-					target: mainItem
-					// onParticipantsChanged: isSelectedCheck.visible = mainItem.confInfoGui.core.getParticipantIndex(modelData.core.defaultAddress) != -1
-					function onSelectedContactCountChanged(){ isSelectedCheck.visible = (mainItem.selectedContacts.indexOf(modelData.core.defaultAddress) != -1)}
-				}
-			}
 			Item{Layout.fillWidth: true}
 			RowLayout {
 				id: actionsRow
 				z: 1
-				// anchors.right: parent.right
+				visible: actionButtons || friendPopup.visible || mainItem.multiSelectionEnabled
-				Layout.rightMargin: 5 * DefaultStyle.dp
+				spacing: visible ? 16 * DefaultStyle.dp : 0
-				// anchors.verticalCenter: parent.verticalCenter
+				EffectImage {
-				spacing: 16 * DefaultStyle.dp
+					id: isSelectedCheck
+					// visible: mainItem.multiSelectionEnabled && (mainItem.confInfoGui.core.getParticipantIndex(modelData.core.defaultAddress) != -1)
+					visible: mainItem.multiSelectionEnabled && (mainItem.selectedContacts.indexOf(modelData.core.defaultAddress) != -1)
+					Layout.preferredWidth: 24 * DefaultStyle.dp
+					Layout.preferredHeight: 24 * DefaultStyle.dp
+					imageSource: AppIcons.check
+					colorizationColor: DefaultStyle.main1_500_main
+					Connections {
+						target: mainItem
+						// onParticipantsChanged: isSelectedCheck.visible = mainItem.confInfoGui.core.getParticipantIndex(modelData.core.defaultAddress) != -1
+						function onSelectedContactCountChanged(){ isSelectedCheck.visible = (mainItem.selectedContacts.indexOf(modelData.core.defaultAddress) != -1)}
+					}
+				}
 				RowLayout{
 					id: actionButtons
 					visible: mainItem.actionLayoutVisible
-					spacing: 10 * DefaultStyle.dp
+					spacing: visible ? 10 * DefaultStyle.dp : 0
 					Button {
 						id: callButton
 						Layout.preferredWidth: 45 * DefaultStyle.dp

Linphone/view/Page/Form/Meeting/AddParticipantsForm.qml

@@ -10,11 +10,9 @@ FocusScope{
 	id: mainItem
 	
 	property string placeHolderText: qsTr("Rechercher des contacts")
-	property list<string> selectedParticipants: contactList.selectedContacts
+	property list<string> selectedParticipants: suggestionList.selectedContacts
 	property int selectedParticipantsCount: selectedParticipants.length
 	property ConferenceInfoGui conferenceInfoGui
-	property bool nameGroupCall: false
-	readonly property string groupName: groupCallName.text
 	property color searchBarColor: DefaultStyle.grey_100
 	property color searchBarBorderColor: "transparent"
 
@@ -22,50 +20,19 @@ FocusScope{
 		// TODO
 		//contactList.selectedContacts.clear()
 	}
-	
+
 	ColumnLayout {
 		anchors.fill: parent
 		spacing: 15 * DefaultStyle.dp
-		ColumnLayout {
-			visible: mainItem.nameGroupCall
-			spacing: 5 * DefaultStyle.dp
-			Layout.rightMargin: 38 * DefaultStyle.dp
-			RowLayout {
-				spacing: 0
-				Text {
-					font.pixelSize: 13 * DefaultStyle.dp
-					font.weight: 700 * DefaultStyle.dp
-					text: qsTr("Nom du groupe")
-				}
-				Item{Layout.fillWidth: true}
-				Text {
-					font.pixelSize: 12 * DefaultStyle.dp
-					font.weight: 300 * DefaultStyle.dp
-					text: qsTr("Requis")
-				}
-			}
-			TextField {
-				id: groupCallName
-				Layout.fillWidth: true
-				Layout.preferredHeight: 49 * DefaultStyle.dp
-				focus: mainItem.nameGroupCall
-				KeyNavigation.down: participantList.count > 0 ? participantList : searchbar
-				Keys.onPressed: (event) => {
-					if(currentIndex <=0 && event.key == Qt.Key_Up){
-						nextItemInFocusChain(false).forceActiveFocus()
-					}
-				}
-			}
-		}
 		ListView {
 			id: participantList
 			Layout.fillWidth: true
 			Layout.preferredHeight: contentHeight
 			Layout.maximumHeight: mainItem.height / 3
 			width: mainItem.width
-			model: contactList.selectedContacts
+			model: suggestionList.selectedContacts
 			clip: true
-			focus: !groupCallName.visible && participantList.count > 0
+			focus: participantList.count > 0
 			Keys.onPressed: (event) => {
 				if(currentIndex <=0 && event.key == Qt.Key_Up){
 					nextItemInFocusChain(false).forceActiveFocus()
@@ -100,7 +67,7 @@ FocusScope{
 						icon.height: 24 * DefaultStyle.dp
 						focus: true
 						contentImageColor: DefaultStyle.main1_500_main
-						onClicked: contactList.selectedContacts.splice(index, 1)
+						onClicked: suggestionList.removeSelectedContactByAddress(modelData)
 					}
 				}
 			}
@@ -120,70 +87,91 @@ FocusScope{
 			Layout.fillWidth: true
 			Layout.topMargin: 6 * DefaultStyle.dp
 			Layout.rightMargin: 28 * DefaultStyle.dp
+			Layout.preferredHeight: 45 * DefaultStyle.dp
 			placeholderText: mainItem.placeHolderText
-			focus: !groupCallName.visible && participantList.count == 0
+			focus: participantList.count == 0
 			color: mainItem.searchBarColor
 			borderColor: mainItem.searchBarColor
-			KeyNavigation.up: participantList.count > 0 
+			KeyNavigation.up: participantList.count > 0
 								? participantList
-								: groupCallName.visible
+								: nextItemInFocusChain(false)
-									? groupCallName
-									: nextItemInFocusChain(false)
 			KeyNavigation.down: contactList
 		}
-		Text {
+		Flickable {
-			Layout.topMargin: 6 * DefaultStyle.dp
-			text: qsTr("Contacts")
-			font {
-				pixelSize: 16 * DefaultStyle.dp
-				weight: 800 * DefaultStyle.dp
-			}
-		}
-		ContactListView {
-			id: contactList
-			visible: contentHeight > 0 || searchbar.text.length > 0
 			Layout.fillWidth: true
 			Layout.fillHeight: true
-			Layout.topMargin: 8 * DefaultStyle.dp
+			contentWidth: width
-			Layout.rightMargin: 8 * DefaultStyle.dp
+			contentHeight: content.height
-			Layout.preferredHeight: contentHeight
+			clip: true
-			multiSelectionEnabled: true
+			Control.ScrollBar.vertical: ScrollBar {
-			contactMenuVisible: false
+				id: contactsScrollBar
-			confInfoGui: mainItem.conferenceInfoGui
+				active: true
-			searchBarText: searchbar.text
+				interactive: true
-			onContactAddedToSelection: participantList.positionViewAtEnd()
+				policy: Control.ScrollBar.AsNeeded
-			headerPositioning: ListView.InlineHeader
+				anchors.top: parent.top
-			header: MouseArea {
+				anchors.bottom: parent.bottom
-				onClicked: contactList.addContactToSelection(sipAddr.text)
+				anchors.right: parent.right
-				visible: searchbar.text.length > 0
+				anchors.rightMargin: 8 * DefaultStyle.dp
-				height: searchbar.text.length > 0 ? 56 * DefaultStyle.dp : 0
+			}
-				width: contactList.width
+			ColumnLayout {
-				RowLayout {
+				id: content
-					Layout.fillWidth: true
+				anchors.left: parent.left
-					spacing: 10 * DefaultStyle.dp
+				anchors.right: parent.right
-					anchors.verticalCenter: parent.verticalCenter
+				anchors.rightMargin: contactsScrollBar.implicitWidth + 12 * DefaultStyle.dp
-					anchors.leftMargin: 30 * DefaultStyle.dp
+				Text {
-					anchors.left: parent.left
+					Layout.topMargin: 6 * DefaultStyle.dp
-					Avatar {
+					text: qsTr("Contacts")
-						Layout.preferredWidth: 45 * DefaultStyle.dp
+					font {
-						Layout.preferredHeight: 45 * DefaultStyle.dp
+						pixelSize: 16 * DefaultStyle.dp
-						_address: sipAddr.text
+						weight: 800 * DefaultStyle.dp
-					}
-					ColumnLayout {
-						spacing: 0
-						Text {
-							id: sipAddr
-							property string _text: UtilsCpp.interpretUrl(searchbar.text)
-							text: SettingsCpp.onlyDisplaySipUriUsername ? UtilsCpp.getUsername(_text) : _text
-							font.pixelSize: 14 * DefaultStyle.dp
-						}
 					}
 				}
+				ContactListView {
+					id: contactList
+					visible: contentHeight > 0 || searchbar.text.length > 0
+					Layout.fillWidth: true
+					// Layout.fillHeight: true
+					Layout.topMargin: 8 * DefaultStyle.dp
+					Layout.preferredHeight: contentHeight
+					multiSelectionEnabled: true
+					contactMenuVisible: false
+					confInfoGui: mainItem.conferenceInfoGui
+					searchBarText: searchbar.text
+					onContactAddedToSelection: (address) => {
+						suggestionList.addContactToSelection(address)
+					}
+					onContactRemovedFromSelection: (address) => suggestionList.removeSelectedContactByAddress(address)
+					Control.ScrollBar.vertical.visible: false
+				}
+				Text {
+					Layout.topMargin: 6 * DefaultStyle.dp
+					text: qsTr("Suggestions")
+					font {
+						pixelSize: 16 * DefaultStyle.dp
+						weight: 800 * DefaultStyle.dp
+					}
+				}
+				ContactListView {
+					id: suggestionList
+					Layout.fillWidth: true
+					Layout.fillHeight: true
+					Layout.preferredHeight: contentHeight
+					contactMenuVisible: false
+					searchBarText: searchbar.text
+					sourceFlags: LinphoneEnums.MagicSearchSource.All
+					multiSelectionEnabled: true
+					onContactAddedToSelection: (address) => {
+						contactList.addContactToSelection(address)
+						participantList.positionViewAtEnd()
+					}
+					onContactRemovedFromSelection: (address) => contactList.removeSelectedContactByAddress(address)
+					Control.ScrollBar.vertical.visible: false
+				}
 			}
-			
-		}
-		Item {
-			Layout.fillHeight: true
 		}
+
+		// Item {
+		// 	Layout.fillHeight: true
+		// }
 	}
 }

Linphone/view/Page/Main/Call/CallPage.qml

@@ -602,33 +602,58 @@ AbstractMainPage {
 	Component {
 		id: groupCallItem
 		FocusScope{
-			width: parent?.width
-			height: parent?.height
 			Control.StackView.onActivated: {
 				titleLoader.sourceComponent = groupCallTitle
 				addParticipantsLayout.forceActiveFocus()
 			}
-			AddParticipantsForm {
+			ColumnLayout {
-				id: addParticipantsLayout
+				spacing: 5 * DefaultStyle.dp
 				anchors.fill: parent
-				onSelectedParticipantsCountChanged: mainItem.selectedParticipantsCount = selectedParticipantsCount
+				RowLayout {
-				nameGroupCall: true
+					spacing: 0
-				focus: true
+					Layout.rightMargin: 38 * DefaultStyle.dp
-				Connections {
+					Text {
-					target: mainItem
+						font.pixelSize: 13 * DefaultStyle.dp
-					function onStartGroupCallRequested() {
+						font.weight: 700 * DefaultStyle.dp
-						if (groupName.length === 0) {
+						text: qsTr("Nom du groupe")
-							UtilsCpp.showInformationPopup(qsTr("Erreur"), qsTr("Un nom doit être donné à l'appel de groupe"), false)
+					}
-						} else if(!mainItem.isRegistered) {
+					Item{Layout.fillWidth: true}
-							UtilsCpp.showInformationPopup(qsTr("Erreur"), qsTr("Vous n'etes pas connecté"), false)
+					Text {
-						} else {
+						font.pixelSize: 12 * DefaultStyle.dp
-							mainItem.confInfoGui = Qt.createQmlObject('import Linphone
+						font.weight: 300 * DefaultStyle.dp
-																		ConferenceInfoGui{
+						text: qsTr("Requis")
-																		}', mainItem)
+					}
-							mainItem.confInfoGui.core.subject = addParticipantsLayout.groupName
+				}
-							mainItem.confInfoGui.core.isScheduled = false
+				TextField {
-							mainItem.confInfoGui.core.addParticipants(addParticipantsLayout.selectedParticipants)
+					id: groupCallName
-							mainItem.confInfoGui.core.save()
+					Layout.fillWidth: true
+					Layout.rightMargin: 38 * DefaultStyle.dp
+					Layout.preferredHeight: 49 * DefaultStyle.dp
+					focus: true
+					KeyNavigation.down: addParticipantsLayout//participantList.count > 0 ? participantList : searchbar
+				}
+				AddParticipantsForm {
+					id: addParticipantsLayout
+					Layout.fillWidth: true
+					Layout.fillHeight: true
+					onSelectedParticipantsCountChanged: mainItem.selectedParticipantsCount = selectedParticipantsCount
+					focus: true
+					Connections {
+						target: mainItem
+						function onStartGroupCallRequested() {
+							if (groupCallName.text.length === 0) {
+								UtilsCpp.showInformationPopup(qsTr("Erreur"), qsTr("Un nom doit être donné à l'appel de groupe"), false)
+							} else if(!mainItem.isRegistered) {
+								UtilsCpp.showInformationPopup(qsTr("Erreur"), qsTr("Vous n'etes pas connecté"), false)
+							} else {
+								mainItem.confInfoGui = Qt.createQmlObject('import Linphone
+																			ConferenceInfoGui{
+																			}', mainItem)
+								mainItem.confInfoGui.core.subject = groupCallName.text
+								mainItem.confInfoGui.core.isScheduled = false
+								mainItem.confInfoGui.core.addParticipants(addParticipantsLayout.selectedParticipants)
+								mainItem.confInfoGui.core.save()
+							}
 						}
 					}
 				}