status-desktop/ui/app/AppLayouts/Onboarding/views/SeedPhraseWordsInputView.qml

184 lines
6.3 KiB
QML

import QtQuick 2.15
import QtQuick.Layouts 1.15
import QtQuick.Controls 2.15
import StatusQ.Core 0.1
import StatusQ.Core.Theme 0.1
import StatusQ.Controls 0.1
import utils 1.0
import "../stores"
Item {
id: root
property StartupStore startupStore
Component.onCompleted: {
d.dirtyWordAtIndex = [false, false, false, false]
d.validWordAtIndex = [false, false, false, false]
d.anyInputDirty = false
d.allEntriesValid = false
let seedPhrase = root.startupStore.getSeedPhrase()
if(seedPhrase.length === 0)
return
d.seedPhrases = seedPhrase.split(" ")
let numbers = []
while (numbers.length < 4) {
let randomNo = Math.floor(Math.random() * 12)
if(numbers.indexOf(randomNo) == -1)
numbers.push(randomNo)
}
numbers.sort((a, b) => { return a < b? -1 : a > b? 1 : 0 })
d.wordNumbers = numbers
}
QtObject {
id: d
property var seedPhrases: []
property var wordNumbers: []
property var dirtyWordAtIndex: [false, false, false, false]
property var validWordAtIndex: [false, false, false, false]
property bool anyInputDirty: false
property bool allEntriesValid: false
readonly property int numOfColumns: 4
readonly property int rowSpacing: Theme.bigPadding
readonly property int columnSpacing: Theme.bigPadding
function updateValidity(index, valid, dirty) {
dirtyWordAtIndex[index] = dirty
validWordAtIndex[index] = valid
let anyDirty = false
let allValid = true
for(let i = 0; i < validWordAtIndex.length; ++i) {
allValid = allValid && validWordAtIndex[i]
anyDirty = anyDirty || (dirtyWordAtIndex[index] && !validWordAtIndex[index])
}
allEntriesValid = allValid
anyInputDirty = anyDirty
}
}
ColumnLayout {
anchors.centerIn: parent
height: Constants.onboarding.loginHeight
spacing: Theme.bigPadding
StatusBaseText {
id: title
Layout.alignment: Qt.AlignHCenter
font.pixelSize: Constants.keycard.general.fontSize1
font.weight: Font.Bold
color: Theme.palette.directColor1
text: qsTr("Enter seed phrase words")
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
}
GridLayout {
id: grid
Layout.alignment: Qt.AlignHCenter
columns: d.numOfColumns
rowSpacing: d.rowSpacing
columnSpacing: d.columnSpacing
height: Constants.keycard.general.enterSeedPhraseWordsHeight
width: Constants.keycard.general.enterSeedPhraseWordsWidth
Component.onCompleted: {
for (var i = 0; i < children.length - 1; ++i) {
if(children[i].inputField && children[i+1].inputField){
children[i].inputField.input.tabNavItem = children[i+1].inputField.input.edit
}
}
}
Repeater {
model: d.wordNumbers
delegate: Item {
Layout.preferredWidth: Constants.keycard.general.seedPhraseCellWidth
Layout.preferredHeight: Constants.keycard.general.seedPhraseCellHeight
property alias inputField: word
property alias wN: wordNumber
StatusBaseText {
id: wordNumber
width: Constants.keycard.general.seedPhraseCellNumberWidth
anchors.left: parent.left
anchors.verticalCenter: parent.verticalCenter
horizontalAlignment: Qt.AlignRight
font.pixelSize: Constants.keycard.general.seedPhraseCellFontSize
color: Theme.palette.directColor1
text: "%1.".arg(model.modelData + 1)
}
StatusInput {
id: word
anchors.left: wordNumber.right
anchors.right: parent.right
anchors.verticalCenter: parent.verticalCenter
anchors.leftMargin: Theme.xlPadding
input.edit.font.pixelSize: Constants.keycard.general.seedPhraseCellFontSize
input.acceptReturn: true
onTextChanged: {
if(text.length == 0)
return
if(/(^\s|^\r|^\n)|(\s$|^\r$|^\n$)/.test(text)) {
text = text.trim()
return
}
else if(/\s|\r|\n/.test(text)) {
text = ""
return
}
valid = d.seedPhrases[model.modelData] === text
d.updateValidity(index, valid, text !== "")
}
onKeyPressed: {
if (d.allEntriesValid &&
(input.edit.keyEvent === Qt.Key_Return ||
input.edit.keyEvent === Qt.Key_Enter)) {
event.accepted = true
root.startupStore.doPrimaryAction()
}
}
}
}
}
}
StatusBaseText {
id: info
Layout.alignment: Qt.AlignHCenter
font.pixelSize: Constants.keycard.general.fontSize3
color: Theme.palette.dangerColor1
horizontalAlignment: Qt.AlignHCenter
text: d.anyInputDirty && !d.allEntriesValid? qsTr("Invalid word") : ""
}
Item {
Layout.fillWidth: true
Layout.fillHeight: true
}
StatusButton {
Layout.alignment: Qt.AlignHCenter
enabled: d.allEntriesValid
text: qsTr("Next")
onClicked: {
root.startupStore.doPrimaryAction()
}
}
}
}