WizardOpenWallet1: navigate with keyboard; enable accessibility

6 files changed, 101 insertions, 16 deletions

diff --git a/main.qml b/main.qml
index 280a54f3..60d4596f 100644
--- a/main.qml
+++ b/main.qml
@@ -212,6 +212,9 @@ ApplicationWindow {
             if (prevState) {
                 appWindow.viewState = prevState;
             }
+            if (wizard.wizardState == "wizardOpenWallet1") {
+                wizard.wizardStateView.wizardOpenWallet1View.pageRoot.forceActiveFocus();
+            }
         };
         passwordDialog.open(usefulName(persistentSettings.wallet_path));
     }
diff --git a/wizard/WizardController.qml b/wizard/WizardController.qml
index ba5266e0..72a108ce 100644
--- a/wizard/WizardController.qml
+++ b/wizard/WizardController.qml
@@ -82,6 +82,7 @@ Rectangle {
 
     property var m_wallet;
     property alias wizardState: wizardStateView.state
+    property alias wizardStateView: wizardStateView
     property alias wizardStackView: stackView
     property int wizardSubViewWidth: 780
     property int wizardSubViewTopMargin: persistentSettings.customDecorations ? 90 : 32
diff --git a/wizard/WizardHeader.qml b/wizard/WizardHeader.qml
index 1e10683d..9815bffa 100644
--- a/wizard/WizardHeader.qml
+++ b/wizard/WizardHeader.qml
@@ -43,7 +43,6 @@ ColumnLayout {
 
     Text {
         text: title
-        Layout.fillWidth: true
         font.family: MoneroComponents.Style.fontRegular.name
         color: MoneroComponents.Style.defaultFontColor
         opacity: MoneroComponents.Style.blackTheme ? 1.0 : 0.8
@@ -59,11 +58,15 @@ ColumnLayout {
         leftPadding: 0
         topPadding: 0
         bottomPadding: 0
+
+        Rectangle {
+            anchors.fill: parent
+            color: parent.parent.focus ? MoneroComponents.Style.titleBarButtonHoverColor : "transparent"
+        }
     }
 
     Text {
-        Layout.fillWidth: true
-        Layout.alignment: Qt.AlignCenter
+        Layout.alignment: Qt.AlignLeft
         visible: parent.subtitle !== ""
 
         color: MoneroComponents.Style.dimmedFontColor
@@ -81,5 +84,10 @@ ColumnLayout {
         wrapMode: Text.WordWrap
         leftPadding: 0
         topPadding: 0
+
+        Rectangle {
+            anchors.fill: parent
+            color: parent.parent.focus ? MoneroComponents.Style.titleBarButtonHoverColor : "transparent"
+        }
     }
 }
diff --git a/wizard/WizardHome.qml b/wizard/WizardHome.qml
index 2ef9fa36..540216e8 100644
--- a/wizard/WizardHome.qml
+++ b/wizard/WizardHome.qml
@@ -120,6 +120,7 @@ Rectangle {
 
                 onMenuClicked: {
                     wizardStateView.state = "wizardOpenWallet1"
+                    wizardStateView.wizardOpenWallet1View.pageRoot.forceActiveFocus();
                 }
             }
 
diff --git a/wizard/WizardNav.qml b/wizard/WizardNav.qml
index 59dba888..ce6a2e1f 100644
--- a/wizard/WizardNav.qml
+++ b/wizard/WizardNav.qml
@@ -36,6 +36,8 @@ import "../components" as MoneroComponents
 RowLayout {
     id: menuNav
     property alias progressEnabled: wizardProgress.visible
+    property var btnPrevKeyNavigationBackTab: btnNext
+    property var btnNextKeyNavigationTab: btnPrev
     property int progressSteps: 0
     property int progress: 0
     property bool autoTransition: true
@@ -77,7 +79,18 @@ RowLayout {
             onClicked: {
                 menuNav.m_prevClicked();
                 menuNav.prevClicked();
+                focus = false;
             }
+            Accessible.role: Accessible.Button
+            Accessible.name: text
+            KeyNavigation.up: btnPrevKeyNavigationBackTab
+            KeyNavigation.backtab: btnPrevKeyNavigationBackTab
+            KeyNavigation.down: wizardProgress.visible ? wizardProgress
+                                                       : btnNext.visible && btnNext.enabled ? btnNext
+                                                                                            : btnNextKeyNavigationTab
+            KeyNavigation.tab: wizardProgress.visible ? wizardProgress
+                                                      : btnNext.visible && btnNext.enabled ? btnNext
+                                                                                           : btnNextKeyNavigationTab
         }
     }
 
@@ -101,6 +114,17 @@ RowLayout {
                 // @TODO: Qt 5.10+ replace === with <=
                 color: index === menuNav.progress ? MoneroComponents.Style.defaultFontColor : MoneroComponents.Style.progressBarBackgroundColor
             }
+            Accessible.role: Accessible.Indicator
+            Accessible.name: qsTr("Step (%1) of (%2)").arg(currentIndex + 1).arg(count) + translationManager.emptyString
+            KeyNavigation.up: btnPrev
+            KeyNavigation.backtab: btnPrev
+            KeyNavigation.down: btnNext
+            KeyNavigation.tab: btnNext
+
+            Rectangle {
+                anchors.fill: parent
+                color: wizardProgress.focus ? MoneroComponents.Style.titleBarButtonHoverColor : "transparent"
+            }
         }
     }
 
@@ -119,7 +143,14 @@ RowLayout {
             onClicked: {
                 menuNav.m_nextClicked();
                 menuNav.nextClicked();
+                focus = false;
             }
+            Accessible.role: Accessible.Button
+            Accessible.name: text
+            KeyNavigation.up: wizardProgress.visible ? wizardProgress : btnPrev
+            KeyNavigation.backtab: wizardProgress.visible ? wizardProgress : btnPrev
+            KeyNavigation.down: btnNextKeyNavigationTab
+            KeyNavigation.tab: btnNextKeyNavigationTab
         }
     }
 }
diff --git a/wizard/WizardOpenWallet1.qml b/wizard/WizardOpenWallet1.qml
index 5aedb350..4e645cf1 100644
--- a/wizard/WizardOpenWallet1.qml
+++ b/wizard/WizardOpenWallet1.qml
@@ -45,6 +45,7 @@ Rectangle {
 
     color: "transparent"
     property alias pageHeight: pageRoot.height
+    property alias pageRoot: pageRoot
     property string viewName: "wizardOpenWallet1"
     property int walletCount: walletKeysFilesModel.rowCount()
 
@@ -58,6 +59,7 @@ Rectangle {
         width: parent.width - 100
         Layout.fillWidth: true
         anchors.horizontalCenter: parent.horizontalCenter;
+        KeyNavigation.tab: openWalletFromFileHeader
 
         spacing: 0
 
@@ -69,8 +71,15 @@ Rectangle {
             spacing: 10
 
             WizardHeader {
+                id: openWalletFromFileHeader
                 title: qsTr("Open a wallet from file") + translationManager.emptyString
                 subtitle: qsTr("Import an existing .keys wallet file from your computer.") + translationManager.emptyString
+                Accessible.role: Accessible.StaticText
+                Accessible.name: title + ". " + subtitle
+                Keys.onUpPressed: wizardNav.btnNext.forceActiveFocus();
+                Keys.onBacktabPressed: wizardNav.btnNext.forceActiveFocus();
+                Keys.onDownPressed: recentList.itemAt(0).forceActiveFocus();
+                Keys.onTabPressed: recentList.itemAt(0).forceActiveFocus();
             }
 
             GridLayout {
@@ -122,6 +131,27 @@ Rectangle {
                     Layout.minimumWidth: flow.itemHeight
                     Layout.preferredHeight: parent.height
 
+                    function moveUp(itemIndex) {
+                        if (itemIndex == 0) {
+                            openWalletFromFileHeader.forceActiveFocus();
+                        } else {
+                            recentList.itemAt(itemIndex - 1).forceActiveFocus();
+                        }
+                    }
+
+                    function moveDown(itemIndex) {
+                        if (itemIndex + 1 == recentList.count) {
+                            wizardNav.btnPrev.forceActiveFocus();
+                        } else {
+                            recentList.itemAt(itemIndex + 1).forceActiveFocus();
+                        }
+                    }
+
+                    function openSelectedWalletFile(networktype, path) {
+                        persistentSettings.nettype = parseInt(networktype);
+                        wizardController.openWalletFile(path);
+                    }
+
                     delegate: Rectangle {
                         // inherited roles from walletKeysFilesModel:
                         // index, fileName, modified, accessed, path, networktype, address
@@ -138,7 +168,24 @@ Rectangle {
                             else if(networktype === 2) return qsTr("Stagenet");
                             return "";
                         }
-                        color: "transparent"
+                        color: item.focus || itemMouseArea.containsMouse ? MoneroComponents.Style.titleBarButtonHoverColor : "transparent"
+                        border.width: item.focus ? 3 : 0
+                        border.color: MoneroComponents.Style.inputBorderColorActive
+
+                        Accessible.role: Accessible.ListItem
+                        Accessible.name: {
+                            if (networktype === 0) var networkTypeText = qsTr("Mainnet wallet") + translationManager.emptyString;
+                            if (networktype === 1) var networkTypeText = qsTr("Testnet wallet") + translationManager.emptyString;
+                            if (networktype === 2) var networkTypeText = qsTr("Stagenet wallet") + translationManager.emptyString;
+
+                            return fileName + ". " + networkTypeText;
+                        }
+                        Keys.onUpPressed: recentList.moveUp(index);
+                        Keys.onBacktabPressed: recentList.moveUp(index);
+                        Keys.onDownPressed: recentList.moveDown(index);
+                        Keys.onTabPressed: recentList.moveDown(index);
+                        Keys.onEnterPressed: recentList.openSelectedWalletFile(networktype, path);
+                        Keys.onReturnPressed: recentList.openSelectedWalletFile(networktype, path);
 
                         Rectangle {
                             height: 1
@@ -257,21 +304,11 @@ Rectangle {
                         }
 
                         MouseArea {
+                            id: itemMouseArea
                             anchors.fill: parent
                             hoverEnabled: true
                             cursorShape: Qt.PointingHandCursor
-
-                            onEntered: {
-                                parent.color = MoneroComponents.Style.titleBarButtonHoverColor;
-                            }
-                            onExited: {
-                                parent.color = "transparent";
-                            }
-                            onClicked: {
-                                persistentSettings.nettype = parseInt(networktype)
-
-                                wizardController.openWalletFile(path);
-                            }
+                            onClicked: recentList.openSelectedWalletFile(networktype, path);
                         }
                     }
                 }
@@ -282,11 +319,15 @@ Rectangle {
             }
 
             WizardNav {
+                id: wizardNav
                 Layout.topMargin: 0
                 progressEnabled: false
                 btnPrev.text: qsTr("Back to menu") + translationManager.emptyString
                 btnNext.text: qsTr("Browse filesystem") + translationManager.emptyString
                 btnNext.visible: true
+                btnPrevKeyNavigationBackTab: recentList.itemAt(recentList.count - 1)
+                btnNextKeyNavigationTab: openWalletFromFileHeader
+
                 onPrevClicked: {
                     wizardStateView.state = "wizardHome";
                 }