@@ -330,6 +330,87 @@ Item {
330330 height: root.height
331331 width: spreadView.width + Math.max(spreadView.width, ApplicationManager.count * spreadView.tileDistance)
332332
333+ Rectangle {
334+ id: sideStageBackground
335+ color: "black"
336+ anchors.fill: parent
337+ anchors.leftMargin: spreadView.width - spreadView.sideStageWidth + spreadView.sideStageWidth * sideStageDragHandle.progress
338+ z: spreadView.indexToZIndex(priv.indexOf(priv.sideStageAppId))
339+ opacity: spreadView.phase == 0 ? 1 : 0
340+ Behavior on opacity { UbuntuNumberAnimation {} }
341+ }
342+
343+ Item {
344+ id: sideStageDragHandle
345+ anchors { top: parent.top; bottom: parent.bottom; left: parent.left; leftMargin: spreadView.width - spreadView.sideStageWidth - width }
346+ width: units.gu(2)
347+ z: sideStageBackground.z
348+ opacity: spreadView.phase <= 0 && spreadView.sideStageVisible ? 1 : 0
349+ property real progress: 0
350+ property bool dragging: false
351+
352+ Behavior on opacity { UbuntuNumberAnimation {} }
353+
354+ Connections {
355+ target: spreadView
356+ onSideStageVisibleChanged: {
357+ if (spreadView.sideStageVisible) {
358+ sideStageDragHandle.progress = 0;
359+ }
360+ }
361+ }
362+
363+ Image {
364+ anchors.centerIn: parent
365+ anchors.horizontalCenterOffset: parent.progress * spreadView.sideStageWidth - (width - parent.width) / 2
366+ width: sideStageDragHandleMouseArea.pressed ? parent.width * 2 : parent.width
367+ height: parent.height
368+ source: "graphics/sidestage_handle@20.png"
369+ Behavior on width { UbuntuNumberAnimation {} }
370+ }
371+
372+ MouseArea {
373+ id: sideStageDragHandleMouseArea
374+ anchors.fill: parent
375+ enabled: spreadView.contentX == 0
376+ property int startX
377+ property var gesturePoints: new Array()
378+
379+ onPressed: {
380+ gesturePoints = [];
381+ startX = mouseX;
382+ sideStageDragHandle.progress = 0;
383+ sideStageDragHandle.dragging = true;
384+ }
385+ onMouseXChanged: {
386+ if (priv.mainStageAppId) {
387+ sideStageDragHandle.progress = Math.max(0, (-startX + mouseX) / spreadView.sideStageWidth)
388+ }
389+ gesturePoints.push(mouseX);
390+ }
391+ onReleased: {
392+ if (priv.mainStageAppId) {
393+ var oneWayFlick = priv.evaluateOneWayFlick(gesturePoints);
394+ sideStageDragSnapAnimation.to = sideStageDragHandle.progress > 0.5 || oneWayFlick ? 1 : 0
395+ sideStageDragSnapAnimation.start();
396+ } else {
397+ sideStageDragHandle.dragging = false;
398+ }
399+ }
400+ }
401+ UbuntuNumberAnimation {
402+ id: sideStageDragSnapAnimation
403+ target: sideStageDragHandle
404+ property: "progress"
405+
406+ onRunningChanged: {
407+ if (!running) {
408+ sideStageDragHandle.dragging = false;
409+ }
410+ }
411+ }
412+ }
413+
333414 Repeater {
334415 id: spreadRepeater
335416 model: ApplicationManager
@@ -392,82 +473,11 @@ Item {
392473 }
393474 }
394475
395− Rectangle {
396− id: sideStageDragHandle
397− color: "transparent"
398− anchors { top: parent.top; bottom: parent.bottom; right: parent.right; rightMargin: spreadView.sideStageWidth }
399− width: units.gu(2)
400− opacity: spreadView.phase <= 0 && spreadView.sideStageVisible ? 1 : 0
401− property real progress: 0
402− property bool dragging: false
403−
404− Behavior on opacity { UbuntuNumberAnimation {} }
405−
406− Connections {
407− target: spreadView
408− onSideStageVisibleChanged: {
409− if (spreadView.sideStageVisible) {
410− sideStageDragHandle.progress = 0;
411− }
412− }
413− }
414−
415− Image {
416− anchors.centerIn: parent
417− anchors.horizontalCenterOffset: parent.progress * spreadView.sideStageWidth - (width - parent.width) / 2
418− width: sideStageDragHandleMouseArea.pressed ? parent.width * 2 : parent.width
419− height: parent.height
420− source: "graphics/sidestage_handle@20.png"
421− Behavior on width { UbuntuNumberAnimation {} }
422− }
423−
424− MouseArea {
425− id: sideStageDragHandleMouseArea
426− anchors.fill: parent
427− enabled: spreadView.contentX == 0
428− property int startX
429− property var gesturePoints: new Array()
430−
431− onPressed: {
432− gesturePoints = [];
433− startX = mouseX;
434− sideStageDragHandle.progress = 0;
435− sideStageDragHandle.dragging = true;
436− }
437− onMouseXChanged: {
438− if (priv.mainStageAppId) {
439− sideStageDragHandle.progress = Math.max(0, (-startX + mouseX) / spreadView.sideStageWidth)
440− }
441− gesturePoints.push(mouseX);
442− }
443− onReleased: {
444− if (priv.mainStageAppId) {
445− var oneWayFlick = priv.evaluateOneWayFlick(gesturePoints);
446− sideStageDragSnapAnimation.to = sideStageDragHandle.progress > 0.5 || oneWayFlick ? 1 : 0
447− sideStageDragSnapAnimation.start();
448− } else {
449− sideStageDragHandle.dragging = false;
450− }
451− }
452− }
453− UbuntuNumberAnimation {
454− id: sideStageDragSnapAnimation
455− target: sideStageDragHandle
456− property: "progress"
457−
458− onRunningChanged: {
459− if (!running) {
460− sideStageDragHandle.dragging = false;
461− }
462− }
463− }
464− }
465−
466476 EdgeDragArea {
467477 id: spreadDragArea
468− direction: Direction.Leftwards
469478 anchors { top: parent.top; right: parent.right; bottom: parent.bottom }
470479 width: root.dragAreaWidth
480+ direction: Direction.Leftwards
471481
472482// Rectangle { anchors.fill: parent; color: "#4400FF00"}
473483