X-Git-Url: http://cgit.sxemacs.org/?p=harmattan%2Fcameraplus;a=blobdiff_plain;f=qml%2FCameraToolBar.qml;h=b53039b0b7cef26f4ee3abd37cd96843ba85eebe;hp=32b6f35f4c8f6ada1b0e2da7ffb834284d95686c;hb=1e779900f88632737d61893ef5d315995fb27b71;hpb=6cc9c36a2a705294e0223b680db5a54de1ebd5ab

diff --git a/qml/CameraToolBar.qml b/qml/CameraToolBar.qml
index 32b6f35..b53039b 100644
--- a/qml/CameraToolBar.qml
+++ b/qml/CameraToolBar.qml
@@ -3,7 +3,7 @@
 /*!
  * This file is part of CameraPlus.
  *
- * Copyright (C) 2012 Mohammed Sameer <msameer@foolab.org>
+ * Copyright (C) 2012-2013 Mohammed Sameer <msameer@foolab.org>
  *
  * This library is free software; you can redistribute it and/or
  * modify it under the terms of the GNU Lesser General Public
@@ -20,110 +20,139 @@
  * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
  */
 
-import QtQuick 1.1
-import com.nokia.meego 1.1
+import QtQuick 2.0
 import "CameraToolBar.js" as Layout
 
 Rectangle {
-        id: tools
-        property bool expanded: false
-        property list<Item> items
-        property int targetWidth: parent.width - (2 * anchors.leftMargin)
-        property alias menuWidth: menu.width
-        property bool manualBack: false
-        signal clicked
-
-        height: menu.height
-        width: expanded ? targetWidth : menu.width
-        color: expanded ? "black" : width == menu.width ? "transparent" : "black"
-        border.color: expanded ? "gray" : width == menu.width ? "transparent" : "gray"
-        radius: 20
-
-        Behavior on width {
-                PropertyAnimation { duration: 100; }
-        }
+    id: toolBar
 
-        ToolIcon {
-                property bool __isMenu: true
-                id: menu
-                anchors.verticalCenter: parent.verticalCenter
-                iconSource: "image://theme/icon-m-toolbar-back-white"
-                onClicked: {
-                        if (tools.manualBack) {
-                                tools.clicked();
-                                return;
-                        }
-
-                        if (!expanded) {
-                                expanded = true;
-                        }
-                        else if (Layout.stack.length == 1) {
-                                expanded = false;
-                        }
-                        else {
-                                Layout.pop();
-                        }
-                }
-
-                anchors.left: parent.left
-                rotation: 180
-        }
+    property bool expanded: true
+    property real targetWidth: parent.width - anchors.leftMargin - anchors.rightMargin
+    property bool manualBack: false
+    property bool hideBack: false
+    signal clicked
 
-        onExpandedChanged: {
-                if (tools.expanded) {
-                        tools.push(tools.items);
-                }
-                else {
-                        tools.pop();
-                }
+    property CameraToolBarTools tools
+    property CameraToolBarTools __currentTools
+
+    function push(tools) {
+        if (expanded) {
+            __currentTools = Layout.pushAndShow(tools)
+        }
+        else {
+            __currentTools = Layout.push(tools)
         }
+    }
 
-        onWidthChanged: Layout.layout();
-        onTargetWidthChanged: Layout.layout();
+    function pop() {
+        __currentTools = Layout.pop();
+    }
 
-        function push(items) {
-                return Layout.push(items);
+    onToolsChanged: {
+        push(tools)
+    }
+
+    onExpandedChanged: {
+        if (Layout.isEmpty()) {
+            return
         }
 
-        function pop() {
-                return Layout.pop();
+        if (expanded) {
+            Layout.showLast()
+        }
+        else {
+            Layout.hideLast()
         }
+    }
+
+    Component.onDestruction: Layout.clear()
+
+    width: expanded ? targetWidth : menu.width
+    height: menu.height
+    color: "black"
+    border.color: "gray"
+    radius: 20
 
-        state: "collapsed"
-        states: [
+    states: [
         State {
-                name: "expanded"
-                when: tools.expanded
+            name: "expanded"
+            when: expanded
         },
         State {
-                name: "collapsed"
-                when: !tools.expanded
+            name: "collapsed"
+            when: !expanded
         }
-        ]
+    ]
 
-        transitions: [
+    transitions: [
         Transition {
-                from: "expanded"
-                to: "collapsed"
-
-                PropertyAnimation {
-                        property: "rotation"
-                        target: menu
-                        from: 0
-                        to: 180
-                        duration: 500
-                }
+            from: "expanded"
+            to: "collapsed"
+
+            PropertyAnimation {
+                property: "rotation"
+                target: menu
+                from: 0
+                to: 180
+                duration: 250
+            }
         },
         Transition {
-                from: "collapsed"
-                to: "expanded"
-                PropertyAnimation {
-                        property: "rotation"
-                        target: menu
-                        from: 180
-                        to: 360
-                        duration: 500
-                }
+            from: "collapsed"
+            to: "expanded"
+            PropertyAnimation {
+                property: "rotation"
+                target: menu
+                from: 180
+                to: 360
+                duration: 250
+            }
+        }
+    ]
+
+    Behavior on width {
+        PropertyAnimation { duration: 100 }
+    }
+
+    CameraToolIcon {
+        visible: !parent.hideBack
+        id: menu
+        anchors.verticalCenter: parent.verticalCenter
+        iconId: cameraTheme.cameraToolBarMenuIcon
+        anchors.left: parent.left
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+
+        onClicked: {
+            if (parent.manualBack) {
+                parent.clicked()
+            } else if (!parent.expanded) {
+                parent.expanded = true
+            } else if (Layout.stack.length == 1) {
+                expanded = false
+            } else {
+                __currentTools = Layout.pop()
+            }
+        }
+    }
+
+    Rectangle {
+        id: dock
+        property real menuWidth: parent.hideBack ? 0 : menu.width
+        property real leftMargin: (parent.width - __currentTools.childrenWidth - menuWidth) / __currentTools.childrenLen
+        color: "transparent"
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+        anchors.right: parent.right
+        anchors.left: parent.hideBack ? parent.left : menu.right
+        anchors.leftMargin: parent.hideBack ? 0 : leftMargin
+    }
+
+    Component {
+        id: toolsContainer
+        Item {
+            property Item tools
+            property Item owner
         }
-        ]
+    }
 }