simplified window v1

BasicPanel.qml

@@ -0,0 +1,148 @@
+import QtQuick 2.0
+import "components"
+
+Rectangle {
+    width: 470
+    height: 334
+    color: "#F0EEEE"
+    border.width: 1
+    border.color: "#DBDBDB"
+
+    Rectangle {
+        id: header
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.leftMargin: 1
+        anchors.rightMargin: 1
+        anchors.topMargin: 30
+        height: 64
+        color: "#FFFFFF"
+
+        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
+            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: 100
+                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("Availible Balance:")
+            }
+
+            Text {
+                id: availableBalanceText
+                width: 100
+                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"
+        }
+    }
+
+    Row {
+        id: row
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: header.bottom
+        anchors.margins: 12
+        spacing: 12
+
+        LineEdit {
+            height: 32
+            fontSize: 15
+            width: parent.width - sendButton.width - row.spacing
+            placeholderText: qsTr("amount...")
+        }
+
+        StandardButton {
+            id: sendButton
+            width: 60
+            height: 32
+            fontSize: 11
+            text: qsTr("SEND")
+            shadowReleasedColor: "#FF4304"
+            shadowPressedColor: "#B32D00"
+            releasedColor: "#FF6C3C"
+            pressedColor: "#FF4304"
+        }
+    }
+
+    LineEdit {
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: row.bottom
+        anchors.margins: 12
+        fontSize: 15
+        height: 32
+        placeholderText: qsTr("destination...")
+    }
+}

bitmonero.pro.user

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtCreator 3.1.2, 2014-07-16T19:37:13. -->
+<!-- Written by QtCreator 3.1.2, 2014-07-18T18:25:55. -->
 <qtcreator>
  <data>
   <variable>ProjectExplorer.Project.ActiveTarget</variable>

components/Input.qml

@@ -4,7 +4,6 @@ import QtQuick 2.2
 
 TextField {
     font.family: "Arial"
-    font.pixelSize: 18
 
     style: TextFieldStyle {
         textColor: "#3F3F3F"

components/LineEdit.qml

@@ -3,6 +3,7 @@ import QtQuick 2.0
 Item {
     property alias placeholderText: input.placeholderText
     property alias text: input.text
+    property int fontSize: 18
     height: 37
 
     Rectangle {
@@ -24,5 +25,6 @@ Item {
         anchors.fill: parent
         anchors.leftMargin: 4
         anchors.rightMargin: 4
+        font.pixelSize: parent.fontSize
     }
 }

components/StandardButton.qml

@@ -1,6 +1,7 @@
 import QtQuick 2.0
 
 Item {
+    id: button
     height: 37
     property string shadowPressedColor
     property string shadowReleasedColor
@@ -8,6 +9,7 @@ Item {
     property string releasedColor
     property string icon: ""
     property string textColor: "#FFFFFF"
+    property int fontSize: 12
     property alias text: label.text
     signal clicked()
 
@@ -39,7 +41,7 @@ Item {
         font.family: "Arial"
         font.bold: true
         font.letterSpacing: -1
-        font.pixelSize: 12
+        font.pixelSize: button.fontSize
         color: parent.textColor
         visible: parent.icon === ""
     }

components/TitleBar.qml

@@ -8,6 +8,8 @@ Rectangle {
     y: -height
     property int mouseX: 0
     property int mouseY: 0
+    property alias maximizeButtonVisible: maximizeButton.visible
+    signal goToBasicVersion(bool yes)
 
     Text {
         anchors.centerIn: parent
@@ -21,6 +23,32 @@ Rectangle {
     Behavior on y {
         NumberAnimation { duration: 100; easing.type: Easing.InQuad }
     }
+
+    Rectangle {
+        id: goToBasicVersionButton
+        property bool containsMouse: titleBar.mouseX >= x && titleBar.mouseX <= x + width
+        property bool checked: false
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+        anchors.left: parent.left
+        width: height
+        color:  containsMouse || checked ? "#FFE00A" : "#000000"
+
+        Image {
+            anchors.centerIn: parent
+            rotation: parent.checked ? 180 : 0
+            source: parent.containsMouse || parent.checked ? "../images/goToBasicVersionHovered.png" :
+                                                             "../images/gotoBasicVersion.png"
+        }
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: {
+                parent.checked = !parent.checked
+                titleBar.goToBasicVersion(parent.checked)
+            }
+        }
+    }
     
     Row {
         id: row
@@ -69,17 +97,17 @@ Rectangle {
         }
         
         Rectangle {
+            id: maximizeButton
             property bool containsMouse: titleBar.mouseX >= x + row.x && titleBar.mouseX <= x + row.x + width
             anchors.top: parent.top
             anchors.bottom: parent.bottom
             width: height
             color: containsMouse ? "#FF6C3C" : "#000000"
-            property bool checked: false
             
             Image {
                 anchors.centerIn: parent
-                source: parent.checked ?  "../images/backToWindowIcon.png" :
+                source: appWindow.visibility === Window.FullScreen ?  "../images/backToWindowIcon.png" :
-                                          "../images/maximizeIcon.png"
+                                                                      "../images/maximizeIcon.png"
 
             }
             
@@ -87,9 +115,8 @@ Rectangle {
                 id: maximizeArea
                 anchors.fill: parent
                 onClicked: {
-                    parent.checked = !parent.checked
+                    appWindow.visibility = appWindow.visibility !== Window.FullScreen ? Window.FullScreen :
-                    appWindow.visibility = parent.checked ? Window.FullScreen :
+                                                                                        Window.Windowed
-                                                            Window.Windowed
                 }
             }
         }

main.qml

@@ -85,14 +85,18 @@ ApplicationWindow {
     width: rightPanelExpanded ? 1269 : 1269 - 300
     height: 800
     color: "#FFFFFF"
-    x: (Screen.width - width) / 2
-    y: (Screen.height - height) / 2
     flags: Qt.FramelessWindowHint | Qt.WindowSystemMenuHint | Qt.Window | Qt.WindowMinimizeButtonHint
-    onWidthChanged: if(width < 1269) x -= 0
+    onWidthChanged: x -= 0
+
+    Component.onCompleted: {
+        x = (Screen.width - width) / 2
+        y = (Screen.height - height) / 2
+    }
 
     Item {
         id: rootItem
         anchors.fill: parent
+        clip: true
 
         MouseArea {
             property var previousPosition
@@ -112,8 +116,8 @@ ApplicationWindow {
         LeftPanel {
             id: leftPanel
             anchors.left: parent.left
-            anchors.top: parent.top
             anchors.bottom: parent.bottom
+            height: parent.height
             onDashboardClicked: middlePanel.state = "Dashboard"
             onHistoryClicked: middlePanel.state = "History"
             onTransferClicked: middlePanel.state = "Transfer"
@@ -125,18 +129,18 @@ ApplicationWindow {
         RightPanel {
             id: rightPanel
             anchors.right: parent.right
-            anchors.top: parent.top
             anchors.bottom: parent.bottom
+            height: parent.height
             width: appWindow.rightPanelExpanded ? 300 : 0
             visible: appWindow.rightPanelExpanded
         }
 
         MiddlePanel {
             id: middlePanel
-            anchors.top: parent.top
             anchors.bottom: parent.bottom
             anchors.left: leftPanel.right
             anchors.right: rightPanel.left
+            height: parent.height
             state: "Dashboard"
         }
 
@@ -147,16 +151,24 @@ ApplicationWindow {
             z: 100
         }
 
+        BasicPanel {
+            id: basicPanel
+            x: 0
+            anchors.bottom: parent.bottom
+            visible: false
+        }
+
         MouseArea {
             id: frameArea
+            property bool blocked: false
             anchors.top: parent.top
             anchors.left: parent.left
             anchors.right: parent.right
             height: 30
             z: 1
             hoverEnabled: true
-            onEntered: titleBar.y = 0
+            onEntered: if(!blocked) titleBar.y = 0
-            onExited: titleBar.y = -titleBar.height
+            onExited: if(!blocked) titleBar.y = -titleBar.height
             propagateComposedEvents: true
             onPressed: mouse.accepted = false
             onReleased: mouse.accepted = false
@@ -166,10 +178,115 @@ ApplicationWindow {
             }
         }
 
+        SequentialAnimation {
+            id: goToBasicAnimation
+            PropertyAction {
+                target: appWindow
+                properties: "visibility"
+                value: Window.Windowed
+            }
+            PropertyAction {
+                target: titleBar
+                properties: "maximizeButtonVisible"
+                value: false
+            }
+            PropertyAction {
+                target: frameArea
+                properties: "blocked"
+                value: true
+            }
+            NumberAnimation {
+                target: appWindow
+                properties: "height"
+                to: 30
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+            NumberAnimation {
+                target: appWindow
+                properties: "width"
+                to: 470
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+            PropertyAction {
+                targets: [leftPanel, middlePanel, rightPanel]
+                properties: "visible"
+                value: false
+            }
+            PropertyAction {
+                target: basicPanel
+                properties: "visible"
+                value: true
+            }
+            NumberAnimation {
+                target: appWindow
+                properties: "height"
+                to: 334
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+
+            onStopped: {
+                middlePanel.visible = false
+                rightPanel.visible = false
+                leftPanel.visible = false
+            }
+        }
+
+        SequentialAnimation {
+            id: goToProAnimation
+            NumberAnimation {
+                target: appWindow
+                properties: "height"
+                to: 30
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+            PropertyAction {
+                target: basicPanel
+                properties: "visible"
+                value: false
+            }
+            PropertyAction {
+                targets: [leftPanel, middlePanel, rightPanel]
+                properties: "visible"
+                value: true
+            }
+            NumberAnimation {
+                target: appWindow
+                properties: "width"
+                to: rightPanelExpanded ? 1269 : 1269 - 300
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+            NumberAnimation {
+                target: appWindow
+                properties: "height"
+                to: 800
+                easing.type: Easing.InCubic
+                duration: 200
+            }
+            PropertyAction {
+                target: frameArea
+                properties: "blocked"
+                value: false
+            }
+            PropertyAction {
+                target: titleBar
+                properties: "maximizeButtonVisible"
+                value: true
+            }
+        }
+
         TitleBar {
             id: titleBar
             anchors.left: parent.left
             anchors.right: parent.right
+            onGoToBasicVersion: {
+                if(yes) goToBasicAnimation.start()
+                else goToProAnimation.start()
+            }
         }
     }
 }

qml.qrc

@@ -72,5 +72,9 @@
         <file>images/expandTable.png</file>
         <file>images/dropdownDel.png</file>
         <file>components/HistoryTable.qml</file>
+        <file>images/gotoBasicVersion.png</file>
+        <file>images/goToBasicVersionHovered.png</file>
+        <file>BasicPanel.qml</file>
+        <file>images/moneroLogo2.png</file>
     </qresource>
 </RCC>