issue: Maximize and then Restore Select a screen to share window

GitLab: #634
Change-Id: I4c95622297e52d4b7fb5ea42426353a3b3579186

src/app/mainview/components/ScreensharingElementPreview.qml

@@ -0,0 +1,85 @@
+/*
+ * Copyright (C) 2023 Savoir-faire Linux Inc.
+ * Author: Nicolas Vengeon <Nicolas.vengeon@savoirfairelinux.com>
+
+ * 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 net.jami.Adapters 1.1
+import net.jami.Models 1.1
+import net.jami.Constants 1.1
+
+import "../../commoncomponents"
+
+Rectangle {
+    id: root
+
+    color: JamiTheme.secondaryBackgroundColor
+    border.color: selectedScreenNumber === elementIndex ? JamiTheme.screenSelectionBorderColor : JamiTheme.tabbarBorderColor
+
+    width: elementWidth
+    height: 3 * width / 4
+
+    property var elementIndex
+    property string rectTitle
+    property var rId
+    property bool isSelectAllScreens
+
+    Text {
+        id: textTitle
+
+        anchors.top: root.top
+        anchors.topMargin: marginSize
+        anchors.horizontalCenter: root.horizontalCenter
+        width: root.width - 2 * marginSize
+
+        font.pointSize: JamiTheme.textFontSize
+        text: rectTitle
+        elide: Text.ElideRight
+        horizontalAlignment: Text.AlignHCenter
+        color: JamiTheme.textColor
+    }
+
+    VideoView {
+        anchors.top: textTitle.bottom
+        anchors.topMargin: 10
+        anchors.horizontalCenter: root.horizontalCenter
+        height: root.height - 50
+        width: root.width - 50
+
+        Component.onDestruction: {
+            VideoDevices.stopDevice(rendererId)
+        }
+        Component.onCompleted: {
+            if (root.rId !== "") {
+                rendererId = VideoDevices.startDevice(root.rId)
+            }
+        }
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        acceptedButtons: Qt.LeftButton
+
+        onClicked: {
+            if (selectedScreenNumber !== root.elementIndex) {
+                selectedScreenNumber = root.elementIndex
+            }
+        }
+    }
+}

src/app/mainview/components/SelectScreen.qml

@@ -1,8 +1,9 @@
 /*
- * Copyright (C) 2020-2022 Savoir-faire Linux Inc.
+ * Copyright (C) 2020-2023 Savoir-faire Linux Inc.
  * Author: Mingrui Zhang <mingrui.zhang@savoirfairelinux.com>
  * Author: Aline Gondim Santos <aline.gondimsantos@savoirfairelinux.com>
- *
+ * Author: Nicolas Vengeon <Nicolas.vengeon@savoirfairelinux.com>
+
  * 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
@@ -35,320 +36,150 @@ import "../../commoncomponents"
 Window {
     id: root
 
-    property bool window: false
+    minimumHeight: minimumWidth * 3 / 4
-
+    minimumWidth: componentMinWidth + 2 * marginSize
-    property int selectedScreenNumber: -1
-    property bool selectAllScreens: false
-    property string currentPreview: ""
-    property var screens: []
-    property real componentMinWidth: 200
-    property real componentWidthDoubleColumn: screenSelectionScrollView.width / 2 -
-                                            screenSelectionScrollViewFlow.spacing / 2 - JamiTheme.preferredMarginSize
-    property real componentWidthSingleColumn: screenSelectionScrollView.width -
-                                              2 * JamiTheme.preferredMarginSize
-
     modality: Qt.ApplicationModal
     title: window ? JamiStrings.selectWindow : JamiStrings.selectScreen
 
-    // How many rows the ScrollView should have.
+    property bool window: false
-    function calculateRepeaterModel() {
+    property int selectedScreenNumber: -2
-        screens = []
+    property bool selectAllScreens: selectedScreenNumber == -1
-        var idx
+    property string currentPreview: ""
-        for (idx in Qt.application.screens) {
+    property var listModel: []
-            screens.push(JamiStrings.screen.arg(idx))
+    property real componentMinWidth: 350
+    property real marginSize: JamiTheme.preferredMarginSize
+    property real elementWidth: {
+        var layoutWidth = selectScreenWindowLayout.width
+        var minSize = componentMinWidth + 2 * marginSize
+        var numberElementPerRow = Math.floor(layoutWidth / minSize)
+        if (numberElementPerRow == 1 && layoutWidth > componentMinWidth * 1.5) {
+            numberElementPerRow = 2
         }
-        AvAdapter.getListWindows()
+        if (window)
-        for (idx in AvAdapter.windowsNames) {
+            numberElementPerRow = Math.min(listModel.length, numberElementPerRow)
-            screens.push(AvAdapter.windowsNames[idx])
+        else
+            numberElementPerRow = Math.min(listModel.length + 1, numberElementPerRow)
+        var spacingLength = marginSize * (numberElementPerRow  + 2)
+
+        return (layoutWidth - spacingLength) / numberElementPerRow
     }
 
-        return screens.length
+    function calculateRepeaterModel() {
+        listModel = []
+        var idx
+        if (!root.window) {
+            for (idx in Qt.application.screens) {
+                listModel.push(JamiStrings.screen.arg(idx))
+            }
+        } else {
+            AvAdapter.getListWindows()
+            for (idx in AvAdapter.windowsNames) {
+                listModel.push(AvAdapter.windowsNames[idx])
+            }
+        }
     }
 
     onVisibleChanged: {
         if (!visible)
             return
         if (!active) {
-            selectedScreenNumber = -1
+            selectedScreenNumber = -2
-            selectAllScreens = false
         }
         screenInfo.model = {}
-        screenInfo2.model = {}
         calculateRepeaterModel()
-        screenInfo.model = screens.length
+        screenInfo.model = root.listModel
-        screenInfo2.model = screens.length
-        windowsText.visible = root.window
     }
 
     Rectangle {
         id: selectScreenWindowRect
 
         anchors.fill: parent
-
         color: JamiTheme.backgroundColor
 
+        ColumnLayout {
+            id: selectScreenWindowLayout
+
+            anchors.fill: parent
+
+            Text {
+                font.pointSize: JamiTheme.menuFontSize
+                font.bold: true
+                text: root.window ? JamiStrings.windows : JamiStrings.screens
+                verticalAlignment: Text.AlignBottom
+                color: JamiTheme.textColor
+                Layout.margins: marginSize
+            }
+
             ScrollView {
                 id: screenSelectionScrollView
 
-            anchors.topMargin: JamiTheme.preferredMarginSize
+                Layout.alignment: Qt.AlignCenter
-            anchors.horizontalCenter: selectScreenWindowRect.horizontalCenter
+                Layout.preferredWidth: selectScreenWindowLayout.width
-
+                Layout.fillHeight: true
-            width: selectScreenWindowRect.width
-            height: selectScreenWindowRect.height -
-                    (selectButton.height + JamiTheme.preferredMarginSize * 4)
 
                 clip: true
                 ScrollBar.horizontal.policy: ScrollBar.AlwaysOff
-            ScrollBar.vertical.policy: ScrollBar.AlwaysOn
+                ScrollBar.vertical.policy: ScrollBar.AsNeeded
 
                 Flow {
                     id: screenSelectionScrollViewFlow
 
-                anchors.fill: parent
+                    // https://bugreports.qt.io/browse/QTBUG-110323
-                topPadding: JamiTheme.preferredMarginSize
-                rightPadding: JamiTheme.preferredMarginSize
-                leftPadding: JamiTheme.preferredMarginSize
-
-                spacing: JamiTheme.preferredMarginSize
-
-                Text {
                     width: screenSelectionScrollView.width
-                    height: JamiTheme.preferredFieldHeight
+                    height: screenSelectionScrollView.height
 
-                    font.pointSize: JamiTheme.menuFontSize
+                    topPadding: marginSize
-                    font.bold: true
+                    rightPadding: marginSize
-                    text: JamiStrings.screens
+                    leftPadding: marginSize
-                    verticalAlignment: Text.AlignBottom
+                    spacing: marginSize
-                    color: JamiTheme.textColor
+
-                    visible: !root.window
+                   ScreensharingElementPreview {
+                       id: screenSelectionRectAll
+
+                       visible: !root.window && Qt.application.screens.length > 1 && Qt.platform.os.toString() !== "windows"
+                       elementIndex: -1
+                       rectTitle: JamiStrings.allScreens
+                       rId: AvAdapter.getSharingResource(-1, "")
+                       isSelectAllScreens: true
                    }
 
+
                     Repeater {
                         id: screenInfo
 
-                    model: screens ? screens.length : 0
+                        model: listModel.length
 
-                    delegate: Rectangle {
+                        delegate: ScreensharingElementPreview {
                             id: screenItem
 
-                        color: JamiTheme.secondaryBackgroundColor
+                            visible: JamiStrings.selectScreen !== listModel[index]
-
+                            elementIndex: index
-                        width: componentWidthDoubleColumn > componentMinWidth ? componentWidthDoubleColumn : componentWidthSingleColumn
+                            rectTitle: listModel[index] ? listModel[index] : ""
-                        height: 3 * width / 4
+                            rId: {
-
+                                if (root.window)
-                        border.color: selectedScreenNumber === index ? JamiTheme.screenSelectionBorderColor : JamiTheme.tabbarBorderColor
+                                    return rId = AvAdapter.getSharingResource(-2, AvAdapter.windowsIds[index])
-                        visible: !root.window && JamiStrings.selectScreen !== screens[index] && index < Qt.application.screens.length
+                                return rId = AvAdapter.getSharingResource(index, "")
-
-                        Text {
-                            id: screenName
-
-                            anchors.top: screenItem.top
-                            anchors.topMargin: 10
-                            anchors.horizontalCenter: screenItem.horizontalCenter
-                            width: parent.width
-                            font.pointSize: JamiTheme.textFontSize
-                            text: screens[index] ? screens[index] : ""
-                            elide: Text.ElideMiddle
-                            horizontalAlignment: Text.AlignHCenter
-                            color: JamiTheme.textColor
-                        }
-
-                        VideoView {
-                            id: screenPreview
-
-                            anchors.top: screenName.bottom
-                            anchors.topMargin: 10
-                            anchors.horizontalCenter: screenItem.horizontalCenter
-                            height: screenItem.height - 50
-                            width: screenItem.width - 50
-
-                            Component.onDestruction: {
-                                VideoDevices.stopDevice(rendererId)
-                            }
-                            Component.onCompleted: {
-                                if (visible) {
-                                    const rId = AvAdapter.getSharingResource(index)
-                                    if (rId !== "") {
-                                        rendererId = VideoDevices.startDevice(rId)
-                                    }
-                                }
-                            }
-                        }
-
-                        MouseArea {
-                            anchors.fill: screenItem
-                            acceptedButtons: Qt.LeftButton
-
-                            onClicked: {
-                                selectAllScreens = false
-                                if (selectedScreenNumber == -1
-                                        || selectedScreenNumber !== index) {
-                                    selectedScreenNumber = index
-                                }
-                            }
                             }
+                            isSelectAllScreens: false
 
                             Connections {
                                 target: AvAdapter
 
                                 function onScreenCaptured(screenNumber, source) {
-                                if (screenNumber === -1)
+                                    if (screenNumber === -1 && !root.window)
                                         screenShotAll.source = JamiQmlUtils.base64StringTitle + source
                                 }
                             }
                         }
                     }
-
-                Rectangle {
-                    id: screenSelectionRectAll
-
-                    color: JamiTheme.secondaryBackgroundColor
-
-                    width: componentWidthDoubleColumn > componentMinWidth ? componentWidthDoubleColumn : componentWidthSingleColumn
-                    height: 3 * width / 4
-
-                    border.color: selectAllScreens ? JamiTheme.screenSelectionBorderColor : JamiTheme.tabbarBorderColor
-
-                    visible: !root.window && Qt.application.screens.length > 1 && Qt.platform.os.toString() !== "windows"
-
-                    Text {
-                        id: screenNameAll
-
-                        anchors.top: screenSelectionRectAll.top
-                        anchors.topMargin: 10
-                        anchors.horizontalCenter: screenSelectionRectAll.horizontalCenter
-
-                        font.pointSize: JamiTheme.textFontSize
-                        text: JamiStrings.allScreens
-                        color: JamiTheme.textColor
-                    }
-
-                    VideoView {
-                        id: screenShotAll
-
-                        anchors.top: screenNameAll.bottom
-                        anchors.topMargin: 10
-                        anchors.horizontalCenter: screenSelectionRectAll.horizontalCenter
-                        height: screenSelectionRectAll.height - 50
-                        width: screenSelectionRectAll.width - 50
-
-                        Component.onDestruction: {
-                            VideoDevices.stopDevice(rendererId)
-                        }
-                        Component.onCompleted: {
-                            if (visible) {
-                                const rId = AvAdapter.getSharingResource(-1)
-                                if (rId !== "") {
-                                    rendererId = VideoDevices.startDevice(rId)
-                                }
-                            }
-                        }
-                    }
-
-                    MouseArea {
-                        anchors.fill: parent
-                        acceptedButtons: Qt.LeftButton
-
-                        onClicked: {
-                            selectedScreenNumber = -1
-                            selectAllScreens = true
-                        }
-                    }
-                }
-
-                Text {
-                    id: windowsText
-                    width: screenSelectionScrollView.width
-                    height: JamiTheme.preferredFieldHeight
-
-                    font.pointSize: JamiTheme.menuFontSize
-                    font.bold: true
-                    text: JamiStrings.windows
-                    verticalAlignment: Text.AlignBottom
-                    color: JamiTheme.textColor
-                    visible: root.window
-                }
-
-                Repeater {
-                    id: screenInfo2
-
-                    model: screens ? screens.length : 0
-
-                    delegate: Rectangle {
-                        id: screenItem2
-
-                        color: JamiTheme.secondaryBackgroundColor
-
-                        width: componentWidthDoubleColumn > componentMinWidth ? componentWidthDoubleColumn : componentWidthSingleColumn
-                        height: 3 * width / 4
-
-                        border.color: selectedScreenNumber === index ? JamiTheme.screenSelectionBorderColor : JamiTheme.tabbarBorderColor
-                        visible: root.window && JamiStrings.selectScreen !== screens[index] && index >= Qt.application.screens.length
-
-                        Text {
-                            id: screenName2
-
-                            anchors.top: screenItem2.top
-                            anchors.topMargin: 10
-                            anchors.horizontalCenter: screenItem2.horizontalCenter
-                            width: parent.width
-                            font.pointSize: JamiTheme.textFontSize
-                            text: screens[index] ? screens[index] : ""
-                            elide: Text.ElideMiddle
-                            horizontalAlignment: Text.AlignHCenter
-                            color: JamiTheme.textColor
-                        }
-
-                        VideoView {
-                            id: screenPreview2
-
-                            anchors.top: screenName2.bottom
-                            anchors.topMargin: 10
-                            anchors.horizontalCenter: screenItem2.horizontalCenter
-                            anchors.leftMargin: 25
-                            anchors.rightMargin: 25
-                            height: screenItem2.height - 60
-                            width: screenItem2.width - 50
-
-                            Component.onDestruction: {
-                                VideoDevices.stopDevice(rendererId)
-                            }
-                            Component.onCompleted: {
-                                if (visible) {
-                                    const rId = AvAdapter.getSharingResource(-2, AvAdapter.windowsIds[index - Qt.application.screens.length], AvAdapter.windowsNames[index - Qt.application.screens.length])
-                                    if (rId !== "") {
-                                        rendererId = VideoDevices.startDevice(rId)
-                                    }
-                                }
-                            }
-                        }
-
-                        MouseArea {
-                            anchors.fill: screenItem2
-                            acceptedButtons: Qt.LeftButton
-
-                            onClicked: {
-                                selectAllScreens = false
-                                if (selectedScreenNumber == -1
-                                        || selectedScreenNumber !== index) {
-                                    selectedScreenNumber = index
-                                }
-                            }
-                        }
-                    }
-                }
-            }
                 }
             }
 
             RowLayout {
-        anchors.bottom: selectScreenWindowRect.bottom
+                Layout.margins: marginSize
-        anchors.bottomMargin: JamiTheme.preferredMarginSize
+                Layout.preferredWidth: selectScreenWindowLayout.width
-        anchors.horizontalCenter: selectScreenWindowRect.horizontalCenter
+                Layout.preferredHeight: childrenRect.height
-
+                spacing: marginSize
-        width: parent.width
-        height: childrenRect.height
-        spacing: JamiTheme.preferredMarginSize
 
                 MaterialButton {
                     id: selectButton
@@ -356,9 +187,9 @@ Window {
                     Layout.maximumWidth: 200
                     Layout.fillWidth: true
                     Layout.alignment: Qt.AlignHCenter
-            Layout.leftMargin: JamiTheme.preferredMarginSize
+                    Layout.leftMargin: marginSize
 
-            enabled: selectedScreenNumber != -1 || selectAllScreens
+                    enabled: selectedScreenNumber != -2
                     opacity: enabled ? 1.0 : 0.5
 
                     color: JamiTheme.buttonTintedBlack
@@ -373,10 +204,10 @@ Window {
                         if (selectAllScreens)
                             AvAdapter.shareAllScreens()
                         else {
-                    if (selectedScreenNumber < Qt.application.screens.length)
+                            if (!root.window)
                                 AvAdapter.shareEntireScreen(selectedScreenNumber)
                             else {
-                        AvAdapter.shareWindow(AvAdapter.windowsIds[selectedScreenNumber - Qt.application.screens.length], AvAdapter.windowsNames[selectedScreenNumber - Qt.application.screens.length])
+                                AvAdapter.shareWindow(AvAdapter.windowsIds[selectedScreenNumber])
                             }
                         }
                         root.close()
@@ -389,7 +220,7 @@ Window {
                     Layout.maximumWidth: 200
                     Layout.fillWidth: true
                     Layout.alignment: Qt.AlignHCenter
-            Layout.rightMargin: JamiTheme.preferredMarginSize
+                    Layout.rightMargin: marginSize
 
                     color: JamiTheme.buttonTintedBlack
                     hoveredColor: JamiTheme.buttonTintedBlackHovered
@@ -402,4 +233,6 @@ Window {
                     onClicked: root.close()
                 }
             }
+        }
+    }
 }