on f2ee9e5 help sign in
unity8/Components/EdgeDemoOverlay.qml
264 lines 8.1 kB history raw
1/*
2 * Copyright (C) 2013 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 */
17import Powerd 0.1
18import QtQuick 2.0
19import QtGraphicalEffects 1.0
20import Unity.Application 0.1
21import Ubuntu.Components 0.1
23Showable {
24 id: overlay
26 /*
27 * Valid values are "left", "right", "top", "bottom", or "none".
28 */
29 property string edge: "top"
31 /*
32 * This is the header displayed, like "Right edge".
33 */
34 property alias title: titleLabel.text
36 /*
37 * This is the block of text displayed below the header.
38 */
39 property alias text: textLabel.text
41 /*
42 * This is the text for the skip button.
43 */
44 property alias skipText: skipLabel.text
46 /*
47 * This is the visible status of the skip button.
48 */
49 property alias showSkip: skipLabel.visible
51 /*
52 * Whether this demo is running currently.
53 */
54 readonly property bool active: available && visible
56 /*
57 * Whether animations are paused.
58 */
59 property alias paused: wholeAnimation.paused
61 /*
62 * Whether animations are running.
63 */
64 readonly property alias running: wholeAnimation.running
66 signal skip()
68 function doSkip() {
69 d.skipOnHide = true;
70 hide();
71 }
73 function hideNow() {
74 overlay.visible = false;
75 overlay.available = false;
76 if (d.skipOnHide) {
77 overlay.skip();
78 }
79 }
81 showAnimation: StandardAnimation {
82 property: "opacity"
83 to: 1
84 onRunningChanged: if (running) overlay.visible = true
85 }
86 hideAnimation: StandardAnimation {
87 property: "opacity"
88 to: 0
89 duration: UbuntuAnimation.BriskDuration
90 onRunningChanged: if (!running) overlay.hideNow()
91 }
93 QtObject {
94 id: d
95 property bool skipOnHide: false
96 property int edgeMargin: units.gu(4)
97 }
99 Rectangle {
100 objectName: "backgroundShade"
102 anchors.fill: parent
103 color: "black"
104 opacity: 0.8
105 visible: overlay.active
107 MouseArea {
108 anchors.fill: parent
109 enabled: overlay.edge == "none" && overlay.opacity == 1.0
110 onClicked: overlay.doSkip()
111 }
112 }
114 Item {
115 id: hintGroup
116 x: 0
117 y: 0
118 width: parent.width
119 height: parent.height
120 visible: overlay.active
122 Column {
123 id: labelGroup
124 layer.enabled: true // otherwise the underlining on "Skip intro" jumps
125 spacing: units.gu(3)
127 anchors {
128 margins: d.edgeMargin
129 left: parent.left
130 top: overlay.edge == "bottom" ? undefined : parent.top
131 bottom: overlay.edge == "bottom" ? parent.bottom : undefined
132 }
134 Label {
135 id: titleLabel
136 fontSize: "x-large"
137 width: units.gu(25)
138 wrapMode: Text.WordWrap
139 }
141 Label {
142 id: textLabel
143 width: units.gu(25)
144 wrapMode: Text.WordWrap
145 }
147 Label {
148 id: skipLabel
149 objectName: "skipLabel"
150 text: i18n.tr("Skip intro")
151 color: UbuntuColors.orange
152 fontSize: "small"
153 font.underline: true
155 MouseArea {
156 // Make clickable area bigger than just the link because
157 // otherwise, the edge demo will feel hard to dismiss.
158 anchors.fill: parent
159 anchors.margins: -units.gu(5)
160 onClicked: overlay.doSkip()
161 }
162 }
163 }
165 LinearGradient {
166 id: edgeHint
167 property int size: 1
168 cached: false
169 visible: overlay.edge != "none"
170 gradient: Gradient {
171 GradientStop {
172 position: 0.0
173 color: Qt.hsla(16.0/360.0, 0.83, 0.47, 0.4) // UbuntuColors.orange, but transparent
174 }
175 GradientStop {
176 position: 1.0
177 color: "transparent"
178 }
179 }
180 anchors.fill: parent
181 start: {
182 if (overlay.edge == "right") {
183 return Qt.point(width, 0);
184 } else if (overlay.edge == "left") {
185 return Qt.point(0, 0);
186 } else if (overlay.edge == "top") {
187 return Qt.point(0, 0);
188 } else {
189 return Qt.point(0, height);
190 }
191 }
192 end: {
193 if (overlay.edge == "right") {
194 return Qt.point(width - size, 0);
195 } else if (overlay.edge == "left") {
196 return Qt.point(size, 0);
197 } else if (overlay.edge == "top") {
198 return Qt.point(0, size);
199 } else {
200 return Qt.point(0, height - size);
201 }
202 }
203 }
204 }
206 SequentialAnimation {
207 id: wholeAnimation
208 objectName: "wholeAnimation"
209 running: overlay.active
211 ParallelAnimation {
212 id: fadeInAnimation
214 StandardAnimation {
215 target: labelGroup
216 property: {
217 if (overlay.edge == "right" || overlay.edge == "left") {
218 return "anchors.leftMargin";
219 } else if (overlay.edge == "bottom") {
220 return "anchors.bottomMargin";
221 } else {
222 return "anchors.topMargin";
223 }
224 }
225 from: {
226 if (overlay.edge == "right") {
227 return d.edgeMargin + units.gu(3)
228 } else {
229 return d.edgeMargin - units.gu(3)
230 }
231 }
232 to: d.edgeMargin
233 duration: overlay.edge == "none" ? 0 : UbuntuAnimation.SleepyDuration
234 }
235 StandardAnimation {
236 target: overlay
237 property: "opacity"
238 from: 0.0
239 to: 1.0
240 duration: UbuntuAnimation.SleepyDuration
241 }
242 }
244 SequentialAnimation {
245 id: hintAnimation
246 loops: Animation.Infinite
247 property string prop: (overlay.edge == "left" || overlay.edge == "right") ? "x" : "y"
248 property double endVal: units.dp(5) * ((overlay.edge == "left" || overlay.edge == "top") ? 1 : -1)
249 property double maxGlow: units.dp(20)
250 property int duration: overlay.edge == "none" ? 0 : UbuntuAnimation.SleepyDuration
252 ParallelAnimation {
253 StandardAnimation { target: hintGroup; property: hintAnimation.prop; from: 0; to: hintAnimation.endVal; duration: hintAnimation.duration }
254 StandardAnimation { target: edgeHint; property: "size"; from: 1; to: hintAnimation.maxGlow; duration: hintAnimation.duration }
255 }
257 // Undo the above
258 ParallelAnimation {
259 StandardAnimation { target: hintGroup; property: hintAnimation.prop; from: hintAnimation.endVal; to: 0; duration: hintAnimation.duration }
260 StandardAnimation { target: edgeHint; property: "size"; from: hintAnimation.maxGlow; to: 1; duration: hintAnimation.duration }
261 }
262 }
263 }