Unity 8
CoverPage.qml
1 /*
2  * Copyright (C) 2013-2016 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 
22 Showable {
23  id: root
24 
25  property real dragHandleLeftMargin
26  property real launcherOffset
27  property alias background: greeterBackground.source
28  property real backgroundTopMargin
29  property var infographicModel
30  property bool draggable: true
31 
32  property alias infographics: infographics
33 
34  readonly property real showProgress: MathUtils.clamp((width - Math.abs(x)) / width, 0, 1)
35 
36  signal tease()
37  signal clicked()
38 
39  function hideRight() {
40  d.forceRightOnNextHideAnimation = true;
41  hide();
42  }
43 
44  QtObject {
45  id: d
46  property bool forceRightOnNextHideAnimation: false
47  }
48 
49  prepareToHide: function () {
50  hideTranslation.from = root.x + translation.x
51  hideTranslation.to = root.x > 0 || d.forceRightOnNextHideAnimation ? root.width : -root.width;
52  d.forceRightOnNextHideAnimation = false;
53  }
54 
55  // We don't directly bind "x" because that's owned by the DragHandle. So
56  // instead, we can get a little extra horizontal push by using transforms.
57  transform: Translate { id: translation; x: root.draggable ? launcherOffset : 0 }
58 
59  // Eat events elsewhere on the coverpage, except mouse clicks which we pass
60  // up (they are used in the NarrowView to hide the cover page)
61  MouseArea {
62  anchors.fill: parent
63  onClicked: root.clicked()
64 
65  MultiPointTouchArea {
66  anchors.fill: parent
67  mouseEnabled: false
68  }
69  }
70 
71  Rectangle {
72  // In case background fails to load
73  id: backgroundBackup
74  anchors.fill: parent
75  color: "black"
76  }
77 
78  CrossFadeImage {
79  id: greeterBackground
80  objectName: "greeterBackground"
81  anchors {
82  fill: parent
83  topMargin: root.backgroundTopMargin
84  }
85  fillMode: Image.PreserveAspectCrop
86  // Limit how much memory we'll reserve for this image
87  sourceSize.height: height
88  sourceSize.width: width
89  }
90 
91  // Darkens wallpaper so that we can read text on it and see infographic
92  Rectangle {
93  anchors.fill: parent
94  color: "black"
95  opacity: 0.4
96  }
97 
98  Infographics {
99  id: infographics
100  objectName: "infographics"
101  height: parent.height
102  model: root.infographicModel
103  clip: true // clip large data bubbles
104 
105  anchors {
106  verticalCenter: parent.verticalCenter
107  left: parent.left
108  right: parent.right
109  }
110  }
111 
112  Label {
113  id: swipeHint
114  property real baseOpacity: 0.5
115  opacity: 0.0
116  anchors.horizontalCenter: parent.horizontalCenter
117  anchors.bottom: parent.bottom
118  anchors.bottomMargin: units.gu(5)
119  text: "《 " + i18n.tr("Unlock") + " 》"
120  color: "white"
121  font.weight: Font.Light
122 
123  SequentialAnimation on opacity {
124  id: showLabelAnimation
125  running: false
126  loops: 2
127 
128  StandardAnimation {
129  from: 0.0
130  to: swipeHint.baseOpacity
131  duration: UbuntuAnimation.SleepyDuration
132  }
133  PauseAnimation { duration: UbuntuAnimation.BriskDuration }
134  StandardAnimation {
135  from: swipeHint.baseOpacity
136  to: 0.0
137  duration: UbuntuAnimation.SleepyDuration
138  }
139  }
140  }
141 
142  DragHandle {
143  id: dragHandle
144  objectName: "coverPageDragHandle"
145  anchors.fill: parent
146  anchors.leftMargin: root.dragHandleLeftMargin
147  enabled: root.draggable
148  direction: Direction.Horizontal
149 
150  onPressedChanged: {
151  if (pressed) {
152  root.tease();
153  showLabelAnimation.start();
154  }
155  }
156  }
157 
158  // right side shadow
159  Image {
160  anchors.left: parent.right
161  anchors.top: parent.top
162  anchors.bottom: parent.bottom
163  fillMode: Image.Tile
164  source: "../graphics/dropshadow_right.png"
165  }
166 
167  // left side shadow
168  Image {
169  anchors.right: parent.left
170  anchors.top: parent.top
171  anchors.bottom: parent.bottom
172  fillMode: Image.Tile
173  source: "../graphics/dropshadow_left.png"
174  }
175 
176  Binding {
177  id: positionLock
178 
179  property bool enabled: false
180  onEnabledChanged: {
181  if (enabled === __enabled) {
182  return;
183  }
184 
185  if (enabled) {
186  if (root.x > 0) {
187  value = Qt.binding(function() { return root.width; })
188  } else {
189  value = Qt.binding(function() { return -root.width; })
190  }
191  }
192 
193  __enabled = enabled;
194  }
195 
196  property bool __enabled: false
197 
198  target: root
199  when: __enabled
200  property: "x"
201  }
202 
203  hideAnimation: SequentialAnimation {
204  id: hideAnimation
205  objectName: "hideAnimation"
206  property var target // unused, here to silence Showable warning
207  StandardAnimation {
208  id: hideTranslation
209  property: "x"
210  target: root
211  }
212  PropertyAction { target: root; property: "visible"; value: false }
213  PropertyAction { target: positionLock; property: "enabled"; value: true }
214  }
215 
216  showAnimation: SequentialAnimation {
217  id: showAnimation
218  objectName: "showAnimation"
219  property var target // unused, here to silence Showable warning
220  PropertyAction { target: root; property: "visible"; value: true }
221  PropertyAction { target: positionLock; property: "enabled"; value: false }
222  StandardAnimation {
223  property: "x"
224  target: root
225  to: 0
226  duration: UbuntuAnimation.FastDuration
227  }
228  }
229 }