wizard v0.1

bitmonero.pro.user

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtCreator 3.1.2, 2014-07-23T13:00:52. -->
+<!-- Written by QtCreator 3.1.2, 2014-08-19T11:29:16. -->
 <qtcreator>
  <data>
   <variable>ProjectExplorer.Project.ActiveTarget</variable>

components/TitleBar.qml

@@ -10,6 +10,7 @@ Rectangle {
     property string walletName: "Donations"
     property bool containsMouse: false
     property alias maximizeButtonVisible: maximizeButton.visible
+    property alias basicButtonVisible: goToBasicVersionButton.visible
     signal goToBasicVersion(bool yes)
 
     Text {

lang/languages.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<languages>
+	<language name="US English" flag="/lang/flags/usa.png" qs="none"/>
+	<language name="UK English" flag="/lang/flags/uk.png" qs="none"/>
+	<language name="Russia" flag="/lang/flags/russia.png" qs="none"/>
+	<language name="RPA" flag="/lang/flags/rpa.png" qs="none"/>
+	<language name="Palestine" flag="/lang/flags/palestine.png" qs="none"/>
+	<language name="India" flag="/lang/flags/india.png" qs="none"/>
+	<language name="German" flag="/lang/flags/german.png" qs="none"/>
+	<language name="China" flag="/lang/flags/china.png" qs="none"/>
+	<language name="Brazil" flag="/lang/flags/brazil.png" qs="none"/>
+	<language name="Bangladesh" flag="/lang/flags/bangladesh.png" qs="none"/>
+</languages>

main.cpp

@@ -13,6 +13,7 @@ int main(int argc, char *argv[])
     qmlRegisterType<clipboardAdapter>("moneroComponents", 1, 0, "Clipboard");
 
     QQmlApplicationEngine engine;
+    engine.rootContext()->setContextProperty("applicationDirectory", QApplication::applicationDirPath());
     engine.load(QUrl(QStringLiteral("qrc:///main.qml")));
     QObject *rootObject = engine.rootObjects().first();
 

main.qml

@@ -3,6 +3,7 @@ import QtQuick.Window 2.0
 import QtQuick.Controls 1.1
 import QtQuick.Controls.Styles 1.1
 import "components"
+import "wizard"
 
 ApplicationWindow {
     id: appWindow
@@ -98,6 +99,26 @@ ApplicationWindow {
         anchors.fill: parent
         clip: true
 
+        state: "wizard"
+        states: [
+            State {
+                name: "wizard"
+                PropertyChanges { target: leftPanel; visible: false }
+                PropertyChanges { target: rightPanel; visible: false }
+                PropertyChanges { target: middlePanel; visible: false }
+                PropertyChanges { target: titleBar; basicButtonVisible: false }
+                PropertyChanges { target: wizard; visible: true }
+            },
+            State {
+                name: "normal"
+                PropertyChanges { target: leftPanel; visible: true }
+                PropertyChanges { target: rightPanel; visible: true }
+                PropertyChanges { target: middlePanel; visible: true }
+                PropertyChanges { target: titleBar; basicButtonVisible: true }
+                PropertyChanges { target: wizard; visible: false }
+            }
+        ]
+
         LeftPanel {
             id: leftPanel
             anchors.left: parent.left
@@ -261,6 +282,11 @@ ApplicationWindow {
             }
         }
 
+        WizardMain {
+            id: wizard
+            anchors.fill: parent
+        }
+
         property int maxWidth: leftPanel.width + 655 + rightPanel.width
         property int maxHeight: 700
         MouseArea {

qml.qrc

@@ -80,5 +80,14 @@
         <file>images/checkedVioletIcon.png</file>
         <file>images/resize.png</file>
         <file>images/resizeHovered.png</file>
+        <file>wizard/WizardWelcome.qml</file>
+        <file>wizard/WizardMain.qml</file>
+        <file>images/nextPage.png</file>
+        <file>images/prevPage.png</file>
+        <file>wizard/WizardOptions.qml</file>
+        <file>images/createWallet.png</file>
+        <file>images/openAccount.png</file>
+        <file>images/recoverWallet.png</file>
+        <file>wizard/WizardCreateWallet.qml</file>
     </qresource>
 </RCC>

wizard/WizardCreateWallet.qml

@@ -0,0 +1,5 @@
+import QtQuick 2.2
+
+Item {
+
+}

wizard/WizardMain.qml

@@ -0,0 +1,96 @@
+import QtQuick 2.2
+
+Rectangle {
+    id: wizard
+    border.color: "#DBDBDB"
+    border.width: 1
+    color: "#FFFFFF"
+
+    Rectangle {
+        id: nextButton
+        anchors.verticalCenter: parent.verticalCenter
+        anchors.right: parent.right
+        anchors.rightMargin: 50
+
+        width: 50; height: 50
+        radius: 25
+        color: nextArea.containsMouse ? "#FF4304" : "#FF6C3C"
+
+        Image {
+            anchors.centerIn: parent
+            anchors.horizontalCenterOffset: 3
+            source: "qrc:///images/nextPage.png"
+        }
+
+        MouseArea {
+            id: nextArea
+            anchors.fill: parent
+            hoverEnabled: true
+            onClicked: wizard.switchPage(true)
+        }
+    }
+
+    property int currentPage: 0
+    function switchPage(next) {
+        var pages = new Array()
+        pages[0] = welcomePage
+        pages[1] = optionsPage
+
+        if(next === false) {
+            if(currentPage > 0) {
+                pages[currentPage].opacity = 0
+                pages[--currentPage].opacity = 1
+            }
+        } else {
+            if(currentPage < pages.length - 1) {
+                pages[currentPage].opacity = 0
+                pages[++currentPage].opacity = 1
+            }
+        }
+    }
+
+    WizardWelcome {
+        id: welcomePage
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+        anchors.right: nextButton.left
+        anchors.left: prevButton.right
+        anchors.leftMargin: 50
+        anchors.rightMargin: 50
+    }
+
+    WizardOptions {
+        id: optionsPage
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+        anchors.right: nextButton.left
+        anchors.left: prevButton.right
+        anchors.leftMargin: 50
+        anchors.rightMargin: 50
+    }
+
+    Rectangle {
+        id: prevButton
+        anchors.verticalCenter: parent.verticalCenter
+        anchors.left: parent.left
+        anchors.leftMargin: 50
+        visible: parent.currentPage > 0
+
+        width: 50; height: 50
+        radius: 25
+        color: prevArea.containsMouse ? "#FF4304" : "#FF6C3C"
+
+        Image {
+            anchors.centerIn: parent
+            anchors.horizontalCenterOffset: -3
+            source: "qrc:///images/prevPage.png"
+        }
+
+        MouseArea {
+            id: prevArea
+            anchors.fill: parent
+            hoverEnabled: true
+            onClicked: wizard.switchPage(false)
+        }
+    }
+}

wizard/WizardOptions.qml

@@ -0,0 +1,131 @@
+import QtQuick 2.2
+
+Item {
+    opacity: 0
+    visible: false
+    Behavior on opacity {
+        NumberAnimation { duration: 100; easing.type: Easing.InQuad }
+    }
+
+    onOpacityChanged: visible = opacity !== 0
+
+    Column {
+        id: headerColumn
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.topMargin: 74
+        spacing: 24
+
+        Text {
+            font.family: "Arial"
+            font.pixelSize: 28
+            //renderType: Text.NativeRendering
+            color: "#3F3F3F"
+            text: qsTr("I want")
+        }
+
+        Text {
+            font.family: "Arial"
+            font.pixelSize: 18
+            //renderType: Text.NativeRendering
+            color: "#4A4646"
+            text: qsTr("Please select one of the following options:")
+        }
+    }
+
+    Row {
+        anchors.centerIn: parent
+        spacing: 50
+
+        Column {
+            anchors.verticalCenter: parent.verticalCenter
+            spacing: 30
+
+            Rectangle {
+                width: 202; height: 202
+                radius: 101
+                color: createWalletArea.containsMouse ? "#DBDBDB" : "#FFFFFF"
+
+                Image {
+                    anchors.centerIn: parent
+                    source: "qrc:///images/createWallet.png"
+                }
+
+                MouseArea {
+                    id: createWalletArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                }
+            }
+
+            Text {
+                font.family: "Arial"
+                font.pixelSize: 16
+                color: "#4A4949"
+                horizontalAlignment: Text.AlignHCenter
+                text: qsTr("This is my first time, I want to<br/>create a new account")
+            }
+        }
+
+        Column {
+            anchors.verticalCenter: parent.verticalCenter
+            spacing: 30
+
+            Rectangle {
+                width: 202; height: 202
+                radius: 101
+                color: recoverWalletArea.containsMouse ? "#DBDBDB" : "#FFFFFF"
+
+                Image {
+                    anchors.centerIn: parent
+                    source: "qrc:///images/recoverWallet.png"
+                }
+
+                MouseArea {
+                    id: recoverWalletArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                }
+            }
+
+            Text {
+                font.family: "Arial"
+                font.pixelSize: 16
+                color: "#4A4949"
+                horizontalAlignment: Text.AlignHCenter
+                text: qsTr("I want to recover my account<br/>from my 24 work seed")
+            }
+        }
+
+        Column {
+            anchors.verticalCenter: parent.verticalCenter
+            spacing: 30
+
+            Rectangle {
+                width: 202; height: 202
+                radius: 101
+                color: openAccountArea.containsMouse ? "#DBDBDB" : "#FFFFFF"
+
+                Image {
+                    anchors.centerIn: parent
+                    source: "qrc:///images/openAccount.png"
+                }
+
+                MouseArea {
+                    id: openAccountArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                }
+            }
+
+            Text {
+                font.family: "Arial"
+                font.pixelSize: 16
+                color: "#4A4949"
+                horizontalAlignment: Text.AlignHCenter
+                text: qsTr("I want to open account file")
+            }
+        }
+    }
+}

wizard/WizardWelcome.qml

@@ -0,0 +1,102 @@
+import QtQuick 2.2
+import QtQuick.XmlListModel 2.0
+
+Item {
+    Behavior on opacity {
+        NumberAnimation { duration: 100; easing.type: Easing.InQuad }
+    }
+
+    onOpacityChanged: visible = opacity !== 0
+
+    Column {
+        id: headerColumn
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.topMargin: 74
+        spacing: 24
+
+        Text {
+            font.family: "Arial"
+            font.pixelSize: 28
+            //renderType: Text.NativeRendering
+            color: "#3F3F3F"
+            text: qsTr("Welcome")
+        }
+
+        Text {
+            font.family: "Arial"
+            font.pixelSize: 18
+            //renderType: Text.NativeRendering
+            color: "#4A4646"
+            text: qsTr("Please choose a language and regional format.")
+        }
+    }
+
+    XmlListModel {
+        id: languagesModel
+        source: "file:///" + applicationDirectory + "/lang/languages.xml"
+        query: "/languages/language"
+
+        XmlRole { name: "name"; query: "@name/string()" }
+        XmlRole { name: "flag"; query: "@flag/string()" }
+        XmlRole { name: "isCurrent"; query: "@enabled/string()" }
+    }
+
+    ListView {
+        id: listView
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+        anchors.top: headerColumn.bottom
+        anchors.topMargin: 24
+        clip: true
+
+        model: languagesModel
+        delegate: Item {
+            width: listView.width
+            height: 80
+
+            Rectangle {
+                id: flagRect
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.left: parent.left
+                width: 60; height: 60
+                radius: 30
+                color: listView.currentIndex === index ? "#DBDBDB" : "#FFFFFF"
+
+                Image {
+                    anchors.centerIn: parent
+                    source: "file:///" + applicationDirectory + flag
+                }
+            }
+
+            Text {
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.left: flagRect.right
+                anchors.right: parent.right
+                anchors.leftMargin: 16
+                font.family: "Arial"
+                font.pixelSize: 24
+                font.bold: listView.currentIndex === index
+                elide: Text.ElideRight
+                color: "#3F3F3F"
+                text: name
+            }
+
+            Rectangle {
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.bottom: parent.bottom
+                height: 1
+                color: "#DBDBDB"
+            }
+
+            MouseArea {
+                id: delegateArea
+                anchors.fill: parent
+                onClicked: listView.currentIndex = index
+            }
+        }
+    }
+}