Fixed kolabnow account setup page.

The account plugin supplies the configuration UI, the application
supplies the scaffolding. That way we ensure the application doens't
contain any account specific code and account configurations are free to
offer specialized UI's that work best for them.
We're not currently using a standardized controller, but if we did those
controllers would have to live with the plugin, not the framework or the
components.

1 files changed, 52 insertions, 70 deletions

diff --git a/accounts/kolabnow/package/contents/ui/KolabnowAccountSettings.qml b/accounts/kolabnow/package/contents/ui/KolabnowAccountSettings.qml
index 753762b7..46d197fa 100644
--- a/accounts/kolabnow/package/contents/ui/KolabnowAccountSettings.qml
+++ b/accounts/kolabnow/package/contents/ui/KolabnowAccountSettings.qml
@@ -1,5 +1,6 @@
 /*
   Copyright (C) 2016 Michael Bohlender, <michael.bohlender@kdemail.net>
+  Copyright (C) 2017 Christian Mollekopf, <mollekopf@kolabsys.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
@@ -17,7 +18,7 @@
 */
 
 import QtQuick 2.4
-import QtQuick.Controls 1.4
+import QtQuick.Controls 1.4 as Controls
 import QtQuick.Layouts 1.1
 
 import org.kde.kirigami 1.0 as Kirigami
@@ -25,127 +26,108 @@ import org.kde.kirigami 1.0 as Kirigami
 import org.kube.framework.settings 1.0 as KubeSettings
 import org.kube.accounts.kolabnow 1.0 as KolabnowAccount
 
-
 Item {
 
     property string accountId
+    property string heading: "Connect your KolabNOW account"
+    property string subheadline: "To let Kube access your account, fill in email address, username, password and give the account a title that will be displayed inside Kube."
 
     KolabnowAccount.KolabnowSettings {
-             id: kolabnowSettings
-             accountIdentifier: accountId
+        id: kolabnowSettings
+        accountIdentifier: accountId
+        accountType: "kolabnow"
+    }
+
+    function save(){
+        kolabnowSettings.save()
     }
 
-    anchors.fill: parent
+    function remove(){
+        kolabnowSettings.remove()
+    }
 
     Item {
         anchors {
             fill: parent
-            margins: Kirigami.Units.largeSpacing * 2
-        }
-
-        Kirigami.Heading {
-            id: heading
-            text: "Connect your KOLABNOW account"
-
-            color: Kirigami.Theme.highlightColor
-        }
-
-        Label {
-            id: subHeadline
-
-            anchors {
-                left: heading.left
-                top: heading.bottom
-            }
-
-            width: parent.width
-
-            text: "To let Kube access your KOLABNOW account, fill in email address and password and give the account a title that will be displayed inside Kube."
-            //TODO wait for kirgami theme disabled text color
-            opacity: 0.5
-            wrapMode: Text.Wrap
         }
 
-
         GridLayout {
             anchors {
-                top:subHeadline.bottom
-                bottom: parent.bottom
-                left: parent.left
-                right: parent.right
-                topMargin: Kirigami.Units.largeSpacing
-                bottomMargin: Kirigami.Units.largeSpacing * 2
+                fill: parent
             }
-
             columns: 2
             columnSpacing: Kirigami.Units.largeSpacing
             rowSpacing: Kirigami.Units.largeSpacing
 
-            Kirigami.Label {
+            Controls.Label {
                 text: "Title of Account"
                 Layout.alignment: Qt.AlignRight
             }
-            TextField {
+            Controls.TextField {
                 Layout.fillWidth: true
-
+                placeholderText: "E.g. \"Work\", \"Home\" that will be displayed in Kube as name"
                 text: kolabnowSettings.accountName
-                placeholderText: "KOLABNOW"
                 onTextChanged: {
                     kolabnowSettings.accountName = text
                 }
             }
 
-            Kirigami.Label {
-                text: "Email address"
+            Controls.Label {
+                text: "Name"
                 Layout.alignment: Qt.AlignRight
             }
-            TextField {
+            Controls.TextField {
                 Layout.fillWidth: true
-
-                text: kolabnowSettings.emailAddress
+                placeholderText: "Your name"
+                text: kolabnowSettings.userName
                 onTextChanged: {
-                    kolabnowSettings.emailAddress = text
+                    kolabnowSettings.userName = text
                 }
             }
 
-            Kirigami.Label {
-                text: "Password"
+            Controls.Label {
+                text: "Email address"
                 Layout.alignment: Qt.AlignRight
             }
-            TextField {
+            Controls.TextField {
                 Layout.fillWidth: true
 
-               text: kolabnowSettings.imapPassword
-               onTextChanged: {
-                   kolabnowSettings.imapPassword = text
-                   kolabnowSettings.smtpPassword = text
+                text: kolabnowSettings.emailAddress
+                onTextChanged: {
+                    kolabnowSettings.emailAddress = text
                 }
+                placeholderText: "Your email address"
             }
 
-            Label {
-                text: ""
+            Controls.Label {
+                text: "Password"
+                Layout.alignment: Qt.AlignRight
             }
-            Item {
+            RowLayout {
                 Layout.fillWidth: true
 
-                Button {
-                    text: "Delete"
+                Controls.TextField {
+                    id: pwField
+                    Layout.fillWidth: true
 
-                    onClicked: {
-                        kolabnowSettings.remove()
-                        root.closeDialog()
+                    placeholderText: "Password of your email account"
+                    text: kolabnowSettings.imapPassword
+                    onTextChanged: {
+                        kolabnowSettings.imapPassword = text
+                        kolabnowSettings.smtpPassword = text
                     }
-                }
 
-                Button {
-                    anchors.right: parent.right
-
-                    text: "Save"
+                    echoMode: TextInput.Password
+                }
 
+                Controls.CheckBox {
+                    text: "Show Password"
                     onClicked: {
-                        focus: true
-                        kolabnowSettings.save()
-                        root.closeDialog()
+                        if(pwField.echoMode == TextInput.Password) {
+                            pwField.echoMode = TextInput.Normal;
+                        } else {
+                            pwField.echoMode = TextInput.Password;
+                        }
                     }
                 }
             }