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