chris/harbour-sailfin
chris/harbour-sailfin
1
0
Fork 0
mirror of https://github.com/HenkKalkwater/harbour-sailfin.git synced 2024-05-18 12:02:41 +00:00
Code Issues Releases Wiki Activity

Login dialog UX improvements

Browse source 
* Show an error when credentials are incorrect
* Fix enter key not logging in
* Hide login message when none is set
This commit is contained in:
Chris Josten 2020-09-27 00:00:42 +02:00
parent 67c8621d6f
commit 0357227134
1 changed files with 31 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
qml/pages/setup/LoginDialog.qml
View file

@ -10,8 +10,11 @@ import "../../components"
*/ */
Dialog { Dialog {
id: loginDialog
property string loginMessage property string loginMessage
property Page firstPage property Page firstPage
property string error
allowedOrientations: Orientation.All allowedOrientations: Orientation.All
@ -36,6 +39,7 @@ Dialog {
} }
} }
onAuthenticationError: { onAuthenticationError: {
loginDialog.error = qsTr("Invalid username or password")
pageStack.completeAnimation() pageStack.completeAnimation()
pageStack.pop() pageStack.pop()
} }
@ -52,6 +56,7 @@ Dialog {
id: dialogHeader id: dialogHeader
anchors.left: parent.left anchors.left: parent.left
anchors.right: parent.right anchors.right: parent.right
//: Dialog action
acceptText: qsTr("Login"); acceptText: qsTr("Login");
} }
SilicaFlickable { SilicaFlickable {
@ -85,14 +90,17 @@ Dialog {
} }
SectionHeader { SectionHeader {
//: Section header for entering username and password
text: qsTr("Credentials") text: qsTr("Credentials")
} }
TextField { TextField {
id: username id: username
width: parent.width width: parent.width
//: Label placeholder for username field
placeholderText: qsTr("Username") placeholderText: qsTr("Username")
label: qsTr("Username") label: placeholderText
errorHighlight: error
EnterKey.iconSource: "image://theme/icon-m-enter-next" EnterKey.iconSource: "image://theme/icon-m-enter-next"
EnterKey.onClicked: password.focus = true EnterKey.onClicked: password.focus = true
} }
@ -101,15 +109,32 @@ Dialog {
id: password id: password
width: parent.width width: parent.width
//: Label placeholder for password field
placeholderText: qsTr("Password") placeholderText: qsTr("Password")
label: qsTr("password") label: placeholderText
echoMode: TextInput.Password echoMode: TextInput.Password
errorHighlight: error
EnterKey.iconSource: "image://theme/icon-m-enter-accept" EnterKey.iconSource: "image://theme/icon-m-enter-accept"
EnterKey.onClicked: login() EnterKey.onClicked: accept()
} }
Label {
anchors {
left: parent.left
leftMargin: Theme.horizontalPageMargin
right: parent.right
rightMargin: Theme.horizontalPageMargin
}
text: error
color: Theme.errorColor
visible: error
}
SectionHeader { SectionHeader {
//: Message shown on login, configured by the server owner. Some form of a MOTD
text: qsTr("Login message") text: qsTr("Login message")
visible: loginMessage
} }
Label { Label {
anchors { anchors {
@ -118,15 +143,12 @@ Dialog {
leftMargin: Theme.horizontalPageMargin leftMargin: Theme.horizontalPageMargin
rightMargin: Theme.horizontalPageMargin rightMargin: Theme.horizontalPageMargin
} }
text: loginMessage visible: loginMessage
text: loginMessage
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
color: Theme.highlightColor color: Theme.highlightColor
} }
} }
} }
canAccept: username.text.length > 0 canAccept: username.text
/*onAccepted: {
pageStack.replace(Qt.resolvedUrl("MainPage.qml"))
}*/
} }