mirror of
https://github.com/HenkKalkwater/harbour-sailfin.git
synced 2024-11-22 01:05:17 +00:00
Login dialog UX improvements
* 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:
parent
67c8621d6f
commit
0357227134
|
@ -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"))
|
|
||||||
}*/
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue