cgit.sxemacs.org Git - harmattan/cameraplus/blob - qml/CameraToolBar.qml

   1 // -*- qml -*-
   2
   3 /*!
   4  * This file is part of CameraPlus.
   5  *
   6  * Copyright (C) 2012-2013 Mohammed Sameer <msameer@foolab.org>
   7  *
   8  * This library is free software; you can redistribute it and/or
   9  * modify it under the terms of the GNU Lesser General Public
  10  * License as published by the Free Software Foundation; either
  11  * version 2.1 of the License, or (at your option) any later version.
  12  *
  13  * This library is distributed in the hope that it will be useful,
  14  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  15  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
  16  * Lesser General Public License for more details.
  17  *
  18  * You should have received a copy of the GNU Lesser General Public
  19  * License along with this library; if not, write to the Free Software
  20  * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
  21  */
  22
  23 import QtQuick 2.0
  24 import "CameraToolBar.js" as Layout
  25
  26 Rectangle {
  27     id: tools
  28     property bool expanded: false
  29     property list<Item> items
  30     property int targetWidth: parent.width - (2 * anchors.leftMargin)
  31     property alias menuWidth: menu.width
  32     property bool manualBack: false
  33     property bool hideBack: false
  34     signal clicked
  35
  36     height: menu.height
  37     width: expanded ? targetWidth : menu.width
  38     color: expanded ? "black" : width == menu.width ? "transparent" : "black"
  39     border.color: expanded ? "gray" : width == menu.width ? "transparent" : "gray"
  40     radius: 20
  41
  42     Behavior on width {
  43         PropertyAnimation { duration: 100 }
  44     }
  45
  46     CameraToolIcon {
  47         property bool __isMenu: true
  48         visible: !parent.hideBack
  49         id: menu
  50         anchors.verticalCenter: parent.verticalCenter
  51         iconId: "icon-m-toolbar-back-white"
  52         onClicked: {
  53             if (tools.manualBack) {
  54                 tools.clicked()
  55                 return
  56             }
  57
  58             if (!expanded) {
  59                 expanded = true
  60             } else if (Layout.stack.length == 1) {
  61                 expanded = false
  62             } else {
  63                 Layout.pop()
  64             }
  65         }
  66
  67         anchors.left: parent.left
  68         rotation: 180
  69     }
  70
  71     onExpandedChanged: {
  72         if (tools.expanded) {
  73             tools.push(tools.items)
  74         } else {
  75             tools.pop()
  76         }
  77     }
  78
  79     onWidthChanged: Layout.layout()
  80     onTargetWidthChanged: Layout.layout()
  81
  82     function push(items) {
  83         return Layout.push(items)
  84     }
  85
  86     function pop() {
  87         return Layout.pop()
  88     }
  89
  90     state: "collapsed"
  91     states: [
  92         State {
  93             name: "expanded"
  94             when: tools.expanded
  95         },
  96         State {
  97             name: "collapsed"
  98             when: !tools.expanded
  99         }
 100     ]
 101
 102     transitions: [
 103         Transition {
 104             from: "expanded"
 105             to: "collapsed"
 106
 107             PropertyAnimation {
 108                 property: "rotation"
 109                 target: menu
 110                 from: 0
 111                 to: 180
 112                 duration: 500
 113             }
 114         },
 115         Transition {
 116             from: "collapsed"
 117             to: "expanded"
 118             PropertyAnimation {
 119                 property: "rotation"
 120                 target: menu
 121                 from: 180
 122                 to: 360
 123                 duration: 500
 124             }
 125         }
 126     ]
 127 }