diff --git a/src/app/onboarding/view.nim b/src/app/onboarding/view.nim index 40a063dd43..0651e57b59 100644 --- a/src/app/onboarding/view.nim +++ b/src/app/onboarding/view.nim @@ -14,7 +14,7 @@ type AccountRoles {.pure.} = enum Username = UserRole + 1, Identicon = UserRole + 2, - Key = UserRole + 3 + Address = UserRole + 3 QtObject: type OnboardingView* = ref object of QAbstractListModel @@ -60,12 +60,12 @@ QtObject: case assetRole: of AccountRoles.Username: result = newQVariant(asset.name) of AccountRoles.Identicon: result = newQVariant(asset.photoPath) - of AccountRoles.Key: result = newQVariant(asset.derived.whisper.publicKey) + of AccountRoles.Address: result = newQVariant(asset.keyUid) method roleNames(self: OnboardingView): Table[int, string] = { AccountRoles.Username.int:"username", AccountRoles.Identicon.int:"identicon", - AccountRoles.Key.int:"key" }.toTable + AccountRoles.Address.int:"address" }.toTable proc storeAccountAndLogin(self: OnboardingView, selectedAccountIndex: int, password: string): string {.slot.} = try: diff --git a/ui/main.qml b/ui/main.qml index ce3f1d1cb8..72a99a75a6 100644 --- a/ui/main.qml +++ b/ui/main.qml @@ -168,7 +168,9 @@ ApplicationWindow { Component { id: genKey GenKey { - btnExistingKey.onClicked: applicationWindow.navigateTo("ExistingKey") + onClosed: function () { + applicationWindow.navigateTo("InitialState") + } } } diff --git a/ui/nim-status-client.pro b/ui/nim-status-client.pro index 00255ae0ed..660297b6ec 100644 --- a/ui/nim-status-client.pro +++ b/ui/nim-status-client.pro @@ -140,6 +140,7 @@ DISTFILES += \ onboarding/EnterSeedPhraseModal.qml \ onboarding/ExistingKey.qml \ onboarding/GenKey.qml \ + onboarding/GenKeyModal.qml \ onboarding/Intro.qml \ onboarding/KeysMain.qml \ onboarding/Login.qml \ diff --git a/ui/onboarding/GenKey.qml b/ui/onboarding/GenKey.qml index cf3174fad0..f358d83659 100644 --- a/ui/onboarding/GenKey.qml +++ b/ui/onboarding/GenKey.qml @@ -6,281 +6,34 @@ import QtQuick.Dialogs 1.3 import "../imports" import "../shared" -SwipeView { - id: swipeView +Item { + property var onClosed: function () {} + id: genKeyView anchors.fill: parent - currentIndex: 0 - property alias btnExistingKey: btnExistingKey - - onCurrentItemChanged: { - currentItem.txtPassword.textField.focus = true; + Component.onCompleted: { + genKeyModal.open() } - Item { - id: wizardStep1 - property int selectedIndex: 0 - Layout.fillHeight: true - Layout.fillWidth: true - - Text { - id: title - text: "Generated accounts" - font.pointSize: 36 - anchors.top: parent.top - anchors.topMargin: 20 - anchors.horizontalCenter: parent.horizontalCenter + GenKeyModal { + property bool wentNext: false + id: genKeyModal + onNextClick: function (selectedIndex) { + wentNext = true + onboardingModel.setCurrentAccount(selectedIndex) + createPasswordModal.open() } - - Item { - anchors.top: title.bottom - anchors.right: parent.right - anchors.bottom: parent.bottom - anchors.left: parent.left - anchors.topMargin: 20 - - - ButtonGroup { - id: accountGroup - } - - Component { - id: addressViewDelegate - - Item { - height: 56 - anchors.right: parent.right - anchors.rightMargin: 0 - anchors.left: parent.left - anchors.leftMargin: 0 - - Row { - RadioButton { - checked: index == 0 ? true : false - ButtonGroup.group: accountGroup - onClicked: { - wizardStep1.selectedIndex = index - } - } - Column { - Image { - source: identicon - } - } - Column { - Text { - text: username - } - Text { - text: key - width: 160 - elide: Text.ElideMiddle - } - } - } - } - } - - ListView { - id: addressesView - contentWidth: 200 - model: onboardingModel - delegate: addressViewDelegate - anchors.fill: parent - Layout.fillHeight: true - Layout.fillWidth: true - } - - Item { - id: footer - width: btnExistingKey.width + selectBtn.width + Theme.padding - height: btnExistingKey.height - anchors.bottom: parent.bottom - anchors.bottomMargin: Theme.padding - anchors.horizontalCenter: parent.horizontalCenter - - StyledButton { - id: btnExistingKey - label: "Access existing key" - } - - StyledButton { - id: selectBtn - anchors.left: btnExistingKey.right - anchors.leftMargin: Theme.padding - label: "Select" - - onClicked: { - onboardingModel.setCurrentAccount(wizardStep1.selectedIndex) - swipeView.incrementCurrentIndex() - } - } - } - - } - } - - Item { - id: wizardStep2 - property Item txtPassword: txtPassword - - Text { - id: step2Title - text: "Enter password" - font.pointSize: 36 - anchors.top: parent.top - anchors.topMargin: 20 - anchors.horizontalCenter: parent.horizontalCenter - } - - Row { - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: step2Title.bottom - anchors.topMargin: 30 - Column { - Image { - source: onboardingModel.currentAccount.identicon - } - } - Column { - Text { - text: onboardingModel.currentAccount.username - } - Text { - text: onboardingModel.currentAccount.address - width: 160 - elide: Text.ElideMiddle - } - - } - } - - Input { - id: txtPassword - anchors.verticalCenter: parent.verticalCenter - anchors.rightMargin: Theme.padding - anchors.leftMargin: Theme.padding - anchors.left: parent.left - anchors.right: parent.right - placeholderText: "Enter password" - - Component.onCompleted: { - this.textField.echoMode = TextInput.Password - } - Keys.onReturnPressed: { - btnNext.clicked() - } - } - - StyledButton { - id: btnNext - label: "Next" - anchors.horizontalCenter: parent.horizontalCenter - anchors.bottom: parent.bottom - anchors.bottomMargin: 20 - onClicked: { - swipeView.incrementCurrentIndex(); + onClosed: function () { + if (!wentNext) { + genKeyView.onClosed() } } } - Item { - id: wizardStep3 - property Item txtPassword: txtConfirmPassword - - Text { - id: step3Title - text: "Confirm password" - font.pointSize: 36 - anchors.top: parent.top - anchors.topMargin: 20 - anchors.horizontalCenter: parent.horizontalCenter - } - - Row { - anchors.horizontalCenter: parent.horizontalCenter - anchors.top: step3Title.bottom - anchors.topMargin: 30 - Column { - Image { - source: onboardingModel.currentAccount.identicon - } - } - Column { - Text { - text: onboardingModel.currentAccount.username - } - Text { - text: onboardingModel.currentAccount.address - width: 160 - elide: Text.ElideMiddle - } - - } - } - - Input { - id: txtConfirmPassword - anchors.verticalCenter: parent.verticalCenter - anchors.rightMargin: Theme.padding - anchors.leftMargin: Theme.padding - anchors.left: parent.left - anchors.right: parent.right - placeholderText: "Confirm entered password" - - Component.onCompleted: { - this.textField.echoMode = TextInput.Password - } - Keys.onReturnPressed: { - btnFinish.clicked() - } - } - - MessageDialog { - id: passwordsDontMatchError - title: "Error" - text: "Passwords don't match" - icon: StandardIcon.Warning - standardButtons: StandardButton.Ok - onAccepted: { - txtConfirmPassword.clear(); - swipeView.currentIndex = 1; - txtPassword.focus = true; - } - } - - MessageDialog { - id: storeAccountAndLoginError - title: "Error storing account and logging in" - text: "An error occurred while storing your account and logging in: " - icon: StandardIcon.Critical - standardButtons: StandardButton.Ok - } - - Connections { - target: onboardingModel - ignoreUnknownSignals: true - onLoginResponseChanged: { - if(error){ - storeAccountAndLoginError.text += error; - storeAccountAndLoginError.open() - } - } - } - - StyledButton { - id: btnFinish - label: "Finish" - anchors.horizontalCenter: parent.horizontalCenter - anchors.bottom: parent.bottom - anchors.bottomMargin: 20 - onClicked: { - if (txtConfirmPassword.textField.text != txtPassword.textField.text) { - return passwordsDontMatchError.open(); - } - const selectedAccountIndex = wizardStep1.selectedIndex - onboardingModel.storeAccountAndLogin(selectedAccountIndex, txtPassword.textField.text) - } + CreatePasswordModal { + id: createPasswordModal + onClosed: function () { + existingKeyView.onClosed() } } } diff --git a/ui/onboarding/GenKeyModal.qml b/ui/onboarding/GenKeyModal.qml new file mode 100644 index 0000000000..447f5a6bd8 --- /dev/null +++ b/ui/onboarding/GenKeyModal.qml @@ -0,0 +1,62 @@ +import QtQuick 2.12 +import QtQuick.Controls 2.3 +import QtQuick.Layouts 1.3 +import "../imports" +import "../shared" +import "./Login" + +ModalPopup { + property int selectedIndex: 0 + property var onClosed: function () {} + property var onNextClick: function () {} + id: popup + title: qsTr("Choose a chat name") + + AccountList { + id: accountList + anchors.fill: parent + + accounts: onboardingModel + isSelected: function (index, address) { + return index === selectedIndex + } + onAccountSelect: function(index) { + selectedIndex = index + } + } + + footer: Button { + id: submitBtn + anchors.bottom: parent.bottom + anchors.topMargin: Theme.padding + anchors.right: parent.right + anchors.rightMargin: Theme.padding + width: 44 + height: 44 + background: Rectangle { + radius: 50 + color: Theme.lightBlue + } + + Image { + sourceSize.height: 15 + sourceSize.width: 20 + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter + source: "../app/img/leave_chat.svg" + rotation: 180 + fillMode: Image.PreserveAspectFit + } + + onClicked : { + onNextClick(selectedIndex); + popup.close() + } + } +} + +/*##^## +Designer { + D{i:0;formeditorColor:"#ffffff";height:500;width:400} +} +##^##*/ diff --git a/ui/onboarding/Login/AccountList.qml b/ui/onboarding/Login/AccountList.qml index 77f5b533f5..60e0003e6c 100644 --- a/ui/onboarding/Login/AccountList.qml +++ b/ui/onboarding/Login/AccountList.qml @@ -7,6 +7,7 @@ import "../../imports" ListView { property var accounts: AccountsData {} + property var isSelected: function () {} property var onAccountSelect: function () {} id: addressesView @@ -19,6 +20,9 @@ ListView { username: model.username address: model.address identicon: model.identicon + isSelected: function (index, address) { + return addressesView.isSelected(index, address) + } onAccountSelect: function (index) { addressesView.onAccountSelect(index) } diff --git a/ui/onboarding/Login/AddressView.qml b/ui/onboarding/Login/AddressView.qml index d7489c5e87..bc0f9cfb7b 100644 --- a/ui/onboarding/Login/AddressView.qml +++ b/ui/onboarding/Login/AddressView.qml @@ -10,7 +10,10 @@ Rectangle { property string address: "0x123345677890987654321123456" property url identicon: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAg0lEQVR4nOzXwQmAMBAFURV7sQybsgybsgyr0QYUlE1g+Mw7ioQMe9lMQwhDaAyhMYTGEJqYkPnrj/t5XE/ft2UdW1yken7MRAyhMYTGEBpDaAyhKe9JbzvSX9WdLWYihtAYQuMLkcYQGkPUScxEDKExhMYQGkNoDKExhMYQmjsAAP//ZfIUZgXTZXQAAAAASUVORK5CYII=" property var onAccountSelect: function() {} - property bool selected: loginModel.currentAccount.address === address + property var isSelected: function() {} + property bool selected: { + return isSelected(index, address) + } property bool isHovered: false id: addressViewDelegate @@ -31,6 +34,9 @@ Rectangle { Text { id: usernameText text: username + elide: Text.ElideRight + anchors.right: parent.right + anchors.rightMargin: Theme.padding font.pixelSize: 17 anchors.top: accountImage.top anchors.left: accountImage.right diff --git a/ui/onboarding/Login/SelectAnotherAccountModal.qml b/ui/onboarding/Login/SelectAnotherAccountModal.qml index 4d62deda5e..15c74fbc00 100644 --- a/ui/onboarding/Login/SelectAnotherAccountModal.qml +++ b/ui/onboarding/Login/SelectAnotherAccountModal.qml @@ -15,6 +15,10 @@ ModalPopup { anchors.fill: parent accounts: loginModel + isSelected: function (index, address) { + return loginModel.currentAccount.address === address + } + onAccountSelect: function(index) { popup.onAccountSelect(index) popup.close() diff --git a/ui/onboarding/qmldir b/ui/onboarding/qmldir index 1e290c8987..83a2ef7b93 100644 --- a/ui/onboarding/qmldir +++ b/ui/onboarding/qmldir @@ -7,4 +7,4 @@ OnboardingMain 1.0 OnboardingMain.qml Slide 1.0 Slide.qml EnterSeedPhraseModal 1.0 EnterSeedPhraseModal.qml CreatePasswordModal 1.0 CreatePasswordModal.qml - +GenKeyModal 1.0 GenKeyModal.qml