Allow explicit selection of SSO method

fixes #975

2 files changed, 51 insertions, 27 deletions

diff --git a/resources/qml/components/FlatButton.qml b/resources/qml/components/FlatButton.qml
index 72184d28..2c9ea061 100644
--- a/resources/qml/components/FlatButton.qml
+++ b/resources/qml/components/FlatButton.qml
@@ -6,6 +6,7 @@
 import QtGraphicalEffects 1.12
 import QtQuick 2.9
 import QtQuick.Controls 2.5
+import QtQuick.Layouts 1.2
 import im.nheko 1.0
 
 // FIXME(Nico): Don't use hardcoded colors.
@@ -16,6 +17,8 @@ Button {
     implicitWidth: Math.ceil(control.contentItem.implicitWidth + control.contentItem.implicitHeight)
     hoverEnabled: true
 
+    property string iconImage: ""
+
     DropShadow {
         anchors.fill: control.background
         horizontalOffset: 3
@@ -27,16 +30,30 @@ Button {
         source: control.background
     }
 
-    contentItem: Text {
-        text: control.text
-        //font: control.font
-        font.capitalization: Font.AllUppercase
-        font.pointSize: Math.ceil(fontMetrics.font.pointSize * 1.5)
-        //font.capitalization: Font.AllUppercase
-        color: Nheko.colors.light
-        horizontalAlignment: Text.AlignHCenter
-        verticalAlignment: Text.AlignVCenter
-        elide: Text.ElideRight
+    contentItem: RowLayout {
+        spacing: 0
+        anchors.centerIn: parent
+        Image {
+            Layout.leftMargin: Nheko.paddingMedium
+            Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
+            Layout.preferredHeight: fontMetrics.font.pixelSize * 1.5
+            Layout.preferredWidth:  fontMetrics.font.pixelSize * 1.5
+            visible: !!iconImage
+            source: iconImage
+        }
+
+        Text {
+            Layout.alignment: Qt.AlignHCenter
+            text: control.text
+            //font: control.font
+            font.capitalization: Font.AllUppercase
+            font.pointSize: Math.ceil(fontMetrics.font.pointSize * 1.5)
+            //font.capitalization: Font.AllUppercase
+            color: Nheko.colors.light
+            horizontalAlignment: Text.AlignHCenter
+            verticalAlignment: Text.AlignVCenter
+            elide: Text.ElideRight
+        }
     }
 
     background: Rectangle {
diff --git a/resources/qml/pages/LoginPage.qml b/resources/qml/pages/LoginPage.qml
index 4d3a52b3..87234a22 100644
--- a/resources/qml/pages/LoginPage.qml
+++ b/resources/qml/pages/LoginPage.qml
@@ -61,7 +61,7 @@ Item {
                     onEditingFinished: login.mxid = text
 
                     ToolTip.text: qsTr("Your login name. A mxid should start with @ followed by the user id. After the user id you need to include your server name after a :.\nYou can also put your homeserver address there, if your server doesn't support .well-known lookup.\nExample: @user:server.my\nIf Nheko fails to discover your homeserver, it will show you a field to enter the server manually.")
-                    Keys.forwardTo: [pwBtn, ssoBtn]
+                    Keys.forwardTo: [pwBtn, ssoRepeater]
                 }
 
 
@@ -89,7 +89,7 @@ Item {
                 echoMode: TextInput.Password
                 ToolTip.text: qsTr("Your password.")
                 visible: login.passwordSupported
-                Keys.forwardTo: [pwBtn, ssoBtn]
+                Keys.forwardTo: [pwBtn, ssoRepeater]
             }
 
             MatrixTextField {
@@ -98,7 +98,7 @@ Item {
                 label: qsTr("Device name")
                 placeholderText: login.initialDeviceName()
                 ToolTip.text: qsTr("A name for this device, which will be shown to others, when verifying your devices. If none is provided a default is used.")
-                Keys.forwardTo: [pwBtn, ssoBtn]
+                Keys.forwardTo: [pwBtn, ssoRepeater]
             }
 
             MatrixTextField {
@@ -112,7 +112,7 @@ Item {
                 text: login.homeserver
                 onEditingFinished: login.homeserver = text
                 ToolTip.text: qsTr("The address that can be used to contact you homeservers client API.\nExample: https://server.my:8787")
-                Keys.forwardTo: [pwBtn, ssoBtn]
+                Keys.forwardTo: [pwBtn, ssoRepeater]
             }
 
             Item {
@@ -150,21 +150,28 @@ Item {
                 Keys.onReturnPressed: pwBtn.pwLogin()
                 Keys.enabled: pwBtn.enabled && login.passwordSupported
             }
-            FlatButton {
-                id: ssoBtn
-                visible: login.ssoSupported
-                enabled: login.homeserverValid && matrixIdLabel.text == login.mxid && login.homeserver == hsLabel.text
-                Layout.alignment: Qt.AlignHCenter
-                text: qsTr("SSO LOGIN")
-                function ssoLogin() {
-                    login.onLoginButtonClicked(Login.SSO, matrixIdLabel.text, passwordLabel.text, deviceNameLabel.text)
+
+            Repeater {
+                id: ssoRepeater
+
+                model: login.identityProviders
+
+                delegate: FlatButton {
+                    id: ssoBtn
+                    visible: login.ssoSupported
+                    enabled: login.homeserverValid && matrixIdLabel.text == login.mxid && login.homeserver == hsLabel.text
+                    Layout.alignment: Qt.AlignHCenter
+                    text: modelData.name
+                    iconImage: modelData.avatarUrl.replace("mxc://", "image://MxcImage/")
+                    function ssoLogin() {
+                        login.onLoginButtonClicked(Login.SSO, matrixIdLabel.text, modelData.id, deviceNameLabel.text)
+                    }
+                    onClicked: ssoBtn.ssoLogin()
+                    Keys.onEnterPressed: ssoBtn.ssoLogin()
+                    Keys.onReturnPressed: ssoBtn.ssoLogin()
+                    Keys.enabled: ssoBtn.enabled && !login.passwordSupported
                 }
-                onClicked: ssoBtn.ssoLogin()
-                Keys.onEnterPressed: ssoBtn.ssoLogin()
-                Keys.onReturnPressed: ssoBtn.ssoLogin()
-                Keys.enabled: ssoBtn.enabled && !login.passwordSupported
             }
-
         }
     }