QML UI: rework single credential page to two pages

This commit tries to implement most of issue #515. It reworks the
one credential page, which its dynamic PIN part, into two pages.
Main driver of selecting one of the two pages is the showPin
boolean. Page 1 contains the email/passwd field (and the
option to use a no cloud setup). Page 2 only contains the PIN
part (and the option to cancel the process).

The Kirigami central button does not seem very handy here. We
need, for example, a cancel, sign-in and register, only register,
etc. buttons, which are not easy to handle in specific icons.
Therefore, normal pushbuttons are chosen to deal with user
interaction, and the Kirigami button is removed from these
pages.

Signed-off-by: Jan Mulder <jlmulder@xs4all.nl>
This commit is contained in:
Jan Mulder 2017-09-27 19:11:23 +02:00 committed by Dirk Hohndel
parent 81eb8466b2
commit dbed88bd81
4 changed files with 93 additions and 22 deletions

View file

@ -53,6 +53,7 @@ Item {
Kirigami.Label { Kirigami.Label {
text: qsTr("Email") text: qsTr("Email")
visible: !rootItem.showPin
font.pointSize: subsurfaceTheme.smallPointSize font.pointSize: subsurfaceTheme.smallPointSize
color: subsurfaceTheme.secondaryTextColor color: subsurfaceTheme.secondaryTextColor
} }
@ -60,16 +61,15 @@ Item {
TextField { TextField {
id: login id: login
text: manager.cloudUserName text: manager.cloudUserName
visible: !rootItem.showPin
Layout.fillWidth: true Layout.fillWidth: true
inputMethodHints: Qt.ImhEmailCharactersOnly | inputMethodHints: Qt.ImhEmailCharactersOnly |
Qt.ImhNoAutoUppercase Qt.ImhNoAutoUppercase
onEditingFinished: {
saveCredentials()
}
} }
Kirigami.Label { Kirigami.Label {
text: qsTr("Password") text: qsTr("Password")
visible: !rootItem.showPin
font.pointSize: subsurfaceTheme.smallPointSize font.pointSize: subsurfaceTheme.smallPointSize
color: subsurfaceTheme.secondaryTextColor color: subsurfaceTheme.secondaryTextColor
} }
@ -77,14 +77,12 @@ Item {
TextField { TextField {
id: password id: password
text: manager.cloudPassword text: manager.cloudPassword
visible: !rootItem.showPin
echoMode: TextInput.PasswordEchoOnEdit echoMode: TextInput.PasswordEchoOnEdit
inputMethodHints: Qt.ImhSensitiveData | inputMethodHints: Qt.ImhSensitiveData |
Qt.ImhHiddenText | Qt.ImhHiddenText |
Qt.ImhNoAutoUppercase Qt.ImhNoAutoUppercase
Layout.fillWidth: true Layout.fillWidth: true
onEditingFinished: {
saveCredentials()
}
} }
Kirigami.Label { Kirigami.Label {
@ -97,5 +95,61 @@ Item {
Layout.fillWidth: true Layout.fillWidth: true
visible: rootItem.showPin visible: rootItem.showPin
} }
RowLayout {
anchors.left: parent.left
anchors.right: parent.right
anchors.margins: Kirigami.Units.smallSpacing
spacing: Kirigami.Units.smallSpacing
visible: rootItem.showPin
SsrfButton {
id:registerpin
text: qsTr("Register")
onClicked: {
saveCredentials()
}
}
Kirigami.Label {
text: "" // Spacer between 2 button groups
Layout.fillWidth: true
}
SsrfButton {
id: cancelpin
text: qsTr("Cancel")
onClicked: {
manager.cancelCredentialsPinSetup()
rootItem.returnTopPage()
}
}
}
RowLayout {
anchors.left: parent.left
anchors.right: parent.right
anchors.margins: Kirigami.Units.smallSpacing
spacing: Kirigami.Units.smallSpacing
visible: !rootItem.showPin
SsrfButton {
id:signin_register_normal
text: qsTr("Sign-in or Register")
onClicked: {
saveCredentials()
}
}
Kirigami.Label {
text: "" // Spacer between 2 button groups
Layout.fillWidth: true
}
SsrfButton {
id: toNoCloudMode
text: qsTr("No cloud mode")
onClicked: {
manager.syncToCloud = false
manager.credentialStatus = QMLManager.CS_NOCLOUD
manager.saveCloudCredentials()
}
}
}
} }
} }

View file

@ -271,8 +271,8 @@ Kirigami.ScrollablePage {
Behavior on opacity { NumberAnimation { duration: Kirigami.Units.shortDuration } } Behavior on opacity { NumberAnimation { duration: Kirigami.Units.shortDuration } }
function setupActions() { function setupActions() {
if (visible) { if (visible) {
page.actions.main = page.saveAction page.actions.main = null
page.actions.right = page.offlineAction page.actions.right = null
page.title = qsTr("Cloud credentials") page.title = qsTr("Cloud credentials")
} else if(manager.credentialStatus === QMLManager.CS_VERIFIED || manager.credentialStatus === QMLManager.CS_NOCLOUD) { } else if(manager.credentialStatus === QMLManager.CS_VERIFIED || manager.credentialStatus === QMLManager.CS_NOCLOUD) {
page.actions.main = page.downloadFromDCAction page.actions.main = page.downloadFromDCAction
@ -358,6 +358,7 @@ Kirigami.ScrollablePage {
onTriggered: { onTriggered: {
manager.syncToCloud = false manager.syncToCloud = false
manager.credentialStatus = QMLManager.CS_NOCLOUD manager.credentialStatus = QMLManager.CS_NOCLOUD
manager.saveCloudCredentials()
} }
} }

View file

@ -11,18 +11,12 @@ Kirigami.ScrollablePage {
function saveCredentials() { cloudCredentials.saveCredentials() } function saveCredentials() { cloudCredentials.saveCredentials() }
ColumnLayout { ColumnLayout {
Kirigami.Label { CloudCredentials {
id: explanationText id: cloudCredentials
Layout.fillWidth: true Layout.fillWidth: true
Layout.margins: Kirigami.Units.gridUnit Layout.margins: Kirigami.Units.gridUnit
Layout.topMargin: Kirigami.Units.gridUnit * 3 Layout.topMargin: 0
text: qsTr("To use Subsurface-mobile with Subsurface cloud storage, please enter your cloud credentials.\n") + property int headingLevel: 3
qsTr("If this is the first time you use Subsurface cloud storage, enter a valid email (all lower case) " +
"and a password of your choice (letters and numbers). " +
"The server will send a PIN to the email address provided that you will have to enter here.\n\n") +
qsTr("To use Subsurface-mobile only with local data on this device, tap " +
"on the no cloud icon below.")
wrapMode: Text.WordWrap
} }
Kirigami.Label { Kirigami.Label {
id: messageArea id: messageArea
@ -32,12 +26,32 @@ Kirigami.ScrollablePage {
text: manager.startPageText text: manager.startPageText
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
} }
CloudCredentials { Kirigami.Label {
id: cloudCredentials id: explanationTextBasic
visible: !showPin
Layout.fillWidth: true Layout.fillWidth: true
Layout.margins: Kirigami.Units.gridUnit Layout.margins: Kirigami.Units.gridUnit
Layout.topMargin: 0 Layout.topMargin: Kirigami.Units.gridUnit * 3
property int headingLevel: 3 text: qsTr("To use Subsurface-mobile with Subsurface cloud storage, please enter your cloud credentials.\n\n") +
qsTr("If this is the first time you use Subsurface cloud storage, enter a valid email (all lower case) " +
"and a password of your choice (letters and numbers).\n\n") +
qsTr("To use Subsurface-mobile only with local data on this device, select " +
"the no cloud buttton above.")
wrapMode: Text.WordWrap
}
Kirigami.Label {
id: explanationTextPin
visible: showPin
Layout.fillWidth: true
Layout.margins: Kirigami.Units.gridUnit
Layout.topMargin: Kirigami.Units.gridUnit * 3
text: qsTr("Thank you for registering with Subsurface. We sent ") + manager.cloudUserName +
qsTr(" a PIN code to complete the registration. ") +
qsTr("If you do not receive an email from us within 15 minutes, please check " +
"the correct spelling of your email address and your spam box first.\n\n" +
"In case of any problems regarding cloud account setup, please contact us " +
"at our user forum \(https://subsurface-divelog.org/user-forum/\).\n\n")
wrapMode: Text.WordWrap
} }
Item { width: Kirigami.Units.gridUnit; height: 3 * Kirigami.Units.gridUnit} Item { width: Kirigami.Units.gridUnit; height: 3 * Kirigami.Units.gridUnit}
} }

View file

@ -267,6 +267,7 @@ void QMLManager::finishSetup()
openLocalThenRemote(url); openLocalThenRemote(url);
} else if (!same_string(existing_filename, "") && credentialStatus() != CS_UNKNOWN) { } else if (!same_string(existing_filename, "") && credentialStatus() != CS_UNKNOWN) {
setCredentialStatus(CS_NOCLOUD); setCredentialStatus(CS_NOCLOUD);
saveCloudCredentials();
appendTextToLog(tr("working in no-cloud mode")); appendTextToLog(tr("working in no-cloud mode"));
int error = parse_file(existing_filename); int error = parse_file(existing_filename);
if (error) { if (error) {
@ -337,6 +338,7 @@ void QMLManager::saveCloudCredentials()
s.beginGroup("CloudStorage"); s.beginGroup("CloudStorage");
s.setValue("email", cloudUser); s.setValue("email", cloudUser);
s.setValue("password", cloudPwd); s.setValue("password", cloudPwd);
s.setValue("cloud_verification_status", credentialStatus());
s.sync(); s.sync();
if (!same_string(prefs.cloud_storage_email, qPrintable(cloudUser))) { if (!same_string(prefs.cloud_storage_email, qPrintable(cloudUser))) {
free(prefs.cloud_storage_email); free(prefs.cloud_storage_email);