wizardview: redesign
Change-Id: If0a3d896b35385f24c9d04b67b12146febfff7c2
diff --git a/src/wizardview/components/BackupKeyPage.qml b/src/wizardview/components/BackupKeyPage.qml
index 59ec3ef..fdfddfb 100644
--- a/src/wizardview/components/BackupKeyPage.qml
+++ b/src/wizardview/components/BackupKeyPage.qml
@@ -23,10 +23,13 @@
import "../../constant"
import "../../commoncomponents"
+import "../../settingsview/components"
-ColumnLayout {
+Rectangle {
+ id: root
+
signal neverShowAgainBoxClicked(bool isChecked)
- signal skip_Btn_Clicked
+ signal leavePage
signal export_Btn_FileDialogAccepted(bool accepted, string folderDir)
/*
@@ -58,143 +61,133 @@
}
}
- Layout.fillWidth: true
- Layout.fillHeight: true
+ anchors.fill: parent
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ color: JamiTheme.backgroundColor
- /*
- * Main layout for BackupKeyPage which consists of the buttons and "never show again" check box
- */
ColumnLayout {
- Layout.alignment: Qt.AlignCenter
- Layout.maximumWidth: 366
-
spacing: 12
- Label {
- id: backupKeysLabel
- Layout.alignment: Qt.AlignHCenter
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: backupBtn.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- Layout.maximumWidth: 366
- Layout.maximumHeight: 21
- Layout.preferredWidth: 366
- Layout.preferredHeight: 21
+ RowLayout {
+ spacing: 12
+ height: 48
- text: qsTr("Backup your account")
- font.pointSize: 13
- font.kerning: true
+ anchors.left: backupBtn.left
+ anchors.right: backupBtn.right
+
+ Label {
+ text: qsTr("Backup your account!")
+
+ font.pointSize: JamiTheme.textFontSize + 3
+ }
+
+ Label {
+ text: qsTr("Recommended")
+ color: "white"
+ padding: 8
+ anchors.right: parent.right
+
+ background: Rectangle {
+ color: "#aed581"
+ radius: 24
+ anchors.fill: parent
+ }
+ }
}
+
Label {
- id: backupInfoLabel1
- Layout.maximumWidth: 366
- Layout.maximumHeight: 57
- Layout.preferredWidth: 366
- Layout.preferredHeight: 57
+ text: qsTr("This account only exists on this device. If you lost your device or uninstall the application, your account will be deleted. You can backup your account now or later.")
+ wrapMode: Text.Wrap
+ anchors.left: backupBtn.left
+ anchors.right: backupBtn.right
- text: qsTr("This account only exists on this device. If you lost your device or uninstall the application,your account will be deleted. You can backup your account now or later.")
- wrapMode: Text.WordWrap
- horizontalAlignment: Text.AlignJustify
- verticalAlignment: Text.AlignVCenter
+ font.pointSize: JamiTheme.textFontSize
}
- CheckBox {
- id: neverShowAgainBox
- checked: false
- Layout.maximumWidth: 366
- Layout.maximumHeight: 19
- Layout.preferredWidth: 366
- Layout.preferredHeight: 19
+ RowLayout {
+ spacing: 12
+ height: 48
- indicator.implicitWidth: 10
- indicator.implicitHeight:10
+ anchors.right: backupBtn.right
+ anchors.left: backupBtn.left
- text: qsTr("Never show me this again")
- font.pointSize: 8
+ Label {
+ text: qsTr("Never show me this again")
+
+ font.pointSize: JamiTheme.textFontSize
+ }
+
+ Switch {
+ id: passwordSwitch
+ Layout.alignment: Qt.AlignRight
+
+ onToggled: {
+ neverShowAgainBoxClicked(checked)
+ }
+ }
+ }
+
+ MaterialButton {
+ id: backupBtn
+ text: qsTr("BACKUP ACCOUNT")
+ color: JamiTheme.buttonTintedGrey
onClicked: {
- neverShowAgainBoxClicked(checked)
+ exportBtn_Dialog.open()
+ leavePage()
}
}
- RowLayout {
- Layout.fillWidth: true
- Layout.maximumHeight: 20
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillHeight: true
- Layout.maximumWidth: 40
- Layout.minimumWidth: 10
- }
+ MaterialButton {
+ text: qsTr("SKIP")
+ color: JamiTheme.buttonTintedGrey
+ outlined: true
- HoverableGradientButton {
- id: exportBtn
-
- Layout.alignment: Qt.AlignVCenter
- Layout.minimumWidth: 85
- Layout.preferredWidth: 85
- Layout.maximumWidth: 85
-
- Layout.minimumHeight: 30
- Layout.preferredHeight: 30
- Layout.maximumHeight: 30
-
- text: qsTr("Export")
- font.kerning: true
- fontPointSize: 10
- radius: height / 2
- backgroundColor: JamiTheme.releaseColor
-
- onClicked: {
- exportBtn_Dialog.open()
- }
- }
-
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
-
- HoverableGradientButton {
- id: skipBtn
-
- Layout.alignment: Qt.AlignVCenter
- Layout.minimumWidth: 85
- Layout.preferredWidth: 85
- Layout.maximumWidth: 85
-
- Layout.minimumHeight: 30
- Layout.preferredHeight: 30
- Layout.maximumHeight: 30
-
- text: qsTr("Skip")
- fontPointSize: 10
- font.kerning: true
- radius: height / 2
- backgroundColor: JamiTheme.releaseColor
-
- onClicked: {
- skip_Btn_Clicked()
- }
- }
-
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillHeight: true
- Layout.maximumWidth: 40
- Layout.minimumWidth: 10
+ onClicked: {
+ leavePage()
}
}
}
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Close")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
}
}
diff --git a/src/wizardview/components/CollapsiblePasswordWidget.qml b/src/wizardview/components/CollapsiblePasswordWidget.qml
index 82af6e2..4f0feb1 100644
--- a/src/wizardview/components/CollapsiblePasswordWidget.qml
+++ b/src/wizardview/components/CollapsiblePasswordWidget.qml
@@ -51,7 +51,7 @@
Layout.leftMargin: 32
- InfoLineEdit {
+ MaterialLineEdit {
id: passwordEdit
visible: visibleCollapsble
@@ -83,7 +83,7 @@
Layout.minimumHeight: 30
}
- InfoLineEdit {
+ MaterialLineEdit {
id: confirmPasswordEdit
visible: visibleCollapsble
diff --git a/src/wizardview/components/ConnectToAccountManagerPage.qml b/src/wizardview/components/ConnectToAccountManagerPage.qml
index c41dcef..4ecfa09 100644
--- a/src/wizardview/components/ConnectToAccountManagerPage.qml
+++ b/src/wizardview/components/ConnectToAccountManagerPage.qml
@@ -23,10 +23,13 @@
import "../../constant"
import "../../commoncomponents"
-ColumnLayout {
+Rectangle {
+ id: root
+
property alias text_usernameManagerEditAlias: usernameManagerEdit.text
property alias text_passwordManagerEditAlias: passwordManagerEdit.text
property alias text_accountManagerEditAlias: accountManagerEdit.text
+ property string errorText: ""
function initializeOnShowUp() {
clearAllTextFields()
@@ -36,67 +39,161 @@
usernameManagerEdit.clear()
passwordManagerEdit.clear()
accountManagerEdit.clear()
+ errorText = ""
}
- Layout.fillWidth: true
- Layout.fillHeight: true
+ anchors.fill: parent
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.preferredHeight: 40
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ color: JamiTheme.backgroundColor
+
+ signal leavePage
+ signal createAccount
ColumnLayout {
- Layout.alignment: Qt.AlignCenter
- Layout.fillWidth: true
-
spacing: 12
- Label {
- id: signInLabel
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: parent.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- Layout.alignment: Qt.AlignHCenter
- Layout.minimumWidth: 256
- Layout.preferredHeight: 21
- text: qsTr("Sign in")
- font.pointSize: 13
- font.kerning: true
+ RowLayout {
+ spacing: 12
+ height: 48
+
+ Layout.fillWidth: true
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
+
+ Label {
+ text: qsTr("Enter URL of management server")
+ }
+
+ Label {
+ text: qsTr("Required")
+ color: "#ff1f62"
+ padding: 8
+ anchors.right: parent.right
+
+ background: Rectangle {
+ color: "#fee4e9"
+ radius: 24
+ anchors.fill: parent
+ }
+ }
}
- InfoLineEdit {
- id: usernameManagerEdit
+ MaterialLineEdit {
+ id: accountManagerEdit
- Layout.alignment: Qt.AlignHCenter
+ selectByMouse: true
+ placeholderText: qsTr("Jami management server URL")
+ font.pointSize: 10
+ font.kerning: true
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
+ }
+
+ Text {
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
+
+ text: qsTr("Enter your organization credentials")
+ wrapMode: Text.Wrap
+ }
+
+ MaterialLineEdit {
+ id: usernameManagerEdit
selectByMouse: true
placeholderText: qsTr("Username")
+ font.pointSize: 10
+ font.kerning: true
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
}
- InfoLineEdit {
+ MaterialLineEdit {
id: passwordManagerEdit
- Layout.alignment: Qt.AlignHCenter
selectByMouse: true
- echoMode: TextInput.Password
placeholderText: qsTr("Password")
+ font.pointSize: 10
+ font.kerning: true
+
+ echoMode: TextInput.Password
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
}
- InfoLineEdit {
- id: accountManagerEdit
+ MaterialButton {
+ id: connectBtn
+ text: qsTr("CONNECT")
+ enabled: accountManagerEdit.text.length !== 0
+ && usernameManagerEdit.text.length !== 0
+ && passwordManagerEdit.text.length !== 0
+ color: enabled? JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
+ onClicked: {
+ errorText = ""
+ createAccount()
+ }
+ }
+
+ Label {
+ text: errorText
+
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
Layout.alignment: Qt.AlignHCenter
- selectByMouse: true
- placeholderText: qsTr("Account Manager")
+ font.pointSize: JamiTheme.textFontSize
+ color: "red"
+
+ height: 32
}
}
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.preferredHeight: 40
- Layout.fillWidth: true
- Layout.fillHeight: true
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Return to welcome page")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
}
}
diff --git a/src/wizardview/components/CreateAccountPage.qml b/src/wizardview/components/CreateAccountPage.qml
index f59b2c6..f2e129c 100644
--- a/src/wizardview/components/CreateAccountPage.qml
+++ b/src/wizardview/components/CreateAccountPage.qml
@@ -19,307 +19,341 @@
import QtQuick 2.14
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.14
+import Qt.labs.platform 1.1
import "../"
import "../../constant"
import "../../commoncomponents"
+import "../../settingsview/components"
-ColumnLayout {
- property alias text_fullNameEditAlias: fullNameEdit.text
+Rectangle {
+ id: root
+
property alias text_usernameEditAlias: usernameEdit.text
-
property int nameRegistrationUIState: WizardView.BLANK
+ property alias text_passwordEditAlias: passwordEdit.text
- property alias checkState_signUpCheckboxAlias: signUpCheckbox.checked
- property alias isToSetPassword_checkState_choosePasswordCheckBox: choosePasswordCheckBox.checked
-
- // photo booth alias
- property alias boothImgBase64: setAvatarWidget.imgBase64
-
- // collapse password widget property aliases
- property alias text_passwordEditAlias: collapsiblePasswordWidget.text_passwordEditAlias
- property alias text_confirmPasswordEditAlias: collapsiblePasswordWidget.text_confirmPasswordEditAlias
- property alias displayState_passwordStatusLabelAlias: collapsiblePasswordWidget.state_passwordStatusLabelAlias
-
- signal validateWizardProgressionCreateAccountPage
+ signal createAccount
+ signal leavePage
function initializeOnShowUp() {
+ createAccountStack.currentIndex = 0
clearAllTextFields()
-
- signUpCheckbox.checked = true
- choosePasswordCheckBox.checked = false
- usernameEdit.enabled = true
- fullNameEdit.enabled = true
+ passwordSwitch.checked = false
}
function clearAllTextFields() {
usernameEdit.clear()
- fullNameEdit.clear()
-
- collapsiblePasswordWidget.clearAllTextFields()
+ passwordEdit.clear()
+ passwordConfirmEdit.clear()
}
- function setCollapsiblePasswordWidgetVisibility(visible) {
- choosePasswordCheckBox.checked = visible
- if (visible) {
- choosePasswordCheckBox.visible = true
+ anchors.fill: parent
+
+ color: JamiTheme.backgroundColor
+
+ /*
+ * JamiFileDialog for exporting account
+ */
+ JamiFileDialog {
+ id: exportBtn_Dialog
+
+ mode: JamiFileDialog.SaveFile
+
+ title: qsTr("Export Account Here")
+ folder: StandardPaths.writableLocation(StandardPaths.HomeLocation) + "/Desktop"
+
+ nameFilters: [qsTr("Jami archive files") + " (*.gz)", qsTr(
+ "All files") + " (*)"]
+
+ onAccepted: {
+ export_Btn_FileDialogAccepted(true, file)
+ }
+
+ onRejected: {
+ export_Btn_FileDialogAccepted(false, folder)
+ }
+
+ onVisibleChanged: {
+ if (!visible) {
+ rejected()
+ }
}
}
- function startBooth(){
- setAvatarWidget.startBooth()
- }
-
- function stopBooth(){
- setAvatarWidget.stopBooth()
- }
-
- Layout.fillWidth: true
- Layout.fillHeight: true
-
- spacing: 6
-
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
-
- ColumnLayout {
- Layout.alignment: Qt.AlignHCenter
-
- spacing: 5
+ StackLayout {
+ id: createAccountStack
+ anchors.verticalCenter: root.verticalCenter
+ anchors.horizontalCenter: root.horizontalCenter
ColumnLayout {
- Layout.fillWidth: true
- spacing: 6
+ spacing: 12
- Layout.alignment: Qt.AlignHCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: root.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- Label {
- id: profileSectionLabel
+ RowLayout {
+ spacing: 12
+ height: 48
-
- Layout.alignment: Qt.AlignHCenter
-
- text: qsTr("Profile")
- font.pointSize: 13
- font.kerning: true
-
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- }
-
- PhotoboothView{
- id: setAvatarWidget
-
- Layout.alignment: Qt.AlignHCenter
-
- Layout.maximumWidth: 261
- Layout.preferredWidth: 261
- Layout.minimumWidth: 261
- Layout.maximumHeight: 261
- Layout.preferredHeight: 261
- Layout.minimumHeight: 261
- }
-
- RowLayout {
- spacing: 6
- Layout.alignment: Qt.AlignHCenter
- Layout.maximumHeight: 30
-
- Item {
Layout.fillWidth: true
- Layout.maximumHeight: 10
- }
+ anchors.left: usernameEdit.left
- InfoLineEdit {
- id: fullNameEdit
+ Label {
+ text: qsTr("Choose a username for your account")
+ }
- fieldLayoutWidth: 261
+ Label {
+ text: qsTr("Recommended")
+ color: "white"
+ padding: 8
+ anchors.right: parent.right
- Layout.alignment: Qt.AlignCenter
-
- selectByMouse: true
- placeholderText: qsTr("Profile name")
- font.pointSize: 10
- font.kerning: true
- }
-
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
- }
- }
- }
-
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
-
- ColumnLayout {
- Layout.alignment: Qt.AlignHCenter
-
- spacing: 5
- Label {
- id: accountSectionLabel
- Layout.alignment: Qt.AlignHCenter
-
- Layout.maximumWidth: 261
- Layout.preferredWidth: 261
- Layout.minimumWidth: 261
- Layout.maximumHeight: 30
- Layout.preferredHeight: 30
- Layout.minimumHeight: 30
-
- text: qsTr("Account")
- font.pointSize: 13
- font.kerning: true
-
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- }
-
- ColumnLayout {
- Layout.fillWidth: true
- spacing: 6
-
- CheckBox {
- id: signUpCheckbox
- checked: true
-
- indicator.width: 10
- indicator.height: 10
-
- Layout.leftMargin: 32
-
- Layout.minimumWidth: 261
-
- Layout.maximumHeight: 30
- Layout.preferredHeight: 30
- Layout.minimumHeight: 25
-
- Layout.alignment: Qt.AlignLeft
-
- text: qsTr("Register public username")
- font.pointSize: 10
- font.kerning: true
-
- indicator.implicitWidth: 20
- indicator.implicitHeight:20
-
- onClicked: {
- if (!checked) {
- usernameEdit.clear()
+ background: Rectangle {
+ color: "#aed581"
+ radius: 24
+ anchors.fill: parent
}
-
- validateWizardProgressionCreateAccountPage()
}
}
- }
- RowLayout {
- spacing: 6
- Layout.fillWidth: true
-
- Layout.leftMargin: 32
-
- InfoLineEdit {
+ MaterialLineEdit {
id: usernameEdit
- fieldLayoutWidth: 261
-
- Layout.alignment: Qt.AlignHCenter
-
selectByMouse: true
placeholderText: qsTr("Choose your username")
font.pointSize: 10
font.kerning: true
- enabled: signUpCheckbox.visible && signUpCheckbox.checked
+ borderColorMode: nameRegistrationUIState === WizardView.BLANK ? MaterialLineEdit.NORMAL
+ : nameRegistrationUIState >= WizardView.FREE ? MaterialLineEdit.NORMAL : MaterialLineEdit.ERROR
+
+ fieldLayoutWidth: chooseUsernameButton.width
+ Layout.topMargin: 32
}
- LookupStatusLabel{
- id: lookupStatusLabel
-
- visible: true
-
- lookupStatusState: {
- switch (nameRegistrationUIState) {
+ Label {
+ text: {
+ switch(nameRegistrationUIState){
case WizardView.BLANK:
- return "Blank"
- case WizardView.INVALID:
- return "Invalid"
- case WizardView.TAKEN:
- return "Taken"
- case WizardView.FREE:
- return "Free"
case WizardView.SEARCHING:
- return "Searching"
- default:
- return "Blank"
+ case WizardView.FREE:
+ return ""
+ case WizardView.INVALID:
+ return qsTr("Invalid username")
+ case WizardView.TAKEN:
+ return qsTr("Username already taken")
}
}
+
+ anchors.left: usernameEdit.left
+ anchors.right: usernameEdit.right
+ Layout.alignment: Qt.AlignHCenter
+
+ font.pointSize: JamiTheme.textFontSize
+ color: "red"
+
+ height: 32
+ }
+
+ MaterialButton {
+ id: chooseUsernameButton
+ text: qsTr("CHOOSE USERNAME")
+ color: nameRegistrationUIState === WizardView.FREE?
+ JamiTheme.buttonTintedGrey
+ : JamiTheme.buttonTintedGreyInactive
+
+ onClicked: {
+ if (nameRegistrationUIState === WizardView.FREE)
+ createAccountStack.currentIndex = createAccountStack.currentIndex + 1
+ }
+ }
+
+ MaterialButton {
+ text: qsTr("SKIP CHOOSING USERNAME")
+ color: JamiTheme.buttonTintedGrey
+ outlined: true
+
+ onClicked: {
+ createAccountStack.currentIndex = createAccountStack.currentIndex + 1
+ }
}
}
ColumnLayout {
- Layout.fillWidth: true
- spacing: 6
+ spacing: 12
- CheckBox {
- id: choosePasswordCheckBox
- checked: false
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: root.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- indicator.width: 10
- indicator.height: 10
+ RowLayout {
+ spacing: 12
+ height: 48
- Layout.leftMargin: 32
+ anchors.right: createAccountButton.right
+ anchors.left: createAccountButton.left
- Layout.minimumWidth: 261
+ Label {
+ text: qsTr("Encrypt account with password")
- Layout.preferredHeight: 30
- Layout.minimumHeight: 25
+ font.pointSize: JamiTheme.textFontSize + 3
+ }
- indicator.implicitWidth: 20
- indicator.implicitHeight:20
+ Label {
+ text: qsTr("Optional")
+ color: "white"
+ anchors.right: parent.right
+ padding: 8
- Layout.alignment: Qt.AlignLeft
-
- text: qsTr("Choose a password for enhanced security")
- font.pointSize: 8
- font.kerning: true
-
- onClicked: {
- if (!checked) {
- collapsiblePasswordWidget.clearAllTextFields()
+ background: Rectangle {
+ color: "#28b1ed"
+ radius: 24
+ anchors.fill: parent
}
-
- validateWizardProgressionCreateAccountPage()
}
}
- CollapsiblePasswordWidget {
- id: collapsiblePasswordWidget
+ RowLayout {
+ spacing: 12
+ height: 48
+
+ anchors.right: createAccountButton.right
+ anchors.left: createAccountButton.left
+
+ Label {
+ text: qsTr("Choose a password to encrypt the account key on this device")
+
+ font.pointSize: JamiTheme.textFontSize
+ }
+
+ Switch {
+ id: passwordSwitch
+ Layout.alignment: Qt.AlignRight
+ }
+ }
+
+ MaterialLineEdit {
+ id: passwordEdit
+
+ visible: passwordSwitch.checked
+
+ fieldLayoutWidth: createAccountButton.width
Layout.alignment: Qt.AlignHCenter
- visibleCollapsble: choosePasswordCheckBox.checked
- && choosePasswordCheckBox.visible
+ selectByMouse: true
+ echoMode: TextInput.Password
+ placeholderText: qsTr("Password")
+ font.pointSize: 10
+ font.kerning: true
+ }
+
+ MaterialLineEdit {
+ id: passwordConfirmEdit
+
+ visible: passwordSwitch.checked
+
+ fieldLayoutWidth: createAccountButton.width
+
+ Layout.alignment: Qt.AlignHCenter
+
+ selectByMouse: true
+ echoMode: TextInput.Password
+ placeholderText: qsTr("Confirm password")
+ font.pointSize: 10
+ font.kerning: true
+ }
+
+ Label {
+ anchors.right: createAccountButton.right
+ anchors.left: createAccountButton.left
+
+ text: qsTr("Note that the password cannot be recovered")
+
+ font.pointSize: JamiTheme.textFontSize
+ }
+
+ MaterialButton {
+ id: createAccountButton
+ text: qsTr("CREATE ACCOUNT")
+ color: !passwordSwitch.checked ||
+ (passwordEdit.text === passwordConfirmEdit.text && passwordEdit.text.length !== 0)?
+ JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
+
+ onClicked: {
+ createAccount()
+ createAccountStack.currentIndex = createAccountStack.currentIndex + 1
+ }
}
}
+ }
- Item {
- Layout.maximumWidth: 261
- Layout.preferredWidth: 261
- Layout.minimumWidth: 261
+ RowLayout {
+ spacing: 12
+ height: 48
- Layout.maximumHeight: 30
- Layout.preferredHeight: 30
- Layout.minimumHeight: 30
+ anchors.top: createAccountStack.bottom
+ anchors.horizontalCenter: root.horizontalCenter
+ Layout.alignment: Qt.AlignHCenter
- Layout.alignment: Qt.AlignHCenter
+ Rectangle {
+ color: usernameEdit.visible? JamiTheme.wizardBlueButtons : "grey"
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+
+ Rectangle {
+ color: createAccountButton.visible? JamiTheme.wizardBlueButtons : "grey"
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+
+ Rectangle {
+ color: "grey"
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+ }
+
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Return to welcome page")
+
+ Shortcut {
+ sequence: StandardKey.Cancel
+ enabled: parent.visible
+ onActivated: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
}
}
}
diff --git a/src/wizardview/components/CreateSIPAccountPage.qml b/src/wizardview/components/CreateSIPAccountPage.qml
index 3f3da17..1b355b8 100644
--- a/src/wizardview/components/CreateSIPAccountPage.qml
+++ b/src/wizardview/components/CreateSIPAccountPage.qml
@@ -23,14 +23,16 @@
import "../../constant"
import "../../commoncomponents"
-ColumnLayout {
- property alias text_sipFullNameEditAlias: sipFullNameEdit.text
+
+Rectangle {
+ id: root
+
property alias text_sipServernameEditAlias: sipServernameEdit.text
property alias text_sipProxyEditAlias: sipProxyEdit.text
property alias text_sipUsernameEditAlias: sipUsernameEdit.text
property alias text_sipPasswordEditAlias: sipPasswordEdit.text
- property alias boothImgBase64: setSIPAvatarWidget.imgBase64
+ property /*alias*/ var boothImgBase64: null//setSIPAvatarWidget.imgBase64
function initializeOnShowUp() {
clearAllTextFields()
@@ -41,123 +43,54 @@
sipPasswordEdit.clear()
sipServernameEdit.clear()
sipProxyEdit.clear()
- sipFullNameEdit.clear()
sipUsernameEdit.clear()
}
- function startBooth(){
- setSIPAvatarWidget.startBooth()
- }
+ signal createAccount
+ signal leavePage
- function stopBooth(){
- setSIPAvatarWidget.stopBooth()
- }
+ anchors.fill: parent
- Layout.fillWidth: true
- Layout.fillHeight: true
-
- spacing: 6
-
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
-
- Label {
- id: sipProfileSectionLabel
-
- Layout.maximumWidth: 368
- Layout.preferredWidth: 368
- Layout.maximumHeight: 21
- Layout.preferredHeight: 21
-
- Layout.alignment: Qt.AlignHCenter
-
- text: qsTr("Profile")
- font.pointSize: 13
- font.kerning: true
-
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- }
-
- PhotoboothView{
- id: setSIPAvatarWidget
-
- Layout.alignment: Qt.AlignHCenter
-
- Layout.maximumWidth: 261
- Layout.preferredWidth: 261
- Layout.minimumWidth: 261
- Layout.maximumHeight: 261
- Layout.preferredHeight: 261
- Layout.minimumHeight: 261
- }
-
- RowLayout {
- spacing: 0
- Layout.alignment: Qt.AlignHCenter
- Layout.maximumHeight: 30
-
- Item {
- Layout.fillWidth: true
- Layout.maximumHeight: 10
- }
-
- InfoLineEdit {
- id: sipFullNameEdit
-
- fieldLayoutWidth : 261
- Layout.alignment: Qt.AlignCenter
- selectByMouse: true
- placeholderText: qsTr("Profile name")
- font.pointSize: 10
- font.kerning: true
- }
-
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
- }
- Item {
- Layout.fillHeight: true
- Layout.fillWidth: true
- }
-
- Label {
- id: sipAccountSectionLabel
- Layout.maximumWidth: 368
- Layout.preferredWidth: 368
- Layout.maximumHeight: 21
- Layout.preferredHeight: 21
-
- Layout.alignment: Qt.AlignHCenter
-
- text: qsTr("SIP Account")
- font.pointSize: 12
- font.kerning: true
-
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
- }
+ color: JamiTheme.backgroundColor
ColumnLayout {
- Layout.alignment: Qt.AlignHCenter
- spacing: 7
+ spacing: 12
- Item {
- Layout.fillWidth: true
- Layout.alignment: Qt.AlignHCenter
- Layout.maximumHeight: 40
- Layout.minimumHeight: 30
- Layout.preferredHeight: 40
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: createAccountButton.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+
+ RowLayout {
+ spacing: 12
+ height: 48
+
+ anchors.left: createAccountButton.left
+ anchors.right: createAccountButton.right
+
+ Label {
+ text: qsTr("Configure an existing SIP account")
+ }
+
+ Label {
+ text: qsTr("Required")
+ color: "#ff1f62"
+ padding: 8
+
+ background: Rectangle {
+ color: "#fee4e9"
+ radius: 24
+ anchors.fill: parent
+ }
+ }
}
- InfoLineEdit {
+ MaterialLineEdit {
id: sipServernameEdit
+
+ fieldLayoutWidth: createAccountButton.width
+
Layout.alignment: Qt.AlignHCenter
- fieldLayoutWidth: 261
selectByMouse: true
placeholderText: qsTr("Server")
@@ -165,10 +98,12 @@
font.kerning: true
}
- InfoLineEdit {
+ MaterialLineEdit {
id: sipProxyEdit
+
+ fieldLayoutWidth: createAccountButton.width
+
Layout.alignment: Qt.AlignHCenter
- fieldLayoutWidth: 261
selectByMouse: true
placeholderText: qsTr("Proxy")
@@ -176,10 +111,12 @@
font.kerning: true
}
- InfoLineEdit {
+ MaterialLineEdit {
id: sipUsernameEdit
+
+ fieldLayoutWidth: createAccountButton.width
+
Layout.alignment: Qt.AlignHCenter
- fieldLayoutWidth: 261
selectByMouse: true
placeholderText: qsTr("Username")
@@ -187,10 +124,12 @@
font.kerning: true
}
- InfoLineEdit {
+ MaterialLineEdit {
id: sipPasswordEdit
+
+ fieldLayoutWidth: createAccountButton.width
+
Layout.alignment: Qt.AlignHCenter
- fieldLayoutWidth: 261
selectByMouse: true
echoMode: TextInput.Password
@@ -198,5 +137,52 @@
font.pointSize: 10
font.kerning: true
}
+
+ MaterialButton {
+ id: createAccountButton
+ text: qsTr("CREATE SIP ACCOUNT")
+ color: JamiTheme.wizardBlueButtons
+
+ onClicked: {
+ createAccount()
+ }
+ }
+ }
+
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Return to welcome page")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
}
}
diff --git a/src/wizardview/components/HoverableGradientButton.qml b/src/wizardview/components/HoverableGradientButton.qml
index 8b1ebd2..09e9671 100644
--- a/src/wizardview/components/HoverableGradientButton.qml
+++ b/src/wizardview/components/HoverableGradientButton.qml
@@ -49,6 +49,7 @@
property string onEnterColor: JamiTheme.hoverColor
property string onExitColor: backgroundColor
property string textColor: "white"
+ property string tooltipText: ""
property string toolTipText: ""
diff --git a/src/wizardview/components/ImportFromBackupPage.qml b/src/wizardview/components/ImportFromBackupPage.qml
index bd7d26e..f379dfe 100644
--- a/src/wizardview/components/ImportFromBackupPage.qml
+++ b/src/wizardview/components/ImportFromBackupPage.qml
@@ -20,18 +20,23 @@
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.14
import Qt.labs.platform 1.1
+import net.jami.Models 1.0
import "../../constant"
import "../../commoncomponents"
-ColumnLayout {
+Rectangle {
+ id: root
+
property alias text_passwordFromBackupEditAlias: passwordFromBackupEdit.text
property string fileImportBtnText: qsTr("Archive(none)")
- signal importFromFile_Dialog_Accepted(string fileDir)
+ property string filePath: ""
+ property string errorText: ""
function clearAllTextFields() {
passwordFromBackupEdit.clear()
+ errorText = ""
fileImportBtnText = qsTr("Archive(none)")
}
@@ -42,135 +47,137 @@
title: qsTr("Open File")
folder: StandardPaths.writableLocation(StandardPaths.HomeLocation) + "/Desktop"
- nameFilters: [qsTr("Jami archive files") + " (*.gz)", qsTr(
- "All files") + " (*)"]
+ nameFilters: [qsTr("Jami archive files") + " (*.gz)", qsTr("All files") + " (*)"]
onAccepted: {
- importFromFile_Dialog_Accepted(file)
+ filePath = file
+ if (file.length != 0) {
+ fileImportBtnText = ClientWrapper.utilsAdaptor.toFileInfoName(file)
+ } else {
+ fileImportBtnText = qsTr("Archive(none)")
+ }
}
}
- Layout.fillWidth: true
- Layout.fillHeight: true
+ anchors.fill: parent
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ color: JamiTheme.backgroundColor
+
+ signal leavePage
+ signal importAccount
ColumnLayout {
- Layout.alignment: Qt.AlignCenter
- Layout.maximumWidth: 366
-
spacing: 12
- RowLayout {
- Layout.fillWidth: true
- Layout.maximumHeight: 24
- spacing: 0
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.horizontalCenter: root.horizontalCenter
+ Layout.preferredWidth: parent.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ Text {
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
- Label {
- id: importFromBackupLabel
- Layout.minimumHeight: 24
- Layout.minimumWidth: 234
- text: qsTr("Import from backup")
- font.pointSize: 13
- font.kerning: true
- horizontalAlignment: Qt.AlignLeft
- verticalAlignment: Qt.AlignVCenter
- }
-
- HoverableRadiusButton {
- id: backupInfoBtn
-
- buttonImageHeight: height
- buttonImageWidth: width
-
- Layout.alignment: Qt.AlignVCenter
- Layout.minimumWidth: 24
- Layout.preferredWidth: 24
- Layout.maximumWidth: 24
-
- Layout.minimumHeight: 24
- Layout.preferredHeight: 24
- Layout.maximumHeight: 24
-
- radius: height / 2
- icon.source: "/images/icons/info-24px.svg"
- icon.height: 24
- icon.width: 24
-
- backgroundColor: JamiTheme.releaseColor
- onClicked: {
- backupInfoLabel.visible = !backupInfoLabel.visible
- }
- }
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ text: qsTr("Import from backup")
+ font.pointSize: JamiTheme.menuFontSize
}
- HoverableGradientButton {
+ MaterialButton {
id: fileImportBtn
- Layout.alignment: Qt.AlignHCenter
- Layout.maximumWidth: 256
- Layout.preferredWidth: 256
-
- Layout.maximumHeight: 30
- Layout.preferredHeight: 30
- Layout.minimumHeight: 30
-
text: fileImportBtnText
- font.pointSize: 10
- font.kerning: true
-
- radius: height / 2
- backgroundColor: JamiTheme.releaseColor
+ toolTipText: qsTr("Import your account's archive")
+ source: "qrc:/images/icons/round-folder-24px.svg"
+ color: JamiTheme.buttonTintedGrey
onClicked: {
importFromFile_Dialog.open()
}
}
- InfoLineEdit {
+ Text {
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
+
+ text: qsTr("You can obtain an archive by clicking on \"Export account\" in the account settings. This will create a .gz file on your device.")
+ wrapMode: Text.Wrap
+ }
+
+ MaterialLineEdit {
id: passwordFromBackupEdit
- Layout.alignment: Qt.AlignHCenter
-
selectByMouse: true
- echoMode: TextInput.Password
placeholderText: qsTr("Password")
+ font.pointSize: 10
+ font.kerning: true
+
+ echoMode: TextInput.Password
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
+ }
+
+ MaterialButton {
+ id: connectBtn
+ text: qsTr("CONNECT FROM BACKUP")
+ color: filePath.length === 0?
+ JamiTheme.buttonTintedGreyInactive : JamiTheme.buttonTintedGrey
+
+ onClicked: {
+ errorText = ""
+ importAccount()
+ }
}
Label {
- id: backupInfoLabel
+ text: errorText
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
Layout.alignment: Qt.AlignHCenter
- Layout.maximumWidth: 366
- Layout.preferredWidth: 366
- text: qsTr("You can obtain an archive by clicking on \"Export account\" in the account settings. This will create a .gz file on your device.")
- wrapMode: Text.WordWrap
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
+ font.pointSize: JamiTheme.textFontSize
+ color: "red"
- visible: false
+ height: 32
}
}
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Return to welcome page")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
}
}
diff --git a/src/wizardview/components/ImportFromDevicePage.qml b/src/wizardview/components/ImportFromDevicePage.qml
index 5181635..3ecb205 100644
--- a/src/wizardview/components/ImportFromDevicePage.qml
+++ b/src/wizardview/components/ImportFromDevicePage.qml
@@ -23,9 +23,12 @@
import "../../constant"
import "../../commoncomponents"
-ColumnLayout {
+Rectangle {
+ id: root
+
property alias text_pinFromDeviceAlias: pinFromDevice.text
property alias text_passwordFromDeviceAlias: passwordFromDevice.text
+ property string errorText: ""
function initializeOnShowUp() {
clearAllTextFields()
@@ -36,107 +39,125 @@
passwordFromDevice.clear()
}
- Layout.fillWidth: true
- Layout.fillHeight: true
+ anchors.fill: parent
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.preferredHeight: 40
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ color: JamiTheme.backgroundColor
+
+ signal leavePage
+ signal importAccount
ColumnLayout {
- Layout.alignment: Qt.AlignCenter
- Layout.fillWidth: true
-
spacing: 12
- RowLayout {
- Layout.fillWidth: true
- Layout.maximumHeight: 24
- spacing: 0
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: parent.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ Text {
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
- Label {
- id: importFromDeviceLabel
- Layout.minimumHeight: 24
- Layout.minimumWidth: 234
- text: qsTr("Import from device")
- font.pointSize: 13
- font.kerning: true
- }
-
- HoverableRadiusButton {
- id: pinInfoBtn
-
- buttonImageHeight: height
- buttonImageWidth: width
-
- Layout.alignment: Qt.AlignVCenter
- Layout.minimumWidth: 24
- Layout.maximumWidth: 24
- Layout.minimumHeight: 24
- Layout.maximumHeight: 24
-
- radius: height / 2
- icon.source: "/images/icons/info-24px.svg"
- backgroundColor: JamiTheme.releaseColor
-
- onClicked: {
- pinInfoLabel.visible = !pinInfoLabel.visible
- }
- }
- Item {
- Layout.alignment: Qt.AlignVCenter
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
+ text: qsTr("Enter your main Jami account password")
+ font.pointSize: JamiTheme.menuFontSize
}
- InfoLineEdit {
- id: pinFromDevice
- Layout.alignment: Qt.AlignHCenter
+ MaterialLineEdit {
+ id: passwordFromDevice
+
+ selectByMouse: true
+ placeholderText: qsTr("Password")
+ font.pointSize: 10
+ font.kerning: true
+
+ echoMode: TextInput.Password
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
+ }
+
+ Text {
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
+
+ text: qsTr("Enter the PIN from another configured Jami account. Use the \"export Jami account\" feature to obtain a PIN")
+ wrapMode: Text.Wrap
+ }
+
+ MaterialLineEdit {
+ id: pinFromDevice
selectByMouse: true
placeholderText: qsTr("PIN")
+ font.pointSize: 10
+ font.kerning: true
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: connectBtn.width
}
- InfoLineEdit {
- id: passwordFromDevice
+ MaterialButton {
+ id: connectBtn
+ text: qsTr("CONNECT FROM ANOTHER DEVICE")
+ color: pinFromDevice.text.length === 0?
+ JamiTheme.buttonTintedGreyInactive : JamiTheme.buttonTintedGrey
- Layout.alignment: Qt.AlignHCenter
-
- selectByMouse: true
- echoMode: TextInput.Password
- placeholderText: qsTr("Password")
+ onClicked: {
+ errorText = ""
+ importAccount()
+ }
}
Label {
- id: pinInfoLabel
+ text: errorText
+ anchors.left: connectBtn.left
+ anchors.right: connectBtn.right
Layout.alignment: Qt.AlignHCenter
- Layout.minimumWidth: 256
- Layout.maximumWidth: 256
- text: qsTr("To obtain a PIN (valid for 10 minutes), you need to open the account settings on the other device and click on \"Link to another device\".")
- wrapMode: Text.WordWrap
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
+ font.pointSize: JamiTheme.textFontSize
+ color: "red"
- visible: false
+ height: 32
}
}
- Item {
- Layout.alignment: Qt.AlignHCenter
- Layout.preferredHeight: 40
- Layout.fillWidth: true
- Layout.fillHeight: true
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Return to welcome page")
+
+ Shortcut {
+ sequence: StandardKey.Cancel
+ enabled: parent.visible
+ onActivated: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
}
}
diff --git a/src/wizardview/components/ProfilePage.qml b/src/wizardview/components/ProfilePage.qml
new file mode 100644
index 0000000..91188f4
--- /dev/null
+++ b/src/wizardview/components/ProfilePage.qml
@@ -0,0 +1,213 @@
+/*
+ * Copyright (C) 2020 by Savoir-faire Linux
+ * Author: Yang Wang <yang.wang@savoirfairelinux.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
+ * the Free Software Foundation; either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import QtQuick 2.14
+import QtQuick.Layouts 1.3
+import QtQuick.Controls 2.14
+
+import "../../constant"
+import "../../commoncomponents"
+
+Rectangle {
+ id: root
+
+ function initializeOnShowUp() {
+ clearAllTextFields()
+ boothImgBase64 = ""
+ readyToSaveDetails = false
+ }
+
+ function clearAllTextFields() {
+ aliasEdit.clear()
+ }
+
+ anchors.fill: parent
+
+ color: JamiTheme.backgroundColor
+
+ signal leavePage
+ signal saveProfile
+
+ property var readyToSaveDetails: false
+ property var showBottom: false
+ property alias boothImgBase64: setAvatarWidget.imgBase64
+ property alias displayName: aliasEdit.text
+
+ ColumnLayout {
+ spacing: 12
+
+ anchors.horizontalCenter: parent.horizontalCenter
+ anchors.verticalCenter: parent.verticalCenter
+ Layout.preferredWidth: parent.width
+ Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
+
+
+ RowLayout {
+ spacing: 12
+ height: 48
+
+ Layout.preferredWidth: saveProfileBtn.width
+
+ Label {
+ text: qsTr("Profile is only shared with contacts")
+
+ font.pointSize: JamiTheme.textFontSize + 3
+ }
+
+ Label {
+ text: qsTr("Optional")
+ color: "white"
+ Layout.alignment: Qt.AlignRight
+ padding: 8
+
+ background: Rectangle {
+ color: "#28b1ed"
+ radius: 24
+ anchors.fill: parent
+ }
+ }
+ }
+
+ PhotoboothView {
+ id: setAvatarWidget
+
+ Layout.alignment: Qt.AlignHCenter
+
+ Layout.maximumWidth: 256
+ Layout.preferredWidth: 256
+ Layout.minimumWidth: 256
+ Layout.maximumHeight: 256
+ Layout.preferredHeight: 256
+ Layout.minimumHeight: 256
+ }
+
+ MaterialLineEdit {
+ id: aliasEdit
+
+ selectByMouse: true
+ placeholderText: qsTr("Enter your name")
+ font.pointSize: 10
+ font.kerning: true
+
+ borderColorMode: MaterialLineEdit.NORMAL
+
+ fieldLayoutWidth: saveProfileBtn.width
+ }
+
+ MaterialButton {
+ id: saveProfileBtn
+ enabled: readyToSaveDetails
+ text: enabled? qsTr("Save Profile") : qsTr("Generating account…")
+ color: enabled? JamiTheme.wizardBlueButtons : JamiTheme.buttonTintedGreyInactive
+
+ onClicked: {
+ saveProfile()
+ }
+ }
+
+ MaterialButton {
+ text: qsTr("SKIP")
+ enabled: saveProfileBtn.enabled
+ color: enabled? JamiTheme.buttonTintedGrey : JamiTheme.buttonTintedGreyInactive
+ outlined: true
+
+ onClicked: {
+ leavePage()
+ }
+ }
+
+ RowLayout {
+ id: bottomLayout
+ height: 48
+ spacing: 12
+ visible: showBottom
+
+ Layout.preferredWidth: saveProfileBtn.width
+ Layout.topMargin: 12
+ Layout.alignment: Qt.AlignHCenter
+
+ Item {
+ Layout.fillWidth: true
+ }
+
+ Rectangle {
+ color: "grey"
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+
+ Rectangle {
+ color: "grey"
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+
+ Rectangle {
+ color: JamiTheme.wizardBlueButtons
+ radius: height / 2
+ height: 12
+ width: 12
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+ }
+
+ }
+
+ HoverableButton {
+ id: cancelButton
+ z: 2
+ visible: readyToSaveDetails
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 90
+ topPadding: 90
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Close")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
+ }
+}
diff --git a/src/wizardview/components/WelcomePageLayout.qml b/src/wizardview/components/WelcomePageLayout.qml
index 0bff7ae..5ec6cbd 100644
--- a/src/wizardview/components/WelcomePageLayout.qml
+++ b/src/wizardview/components/WelcomePageLayout.qml
@@ -1,6 +1,7 @@
/*
* Copyright (C) 2020 by Savoir-faire Linux
* Author: Yang Wang <yang.wang@savoirfairelinux.com>
+ * Author: Sébastien blin <sebastien.blin@savoirfairelinux.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
@@ -19,26 +20,25 @@
import QtQuick 2.14
import QtQuick.Layouts 1.3
import QtQuick.Controls 2.14
+import QtGraphicalEffects 1.15
+import net.jami.Models 1.0
import "../../constant"
import "../../commoncomponents"
ColumnLayout {
- property alias connectAccountManagerButtonAlias: connectAccountManagerButton
- property alias newSIPAccountButtonAlias: newSIPAccountButton
-
- Layout.fillWidth: true
- Layout.fillHeight: true
- spacing: 6
+ anchors.fill: parent
+ anchors.verticalCenter: parent.verticalCenter
+ anchors.horizontalCenter: parent.horizontalCenter
signal welcomePageRedirectPage(int toPageIndex)
+ signal leavePage
Item {
// put a spacer to make the buttons closs to the middle
- Layout.minimumHeight: 57
- Layout.maximumHeight: 57
- Layout.preferredHeight: 57
+ Layout.preferredHeight: 48
Layout.fillWidth: true
+ Layout.fillHeight: true
}
RowLayout {
Layout.fillWidth: true
@@ -52,13 +52,6 @@
font.kerning: true
}
}
- Item {
- Layout.minimumHeight: 17
- Layout.maximumHeight: 17
- Layout.preferredHeight: 17
- Layout.fillWidth: true
- }
-
RowLayout {
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter
@@ -80,29 +73,18 @@
}
}
}
- Item {
- // put a spacer to make the buttons closs to the middle
- Layout.preferredHeight: 57
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
- Layout.maximumHeight: 30
+ Layout.maximumHeight: 36
Layout.alignment: Qt.AlignHCenter
- HoverableGradientButton {
+ MaterialButton {
id: newAccountButton
- Layout.alignment: Qt.AlignCenter
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- text: qsTr("Create local account")
- font.pointSize: 10
- font.kerning: true
- radius: height / 2
-
+ text: qsTr("CREATE A JAMI ACCOUNT")
toolTipText: qsTr("Create new Jami account")
+ source: "qrc:/images/default_avatar_overlay.svg"
+ color: JamiTheme.buttonTintedBlue
onClicked: {
welcomePageRedirectPage(1)
@@ -110,24 +92,18 @@
}
}
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
- Layout.maximumHeight: 30
+ Layout.maximumHeight: 36
Layout.alignment: Qt.AlignHCenter
- HoverableGradientButton {
+ MaterialButton {
id: fromDeviceButton
- Layout.alignment: Qt.AlignCenter
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- text: qsTr("Import from device")
- font.pointSize: 10
- font.kerning: true
- backgroundColor: JamiTheme.releaseColor
- radius: height / 2
-
+ text: qsTr("IMPORT FROM ANOTHER DEVICE")
toolTipText: qsTr("Import account from other device")
+ source: "qrc:/images/icons/devices-24px.svg"
+ color: JamiTheme.buttonTintedBlue
onClicked: {
welcomePageRedirectPage(5)
@@ -135,24 +111,18 @@
}
}
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
- Layout.maximumHeight: 30
+ Layout.maximumHeight: 36
Layout.alignment: Qt.AlignHCenter
- HoverableGradientButton {
+ MaterialButton {
id: fromBackupButton
- Layout.alignment: Qt.AlignCenter
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- text: qsTr("Import from backup")
- font.pointSize: 10
- font.kerning: true
- backgroundColor: JamiTheme.releaseColor
- radius: height / 2
-
+ text: qsTr("CONNECT FROM BACKUP")
toolTipText: qsTr("Import account from backup file")
+ source: "qrc:/images/icons/backup-24px.svg"
+ color: JamiTheme.buttonTintedBlue
onClicked: {
welcomePageRedirectPage(3)
@@ -160,26 +130,18 @@
}
}
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
- Layout.maximumHeight: 30
+ Layout.maximumHeight: 36
Layout.alignment: Qt.AlignHCenter
- Button {
+ MaterialButton {
id: showAdvancedButton
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- Layout.alignment: Qt.AlignCenter
- text: qsTr("Show Advanced")
- font.pointSize: 8
- font.kerning: true
- background: Rectangle{
- anchors.fill: parent
-
- color: "transparent"
- radius: height /2
- }
+ text: qsTr("SHOW ADVANCED")
+ toolTipText: qsTr("Show advanced options")
+ color: JamiTheme.buttonTintedBlue
+ outlined: true
hoverEnabled: true
@@ -194,25 +156,19 @@
}
}
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter
- Layout.maximumHeight: 30
- HoverableGradientButton {
+ Layout.maximumHeight: 36
+ MaterialButton {
id: connectAccountManagerButton
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- Layout.alignment: Qt.AlignCenter
- text: qsTr("Connect to account manager")
visible: false
- font.pointSize: 10
- font.kerning: true
- backgroundColor: JamiTheme.releaseColor
- radius: height / 2
-
+ text: qsTr("CONNECT TO MANAGEMENT SERVER")
toolTipText: qsTr("Login to account manager")
+ source: "qrc:/images/icons/router-24px.svg"
+ color: JamiTheme.buttonTintedBlue
onClicked: {
welcomePageRedirectPage(6)
@@ -220,25 +176,18 @@
}
}
RowLayout {
- spacing: 6
+ spacing: 8
Layout.fillWidth: true
Layout.alignment: Qt.AlignHCenter
- Layout.maximumHeight: 30
-
- HoverableGradientButton {
+ Layout.maximumHeight: 36
+ MaterialButton {
id: newSIPAccountButton
- Layout.preferredWidth: 256
- Layout.preferredHeight: 30
- Layout.alignment: Qt.AlignCenter
- text: qsTr("Add a new SIP account")
visible: false
- font.pointSize: 10
- font.kerning: true
- radius: height / 2
- backgroundColor: JamiTheme.releaseColor
-
+ text: qsTr("CREATE A SIP ACCOUNT")
toolTipText: qsTr("Create new SIP account")
+ source: "qrc:/images/default_avatar_overlay.svg"
+ color: JamiTheme.buttonTintedBlue
onClicked: {
welcomePageRedirectPage(2)
@@ -251,4 +200,45 @@
Layout.preferredHeight: 65
Layout.fillWidth: true
}
+
+ HoverableButton {
+ id: cancelButton
+ z: 2
+
+ visible: {
+ return ClientWrapper.utilsAdaptor.getAccountListSize() > 0
+ }
+
+ anchors.right: parent.right
+ anchors.top: parent.top
+
+ rightPadding: 40
+ topPadding: 40
+
+ Layout.preferredWidth: 96
+ Layout.preferredHeight: 96
+
+ backgroundColor: "transparent"
+ onEnterColor: "transparent"
+ onPressColor: "transparent"
+ onReleaseColor: "transparent"
+ onExitColor: "transparent"
+
+ buttonImageHeight: 48
+ buttonImageWidth: 48
+ source: "qrc:/images/icons/ic_close_white_24dp.png"
+ radius: 48
+ baseColor: "#7c7c7c"
+ toolTipText: qsTr("Close")
+
+ Action {
+ enabled: parent.visible
+ shortcut: StandardKey.Cancel
+ onTriggered: leavePage()
+ }
+
+ onClicked: {
+ leavePage()
+ }
+ }
}