on xenial help sign in
Add right edge tutorial
commitadc82d2c87ce1daa7098c289d9bc96d5cbbfa13f authorMichael Terry <michael.terry@canonical.com> dateThu 24 Sep 2015, 12:51 (11 years ago) parent5cf8e08
10 files changed+137−45
qml/Greeter/Greeter.qml+10−7 qml/Shell.qml+23−22 qml/Stages/PhoneStage.qml+1−1 qml/Stages/TabletStage.qml+3 qml/Tutorial/Tutorial.qml+7 qml/Tutorial/TutorialContent.qml+33−4 qml/Tutorial/TutorialLeft.qml+4−8 qml/Tutorial/TutorialPage.qml+2−1 qml/Tutorial/TutorialRight.qml+53 qml/Tutorial/TutorialTop.qml+1−2
qml/Greeter/Greeter.qml+10−7
@@ -160,6 +160,14 @@ Showable {
160160 return false;
161161 }
162162 }
163+
164+ function checkForcedUnlock() {
165+ if (forcedUnlock && shown) {
166+ // pretend we were just authenticated
167+ loader.item.hide();
168+ loader.item.notifyAuthenticationSucceeded();
169+ }
170+ }
163171 }
164172
165173 onLauncherOffsetChanged: {
@@ -168,13 +176,8 @@ Showable {
168176 }
169177 }
170178
171− onForcedUnlockChanged: {
172− if (forcedUnlock && shown) {
173− // pretend we were just authenticated
174− loader.item.hide();
175− loader.item.notifyAuthenticationSucceeded();
176− }
177− }
179+ onForcedUnlockChanged: d.checkForcedUnlock()
180+ Component.onCompleted: d.checkForcedUnlock()
178181
179182 onRequiredChanged: {
180183 if (required) {
qml/Shell.qml+23−22
@@ -369,28 +369,6 @@ Item {
369369 value: physicalKeysMapper.altTabPressed
370370 }
371371 }
372−
373− Tutorial {
374− id: tutorial
375− objectName: "tutorial"
376− anchors.fill: parent
377−
378− // EdgeDragAreas don't work with mice. So to avoid trapping the user,
379− // we skip the tutorial on the Desktop to avoid using them. The
380− // Desktop doesn't use the same spread design anyway. The tutorial is
381− // all a bit of a placeholder on non-phone form factors right now.
382− // When the design team gives us more guidance, we can do something
383− // more clever here.
384− active: usageScenario != "desktop" && AccountsService.demoEdges
385−
386− launcher: launcher
387− panel: panel
388−
389− onFinished: {
390− AccountsService.demoEdges = false;
391− active = false; // for immediate response / if AS is having problems
392− }
393− }
394372 }
395373
396374 InputMethod {
@@ -600,6 +578,29 @@ Item {
600578 }
601579 }
602580
581+ Tutorial {
582+ id: tutorial
583+ objectName: "tutorial"
584+ anchors.fill: parent
585+
586+ // EdgeDragAreas don't work with mice. So to avoid trapping the user,
587+ // we skip the tutorial on the Desktop to avoid using them. The
588+ // Desktop doesn't use the same spread design anyway. The tutorial is
589+ // all a bit of a placeholder on non-phone form factors right now.
590+ // When the design team gives us more guidance, we can do something
591+ // more clever here.
592+ active: usageScenario != "desktop" && AccountsService.demoEdges
593+
594+ launcher: launcher
595+ panel: panel
596+ stage: applicationsDisplayLoader.item
597+
598+ onFinished: {
599+ AccountsService.demoEdges = false;
600+ active = false; // for immediate response / if AS is having problems
601+ }
602+ }
603+
603604 Wizard {
604605 id: wizard
605606 objectName: "wizard"
qml/Stages/PhoneStage.qml+1−1
@@ -101,7 +101,7 @@ Rectangle {
101101 && spreadView.phase === 0
102102
103103 // How far left the stage has been dragged
104− readonly property real dragProgress: spreadRepeater.count > 0 ? -spreadRepeater.itemAt(0).xTranslate : 0
104+ readonly property real dragProgress: spreadRepeater.count > 0 ? spreadRepeater.itemAt(0).progress : 0
105105
106106 readonly property alias dragging: spreadDragArea.dragging
107107
qml/Stages/TabletStage.qml+3
@@ -86,6 +86,9 @@ Rectangle {
8686 }
8787 }
8888
89+ // How far left the stage has been dragged
90+ readonly property real dragProgress: spreadRepeater.count > 0 ? spreadRepeater.itemAt(0).progress : 0
91+
8992 // To be read from outside
9093 property var mainApp: null
9194 property int mainAppWindowOrientationAngle: 0
qml/Tutorial/Tutorial.qml+7
@@ -24,6 +24,7 @@ Item {
2424
2525 property Item launcher
2626 property Item panel
27+ property Item stage
2728
2829 readonly property bool launcherEnabled: loader.item ? loader.item.launcherEnabled : true
2930 readonly property bool spreadEnabled: loader.item ? loader.item.spreadEnabled : true
@@ -56,6 +57,12 @@ Item {
5657 value: root.panel
5758 }
5859
60+ Binding {
61+ target: loader.item
62+ property: "stage"
63+ value: root.stage
64+ }
65+
5966 Connections {
6067 target: loader.item
6168 onFinished: root.finished()
qml/Tutorial/TutorialContent.qml+33−4
@@ -23,9 +23,10 @@ Item {
2323
2424 property Item launcher
2525 property Item panel
26+ property Item stage
2627
2728 readonly property bool launcherEnabled: !running || tutorialLeft.shown
28− readonly property bool spreadEnabled: !running
29+ readonly property bool spreadEnabled: !running || tutorialRight.shown
2930 readonly property bool panelEnabled: !running || tutorialTop.shown
3031 readonly property bool panelContentEnabled: !running
3132 readonly property alias running: d.running
@@ -41,15 +42,15 @@ Item {
4142 QtObject {
4243 id: d
4344
44− property bool running: tutorialLeft.shown || tutorialTop.shown
45+ property bool running: tutorialLeft.shown || tutorialTop.shown || tutorialRight.shown
4546 }
4647
4748 TutorialLeft {
4849 id: tutorialLeft
4950 objectName: "tutorialLeft"
50− parent: root.panel
5151 anchors.fill: parent
5252 launcher: root.launcher
53+ hides: [launcher, panel.indicators]
5354
5455 Component.onCompleted: {
5556 if (AccountsService.demoEdgesCompleted.indexOf("left") == -1) {
@@ -65,9 +66,9 @@ Item {
6566 TutorialTop {
6667 id: tutorialTop
6768 objectName: "tutorialTop"
68− parent: root.panel
6969 anchors.fill: parent
7070 panel: root.panel
71+ hides: [launcher, panel.indicators]
7172
7273 Connections {
7374 target: AccountsService
@@ -87,6 +88,34 @@ Item {
8788
8889 onFinished: {
8990 AccountsService.markDemoEdgeCompleted("top");
91+ }
92+ }
93+
94+ TutorialRight {
95+ id: tutorialRight
96+ objectName: "tutorialRight"
97+ anchors.fill: parent
98+ stage: root.stage
99+ hides: [launcher, panel.indicators]
100+
101+ Connections {
102+ target: AccountsService
103+ onDemoEdgesCompletedChanged: {
104+ if (AccountsService.demoEdgesCompleted.indexOf("top") != -1 &&
105+ AccountsService.demoEdgesCompleted.indexOf("right") == -1) {
106+ tutorialRightTimer.start();
107+ }
108+ }
109+ }
110+
111+ Timer {
112+ id: tutorialRightTimer
113+ interval: 1
114+ onTriggered: tutorialRight.show()
115+ }
116+
117+ onFinished: {
118+ AccountsService.markDemoEdgeCompleted("right");
90119 root.finish();
91120 }
92121 }
qml/Tutorial/TutorialLeft.qml+4−8
@@ -1,5 +1,5 @@
11/*
2− * Copyright (C) 2014,2015 Canonical, Ltd.
2+ * Copyright (C) 2015 Canonical, Ltd.
33 *
44 * This program is free software; you can redistribute it and/or modify
55 * it under the terms of the GNU General Public License as published by
@@ -23,14 +23,10 @@ TutorialPage {
2323
2424 property var launcher
2525
26− Connections {
27− target: root.launcher
26+ opacityOverride: 1 - launcher.visibleWidth / launcher.panelWidth
2827
29− onStateChanged: {
30− if (root.launcher.state === "visible") {
31− root.hide();
32− }
33− }
28+ mouseArea {
29+ anchors.leftMargin: launcher.dragAreaWidth
3430 }
3531
3632 background {
qml/Tutorial/TutorialPage.qml+2−1
@@ -33,8 +33,9 @@ Showable {
3333
3434 visible: false
3535 shown: false
36− opacity: Math.min(_showOpacity, opacityOverride)
3736
37+ opacity: Math.min(_showOpacity, opacityOverride)
38+ onOpacityOverrideChanged: if (opacityOverride <= 0) hide()
3839 property real _showOpacity: 0
3940
4041 showAnimation: StandardAnimation {
qml/Tutorial/TutorialRight.qmlnew file+53
@@ -0,0 +1,53 @@
1+/*
2+ * Copyright (C) 2015 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 "." as LocalComponents
20+
21+TutorialPage {
22+ id: root
23+
24+ property var stage
25+
26+ opacityOverride: 1 - stage.dragProgress * 2
27+
28+ mouseArea {
29+ anchors.rightMargin: stage.dragAreaWidth
30+ }
31+
32+ background {
33+ sourceSize.height: 1080
34+ sourceSize.width: 1916
35+ source: Qt.resolvedUrl("graphics/background1.png")
36+ }
37+
38+ arrow {
39+ anchors.right: root.right
40+ anchors.rightMargin: units.gu(2)
41+ anchors.verticalCenter: root.verticalCenter
42+ rotation: 180
43+ }
44+
45+ label {
46+ text: i18n.tr("Short or long swipe from the right edge to view your open apps")
47+ anchors.right: arrow.left
48+ anchors.rightMargin: units.gu(3)
49+ anchors.left: root.left
50+ anchors.leftMargin: units.gu(4)
51+ anchors.verticalCenter: arrow.verticalCenter
52+ }
53+}
qml/Tutorial/TutorialTop.qml+1−2
@@ -1,5 +1,5 @@
11/*
2− * Copyright (C) 2014,2015 Canonical, Ltd.
2+ * Copyright (C) 2015 Canonical, Ltd.
33 *
44 * This program is free software; you can redistribute it and/or modify
55 * it under the terms of the GNU General Public License as published by
@@ -24,7 +24,6 @@ TutorialPage {
2424 property var panel
2525
2626 opacityOverride: 1 - panel.indicators.unitProgress
27− onOpacityOverrideChanged: if (opacityOverride === 0) hide()
2827
2928 mouseArea {
3029 anchors.topMargin: panel.indicators.minimizedPanelHeight