Unity 8
IndicatorsMenu.qml
1 /*
2  * Copyright (C) 2014 Canonical, Ltd.
3  *
4  * This program is free software; you can redistribute it and/or modify
5  * it under the terms of the GNU General Public License as published by
6  * the Free Software Foundation; version 3.
7  *
8  * This program is distributed in the hope that it will be useful,
9  * but WITHOUT ANY WARRANTY; without even the implied warranty of
10  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11  * GNU General Public License for more details.
12  *
13  * You should have received a copy of the GNU General Public License
14  * along with this program. If not, see <http://www.gnu.org/licenses/>.
15  */
16 
17 import QtQuick 2.4
18 import Ubuntu.Components 1.3
19 import Ubuntu.Gestures 0.1
20 import "../Components"
21 import "Indicators"
22 
23 Showable {
24  id: root
25  property alias indicatorsModel: bar.indicatorsModel
26  property alias showDragHandle: __showDragHandle
27  property alias hideDragHandle: __hideDragHandle
28  property alias overFlowWidth: bar.overFlowWidth
29  property alias verticalVelocityThreshold: yVelocityCalculator.velocityThreshold
30  property alias currentIndicator: bar.currentIndicator
31  property int minimizedPanelHeight: units.gu(3)
32  property int expandedPanelHeight: units.gu(7)
33  property real openedHeight: units.gu(71)
34  readonly property real unitProgress: Math.max(0, (height - minimizedPanelHeight) / (openedHeight - minimizedPanelHeight))
35  readonly property bool fullyOpened: unitProgress >= 1
36  readonly property bool partiallyOpened: unitProgress > 0 && unitProgress < 1.0
37  readonly property bool fullyClosed: unitProgress == 0
38  property bool enableHint: true
39  property bool contentEnabled: true
40  property bool showOnClick: true
41  property color panelColor: UbuntuColors.jet
42 
43  signal showTapped(point position)
44 
45  // TODO: Perhaps we need a animation standard for showing/hiding? Each showable seems to
46  // use its own values. Need to ask design about this.
47  showAnimation: StandardAnimation {
48  property: "height"
49  to: openedHeight
50  duration: UbuntuAnimation.BriskDuration
51  easing.type: Easing.OutCubic
52  }
53 
54  hideAnimation: StandardAnimation {
55  property: "height"
56  to: minimizedPanelHeight
57  duration: UbuntuAnimation.BriskDuration
58  easing.type: Easing.OutCubic
59  }
60 
61  height: minimizedPanelHeight
62 
63  onUnitProgressChanged: d.updateState()
64  clip: root.partiallyOpened
65 
66  IndicatorsLight {
67  id: indicatorLights
68  }
69 
70  // eater
71  MouseArea {
72  anchors.fill: parent
73  hoverEnabled: true
74  }
75 
76  MenuContent {
77  id: content
78  objectName: "menuContent"
79  color: root.panelColor
80 
81  anchors {
82  left: parent.left
83  right: parent.right
84  top: bar.bottom
85  }
86  height: openedHeight - bar.height - handle.height
87  indicatorsModel: root.indicatorsModel
88  visible: root.unitProgress > 0
89  enabled: contentEnabled
90  currentMenuIndex: bar.currentItemIndex
91  }
92 
93  Handle {
94  id: handle
95  objectName: "handle"
96  anchors {
97  left: parent.left
98  right: parent.right
99  bottom: parent.bottom
100  }
101  height: units.gu(2)
102  active: d.activeDragHandle ? true : false
103 
104  //small shadow gradient at bottom of menu
105  Rectangle {
106  anchors {
107  left: parent.left
108  right: parent.right
109  bottom: parent.top
110  }
111  height: units.gu(0.5)
112  gradient: Gradient {
113  GradientStop { position: 0.0; color: "transparent" }
114  GradientStop { position: 1.0; color: root.panelColor }
115  }
116  opacity: 0.3
117  }
118  }
119 
120  Rectangle {
121  anchors.fill: bar
122  color: panelColor
123  }
124 
125  IndicatorsBar {
126  id: bar
127  objectName: "indicatorsBar"
128 
129  anchors {
130  left: parent.left
131  right: parent.right
132  }
133  expanded: false
134  enableLateralChanges: false
135  lateralPosition: -1
136  unitProgress: root.unitProgress
137 
138  height: expanded ? expandedPanelHeight : minimizedPanelHeight
139  Behavior on height { NumberAnimation { duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing } }
140  }
141 
142  ScrollCalculator {
143  id: leftScroller
144  width: units.gu(5)
145  anchors.left: bar.left
146  height: bar.height
147 
148  forceScrollingPercentage: 0.33
149  stopScrollThreshold: units.gu(0.75)
150  direction: Qt.RightToLeft
151  lateralPosition: -1
152 
153  onScroll: bar.addScrollOffset(-scrollAmount);
154  }
155 
156  ScrollCalculator {
157  id: rightScroller
158  width: units.gu(5)
159  anchors.right: bar.right
160  height: bar.height
161 
162  forceScrollingPercentage: 0.33
163  stopScrollThreshold: units.gu(0.75)
164  direction: Qt.LeftToRight
165  lateralPosition: -1
166 
167  onScroll: bar.addScrollOffset(scrollAmount);
168  }
169 
170  MouseArea {
171  anchors.bottom: parent.bottom
172  anchors.left: parent.left
173  anchors.right: parent.right
174  height: minimizedPanelHeight
175  enabled: __showDragHandle.enabled && showOnClick
176  onClicked: {
177  bar.selectItemAt(mouseX)
178  root.show()
179  }
180  }
181 
182  DragHandle {
183  id: __showDragHandle
184  objectName: "showDragHandle"
185  anchors.bottom: parent.bottom
186  anchors.left: parent.left
187  anchors.right: parent.right
188  height: minimizedPanelHeight
189  direction: Direction.Downwards
190  enabled: !root.shown && root.available
191  autoCompleteDragThreshold: maxTotalDragDistance / 2
192  stretch: true
193 
194  onPressedChanged: {
195  if (pressed) {
196  touchPressTime = new Date().getTime();
197  } else {
198  var touchReleaseTime = new Date().getTime();
199  if (touchReleaseTime - touchPressTime <= 300) {
200  root.showTapped(Qt.point(touchSceneX, touchSceneY));
201  }
202  }
203  }
204  property var touchPressTime
205 
206  // using hint regulates minimum to hint displacement, but in fullscreen mode, we need to do it manually.
207  overrideStartValue: enableHint ? minimizedPanelHeight : expandedPanelHeight + handle.height
208  maxTotalDragDistance: openedHeight - (enableHint ? minimizedPanelHeight : expandedPanelHeight + handle.height)
209  hintDisplacement: enableHint ? expandedPanelHeight - minimizedPanelHeight + handle.height : 0
210  }
211 
212  MouseArea {
213  anchors.fill: __hideDragHandle
214  enabled: __hideDragHandle.enabled
215  onClicked: root.hide()
216  }
217 
218  DragHandle {
219  id: __hideDragHandle
220  objectName: "hideDragHandle"
221  anchors.fill: handle
222  direction: Direction.Upwards
223  enabled: root.shown && root.available
224  hintDisplacement: units.gu(3)
225  autoCompleteDragThreshold: maxTotalDragDistance / 6
226  stretch: true
227  maxTotalDragDistance: openedHeight - expandedPanelHeight - handle.height
228 
229  onTouchSceneXChanged: {
230  if (root.state === "locked") {
231  d.xDisplacementSinceLock += (touchSceneX - d.lastHideTouchSceneX)
232  d.lastHideTouchSceneX = touchSceneX;
233  }
234  }
235  }
236 
237  PanelVelocityCalculator {
238  id: yVelocityCalculator
239  velocityThreshold: d.hasCommitted ? 0.1 : 0.3
240  trackedValue: d.activeDragHandle ? d.activeDragHandle.touchSceneY : 0
241 
242  onVelocityAboveThresholdChanged: d.updateState()
243  }
244 
245  Connections {
246  target: showAnimation
247  onRunningChanged: {
248  if (showAnimation.running) {
249  root.state = "commit";
250  }
251  }
252  }
253 
254  Connections {
255  target: hideAnimation
256  onRunningChanged: {
257  if (hideAnimation.running) {
258  root.state = "initial";
259  }
260  }
261  }
262 
263  QtObject {
264  id: d
265  property var activeDragHandle: showDragHandle.dragging ? showDragHandle : hideDragHandle.dragging ? hideDragHandle : null
266  property bool hasCommitted: false
267  property real lastHideTouchSceneX: 0
268  property real xDisplacementSinceLock: 0
269  onXDisplacementSinceLockChanged: d.updateState()
270 
271  property real rowMappedLateralPosition: {
272  if (!d.activeDragHandle) return -1;
273  return d.activeDragHandle.mapToItem(bar, d.activeDragHandle.touchX, 0).x;
274  }
275 
276  function updateState() {
277  if (!showAnimation.running && !hideAnimation.running && d.activeDragHandle) {
278  if (unitProgress <= 0) {
279  root.state = "initial";
280  // lock indicator if we've been committed and aren't moving too much laterally or too fast up.
281  } else if (d.hasCommitted && (Math.abs(d.xDisplacementSinceLock) < units.gu(2) || yVelocityCalculator.velocityAboveThreshold)) {
282  root.state = "locked";
283  } else {
284  root.state = "reveal";
285  }
286  }
287  }
288  }
289 
290  states: [
291  State {
292  name: "initial"
293  PropertyChanges { target: d; hasCommitted: false; restoreEntryValues: false }
294  },
295  State {
296  name: "reveal"
297  StateChangeScript {
298  script: {
299  yVelocityCalculator.reset();
300  // initial item selection
301  if (!d.hasCommitted) bar.selectItemAt(d.activeDragHandle ? d.activeDragHandle.touchX : -1);
302  d.hasCommitted = false;
303  }
304  }
305  PropertyChanges {
306  target: bar
307  expanded: true
308  // changes to lateral touch position effect which indicator is selected
309  lateralPosition: d.rowMappedLateralPosition
310  // vertical velocity determines if changes in lateral position has an effect
311  enableLateralChanges: d.activeDragHandle &&
312  !yVelocityCalculator.velocityAboveThreshold
313  }
314  // left scroll bar handling
315  PropertyChanges {
316  target: leftScroller
317  lateralPosition: {
318  if (!d.activeDragHandle) return -1;
319  var mapped = d.activeDragHandle.mapToItem(leftScroller, d.activeDragHandle.touchX, 0);
320  return mapped.x;
321  }
322  }
323  // right scroll bar handling
324  PropertyChanges {
325  target: rightScroller
326  lateralPosition: {
327  if (!d.activeDragHandle) return -1;
328  var mapped = d.activeDragHandle.mapToItem(rightScroller, d.activeDragHandle.touchX, 0);
329  return mapped.x;
330  }
331  }
332  },
333  State {
334  name: "locked"
335  StateChangeScript {
336  script: {
337  d.xDisplacementSinceLock = 0;
338  d.lastHideTouchSceneX = hideDragHandle.touchSceneX;
339  }
340  }
341  PropertyChanges { target: bar; expanded: true }
342  },
343  State {
344  name: "commit"
345  extend: "locked"
346  PropertyChanges { target: bar; interactive: true }
347  PropertyChanges {
348  target: d;
349  hasCommitted: true
350  lastHideTouchSceneX: 0
351  xDisplacementSinceLock: 0
352  restoreEntryValues: false
353  }
354  }
355  ]
356  state: "initial"
357 }