Unity 8

qml/Shell.qml (+7/-3)
qml/Stages/ApplicationWindow.qml (+14/-1)
qml/Stages/PhoneStage.qml (+62/-34)
qml/Stages/TransformedSpreadDelegate.qml (+27/-21)
qml/Tutorial/Slider.qml (+8/-2)
qml/Tutorial/Tick.qml (+29/-0)
qml/Tutorial/Tutorial.qml (+8/-1)
qml/Tutorial/TutorialBottom.qml (+104/-0)
qml/Tutorial/TutorialBottomFinish.qml (+41/-0)
qml/Tutorial/TutorialContent.qml (+69/-75)
qml/Tutorial/TutorialLeftFinish.qml (+4/-10)
qml/Tutorial/TutorialPage.qml (+79/-74)
qml/Tutorial/TutorialRight.qml (+223/-0)
tests/autopilot/unity8/shell/emulators/tutorial.py (+24/-4)
tests/autopilot/unity8/shell/tests/test_tutorial.py (+7/-0)
tests/qmltests/Tutorial/tst_Tutorial.qml (+63/-1)

To merge this branch:

bzr merge lp:~mterry/unity8/tutorial-new-screens

High

Fix Released

Link a bug report

Reviewer	Review Type	Date Requested	Status
PS Jenkins bot	continuous-integration		Approve on 2015-02-11
Michael Zanetti (community)		2015-01-06	Approve on 2015-02-04
Review via email: mp+245699@code.launchpad.net

Commit Message

Add new right-edge and bottom-edge screens to the first-boot edge tutorial

Description of the Change

Add new right-edge and bottom-edge screens to the first-boot edge tutorial.

I redesigned TutorialContent a bit to not use a loader, but pre-load everything. This prevented a delay between the Left and Right edge screens as it loads the fake app images. We already have a loader in Tutorial.qml, so I felt the second layer was unnecessary.

I also have added bits here and there to PhoneStage in order to support the right-edge tutorial screen.

Design spec here: https://docs.google.com/a/canonical.com/presentation/d/1M8S1wTo-5lIFaIxxgls9TCEnvR79XThGEVpRtkHJY_A/edit#slide=id.g451b9c9a8_062

To test, install the debs from this MP and run the following: phablet-config edges-intro --enable; adb reboot

== Checklist ==

* Are there any related MPs required for this MP to build/function as expected? Please list.
Yes, the pre-requisite linked to this MP

* Did you perform an exploratory manual test run of your code change and any related functionality?
Yes

* Did you make sure that your branch does not contain spurious tags?
Yes

* If you changed the packaging (debian), did you subscribe the ubuntu-unity team to this MP?
NA

* If you changed the UI, has there been a design review?
TBD

PS Jenkins bot (ps-jenkins) wrote on 2015-01-07:

FAILED: Continuous integration, rev:1393
http://jenkins.qa.ubuntu.com/job/unity8-ci/5080/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/676
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/244
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/245
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/245
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/581
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/674
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/674/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/16850

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5080/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-07

1394. By Michael Terry on 2015-01-07: Merge from refactor branch
1395. By Michael Terry on 2015-01-07: Robustify waiting for demoEdgesChanged signal by not doing it

PS Jenkins bot (ps-jenkins) wrote on 2015-01-07:

FAILED: Continuous integration, rev:1394
http://jenkins.qa.ubuntu.com/job/unity8-ci/5095/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/696
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/259
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/260
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/260
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/600
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/694
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/694/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/16882

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5095/rebuild

review: Needs Fixing (continuous-integration)

PS Jenkins bot (ps-jenkins) wrote on 2015-01-07:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5102/rebuild

review: Approve (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-07

1396. By Michael Terry on 2015-01-07: Merge from -refactor branch
1397. By Michael Terry on 2015-01-07: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-01-08:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5106/rebuild

review: Needs Fixing (continuous-integration)

PS Jenkins bot (ps-jenkins) wrote on 2015-01-08:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5108/rebuild

review: Needs Fixing (continuous-integration)

Michael Zanetti (mzanetti) wrote on 2015-01-08:

I tested the spread, still seems to work fine. I'm a bit worried that doing changes in the spread in the future might break the welcome wizard as its not totally obvious why your changes would be required if one only looks at the real right edge spread. I guess it would be beneficial to add some tests that verify your changes keep working. What do you think?

review: Needs Information

PS Jenkins bot (ps-jenkins) wrote on 2015-01-08:

FAILED: Continuous integration, rev:1397
http://jenkins.qa.ubuntu.com/job/unity8-ci/5115/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/726
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/279
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/280
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/280
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/629
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/724
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/724/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/16926

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5115/rebuild

review: Needs Fixing (continuous-integration)

Michał Sawicz (saviq) wrote on 2015-01-08:

There seem to be somewhat legitimate (if flaky) qmltest failures, please investigate.

Albert Astals Cid (aacid) wrote on 2015-01-08:

qmltestrunner.PhoneStage::test_enterSpread is failing randomly in some other places but testTutorial.xml does indeed seem to be relative to this one

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-08

1398. By Michael Terry on 2015-01-08: Merge from -refactor
1399. By Michael Terry on 2015-01-08: Add a couple tests

Michael Terry (mterry) wrote on 2015-01-08:

@mzanetti, I've added a test that pokes and prods some spread values to make sure that they are what we expect (like the first app delegate having x==shell.width instead of 0 for example).

It's hard to test the new spread mode fully because it modifies how the transforms are applied as mostly a visual thing. What I really want to be able to write is a "does it look right?" test, with maybe some Mike AI that knows the correct answer. But ah well. Checking some values will have to do for now.

PS Jenkins bot (ps-jenkins) wrote on 2015-01-08:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5122/rebuild

review: Needs Fixing (continuous-integration)

PS Jenkins bot (ps-jenkins) wrote on 2015-01-08:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5124/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-09

1400. By Michael Terry on 2015-01-09: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-01-09:

FAILED: Continuous integration, rev:1400
http://jenkins.qa.ubuntu.com/job/unity8-ci/5129/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/755
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/293
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/294
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/294
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/657
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/753
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/753/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/16970

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5129/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-09

1401. By Michael Terry on 2015-01-09: Merge from -refactor
1402. By Michael Terry on 2015-01-09: Updated fake screenshots
1403. By Michael Terry on 2015-01-09: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-01-10:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5132/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-12

1404. By Michael Terry on 2015-01-12: Update facebook.png from design

PS Jenkins bot (ps-jenkins) wrote on 2015-01-12:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5140/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-15

1405. By Michael Terry on 2015-01-15: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-01-15:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5150/rebuild

review: Needs Fixing (continuous-integration)

Albert Astals Cid (aacid) wrote on 2015-01-27:

Text conflict in qml/Shell.qml
1 conflicts encountered.

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-28

1406. By Michael Terry on 2015-01-28: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-01-28:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5202/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-01-30

1407. By Michael Terry on 2015-01-30: Make spread pages slightly smaller

PS Jenkins bot (ps-jenkins) wrote on 2015-01-30:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5210/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-02-01

1408. By Michael Terry on 2015-02-01: Merge from -refactor
1409. By Michael Terry on 2015-02-01: Add tease to bottom edge slider

PS Jenkins bot (ps-jenkins) wrote on 2015-02-02:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5213/rebuild

review: Needs Fixing (continuous-integration)

Michael Zanetti (mzanetti) wrote on 2015-02-02:

there's an outdated comment now, see inline comment

Michael Terry (mterry) wrote on 2015-02-02:

Naw, I think that comment is still fine. I replied inline. But I'm happy to change if you disagree.

Michael Zanetti (mzanetti) wrote on 2015-02-03:

* Did you perform an exploratory manual test run of the code change and any related functionality?

yes

* Did CI run pass? If not, please explain why.

no. ci seems to have crashed. I've just triggered a rebuild. Michael, please check if jenkins is fine with this branch before we land it.

* Did you make sure that the branch does not contain spurious tags?

yes

review: Approve

PS Jenkins bot (ps-jenkins) wrote on 2015-02-03:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5219/rebuild

review: Needs Fixing (continuous-integration)

Michael Zanetti (mzanetti) wrote on 2015-02-03:

ok, Jenkins built fine now. Failing qml tests don't seem to be related to this branch. However, Autopilot seems to have issues. I think at least this test is broken by this branch:

unity8.shell.tests.test_edges_demo.EdgesDemoTestCase.test_complete_edge_demo

Please also check if the other AP failures are related.

review: Needs Fixing

lp:~mterry/unity8/tutorial-new-screens updated on 2015-02-03

1410. By Michael Terry on 2015-02-03: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-02-03:

FAILED: Continuous integration, rev:1410
http://jenkins.qa.ubuntu.com/job/unity8-ci/5227/
Executed test runs:
    FAILURE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/1139/console
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/391
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/392
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/392
    FAILURE: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1137/console

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5227/rebuild

review: Needs Fixing (continuous-integration)

Michael Terry (mterry) wrote on 2015-02-03:

This is from Olga reviewing the latest code here:

"We reviewed the new implementation and you have the go ahead. :)
Looks brilliant! :D"

So that's a +1 from design. Just need to confirm fixed AP tests and we're good.

PS Jenkins bot (ps-jenkins) wrote on 2015-02-04:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5238/rebuild

review: Needs Fixing (continuous-integration)

Michael Zanetti (mzanetti) wrote on 2015-02-04:

ok. last test run looks good.

review: Approve

lp:~mterry/unity8/tutorial-new-screens updated on 2015-02-05

1411. By Michael Terry on 2015-02-05: Merge from -refactor
1412. By Michael Terry on 2015-02-05: Merge from -refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-02-11:

PASSED: Continuous integration, rev:1410
http://jenkins.qa.ubuntu.com/job/unity8-ci/5281/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/1287
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/445
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/446
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/446
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/1137
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1285
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1285/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/17954

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5281/rebuild

review: Approve (continuous-integration)

PS Jenkins bot (ps-jenkins) wrote on 2015-02-11:

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5288/rebuild

review: Needs Fixing (continuous-integration)

lp:~mterry/unity8/tutorial-new-screens updated on 2015-02-11

1413. By Michael Terry on 2015-02-11: Merge from tutorial-refactor

PS Jenkins bot (ps-jenkins) wrote on 2015-02-11:

PASSED: Continuous integration, rev:1412
http://jenkins.qa.ubuntu.com/job/unity8-ci/5295/
Executed test runs:
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-vivid-touch/1302
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-vivid/459
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-amd64-ci/460
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-vivid-i386-ci/460
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-vivid-mako/1152
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1300
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-vivid-armhf/1300/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/17974

Click here to trigger a rebuild:
http://s-jenkins.ubuntu-ci:8080/job/unity8-ci/5295/rebuild

review: Approve (continuous-integration)

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk

Subscribers

People subscribed via source and target branches

to all changes:

Michael Terry

Mohammad Rakibul Hasan

Unity Team

 === modified file 'qml/Shell.qml'
 --- qml/Shell.qml	2015-02-11 16:32:24 +0000
 +++ qml/Shell.qml	2015-02-11 16:32:25 +0000
@@ -290,7 +290,7 @@
              source: usageModeSettings.usageMode === "Windowed" ? "Stages/DesktopStage.qml"
                          : tabletMode ? "Stages/TabletStage.qml" : "Stages/PhoneStage.qml"
--            property bool interactive: tutorial.stagesEnabled
++            property bool interactive: tutorial.spreadEnabled
                      && !greeter.shown
                      && !lockscreen.shown
                      && panel.indicators.fullyClosed
@@ -323,7 +323,7 @@
              Binding {
                  target: applicationsDisplayLoader.item
                  property: "spreadEnabled"
--                value: tutorial.stagesEnabled && !greeter.hasLockedApp
++                value: tutorial.spreadEnabled && !greeter.hasLockedApp
+             }
              Binding {
                  target: applicationsDisplayLoader.item
@@ -889,8 +889,12 @@
          panel: panel
          stages: stages
          overlay: overlay
++        edgeSize: shell.edgeSize
--        onFinished: AccountsService.demoEdges = false
++        onFinished: {
++            AccountsService.demoEdges = false;
++            active = false; // for immediate response / if AS is having problems
++        }
+     }
      Connections {
 === modified file 'qml/Stages/ApplicationWindow.qml'
 --- qml/Stages/ApplicationWindow.qml	2015-02-11 16:32:24 +0000
 +++ qml/Stages/ApplicationWindow.qml	2015-02-11 16:32:25 +0000
@@ -43,6 +43,7 @@
          readonly property color splashColor: root.application ? root.application.splashColor : "#00000000"
          readonly property color splashColorHeader: root.application ? root.application.splashColorHeader : "#00000000"
          readonly property color splashColorFooter: root.application ? root.application.splashColorFooter : "#00000000"
++        readonly property url defaultScreenshot: root.application ? root.application.defaultScreenshot : ""
          // Whether the Application had a surface before but lost it.
          property bool hadSurface: sessionContainer.surfaceContainer.hadSurface
@@ -72,7 +73,7 @@
      Image {
          id: screenshotImage
          objectName: "screenshotImage"
--        source: ""
++        source: d.defaultScreenshot
          anchors.fill: parent
          antialiasing: !root.interactive
@@ -125,6 +126,7 @@
+     }
      StateGroup {
++        id: stateGroup
          objectName: "applicationWindowStateGroup"
          states: [
              State {
@@ -218,6 +220,17 @@
+                 }
              },
              Transition {
++                from: "splashScreen"; to: "screenshot"
++                SequentialAnimation {
++                    PropertyAction { target: screenshotImage
++                                     property: "visible"; value: true }
++                    UbuntuNumberAnimation { target: screenshotImage; property: "opacity";
++                                            from: 0.0; to: 1.0
++                                            duration: UbuntuAnimation.BriskDuration }
++                    PropertyAction { target: splashLoader; property: "active"; value: false }
++                }
++            },
++            Transition {
                  from: "surface"; to: "void"
                  SequentialAnimation {
                      PropertyAction { target: sessionContainer.surfaceContainer; property: "visible"; value: false }
 === modified file 'qml/Stages/PhoneStage.qml'
 --- qml/Stages/PhoneStage.qml	2015-02-11 16:32:24 +0000
 +++ qml/Stages/PhoneStage.qml	2015-02-11 16:32:25 +0000
@@ -32,6 +32,21 @@
      property bool spreadEnabled: true // If false, animations and right edge will be disabled
      property real inverseProgress: 0 // This is the progress for left edge drags, in pixels.
      property int orientation: Qt.PortraitOrientation
++    property QtObject applicationManager: ApplicationManager
++    property bool focusFirstApp: true // If false, focused app will appear on right edge like other apps
++    property bool altTabEnabled: true
++    property real startScale: 1.1
++    property real endScale: 0.7
++
++    // How far left the stage has been dragged
++    readonly property real dragProgress: spreadRepeater.count > 0 ? -spreadRepeater.itemAt(0).xTranslate : 0
++
++    readonly property alias dragging: spreadDragArea.dragging
++
++    // Only used by the tutorial right now, when it is teasing the right edge
++    property real dragAreaOverlap
++
++    signal opened()
      color: "#111111"
@@ -52,30 +67,30 @@
          if (inverseProgress == 0 && priv.oldInverseProgress > 0) {
              // left edge drag released. Minimum distance is given by design.
              if (priv.oldInverseProgress > units.gu(22)) {
--                ApplicationManager.requestFocusApplication("unity8-dash");
++                applicationManager.requestFocusApplication("unity8-dash");
+             }
+         }
          priv.oldInverseProgress = inverseProgress;
+     }
      Connections {
--        target: ApplicationManager
++        target: applicationManager
          onFocusRequested: {
              if (spreadView.phase > 0) {
                  spreadView.snapTo(priv.indexOf(appId));
              } else {
--                ApplicationManager.focusApplication(appId);
++                applicationManager.focusApplication(appId);
+             }
+         }
          onApplicationAdded: {
              if (spreadView.phase == 2) {
--                spreadView.snapTo(ApplicationManager.count - 1);
++                spreadView.snapTo(applicationManager.count - 1);
              } else {
                  spreadView.phase = 0;
                  spreadView.contentX = -spreadView.shift;
--                ApplicationManager.focusApplication(appId);
++                applicationManager.focusApplication(appId);
+             }
+         }
@@ -90,9 +105,9 @@
+         }
          function focusTopMostApp() {
--            if (ApplicationManager.count > 0) {
--                var topmostApp = ApplicationManager.get(0);
--                ApplicationManager.focusApplication(topmostApp.appId);
++            if (applicationManager.count > 0) {
++                var topmostApp = applicationManager.get(0);
++                applicationManager.focusApplication(topmostApp.appId);
+             }
+         }
+     }
@@ -100,20 +115,21 @@
      QtObject {
          id: priv
--        property string focusedAppId: ApplicationManager.focusedApplicationId
--        property var focusedApplication: ApplicationManager.findApplication(focusedAppId)
++        readonly property int firstSpreadIndex: root.focusFirstApp ? 1 : 0
++        property string focusedAppId: applicationManager.focusedApplicationId
++        property var focusedApplication: applicationManager.findApplication(focusedAppId)
          property var focusedAppDelegate: null
          property real oldInverseProgress: 0
--        property bool animateX: true
++        property bool animateX: false
          onFocusedAppIdChanged: focusedAppDelegate = spreadRepeater.itemAt(0);
          onFocusedAppDelegateChanged: focusedAppDelegate.focus = true;
          function indexOf(appId) {
--            for (var i = 0; i < ApplicationManager.count; i++) {
--                if (ApplicationManager.get(i).appId == appId) {
++            for (var i = 0; i < applicationManager.count; i++) {
++                if (applicationManager.get(i).appId == appId) {
                      return i;
+                 }
+             }
@@ -133,7 +149,7 @@
          // This indicates when the spreadView is active. That means, all the animations
          // are activated and tiles need to line up for the spread.
--        readonly property bool active: shiftedContentX > 0 || spreadDragArea.status === DirectionalDragArea.Recognized
++        readonly property bool active: shiftedContentX > 0 || spreadDragArea.status === DirectionalDragArea.Recognized || !root.focusFirstApp
          // The flickable needs to fill the screen in order to get touch events all over.
          // However, we don't want to the user to be able to scroll back all the way. For
@@ -199,10 +215,17 @@
                  // Add 1 pixel to make sure we definitely hit positionMarker4 even with rounding errors of the animation.
                  snapAnimation.targetContentX = width * positionMarker4 + 1 - shift;
                  snapAnimation.start();
++                root.opened();
+             }
+         }
          function snapTo(index) {
--            if (ApplicationManager.count <= index) {
++            if (!root.altTabEnabled) {
++                // Reset to start instead
++                snapAnimation.targetContentX = -shift;
++                snapAnimation.start();
++                return;
++            }
++            if (applicationManager.count <= index) {
                  // In case we're trying to snap to some non existing app, lets snap back to the first one
                  index = 0;
+             }
@@ -217,10 +240,12 @@
              snapAnimation.start();
+         }
--        // In case the ApplicationManager already holds an app when starting up we're missing animations
++        // In case the applicationManager already holds an app when starting up we're missing animations
          // Make sure we end up in the same state
          Component.onCompleted: {
              spreadView.contentX = -spreadView.shift
++            priv.animateX = true;
++            snapAnimation.complete();
+         }
          SequentialAnimation {
@@ -237,7 +262,7 @@
              ScriptAction {
                  script: {
                      if (spreadView.selectedIndex >= 0) {
--                        ApplicationManager.focusApplication(ApplicationManager.get(spreadView.selectedIndex).appId);
++                        applicationManager.focusApplication(applicationManager.get(spreadView.selectedIndex).appId);
                          spreadView.selectedIndex = -1;
                          spreadView.phase = 0;
@@ -252,7 +277,7 @@
              // This width controls how much the spread can be flicked left/right. It's composed of:
              //  tileDistance * app count (with a minimum of 3 apps, in order to also allow moving 1 and 2 apps a bit)
              //  + some constant value (still scales with the screen width) which looks good and somewhat fills the screen
--            width: Math.max(3, ApplicationManager.count) * spreadView.tileDistance + (spreadView.width - spreadView.tileDistance) * 1.5
++            width: Math.max(3, applicationManager.count) * spreadView.tileDistance + (spreadView.width - spreadView.tileDistance) * 1.5
              height: parent.height
              Behavior on width {
                  enabled: spreadView.closingIndex >= 0
@@ -267,20 +292,22 @@
              x: spreadView.contentX
              onClicked: {
--                spreadView.snapTo(0);
++                if (root.altTabEnabled) {
++                    spreadView.snapTo(0);
++                }
+             }
              Repeater {
                  id: spreadRepeater
                  objectName: "spreadRepeater"
--                model: ApplicationManager
++                model: applicationManager
                  delegate: TransformedSpreadDelegate {
                      id: appDelegate
                      objectName: "appDelegate" + index
                      startAngle: 45
                      endAngle: 5
--                    startScale: 1.1
--                    endScale: 0.7
++                    startScale: root.startScale
++                    endScale: root.endScale
                      startDistance: spreadView.tileDistance
                      endDistance: units.gu(.5)
                      width: spreadView.width
@@ -288,11 +315,12 @@
                      selected: spreadView.selectedIndex == index
                      otherSelected: spreadView.selectedIndex >= 0 && !selected
                      interactive: !spreadView.interactive && spreadView.phase === 0
--                            && spreadView.shiftedContentX === 0 && root.interactive && index === 0
--                    swipeToCloseEnabled: spreadView.interactive && !snapAnimation.running
++                            && spreadView.shiftedContentX === 0 && root.interactive && isFocused
++                    swipeToCloseEnabled: spreadView.interactive && root.interactive && !snapAnimation.running
                      maximizedAppTopMargin: root.maximizedAppTopMargin
                      dropShadow: spreadView.active ||
                                  (priv.focusedAppDelegate && priv.focusedAppDelegate.x !== 0)
++                    focusFirstApp: root.focusFirstApp
                      readonly property bool isDash: model.appId == "unity8-dash"
@@ -300,7 +328,7 @@
                      x: {
                          // focused app is always positioned at 0 except when following left edge drag
--                        if (index == 0) {
++                        if (isFocused) {
                              if (!isDash && root.inverseProgress > 0 && spreadView.phase === 0) {
                                  return root.inverseProgress;
+                             }
@@ -311,10 +339,10 @@
+                         }
                          // Otherwise line up for the spread
--                        return spreadView.width + (index - 1) * spreadView.tileDistance;
++                        return spreadView.width + spreadIndex * spreadView.tileDistance;
+                     }
--                    application: ApplicationManager.get(index)
++                    application: applicationManager.get(index)
                      closeable: !isDash
                      property real behavioredIndex: index
@@ -352,7 +380,7 @@
                      progress: {
                          var tileProgress = (spreadView.shiftedContentX - behavioredIndex * spreadView.tileDistance) / spreadView.width;
                          // Tile 1 needs to move directly from the beginning...
--                        if (behavioredIndex == 1 && spreadView.phase < 2) {
++                        if (root.focusFirstApp && behavioredIndex == 1 && spreadView.phase < 2) {
                              tileProgress += spreadView.tileDistance / spreadView.width;
+                         }
                          // Limiting progress to ~0 and 1.7 to avoid binding calculations when tiles are not
@@ -367,7 +395,7 @@
                      // This mostly is the same as progress, just adds the snapping to phase 1 for tiles 0 and 1
                      animatedProgress: {
--                        if (spreadView.phase == 0 && index < 2) {
++                        if (spreadView.phase == 0 && index <= priv.firstSpreadIndex) {
                              if (progress < spreadView.positionMarker1) {
                                  return progress;
                              } else if (progress < spreadView.positionMarker1 + 0.05){
@@ -392,11 +420,11 @@
+                     }
                      onClicked: {
--                        if (spreadView.phase == 2) {
--                            if (ApplicationManager.focusedApplicationId == ApplicationManager.get(index).appId) {
++                        if (root.altTabEnabled && spreadView.phase == 2) {
++                            if (applicationManager.focusedApplicationId == applicationManager.get(index).appId) {
                                  spreadView.snapTo(index);
                              } else {
--                                ApplicationManager.requestFocusApplication(ApplicationManager.get(index).appId);
++                                applicationManager.requestFocusApplication(applicationManager.get(index).appId);
+                             }
+                         }
+                     }
@@ -411,7 +439,7 @@
                      onClosed: {
                          spreadView.closingIndex = index;
--                        ApplicationManager.stopApplication(ApplicationManager.get(index).appId);
++                        applicationManager.stopApplication(applicationManager.get(index).appId);
+                     }
+                 }
+             }
@@ -424,7 +452,7 @@
          direction: Direction.Leftwards
          enabled: (spreadView.phase != 2 && root.spreadEnabled) || dragging
--        anchors { top: parent.top; right: parent.right; bottom: parent.bottom }
++        anchors { top: parent.top; right: parent.right; bottom: parent.bottom; rightMargin: -root.dragAreaOverlap }
          width: root.dragAreaWidth
          property var gesturePoints: new Array()
 === modified file 'qml/Stages/TransformedSpreadDelegate.qml'
 --- qml/Stages/TransformedSpreadDelegate.qml	2014-12-01 12:09:28 +0000
 +++ qml/Stages/TransformedSpreadDelegate.qml	2015-02-11 16:32:25 +0000
@@ -46,6 +46,18 @@
      property real startDistance: units.gu(5)
      property real endDistance: units.gu(.5)
++    // Whether first app is displayed entirely vs just on the spread edge
++    property bool focusFirstApp: true
++
++    // Whether this delegate is displayed to the user outside of the spread
++    readonly property bool isFocused: focusFirstApp && index === 0
++
++    // Adjusted index for any spread animation calculations
++    readonly property int spreadIndex: index - (focusFirstApp ? 1 : 0)
++
++    // How far left this delegate has been translated
++    readonly property alias xTranslate: priv.xTranslate
++
      onSelectedChanged: {
          if (selected) {
              priv.snapshot();
@@ -63,8 +75,8 @@
      Connections {
          target: spreadView
          onPhaseChanged: {
--            if (spreadView.phase == 1) {
--                if (index == 0) {
++            if (root.focusFirstApp && spreadView.phase == 1) {
++                if (index === 0) {
                      priv.phase2startTranslate = priv.easingAnimation(0, spreadView.positionMarker4, 0, -spreadView.width, spreadView.positionMarker4) + spreadView.width;
                      priv.phase2startAngle = priv.easingAnimation(0, spreadView.positionMarker4, root.startAngle, root.endAngle, spreadView.positionMarker4);
                      priv.phase2startScale = priv.easingAnimation(0, spreadView.positionMarker4, root.startScale, root.endScale, spreadView.positionMarker4);
@@ -134,7 +146,7 @@
+             }
              if (otherSelected) {
--                if (spreadView.phase < 2 && index == 0) {
++                if (spreadView.phase < 2 && root.isFocused) {
                      return linearAnimation(selectedProgress, 0, selectedXTranslate,
                                             selectedXTranslate - spreadView.tileDistance, root.progress);
+                 }
@@ -142,8 +154,7 @@
                  return selectedXTranslate;
+             }
--            switch (index) {
--            case 0:
++            if (root.focusFirstApp && index === 0) {
                  if (spreadView.phase == 0) {
                      return Math.min(0, linearAnimation(0, spreadView.positionMarker2,
 , -spreadView.width * .25, root.animatedProgress));
@@ -153,11 +164,10 @@
                  } else if (!priv.isSelected){ // phase 2
                      // Apply the same animation as with the rest but add spreadView.width to align it with the others.
                      return -easingCurve.value * spreadView.width + spreadView.width;
--                } else if (priv.isSelected) {
++                } else {
                      return linearAnimation(selectedProgress, 0, selectedXTranslate, 0, root.progress);
+                 }
--
--            case 1:
++            } else if (root.focusFirstApp && index === 1) {
                  if (spreadView.phase == 0 && !priv.isSelected) {
                      return linearAnimation(0, spreadView.positionMarker2,
 , -spreadView.width * spreadView.snapPosition, root.animatedProgress);
@@ -170,13 +180,13 @@
              if (priv.isSelected) {
                  // Distance to left edge
--                var targetTranslate = -spreadView.width - ((index - 1) * root.startDistance);
++                var targetTranslate = -spreadView.width - (root.spreadIndex * root.startDistance);
                  return linearAnimation(selectedProgress, 0,
                                         selectedXTranslate, targetTranslate, root.progress);
+             }
              // Fix it at the right edge...
--            var rightEdgeOffset =  -((index - 1) * root.startDistance);
++            var rightEdgeOffset =  -(root.spreadIndex * root.startDistance);
              // ...and use our easing to move them to the left. Stop a bit earlier for each tile
              var animatedEndDistance = linearAnimation(0, 2, root.endDistance, 0, root.progress);
              return -easingCurve.value * spreadView.width + (index * animatedEndDistance) + rightEdgeOffset;
@@ -194,8 +204,7 @@
              if (priv.isSelected) {
                  return linearAnimation(selectedProgress, 0, selectedAngle, 0, root.progress);
+             }
--            switch (index) {
--            case 0:
++            if (root.focusFirstApp && index === 0) {
                  if (spreadView.phase == 0) {
                      return Math.max(0, linearAnimation(0, spreadView.positionMarker2,
 , root.tile0SnapAngle, root.animatedProgress));
@@ -203,7 +212,7 @@
                      return linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4,
                                             root.tile0SnapAngle, phase2startAngle, root.progress);
+                 }
--            case 1:
++            } else if (root.focusFirstApp && index === 1) {
                  if (spreadView.phase == 0) {
                      return linearAnimation(0, spreadView.positionMarker2, root.startAngle,
                                             root.startAngle * (1-spreadView.snapPosition), root.animatedProgress);
@@ -227,15 +236,14 @@
                  return linearAnimation(selectedProgress, 0, selectedScale, 1, root.progress);
+             }
--            switch (index) {
--            case 0:
++            if (root.focusFirstApp && index === 0) {
                  if (spreadView.phase == 0) {
                      return 1;
                  } else if (spreadView.phase == 1) {
                      return linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4,
 , phase2startScale, root.progress);
+                 }
--            case 1:
++            } else if (root.focusFirstApp && index === 1) {
                  if (spreadView.phase == 0) {
                      var targetScale = tile1StartScale - ((tile1StartScale - 1) * spreadView.snapPosition);
                      return linearAnimation(0, spreadView.positionMarker2,
@@ -254,7 +262,7 @@
                  return linearAnimation (selectedProgress, Math.max(0, selectedProgress - .5),
                                          selectedOpacity, 0, root.progress);
+             }
--            if (index == 0) {
++            if (root.isFocused) {
                  switch (spreadView.phase) {
                  case 0:
                      return linearAnimation(0, spreadView.positionMarker2, 1, .7, root.animatedProgress);
@@ -272,16 +280,14 @@
                  return linearAnimation(selectedProgress, 0, selectedTopMarginProgress, 0, root.progress);
+             }
--            switch (index) {
--            case 0:
++            if (root.focusFirstApp && index === 0) {
                  if (spreadView.phase == 0) {
                      return 0;
                  } else if (spreadView.phase == 1) {
                      return linearAnimation(spreadView.positionMarker2, spreadView.positionMarker4,
 , priv.phase2startTopMarginProgress, root.progress);
+                 }
--                break;
--            case 1:
++            } else if (root.focusFirstApp && index === 1) {
                  if (spreadView.phase == 0) {
                      return 0;
                  } else if (spreadView.phase == 1) {
 === modified file 'qml/Tutorial/Slider.qml'
 --- qml/Tutorial/Slider.qml	2015-02-11 16:32:24 +0000
 +++ qml/Tutorial/Slider.qml	2015-02-11 16:32:25 +0000
@@ -38,7 +38,7 @@
          readonly property real margin: units.gu(0.5)
          readonly property real arrowSize: root.height - margin * 2
          readonly property real dotSize: units.dp(1)
--        readonly property real slideOffset: Math.min(root.offset - offscreenOffset, target.x)
++        readonly property real slideOffset: MathUtils.clamp(root.offset - offscreenOffset, -offscreenOffset, target.x)
          readonly property real offscreenOffset: units.gu(2)
+     }
@@ -111,7 +111,13 @@
          color: UbuntuColors.orange
          darkenBy: root.active ? 0.5 : 0
          anchors.left: parent.left
--        anchors.leftMargin: d.slideOffset
++        // We use a Translate transform rather than anchors.leftMargin because
++        // the latter has weird performance problems on the TutorialRight page.
++        transform: [
++            Translate {
++                x: d.slideOffset
++            }
++        ]
          anchors.verticalCenter: parent.verticalCenter
+     }
+ }
 === added file 'qml/Tutorial/Tick.qml'
 --- qml/Tutorial/Tick.qml	1970-01-01 00:00:00 +0000
 +++ qml/Tutorial/Tick.qml	2015-02-11 16:32:25 +0000
@@ -0,0 +1,29 @@
++/*
++ * Copyright (C) 2015 Canonical, Ltd.
++ *
++ * This program is free software; you can redistribute it and/or modify
++ * it under the terms of the GNU General Public License as published by
++ * the Free Software Foundation; version 3.
++ *
++ * This program is distributed in the hope that it will be useful,
++ * but WITHOUT ANY WARRANTY; without even the implied warranty of
++ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
++ * GNU General Public License for more details.
++ *
++ * You should have received a copy of the GNU General Public License
++ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
++ */
++
++import QtQuick 2.3
++import Ubuntu.Components 1.1
++
++MouseArea {
++    implicitHeight: tick.height
++    implicitWidth: tick.width
++    Image {
++        id: tick
++        source: Qt.resolvedUrl("graphics/tick.png")
++        height: units.gu(6.5)
++        width: units.gu(6.5)
++    }
++}
 === modified file 'qml/Tutorial/Tutorial.qml'
 --- qml/Tutorial/Tutorial.qml	2015-02-11 16:32:24 +0000
 +++ qml/Tutorial/Tutorial.qml	2015-02-11 16:32:25 +0000
@@ -22,6 +22,7 @@
      property alias active: loader.active
      property bool paused
++    property real edgeSize
      property Item launcher
      property Item panel
@@ -29,7 +30,7 @@
      property Item overlay
      readonly property bool launcherEnabled: loader.item ? loader.item.launcherEnabled : true
--    readonly property bool stagesEnabled: loader.item ? loader.item.stagesEnabled : true
++    readonly property bool spreadEnabled: loader.item ? loader.item.spreadEnabled : true
      readonly property bool panelEnabled: loader.item ? loader.item.panelEnabled : true
      readonly property bool panelContentEnabled: loader.item ? loader.item.panelContentEnabled : true
      readonly property bool running: loader.item ? loader.item.running : false
@@ -55,6 +56,12 @@
          Binding {
              target: loader.item
++            property: "edgeSize"
++            value: root.edgeSize
++        }
++
++        Binding {
++            target: loader.item
              property: "launcher"
              value: root.launcher
+         }
 === added file 'qml/Tutorial/TutorialBottom.qml'
 --- qml/Tutorial/TutorialBottom.qml	1970-01-01 00:00:00 +0000
 +++ qml/Tutorial/TutorialBottom.qml	2015-02-11 16:32:25 +0000
@@ -0,0 +1,104 @@
++/*
++ * Copyright (C) 2014 Canonical, Ltd.
++ *
++ * This program is free software; you can redistribute it and/or modify
++ * it under the terms of the GNU General Public License as published by
++ * the Free Software Foundation; version 3.
++ *
++ * This program is distributed in the hope that it will be useful,
++ * but WITHOUT ANY WARRANTY; without even the implied warranty of
++ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
++ * GNU General Public License for more details.
++ *
++ * You should have received a copy of the GNU General Public License
++ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
++ */
++
++import QtQuick 2.3
++import Ubuntu.Components 1.1
++import Ubuntu.Gestures 0.1
++import "../Components"
++import "." as LocalComponents
++
++TutorialPage {
++    id: root
++
++    property alias edgeSize: dragArea.height
++
++    title: i18n.tr("Open special menus")
++    text: i18n.tr("Swipe up from the bottom edge.")
++    fullTextWidth: true
++
++    SequentialAnimation {
++        id: teaseAnimation
++        paused: running && root.paused
++        running: !dragArea.useTouchY && slider.dragOffset === 0
++        loops: Animation.Infinite
++
++        UbuntuNumberAnimation {
++            target: slider
++            property: "teaseOffset"
++            to: units.gu(1)
++            duration: UbuntuAnimation.SleepyDuration
++        }
++        UbuntuNumberAnimation {
++            target: slider
++            property: "teaseOffset"
++            to: 0
++            duration: UbuntuAnimation.SleepyDuration
++        }
++    }
++
++    foreground {
++        children: [
++            LocalComponents.Slider {
++                id: slider
++                anchors {
++                    bottom: parent.bottom
++                    bottomMargin: width / 2 - height / 2
++                    horizontalCenter: parent.horizontalCenter
++                }
++                rotation: -90
++                offset: teaseOffset + dragOffset
++                active: dragArea.dragging
++
++                property real teaseOffset
++                property real dragOffset: dragArea.useTouchY ? -dragArea.touchY : 0
++
++                Behavior on dragOffset {
++                    id: offsetAnimation
++                    UbuntuNumberAnimation {}
++                }
++            }
++        ]
++    }
++
++    EdgeDragArea {
++        id: dragArea
++        direction: Direction.Upwards
++        anchors {
++            bottom: parent.bottom
++            left: parent.left
++            right: parent.right
++        }
++
++        property bool useTouchY
++
++        onDraggingChanged: {
++            if (!dragging) {
++                if (slider.percent >= 0.85) {
++                    root.hide();
++                } else if (slider.percent >= 0.15) {
++                    root.showError();
++                }
++            }
++
++            // We use a separate vars here rather than just directly looking at
++            // 'dragging' because we want to preserve our 'slider.offset'
++            // value during the above percent check.  Now that we made it,
++            // we can have 'slider.offset' go back to zero.
++            offsetAnimation.enabled = !dragging;
++            useTouchY = dragging;
++        }
++    }
++}
 === added file 'qml/Tutorial/TutorialBottomFinish.qml'
 --- qml/Tutorial/TutorialBottomFinish.qml	1970-01-01 00:00:00 +0000
 +++ qml/Tutorial/TutorialBottomFinish.qml	2015-02-11 16:32:25 +0000
@@ -0,0 +1,41 @@
++/*
++ * Copyright (C) 2014 Canonical, Ltd.
++ *
++ * This program is free software; you can redistribute it and/or modify
++ * it under the terms of the GNU General Public License as published by
++ * the Free Software Foundation; version 3.
++ *
++ * This program is distributed in the hope that it will be useful,
++ * but WITHOUT ANY WARRANTY; without even the implied warranty of
++ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
++ * GNU General Public License for more details.
++ *
++ * You should have received a copy of the GNU General Public License
++ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
++ */
++
++import QtQuick 2.3
++import Ubuntu.Components 1.1
++import "." as LocalComponents
++
++TutorialPage {
++    id: root
++
++    title: i18n.tr("This action does different things for different apps")
++    text: i18n.tr("Tap here to finish.")
++    fullTextWidth: true
++
++    foreground {
++        children: [
++            LocalComponents.Tick {
++                objectName: "tick"
++                anchors {
++                    horizontalCenter: parent.horizontalCenter
++                    top: parent.top
++                    topMargin: root.textBottom + units.gu(3)
++                }
++                onClicked: root.hide()
++            }
++        ]
++    }
++}
 === modified file 'qml/Tutorial/TutorialContent.qml'
 --- qml/Tutorial/TutorialContent.qml	2015-02-11 16:32:24 +0000
 +++ qml/Tutorial/TutorialContent.qml	2015-02-11 16:32:25 +0000
@@ -26,13 +26,14 @@
      property Item overlay
      readonly property bool launcherEnabled: !running ||
--                                            (!paused && loader.target === leftComponent)
--    readonly property bool stagesEnabled: !running
++                                            (!paused && tutorialLeft.shown)
++    readonly property bool spreadEnabled: !running
      readonly property bool panelEnabled: !running
      readonly property bool panelContentEnabled: !running
--    readonly property bool running: loader.sourceComponent !== null
++    readonly property alias running: d.running
      property bool paused: false
++    property real edgeSize
      signal finished()
@@ -50,81 +51,74 @@
      QtObject {
          id: d
++        property bool running
++
          function stop() {
--            loader.sourceComponent = null;
++            running = false;
+         }
          function start() {
--            loader.load(leftComponent);
--        }
--    }
--
--    Loader {
--        id: loader
--        objectName: "tutorialLoader"
--
--        property Component target: {
--            if (next) {
--                return next;
--            } else if (loader.item && loader.item.shown) {
--                return sourceComponent;
--            } else {
--                return null;
--            }
--        }
--
--        property Component next: null
--
--        function load(comp) {
--            if (loader.item) {
--                next = comp;
--                loader.item.hide();
--            } else {
--                loader.sourceComponent = comp;
--            }
--        }
--
--        Connections {
--            target: loader.item
--            onFinished: {
--                loader.sourceComponent = loader.next;
--                if (loader.next != null) {
--                    loader.next = null;
--                } else {
--                    root.finished();
--                }
--            }
--        }
--
--        Binding {
--            target: loader.item
--            property: "paused"
--            value: root.paused
--        }
--    }
--
--    Component {
--        id: leftComponent
--        TutorialLeft {
--            objectName: "tutorialLeft"
--            parent: root.stages
--            anchors.fill: parent
--            launcher: root.launcher
--
--            onFinished: loader.load(leftFinishComponent)
--        }
--    }
--
--    Component {
--        id: leftFinishComponent
--        TutorialLeftFinish {
--            objectName: "tutorialLeftFinish"
--            parent: root.stages
--            anchors.fill: parent
--            textXOffset: root.launcher.panelWidth
--            backgroundFadesOut: true
--
--            onFinished: root.launcher.hide()
--        }
++            running = true;
++            tutorialLeft.show();
++        }
++    }
++
++    TutorialLeft {
++        id: tutorialLeft
++        objectName: "tutorialLeft"
++        parent: root.stages
++        anchors.fill: parent
++        launcher: root.launcher
++        paused: !shown || root.paused
++
++        onFinished: tutorialLeftFinish.show()
++    }
++
++    TutorialLeftFinish {
++        id: tutorialLeftFinish
++        objectName: "tutorialLeftFinish"
++        parent: root.stages
++        anchors.fill: parent
++        textXOffset: root.launcher.panelWidth
++        paused: !shown || root.paused
++
++        onFinished: {
++            root.launcher.hide();
++            tutorialRight.show();
++        }
++    }
++
++    TutorialRight {
++        id: tutorialRight
++        objectName: "tutorialRight"
++        parent: root.stages
++        anchors.fill: parent
++        edgeSize: root.edgeSize
++        panel: root.panel
++        paused: !shown || root.paused
++
++        onFinished: tutorialBottom.show()
++    }
++
++    TutorialBottom {
++        id: tutorialBottom
++        objectName: "tutorialBottom"
++        parent: root.stages
++        anchors.fill: parent
++        edgeSize: root.edgeSize
++        paused: !shown || root.paused
++
++        onFinished: tutorialBottomFinish.show()
++    }
++
++    TutorialBottomFinish {
++        id: tutorialBottomFinish
++        objectName: "tutorialBottomFinish"
++        parent: root.stages
++        anchors.fill: parent
++        backgroundFadesOut: true
++        paused: !shown || root.paused
++
++        onFinished: root.finish()
+     }
+ }
 === modified file 'qml/Tutorial/TutorialLeftFinish.qml'
 --- qml/Tutorial/TutorialLeftFinish.qml	2015-02-11 16:32:24 +0000
 +++ qml/Tutorial/TutorialLeftFinish.qml	2015-02-11 16:32:25 +0000
@@ -16,31 +16,25 @@
  import QtQuick 2.3
  import Ubuntu.Components 1.1
++import "." as LocalComponents
  TutorialPage {
      id: root
      title: i18n.tr("These are the shortcuts to favorite apps")
--    text: i18n.tr("Tap here to finish.")
++    text: i18n.tr("Tap here to continue.")
      fullTextWidth: true
      foreground {
          children: [
--            Image {
++            LocalComponents.Tick {
                  objectName: "tick"
                  anchors {
                      horizontalCenter: parent.horizontalCenter
                      top: parent.top
                      topMargin: root.textBottom + units.gu(3)
+                 }
--                source: Qt.resolvedUrl("graphics/tick.png")
--                height: units.gu(6.5)
--                width: units.gu(6.5)
--
--                MouseArea {
--                    anchors.fill: parent
--                    onClicked: root.hide()
--                }
++                onClicked: root.hide()
+             }
+         ]
+     }
 === modified file 'qml/Tutorial/TutorialPage.qml'
 --- qml/Tutorial/TutorialPage.qml	2015-02-11 16:32:24 +0000
 +++ qml/Tutorial/TutorialPage.qml	2015-02-11 16:32:25 +0000
@@ -52,8 +52,8 @@
      property real textXOffset: 0
      property real textYOffset: 0
--    // Foreground opacity
--    property real foregroundOpacity: 1
++    // Foreground text opacity
++    property real textOpacity: 1
      signal finished()
@@ -63,8 +63,8 @@
      ////
++    visible: false
      shown: false
--    Component.onCompleted: show()
      property real _foregroundHideOpacity
@@ -73,16 +73,16 @@
          from: 0
          to: 1
          duration: root.backgroundFadesIn ? UbuntuAnimation.SleepyDuration : UbuntuAnimation.BriskDuration
++        onStarted: root.visible = true
+     }
      hideAnimation: StandardAnimation {
          property: root.backgroundFadesOut ? "opacity" : "_foregroundHideOpacity"
          to: 0
          duration: UbuntuAnimation.BriskDuration
--        onRunningChanged: {
--            if (!running) {
--                root.finished();
--            }
++        onStopped: {
++            root.visible = false;
++            root.finished();
+         }
+     }
@@ -122,73 +122,78 @@
      Item {
          id: foreground
          anchors.fill: parent
--        opacity: root.foregroundOpacity < 1 ? root.foregroundOpacity : root._foregroundHideOpacity
--
--        Label {
--            id: titleLabel
--            anchors {
--                top: parent.verticalCenter
--                topMargin: d.verticalOffset + root.textYOffset
--                left: parent.left
--                leftMargin: d.sideMargin + d.textXOffset
--            }
--            width: parent.width - d.sideMargin * 2
--            horizontalAlignment: Text.AlignLeft
--            wrapMode: Text.Wrap
--            font.weight: Font.Light
--            font.pixelSize: units.gu(3.5)
--        }
--
--        Label {
--            id: textLabel
--            anchors {
--                top: titleLabel.bottom
--                topMargin: units.gu(2)
--                left: parent.left
--                leftMargin: d.sideMargin + d.textXOffset
--            }
--            width: (parent.width - d.sideMargin * 2) * (fullTextWidth ? 1 : 0.66)
--            horizontalAlignment: Text.AlignLeft
--            wrapMode: Text.Wrap
--            font.weight: Font.Light
--            font.pixelSize: units.gu(2.5)
--        }
--
--        // We use two separate labels like this rather than just changing
--        // the text of the above labels because we want to know where to place
--        // sliders (via root.textBottom) without having that place change
--        // as the text changes length.
--        Label {
--            id: errorTitleLabel
--            objectName: "errorTitleLabel"
--            anchors {
--                top: titleLabel.top
--                left: titleLabel.left
--            }
--            width: titleLabel.width
--            horizontalAlignment: titleLabel.horizontalAlignment
--            wrapMode: titleLabel.wrapMode
--            font.weight: titleLabel.font.weight
--            font.pixelSize: titleLabel.font.pixelSize
--            opacity: 0
--            text: i18n.tr("You almost got it!")
--        }
--
--        Label {
--            id: errorTextLabel
--            objectName: "errorTextLabel"
--            anchors {
--                top: errorTitleLabel.bottom
--                topMargin: textLabel.anchors.topMargin
--                left: textLabel.left
--            }
--            width: textLabel.width
--            horizontalAlignment: textLabel.horizontalAlignment
--            wrapMode: textLabel.wrapMode
--            font.weight: textLabel.font.weight
--            font.pixelSize: textLabel.font.pixelSize
--            opacity: 0
--            text: i18n.tr("Try again.")
++        opacity: root._foregroundHideOpacity
++
++        Item {
++            anchors.fill: parent
++            opacity: root.textOpacity
++
++            Label {
++                id: titleLabel
++                anchors {
++                    top: parent.verticalCenter
++                    topMargin: d.verticalOffset + root.textYOffset
++                    left: parent.left
++                    leftMargin: d.sideMargin + d.textXOffset
++                }
++                width: parent.width - d.sideMargin * 2
++                horizontalAlignment: Text.AlignLeft
++                wrapMode: Text.Wrap
++                font.weight: Font.Light
++                font.pixelSize: units.gu(3.5)
++            }
++
++            Label {
++                id: textLabel
++                anchors {
++                    top: titleLabel.bottom
++                    topMargin: units.gu(2)
++                    left: parent.left
++                    leftMargin: d.sideMargin + d.textXOffset
++                }
++                width: (parent.width - d.sideMargin * 2) * (fullTextWidth ? 1 : 0.66)
++                horizontalAlignment: Text.AlignLeft
++                wrapMode: Text.Wrap
++                font.weight: Font.Light
++                font.pixelSize: units.gu(2.5)
++            }
++
++            // We use two separate labels like this rather than just changing
++            // the text of the above labels because we want to know where to place
++            // sliders (via root.textBottom) without having that place change
++            // as the text changes length.
++            Label {
++                id: errorTitleLabel
++                objectName: "errorTitleLabel"
++                anchors {
++                    top: titleLabel.top
++                    left: titleLabel.left
++                }
++                width: titleLabel.width
++                horizontalAlignment: titleLabel.horizontalAlignment
++                wrapMode: titleLabel.wrapMode
++                font.weight: titleLabel.font.weight
++                font.pixelSize: titleLabel.font.pixelSize
++                opacity: 0
++                text: i18n.tr("You almost got it!")
++            }
++
++            Label {
++                id: errorTextLabel
++                objectName: "errorTextLabel"
++                anchors {
++                    top: errorTitleLabel.bottom
++                    topMargin: textLabel.anchors.topMargin
++                    left: textLabel.left
++                }
++                width: textLabel.width
++                horizontalAlignment: textLabel.horizontalAlignment
++                wrapMode: textLabel.wrapMode
++                font.weight: textLabel.font.weight
++                font.pixelSize: textLabel.font.pixelSize
++                opacity: 0
++                text: i18n.tr("Try again.")
++            }
+         }
          // A place for subclasses to add extra widgets
 === added file 'qml/Tutorial/TutorialRight.qml'
 --- qml/Tutorial/TutorialRight.qml	1970-01-01 00:00:00 +0000
 +++ qml/Tutorial/TutorialRight.qml	2015-02-11 16:32:25 +0000
@@ -0,0 +1,223 @@
++/*
++ * Copyright (C) 2014 Canonical, Ltd.
++ *
++ * This program is free software; you can redistribute it and/or modify
++ * it under the terms of the GNU General Public License as published by
++ * the Free Software Foundation; version 3.
++ *
++ * This program is distributed in the hope that it will be useful,
++ * but WITHOUT ANY WARRANTY; without even the implied warranty of
++ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
++ * GNU General Public License for more details.
++ *
++ * You should have received a copy of the GNU General Public License
++ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
++ */
++
++import QtQuick 2.3
++import Ubuntu.Components 1.1
++import Ubuntu.Gestures 0.1
++import Unity.Application 0.1
++import "../Components"
++import "../Stages"
++import "." as LocalComponents
++
++TutorialPage {
++    id: root
++
++    property var panel
++    property alias edgeSize: stage.dragAreaWidth
++
++    title: i18n.tr("To view open apps")
++    text: i18n.tr("Long swipe from the right edge.")
++
++    textOpacity: 1 - slider.percent
++
++    SequentialAnimation {
++        id: teaseAnimation
++        paused: running && root.paused
++        running: !stage.dragging && stage.dragProgress === 0
++        loops: Animation.Infinite
++
++        UbuntuNumberAnimation {
++            target: stage
++            property: "x"
++            to: -stage.dragAreaOverlap
++            duration: UbuntuAnimation.SleepyDuration
++        }
++        UbuntuNumberAnimation {
++            target: stage
++            property: "x"
++            to: 0
++            duration: UbuntuAnimation.SleepyDuration
++        }
++    }
++
++    foreground {
++        children: [
++            LocalComponents.Slider {
++                id: slider
++                anchors {
++                    right: parent.right
++                    top: parent.top
++                    topMargin: root.textBottom + units.gu(3)
++                }
++                rotation: 180
++                offset: stage.dragProgress - stage.x
++                active: stage.dragging
++            },
++
++            // Just assume PhoneStage for now.  The tablet version of the right-edge
++            // tutorial is still being spec'd by the design team.
++            PhoneStage {
++                id: stage
++                objectName: "stage"
++                anchors.top: parent.top
++                width: parent.width
++                height: parent.height
++                applicationManager: fakeAppManager
++                color: "transparent"
++                interactive: false
++                altTabEnabled: false
++                focusFirstApp: false
++                startScale: 0.8
++                endScale: 0.6
++                dragAreaOverlap: units.gu(2)
++
++                onOpened: {
++                    overlay.show();
++                    root.textOpacity = 0;
++                    slider.visible = false;
++                }
++
++                onDraggingChanged: {
++                    if (!dragging) {
++                        if (!overlay.shown) {
++                            root.showError();
++                        }
++                        teaseAnimation.complete();
++                    }
++                }
++            },
++
++            Showable {
++                id: overlay
++                objectName: "overlay"
++                anchors.fill: parent
++
++                opacity: 0
++                shown: false
++                showAnimation: UbuntuNumberAnimation { property: "opacity"; to: 1 }
++
++                Label {
++                    anchors.top: parent.top
++                    anchors.topMargin: root.panel.panelHeight + units.gu(2)
++                    anchors.left: parent.left
++                    anchors.leftMargin: units.gu(2)
++                    anchors.right: parent.right
++                    anchors.rightMargin: units.gu(2)
++                    wrapMode: Text.Wrap
++                    horizontalAlignment: Text.AlignHCenter
++                    fontSize: "large"
++                    text: i18n.tr("View all your running tasks.")
++                }
++
++                LocalComponents.Tick {
++                    objectName: "tick"
++                    anchors.bottom: bottomOverlayText.top
++                    anchors.bottomMargin: units.gu(1)
++                    anchors.horizontalCenter: bottomOverlayText.horizontalCenter
++                    onClicked: root.hide()
++                }
++
++                Label {
++                    id: bottomOverlayText
++                    anchors.bottom: parent.bottom
++                    anchors.bottomMargin: units.gu(2)
++                    anchors.left: parent.left
++                    anchors.leftMargin: units.gu(2)
++                    anchors.right: parent.right
++                    anchors.rightMargin: units.gu(2)
++                    wrapMode: Text.Wrap
++                    horizontalAlignment: Text.AlignHCenter
++                    fontSize: "small"
++                    text: i18n.tr("Tap here to continue.")
++                }
++            }
++        ]
++    }
++
++    ListModel {
++        id: fakeAppManager
++
++        readonly property string focusedApplicationId: "facebook"
++
++        function focusApplication(appId) {}
++        function requestFocusApplication(appId) {}
++        function findApplication(appId) {return null;}
++
++        signal applicationAdded(string appId)
++        signal applicationRemoved(string appId)
++        signal focusRequested(string appId)
++
++        ListElement {
++            appId: "facebook"
++            fullscreen: false
++            name: ""
++            icon: ""
++            state: ApplicationInfoInterface.Stopped
++            splashTitle: ""
++            splashImage: ""
++            splashShowHeader: false
++            splashColor: "transparent"
++            splashColorHeader: "transparent"
++            splashColorFooter: "transparent"
++            defaultScreenshot: "../Tutorial/graphics/facebook.png"
++        }
++
++        ListElement {
++            appId: "camera"
++            fullscreen: false
++            name: ""
++            icon: ""
++            state: ApplicationInfoInterface.Stopped
++            splashTitle: ""
++            splashImage: ""
++            splashShowHeader: false
++            splashColor: "transparent"
++            splashColorHeader: "transparent"
++            splashColorFooter: "transparent"
++            defaultScreenshot: "../Tutorial/graphics/camera.png"
++        }
++
++        ListElement {
++            appId: "gallery"
++            fullscreen: false
++            name: ""
++            icon: ""
++            state: ApplicationInfoInterface.Stopped
++            splashTitle: ""
++            splashImage: ""
++            splashShowHeader: false
++            splashColor: "transparent"
++            splashColorHeader: "transparent"
++            splashColorFooter: "transparent"
++            defaultScreenshot: "../Tutorial/graphics/gallery.png"
++        }
++
++        ListElement {
++            appId: "dialer"
++            fullscreen: false
++            name: ""
++            icon: ""
++            state: ApplicationInfoInterface.Stopped
++            splashTitle: ""
++            splashImage: ""
++            splashShowHeader: false
++            splashColor: "transparent"
++            splashColorHeader: "transparent"
++            splashColorFooter: "transparent"
++            defaultScreenshot: "../Tutorial/graphics/dialer.png"
++        }
++    }
++}
 === added file 'qml/Tutorial/graphics/camera.png'
 Binary files qml/Tutorial/graphics/camera.png	1970-01-01 00:00:00 +0000 and qml/Tutorial/graphics/camera.png	2015-02-11 16:32:25 +0000 differ
 === added file 'qml/Tutorial/graphics/dialer.png'
 Binary files qml/Tutorial/graphics/dialer.png	1970-01-01 00:00:00 +0000 and qml/Tutorial/graphics/dialer.png	2015-02-11 16:32:25 +0000 differ
 === added file 'qml/Tutorial/graphics/facebook.png'
 Binary files qml/Tutorial/graphics/facebook.png	1970-01-01 00:00:00 +0000 and qml/Tutorial/graphics/facebook.png	2015-02-11 16:32:25 +0000 differ
 === added file 'qml/Tutorial/graphics/gallery.png'
 Binary files qml/Tutorial/graphics/gallery.png	1970-01-01 00:00:00 +0000 and qml/Tutorial/graphics/gallery.png	2015-02-11 16:32:25 +0000 differ
 === modified file 'tests/autopilot/unity8/shell/emulators/tutorial.py'
 --- tests/autopilot/unity8/shell/emulators/tutorial.py	2015-02-11 16:32:24 +0000
 +++ tests/autopilot/unity8/shell/emulators/tutorial.py	2015-02-11 16:32:25 +0000
@@ -35,20 +35,40 @@
      @classmethod
      def validate_dbus_object(cls, path, state):
          name = introspection.get_classname_from_path(path)
--        return name == b'TutorialPage' or name == b'TutorialLeft'
++        return name in (b'TutorialPage', b'TutorialLeft',
++                        b'TutorialLeftFinish', b'TutorialRight',
++                        b'TutorialBottom', b'TutorialBottomFinish')
      @autopilot.logging.log_action(logger.info)
      def short_swipe_right(self):
++        self.shown.wait_for(True)
          x, y, width, height = self.globalRect
          start_x = x
          stop_x = x + width // 3
          start_y = stop_y = y + height // 2
          self.pointing_device.drag(start_x, start_y, stop_x, stop_y)
--        self.shown.wait_for(False)
++
++    @autopilot.logging.log_action(logger.info)
++    def swipe_left(self):
++        self.shown.wait_for(True)
++        x, y, width, height = self.globalRect
++        start_x = width
++        stop_x = x
++        start_y = stop_y = y + height // 2
++        self.pointing_device.drag(start_x, start_y, stop_x, stop_y)
++
++    @autopilot.logging.log_action(logger.info)
++    def swipe_up(self):
++        self.shown.wait_for(True)
++        x, y, width, height = self.globalRect
++        start_y = height
++        stop_y = y
++        start_x = stop_x = x + width // 2
++        self.pointing_device.drag(start_x, start_y, stop_x, stop_y)
      @autopilot.logging.log_action(logger.info)
      def tap(self):
          """Tap the tick button to complete this step."""
--        button = self.select_single(objectName="tick")
++        self.shown.wait_for(True)
++        button = self.wait_select_single(objectName="tick")
          self.pointing_device.click_object(button)
--        self.shown.wait_for(False)
 === modified file 'tests/autopilot/unity8/shell/tests/test_tutorial.py'
 --- tests/autopilot/unity8/shell/tests/test_tutorial.py	2015-02-11 16:32:24 +0000
 +++ tests/autopilot/unity8/shell/tests/test_tutorial.py	2015-02-11 16:32:25 +0000
@@ -47,4 +47,11 @@
          page.short_swipe_right()
          page = self.unity.wait_select_single(objectName='tutorialLeftFinish')
          page.tap()
++        page = self.unity.wait_select_single(objectName='tutorialRight')
++        page.swipe_left()
++        page.tap()
++        page = self.unity.wait_select_single(objectName='tutorialBottom')
++        page.swipe_up()
++        page = self.unity.wait_select_single(objectName='tutorialBottomFinish')
++        page.tap()
          self.assertThat(tutorial.running, Eventually(Equals(False)))
 === modified file 'tests/qmltests/Tutorial/tst_Tutorial.qml'
 --- tests/qmltests/Tutorial/tst_Tutorial.qml	2015-02-11 16:32:24 +0000
 +++ tests/qmltests/Tutorial/tst_Tutorial.qml	2015-02-11 16:32:25 +0000
@@ -162,7 +162,6 @@
+         }
          function waitForPage(name) {
--            tryCompareFunction(function() { return findChild(shell, name) !== null; }, true);
              waitForRendering(findChild(shell, name));
              var page = findChild(shell, name);
              tryCompare(page, "shown", true);
@@ -221,6 +220,33 @@
              var tick = findChild(page, "tick");
              tap(tick);
++            page = waitForPage("tutorialRight");
++            checkTopEdge();
++            checkLeftEdge();
++            checkBottomEdge();
++            if (name === "tutorialRight") return page;
++            touchFlick(shell, shell.width, halfHeight, halfWidth, halfHeight);
++            var overlay = findChild(page, "overlay");
++            tryCompare(overlay, "shown", true);
++            var tick = findChild(page, "tick");
++            tap(tick);
++
++            var page = waitForPage("tutorialBottom");
++            checkTopEdge();
++            checkLeftEdge();
++            checkRightEdge();
++            if (name === "tutorialBottom") return page;
++            touchFlick(shell, halfWidth, shell.height, halfWidth, halfHeight);
++
++            var page = waitForPage("tutorialBottomFinish");
++            checkTopEdge();
++            checkLeftEdge();
++            checkRightEdge();
++            checkBottomEdge();
++            if (name === "tutorialBottomFinish") return page;
++            var tick = findChild(page, "tick");
++            tap(tick);
++
              checkFinished();
              return null;
+         }
@@ -277,6 +303,42 @@
              tryCompare(left, "shown", true); // and we should still be on left
+         }
++        function test_spread() {
++            // Unfortunately, most of what we want to test of the spread is
++            // "did it render correctly?" but that's hard to test.  So instead,
++            // just poke and prod it a little bit to see if some of the values
++            // we'd expect to be correct, are so.
++
++            var right = goToPage("tutorialRight");
++            var stage = findChild(right, "stage");
++            var delegate0 = findChild(right, "appDelegate0");
++
++            tryCompare(stage, "dragProgress", 0);
++            touchFlick(shell, shell.width, halfHeight, shell.width * 0.8, halfHeight, true, false);
++            verify(stage.dragProgress > 0);
++            compare(stage.dragProgress, -delegate0.xTranslate);
++            touchFlick(shell, shell.width * 0.8, halfHeight, shell.width, halfHeight, false, true);
++            tryCompare(stage, "dragProgress", 0);
++
++            tryCompare(delegate0, "x", shell.width);
++
++            var screenshotImage = findChild(right, "screenshotImage");
++            tryCompare(screenshotImage, "source", Qt.resolvedUrl("../../../qml/Tutorial/graphics/facebook.png"));
++            tryCompare(screenshotImage, "visible", true);
++        }
++
++        function test_bottomShortDrag() {
++            var bottom = goToPage("tutorialBottom");
++
++            touchFlick(shell, halfWidth, shell.height, halfWidth, shell.height * 0.8);
++
++            var errorTextLabel = findChild(bottom, "errorTextLabel");
++            var errorTitleLabel = findChild(bottom, "errorTitleLabel");
++            tryCompare(bottom, "shown", true); // still on bottom page
++            tryCompare(errorTextLabel, "opacity", 1); // show error
++            tryCompare(errorTitleLabel, "opacity", 1); // show error
++        }
++
          function test_interrupted() {
              goToPage("tutorialLeft");
              ApplicationManager.startApplication("dialer-app");