git.maemo.org Git - marketstoday/blob - src/qml/Library/ToolBar.qml

   1 /*
   2 @version: 0.5
   3 @author: Sudheer K. <scifi1947 at gmail.com>
   4 @license: GNU General Public License
   5 */
   6
   7 import Qt 4.7
   8
   9 Item {
  10     id: toolbar
  11     property bool updatePending: false
  12     property bool displayIcons: true
  13     property bool displayNavigation: false
  14     property string targetContentType: "News"
  15     property int componentHeight: toolbar.height
  16
  17     signal reloadButtonClicked
  18     signal downButtonClicked
  19     signal upButtonClicked
  20     signal newsButtonClicked
  21     signal stocksButtonClicked
  22
  23     BorderImage { source: "images/toolbar.sci"; width: parent.width; height: parent.height + 14; y: -7 }
  24
  25     Rectangle {
  26         id: reloadButtonArea
  27         width: 60
  28         height: parent.height
  29         anchors.left: parent.left
  30         color: "#00000000"
  31         visible: toolbar.displayIcons
  32
  33         Image {
  34             id: reloadButton
  35             source: "images/reload.png"
  36             width: 32; height: 32
  37             anchors.centerIn: parent
  38             smooth: true
  39
  40             NumberAnimation on rotation {
  41                 from: 0; to: 360; running: toolbar.updatePending == true; loops: Animation.Infinite; duration: 900
  42             }
  43         }
  44
  45         MouseArea{
  46           id: reloadButtonMouseArea
  47           anchors.fill: parent
  48           onClicked: {
  49               toolbar.updatePending = true;
  50               toolbar.reloadButtonClicked();
  51           }
  52         }
  53
  54         states: State {
  55                  name: "pressed"; when: reloadButtonMouseArea.pressed
  56                  PropertyChanges { target: reloadButtonArea; color: "#9a9a9a"}
  57         }
  58     }
  59
  60     Rectangle {
  61         id: downButtonArea
  62         width: 60
  63         height: parent.height
  64         anchors.right: parent.horizontalCenter; anchors.horizontalCenterOffset: -60;
  65         color: "#00000000"
  66         visible: toolbar.displayNavigation
  67
  68         Image {
  69             id: downButton
  70             source: "images/down.png"
  71             width: 32; height: 32
  72             anchors.verticalCenter: parent.verticalCenter
  73             anchors.right: parent.right
  74             anchors.rightMargin: 5
  75         }
  76
  77         MouseArea{
  78           id: downButtonMouseArea
  79           anchors.fill: parent
  80           onClicked: toolbar.downButtonClicked()
  81         }
  82
  83         states: State {
  84                  name: "pressed"; when: downButtonMouseArea.pressed
  85                  PropertyChanges { target: downButtonArea; color: "#9a9a9a"}
  86         }
  87     }
  88
  89
  90     Rectangle {
  91         id: upButtonArea
  92         width: 60
  93         height: parent.height
  94         anchors.left: parent.horizontalCenter; anchors.horizontalCenterOffset: 60;
  95         color: "#00000000"
  96         visible: toolbar.displayNavigation
  97
  98         Image {
  99             id: upButton
 100             source: "images/up.png"
 101             width: 32; height: 32
 102             anchors.verticalCenter: parent.verticalCenter
 103             anchors.left: parent.left
 104             anchors.leftMargin: 5
 105         }
 106
 107         MouseArea{
 108           id: upButtonMouseArea
 109           anchors.fill: parent
 110           onClicked: toolbar.upButtonClicked()
 111         }
 112
 113         states: State {
 114                  name: "pressed"; when: upButtonMouseArea.pressed
 115                  PropertyChanges { target: upButtonArea; color: "#9a9a9a"}
 116         }
 117     }
 118
 119     Loader {
 120         id: contentIconLoader
 121         width: 60
 122         height: parent.height
 123         anchors.right: parent.right
 124         visible: toolbar.displayIcons
 125         sourceComponent: targetContentType == "News"? newsButtonComponent:stocksButtonComponent
 126     }
 127
 128
 129     Component {
 130         id: newsButtonComponent
 131
 132         Rectangle {
 133             id: newsButtonArea
 134             anchors.fill: parent
 135             color: "#00000000"
 136
 137             Image {
 138                 id: newsButton
 139                 source: "images/tab_news.png"
 140                 width: 32; height: 32
 141                 anchors.centerIn: parent
 142             }
 143
 144             MouseArea{
 145               id: newsButtonMouseArea
 146               anchors.fill: parent
 147               onClicked: toolbar.newsButtonClicked()
 148             }
 149
 150             states: State {
 151                      name: "pressed"; when: newsButtonMouseArea.pressed
 152                      PropertyChanges { target: newsButtonArea; color: "#9a9a9a"}
 153             }
 154         }
 155     }
 156
 157     Component{
 158         id: stocksButtonComponent
 159         Rectangle {
 160             id: stocksButtonArea
 161             anchors.fill: parent
 162             color: "#00000000"
 163
 164             Image {
 165                 id: stocksButton
 166                 source: "images/tab_stocks.png"
 167                 width: 32; height: 32
 168                 anchors.centerIn: parent
 169             }
 170
 171             MouseArea{
 172               id: stocksButtonMouseArea
 173               anchors.fill: parent
 174               onClicked: toolbar.stocksButtonClicked()
 175             }
 176
 177             states: State {
 178                      name: "pressed"; when: stocksButtonMouseArea.pressed
 179                      PropertyChanges { target: stocksButtonArea; color: "#9a9a9a"}
 180             }
 181         }
 182     }
 183 }