Minimized aka basic mode

BasicPanel.qml

@@ -31,6 +31,8 @@ import QtGraphicalEffects 1.0
 import "components"
 import "pages"
 
+// mbg033 @ 2016-10-08: Not used anymore, to be deleted
+
 Rectangle {
     id: root
     width: 470

MiddlePanel.qml

@@ -29,17 +29,24 @@
 import QtQuick 2.2
 import QtQml 2.0
 import QtQuick.Controls 2.0
+import QtQuick.Layouts 1.1
 import QtGraphicalEffects 1.0
 import "pages"
 
 Rectangle {
     id: root
+
+    property Item currentView
+    property bool basicMode : false
     property Transfer transferView: Transfer { }
     property Receive receiveView: Receive { }
     property History historyView: History { }
     property Settings settingsView: Settings { }
 
-    property Item currentView
+    signal paymentClicked(string address, string paymentId, double amount, int mixinCount, int priority)
+    signal generatePaymentIdInvoked()
+
+    color: "#F0EEEE"
 
     onCurrentViewChanged: {
         if (currentView) {
@@ -52,9 +59,7 @@ Rectangle {
         }
     }
 
-    color: "#F0EEEE"
+
-    signal paymentClicked(string address, string paymentId, double amount, int mixinCount, int priority)
-    signal generatePaymentIdInvoked()
 
 //    states: [
 //        State {
@@ -107,11 +112,15 @@ Rectangle {
             }
         ]
 
+
+    // color stripe at the top
     Row {
         id: styledRow
+        height: 4
+        anchors.top: parent.top
         anchors.left: parent.left
         anchors.right: parent.right
-        anchors.top: parent.top
+
 
         Rectangle { height: 4; width: parent.width / 5; color: "#FFE00A" }
         Rectangle { height: 4; width: parent.width / 5; color: "#6B0072" }
@@ -120,24 +129,127 @@ Rectangle {
         Rectangle { height: 4; width: parent.width / 5; color: "#FF4F41" }
     }
 
-    StackView {
+    ColumnLayout {
-        id: stackView
-        initialItem: transferView
         anchors.fill: parent
-        anchors.margins: 4
+        anchors.margins: 2
-        clip: true // otherwise animation will affect left panel
+        anchors.topMargin: 30
-    }
+        spacing: 0
 
-    /* connect "payment" click */
+
-    Connections {
+        // BasicPanel header
-        ignoreUnknownSignals: false
+        Rectangle {
-        target: transferView
+            id: header
-        onPaymentClicked : {
+            anchors.leftMargin: 1
-            console.log("MiddlePanel: paymentClicked")
+            anchors.rightMargin: 1
-            paymentClicked(address, paymentId, amount, mixinCount, priority)
+            Layout.fillWidth: true
+            Layout.preferredHeight: 64
+            color: "#FFFFFF"
+            visible: false
+
+            Image {
+                id: logo
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.verticalCenterOffset: -5
+                anchors.left: parent.left
+                anchors.leftMargin: 20
+                source: "images/moneroLogo2.png"
+            }
+
+            Grid {
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.right: parent.right
+                width: 256
+                columns: 3
+
+                Text {
+
+                    width: 116
+                    height: 20
+                    font.family: "Arial"
+                    font.pixelSize: 12
+                    font.letterSpacing: -1
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignLeft
+                    verticalAlignment: Text.AlignBottom
+                    color: "#535353"
+                    text: qsTr("Locked Balance:")
+                }
+
+                Text {
+                    id: balanceText
+                    width: 110
+                    height: 20
+                    font.family: "Arial"
+                    font.pixelSize: 18
+                    font.letterSpacing: -1
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignLeft
+                    verticalAlignment: Text.AlignBottom
+                    color: "#000000"
+                    text: qsTr("78.9239845")
+                }
+
+                Item {
+                    height: 20
+                    width: 20
+
+                    Image {
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.left: parent.left
+                        source: "images/lockIcon.png"
+                    }
+                }
+
+                Text {
+                    width: 116
+                    height: 20
+                    font.family: "Arial"
+                    font.pixelSize: 12
+                    font.letterSpacing: -1
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignLeft
+                    verticalAlignment: Text.AlignBottom
+                    color: "#535353"
+                    text: qsTr("Available Balance:")
+                }
+
+                Text {
+                    id: availableBalanceText
+                    width: 110
+                    height: 20
+                    font.family: "Arial"
+                    font.pixelSize: 14
+                    font.letterSpacing: -1
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignLeft
+                    verticalAlignment: Text.AlignBottom
+                    color: "#000000"
+                    text: qsTr("2324.9239845")
+                }
+            }
+
+            Rectangle {
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.bottom: parent.bottom
+                height: 1
+                color: "#DBDBDB"
+            }
+        }
+
+        // Views container
+        StackView {
+            id: stackView
+            initialItem: transferView
+            anchors.topMargin: 30
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+            anchors.top: styledRow.bottom
+            anchors.margins: 4
+            clip: true // otherwise animation will affect left panel
         }
     }
-
+    // border
     Rectangle {
         anchors.top: styledRow.bottom
         anchors.bottom: parent.bottom
@@ -160,12 +272,25 @@ Rectangle {
         anchors.bottom: parent.bottom
         height: 1
         color: "#DBDBDB"
+
     }
 
-    // indicate disabled state
+
+    // indicates disabled state
     Desaturate {
         anchors.fill: parent
         source: parent
         desaturation: root.enabled ? 0.0 : 1.0
     }
+
+
+    /* connect "payment" click */
+    Connections {
+        ignoreUnknownSignals: false
+        target: transferView
+        onPaymentClicked : {
+            console.log("MiddlePanel: paymentClicked")
+            paymentClicked(address, paymentId, amount, mixinCount, priority)
+        }
+    }
 }

main.qml

@@ -230,9 +230,9 @@ ApplicationWindow {
 
     function onWalletUpdate() {
         console.log(">>> wallet updated")
-        basicPanel.unlockedBalanceText = leftPanel.unlockedBalanceText =
+//        basicPanel.unlockedBalanceText = leftPanel.unlockedBalanceText =
-                walletManager.displayAmount(currentWallet.unlockedBalance);
+//                walletManager.displayAmount(currentWallet.unlockedBalance);
-        basicPanel.balanceText = leftPanel.balanceText = walletManager.displayAmount(currentWallet.balance);
+//        basicPanel.balanceText = leftPanel.balanceText = walletManager.displayAmount(currentWallet.balance);
     }
 
     function onWalletRefresh() {
@@ -396,7 +396,7 @@ ApplicationWindow {
         middlePanel.enabled = enable;
         leftPanel.enabled = enable;
         rightPanel.enabled = enable;
-        basicPanel.enabled = enable;
+        // basicPanel.enabled = enable;
     }
 
     function showProcessingSplash(message) {
@@ -573,7 +573,7 @@ ApplicationWindow {
         MiddlePanel {
             id: middlePanel
             anchors.bottom: parent.bottom
-            anchors.left: leftPanel.right
+            anchors.left: leftPanel.visible ?  leftPanel.right : parent.left
             anchors.right: rightPanel.left
             height: parent.height
             state: "Transfer"
@@ -585,16 +585,6 @@ ApplicationWindow {
             visible: false
         }
 
-        BasicPanel {
-            id: basicPanel
-            x: 0
-            anchors.bottom: parent.bottom
-            anchors.top: parent.top
-            anchors.left: parent.left
-            anchors.right: parent.right
-            visible: false
-        }
-
         MouseArea {
             id: frameArea
             property bool blocked: false
@@ -650,25 +640,26 @@ ApplicationWindow {
                 duration: 200
             }
             PropertyAction {
-                targets: [leftPanel, middlePanel, rightPanel]
+                targets: [leftPanel, rightPanel]
                 properties: "visible"
                 value: false
             }
             PropertyAction {
-                target: basicPanel
+                target: middlePanel
-                properties: "visible"
+                properties: "basicMode"
                 value: true
             }
+
             NumberAnimation {
                 target: appWindow
                 properties: "height"
-                to: basicPanel.height
+                to: middlePanel.height
                 easing.type: Easing.InCubic
                 duration: 200
             }
 
             onStopped: {
-                middlePanel.visible = false
+                // middlePanel.visible = false
                 rightPanel.visible = false
                 leftPanel.visible = false
             }
@@ -684,8 +675,8 @@ ApplicationWindow {
                 duration: 200
             }
             PropertyAction {
-                target: basicPanel
+                target: middlePanel
-                properties: "visible"
+                properties: "basicMode"
                 value: false
             }
             PropertyAction {
@@ -778,8 +769,13 @@ ApplicationWindow {
             anchors.left: parent.left
             anchors.right: parent.right
             onGoToBasicVersion: {
-                if(yes) goToBasicAnimation.start()
+                if (yes) {
-                else goToProAnimation.start()
+                    // basicPanel.currentView = middlePanel.currentView
+                    goToBasicAnimation.start()
+                } else {
+                    // middlePanel.currentView = basicPanel.currentView
+                    goToProAnimation.start()
+                }
             }
 
             MouseArea {

pages/History.qml

@@ -41,7 +41,6 @@ Rectangle {
     property var model
 
     color: "#F0EEEE"
-
     onModelChanged: {
         if (typeof model !== 'undefined') {
             // setup date filter scope according to real transactions