Merge lp:~unity-team/unity8/rtm-expanded-panel-design into lp:unity8/rtm-14.09

[Michał Sawicz]

Implementation of expandable panel design

New Panel design described in:
https://docs.google.com/a/canonical.com/document/d/1jHIGzAzf7kFELgOiU9J0Hd9mOa3NzTsnEglLmx_qEfk/edit#heading=h.lo6wjg7251og

 * Are there any related MPs required for this MP to build/function as expected? Please list.
No

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

 * 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?
N/A

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

[lp:~unity-team/unity8/rtm-expanded-panel-design]

1323. By Nick Dedekind on 2014-10-14

sync indicator page delegate loader

1324. By Nick Dedekind on 2014-10-14

remove previouslyStopped

1325. By Nick Dedekind on 2014-10-14

full screen notifications don't include panel

[Ted Gould (ted)]

Playing with this some in silo 6 there are a few things I'm noticing:

* Indicators that are marked as not visible aren't showing up in the expanded panel
* Selecting an expanded item that is partially on screen doesn't pull it to be completely on screen
* Putting your finger on the bottom bar allows you to slide between the indicators. So if you grab the bar and close, you probably change indicators along the way (which is odd)

Otherwise I really love it :-)

[lp:~unity-team/unity8/rtm-expanded-panel-design]

1326. By Nick Dedekind on 2014-10-15

remove/add item fixes

[Michał Sawicz (saviq)]

This has been tested extensively for going into rtm.

review: Approve

=== modified file 'plugins/Unity/Indicators/Indicators.qmltypes'
--- plugins/Unity/Indicators/Indicators.qmltypes	2014-10-15 16:33:45 +0000
+++ plugins/Unity/Indicators/Indicators.qmltypes	2014-10-15 16:33:46 +0000
@@ -99,10 +99,8 @@
             values: {
                 "Identifier": 0,
                 "Position": 1,
-                "WidgetSource": 2,
-                "PageSource": 3,
-                "IndicatorProperties": 4,
-                "IsVisible": 5
+                "IndicatorProperties": 2,
+                "IsVisible": 3
             }
         }
     }

=== modified file 'plugins/Unity/Indicators/indicators.h'
--- plugins/Unity/Indicators/indicators.h	2013-09-17 12:31:19 +0000
+++ plugins/Unity/Indicators/indicators.h	2014-10-15 16:33:46 +0000
@@ -74,8 +74,6 @@
     enum Roles {
         Identifier = 0,
         Position,
-        WidgetSource,
-        PageSource,
         IndicatorProperties,
         IsVisible
     };

=== modified file 'plugins/Unity/Indicators/indicatorsmodel.cpp'
--- plugins/Unity/Indicators/indicatorsmodel.cpp	2014-01-30 14:54:01 +0000
+++ plugins/Unity/Indicators/indicatorsmodel.cpp	2014-10-15 16:33:46 +0000
@@ -202,8 +202,6 @@
     {
         roles[IndicatorsModelRole::Identifier] = "identifier";
         roles[IndicatorsModelRole::Position] = "position";
-        roles[IndicatorsModelRole::WidgetSource] = "widgetSource";
-        roles[IndicatorsModelRole::PageSource] = "pageSource";
         roles[IndicatorsModelRole::IndicatorProperties] = "indicatorProperties";
     }
     return roles;
@@ -248,10 +246,6 @@
                 return QVariant(indicator->indicatorProperties());
             }
             break;
-        case IndicatorsModelRole::WidgetSource:
-            return qmlDirectory()+"/Panel/Indicators/DefaultIndicatorWidget.qml";
-        case IndicatorsModelRole::PageSource:
-            return qmlDirectory()+"/Panel/Indicators/DefaultIndicatorPage.qml";
         default:
             break;
     }

=== modified file 'plugins/Unity/Indicators/visibleindicatorsmodel.cpp'
--- plugins/Unity/Indicators/visibleindicatorsmodel.cpp	2013-09-17 12:31:19 +0000
+++ plugins/Unity/Indicators/visibleindicatorsmodel.cpp	2014-10-15 16:33:46 +0000
@@ -33,8 +33,6 @@
     {
         roles[IndicatorsModelRole::Identifier] = "identifier";
         roles[IndicatorsModelRole::Position] = "position";
-        roles[IndicatorsModelRole::WidgetSource] = "widgetSource";
-        roles[IndicatorsModelRole::PageSource] = "pageSource";
         roles[IndicatorsModelRole::IndicatorProperties] = "indicatorProperties";
         roles[IndicatorsModelRole::IsVisible] = "isVisible";
     }

=== modified file 'qml/Components/DragHandle.qml'
--- qml/Components/DragHandle.qml	2014-02-12 18:51:36 +0000
+++ qml/Components/DragHandle.qml	2014-10-15 16:33:46 +0000
@@ -68,6 +68,7 @@
     }
 
     property real hintDisplacement: 0
+    property var overrideStartValue: undefined
     SmoothedAnimation {
         id: hintingAnimation
         target: hintingAnimation
@@ -196,7 +197,11 @@
         } else /* Undecided || Recognized */ {
             if (d.previousStatus === DirectionalDragArea.WaitingForTouch) {
                 dragEvaluator.reset();
-                d.startValue = parent[d.targetProp];
+                if (overrideStartValue !== undefined) {
+                    d.startValue = overrideStartValue;
+                } else {
+                    d.startValue = parent[d.targetProp];
+                }
 
                 if (hintDisplacement > 0) {
                     hintingAnimation.targetValue = d.startValue;

=== removed file 'qml/Components/ListItems/VerticalThinDivider.qml'
--- qml/Components/ListItems/VerticalThinDivider.qml	2013-06-05 22:03:08 +0000
+++ qml/Components/ListItems/VerticalThinDivider.qml	1970-01-01 00:00:00 +0000
@@ -1,26 +0,0 @@
-/*
- * Copyright (C) 2012 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.0
-
-Image {
-    anchors {
-        top: (parent) ? parent.top : null
-        bottom: (parent) ? parent.bottom : null
-    }
-    width: (visible) ? units.dp(2) : 0
-    source: "graphics/ListItemDividerVertical.png"
-}

=== removed file 'qml/Components/ListItems/graphics/[e-mail]'
Binary files qml/Components/ListItems/graphics/[e-mail]	2013-06-05 22:03:08 +0000 and qml/Components/ListItems/graphics/[e-mail]	1970-01-01 00:00:00 +0000 differ
=== added file 'qml/Components/ScrollCalculator.qml'
--- qml/Components/ScrollCalculator.qml	1970-01-01 00:00:00 +0000
+++ qml/Components/ScrollCalculator.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,81 @@
+/*
+ * 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.2
+import Ubuntu.Components 1.1
+
+Item {
+    id: scrollArea
+
+    readonly property bool areaActive: lateralPosition >= 0
+    property real stopScrollThreshold: units.gu(2)
+    property int direction: Qt.LeftToRight
+    property real baseScrollAmount: units.dp(3)
+    property real maximumScrollAmount: units.dp(8)
+    property real lateralPosition: -1
+    property real forceScrollingPercentage: 0.4
+
+    signal scroll(real scrollAmount)
+
+    width: units.gu(5)
+    rotation: direction === Qt.LeftToRight ? 0 : 180
+
+    onAreaActiveChanged: areaActive ? handleEnter() : handleExit()
+
+    function handleEnter() {
+        d.thresholdAreaX = -scrollArea.stopScrollThreshold;
+        scrollTimer.restart();
+    }
+
+    function handleExit() {
+        d.thresholdAreaX = -scrollArea.stopScrollThreshold;
+        scrollTimer.stop();
+    }
+
+    onLateralPositionChanged: {
+        if (scrollArea.areaActive) {
+            if (lateralPosition > width * (1 - forceScrollingPercentage)) {
+                d.thresholdAreaX = width * (1 - forceScrollingPercentage);
+                if (!scrollTimer.running) scrollTimer.restart();
+            } else if (lateralPosition > d.thresholdAreaX + scrollArea.stopScrollThreshold) {
+                d.thresholdAreaX = lateralPosition - scrollArea.stopScrollThreshold;
+                if (!scrollTimer.running) scrollTimer.restart();
+            } else if (lateralPosition < d.thresholdAreaX) {
+                d.thresholdAreaX = lateralPosition;
+                scrollTimer.stop();
+            }
+
+            d.progression = lateralPosition / width;
+        }
+    }
+
+    Timer {
+        id: scrollTimer
+        interval: 16
+        repeat: true
+
+        onTriggered: {
+            var scrollAmount = scrollArea.baseScrollAmount + scrollArea.maximumScrollAmount * d.progression;
+            scrollArea.scroll(scrollAmount);
+        }
+    }
+
+    QtObject {
+        id: d
+        property real progression: 0
+        property real thresholdAreaX: -scrollArea.stopScrollThreshold
+    }
+}

=== added file 'qml/Panel/Handle.qml'
--- qml/Panel/Handle.qml	1970-01-01 00:00:00 +0000
+++ qml/Panel/Handle.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,43 @@
+/*
+ * 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.2
+import Ubuntu.Components 1.1
+
+Rectangle {
+    id: handle
+    color: "#333333"
+    height: units.gu(2)
+    property bool active: false
+
+    Row {
+        id: dots
+        width: childrenRect.width
+        height: childrenRect.height
+        anchors.centerIn: parent
+        spacing: units.gu(0.5)
+        Repeater {
+            model: 3
+            delegate: Rectangle {
+                id: dot
+                width: units.dp(3)
+                height: width
+                color: handle.active ? "#de4814" : "#717171"
+                radius: units.dp(1)
+            }
+        }
+    }
+}

=== removed file 'qml/Panel/IndicatorItem.qml'
--- qml/Panel/IndicatorItem.qml	2014-09-29 10:24:58 +0000
+++ qml/Panel/IndicatorItem.qml	1970-01-01 00:00:00 +0000
@@ -1,53 +0,0 @@
-/*
- * Copyright (C) 2013 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.0
-import Ubuntu.Components 0.1
-import Unity.Indicators 0.1 as Indicators
-import "../Components"
-
-Loader {
-    id: root
-
-    property alias widgetSource: root.source
-    property bool dimmed: false
-    property var indicatorProperties: undefined
-    property bool indicatorVisible: item ? item.enabled : false
-    property string identifier
-
-    opacity: dimmed ? 0.4 : 1
-    Behavior on opacity { UbuntuNumberAnimation { duration: UbuntuAnimation.BriskDuration } }
-
-    onLoaded: {
-        for(var pName in indicatorProperties) {
-            if (item.hasOwnProperty(pName)) {
-                item[pName] = indicatorProperties[pName];
-            }
-        }
-    }
-
-    Binding {
-        target: item
-        property: "identifier"
-        value: identifier
-    }
-
-    Binding {
-        target: item
-        property: "objectName"
-        value: identifier + "-widget"
-    }
-}

=== added file 'qml/Panel/IndicatorItemRow.qml'
--- qml/Panel/IndicatorItemRow.qml	1970-01-01 00:00:00 +0000
+++ qml/Panel/IndicatorItemRow.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,256 @@
+/*
+ * Copyright (C) 2013-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.2
+import Ubuntu.Components 1.1
+
+Item {
+    id: root
+    width: row.width
+    height: units.gu(3)
+
+    property QtObject indicatorsModel: null
+    property real overFlowWidth: width
+    property bool expanded: false
+    property var currentItem
+    readonly property int currentItemIndex: currentItem ? currentItem.ownIndex : -1
+
+    property real unitProgress: 0.0
+    property real selectionChangeBuffer: units.gu(2)
+    property bool enableLateralChanges: false
+    property color hightlightColor: "#ededed"
+
+    property real lateralPosition: -1
+    onLateralPositionChanged: {
+        updateItemFromLateralPosition();
+    }
+
+    onEnableLateralChangesChanged: {
+        updateItemFromLateralPosition();
+    }
+
+    function updateItemFromLateralPosition() {
+        if (currentItem && !enableLateralChanges) return;
+        if (lateralPosition === -1) return;
+
+        if (!currentItem) {
+            selectItemAt(lateralPosition);
+            return;
+        }
+
+        var maximumBufferOffset = selectionChangeBuffer * unitProgress;
+        var proposedItem = indicatorAt(lateralPosition, 0);
+        if (proposedItem) {
+            var bufferExceeded = false;
+
+            if (proposedItem !== currentItem) {
+                // Proposed item is not directly adjacent to current?
+                if (Math.abs(proposedItem.ownIndex - currentItem.ownIndex) > 1) {
+                    bufferExceeded = true;
+                } else { // no
+                    var currentItemLateralPosition = root.mapToItem(proposedItem, lateralPosition, 0).x;
+
+                    // Is the distance into proposed item greater than max buffer?
+                    // Proposed item is before current item
+                    if (proposedItem.x < currentItem.x) {
+                        bufferExceeded = (proposedItem.width - currentItemLateralPosition) > maximumBufferOffset;
+                    } else { // After
+                        bufferExceeded = currentItemLateralPosition > maximumBufferOffset;
+                    }
+                }
+                if (bufferExceeded) {
+                    selectItemAt(lateralPosition);
+                }
+            }
+        } else {
+            selectItemAt(lateralPosition);
+        }
+    }
+
+    function indicatorAt(x, y) {
+        var item = row.childAt(x, y);
+        return item && item.hasOwnProperty("ownIndex") ? item : null;
+    }
+
+    function resetCurrentItem() {
+        d.firstItemSwitch = true;
+        d.previousItem = undefined;
+        currentItem = undefined;
+    }
+
+    function setCurrentItemIndex(index) {
+        for (var i = 0; i < row.children.length; i++) {
+            var item = row.children[i];
+            if (item.hasOwnProperty("ownIndex") && item.ownIndex === index) {
+                if (currentItem !== item) currentItem = item;
+                break;
+            }
+        }
+    }
+
+    function selectItemAt(lateralPosition) {
+        var item = indicatorAt(lateralPosition, 0);
+        if (item && item.opacity > 0) {
+            currentItem = item;
+        } else {
+            // Select default item.
+            var searchIndex = lateralPosition > width ? repeater.count - 1 : 0;
+
+            for (var i = 0; i < row.children.length; i++) {
+                if (row.children[i].hasOwnProperty("ownIndex") && row.children[i].ownIndex === searchIndex) {
+                    item = row.children[i];
+                    break;
+                }
+            }
+            if (currentItem !== item) currentItem = item;
+        }
+    }
+
+    QtObject {
+        id: d
+        property bool firstItemSwitch: true
+        property var previousItem
+    }
+
+    onCurrentItemChanged: {
+        if (d.previousItem) {
+            d.firstItemSwitch = false;
+        }
+        d.previousItem = currentItem;
+    }
+
+    Row {
+        id: row
+        anchors {
+            top: parent.top
+            bottom: parent.bottom
+        }
+
+        Repeater {
+            id: repeater
+            model: indicatorsModel
+            visible: false
+
+            onItemRemoved: {
+                // current item removed.
+                if (currentItem === item) {
+                    var i = 0;
+                    while (i < row.children.length) {
+                        var childItem = row.children[i];
+                        if (childItem !== item) {
+                            setCurrentItemIndex(i);
+                            break;
+                        }
+                        i++;
+                    }
+                }
+            }
+
+            delegate: IndicatorItem {
+                id: item
+                objectName: identifier+"-panelItem"
+
+                property int ownIndex: index
+                property bool overflow: row.width - x > overFlowWidth
+                property bool hidden: !item.expanded && overflow
+
+                height: row.height
+                expanded: root.expanded
+                selected: currentItem === this
+
+                identifier: model.identifier
+                busName: indicatorProperties.busName
+                actionsObjectPath: indicatorProperties.actionsObjectPath
+                menuObjectPath: indicatorProperties.menuObjectPath
+
+                opacity: hidden ? 0.0 : 1.0
+                Behavior on opacity { NumberAnimation { duration: UbuntuAnimation.SnapDuration } }
+            }
+        }
+    }
+
+    Rectangle {
+        id: highlight
+        objectName: "highlight"
+
+        anchors.bottom: row.bottom
+        height: units.dp(2)
+        color: root.hightlightColor
+        visible: currentItem !== undefined
+        opacity: 0.0
+
+        width: currentItem ? currentItem.width : 0
+        Behavior on width {
+            enabled: !d.firstItemSwitch && expanded
+            UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration; easing: UbuntuAnimation.StandardEasing }
+        }
+
+        // micromovements of the highlight line when user moves the finger across the items while pulling
+        // the handle downwards.
+        property real highlightCenterOffset: {
+            if (!currentItem || lateralPosition == -1 || !enableLateralChanges) return 0;
+
+            var itemMapped = root.mapToItem(currentItem, lateralPosition, 0);
+
+            var distanceFromCenter = itemMapped.x - currentItem.width / 2;
+            if (distanceFromCenter > 0) {
+                distanceFromCenter = Math.max(0, distanceFromCenter - currentItem.width / 8);
+            } else {
+                distanceFromCenter = Math.min(0, distanceFromCenter + currentItem.width / 8);
+            }
+
+            if (currentItem && currentItem.ownIndex === 0 && distanceFromCenter < 0) {
+                return 0;
+            } else if (currentItem && currentItem.ownIndex === repeater.count-1 & distanceFromCenter > 0) {
+                return 0;
+            }
+            return (distanceFromCenter / (currentItem.width / 4)) * units.gu(1);
+        }
+        Behavior on highlightCenterOffset {
+            NumberAnimation { duration: UbuntuAnimation.FastDuration; easing: UbuntuAnimation.StandardEasing }
+        }
+
+        property real currentItemX: currentItem ? currentItem.x : 0
+        Behavior on currentItemX {
+            id: currentItemXBehavior
+            enabled: !d.firstItemSwitch && expanded
+            NumberAnimation { duration: UbuntuAnimation.FastDuration; easing: UbuntuAnimation.StandardEasing }
+        }
+        x: currentItemX + highlightCenterOffset
+    }
+
+    states: [
+        State {
+            name: "minimised"
+            when: !expanded
+        },
+        State {
+            name: "expanded"
+            when: expanded
+            PropertyChanges { target: highlight; opacity: 0.9 }
+        }
+    ]
+
+    transitions: [
+        Transition {
+            PropertyAnimation {
+                properties: "opacity";
+                duration: UbuntuAnimation.SnapDuration
+                easing: UbuntuAnimation.StandardEasing
+            }
+        }
+    ]
+}

=== renamed file 'qml/Panel/Indicators/DefaultIndicatorPage.qml' => 'qml/Panel/IndicatorPage.qml'
--- qml/Panel/Indicators/DefaultIndicatorPage.qml	2014-09-29 10:24:58 +0000
+++ qml/Panel/IndicatorPage.qml	2014-10-15 16:33:46 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013 Canonical Ltd.
+ * Copyright 2013-2014 Canonical Ltd.
  *
  * This program is free software; you can redistribute it and/or modify
  * it under the terms of the GNU Lesser General Public License as published by
@@ -12,15 +12,12 @@
  *
  * You should have received a copy of the GNU Lesser General Public License
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
- *
- * Authors:
- *      Renato Araujo Oliveira Filho <[e-mail]>
- *      Nick Dedekind <[e-mail]>
  */
 
 import QtQuick 2.0
 import Ubuntu.Components 0.1 as Components
 import Unity.Indicators 0.1 as Indicators
+import "Indicators"
 
 IndicatorBase {
     id: main
@@ -125,7 +122,6 @@
         delegate: Loader {
             id: loader
             objectName: "menuItem" + index
-            asynchronous: true
             width: ListView.view.width
             visible: status == Loader.Ready
 

=== removed file 'qml/Panel/IndicatorRow.qml'
--- qml/Panel/IndicatorRow.qml	2014-05-07 13:59:58 +0000
+++ qml/Panel/IndicatorRow.qml	1970-01-01 00:00:00 +0000
@@ -1,162 +0,0 @@
-/*
- * Copyright (C) 2013 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.0
-import Ubuntu.Components 0.1
-import Unity.Indicators 0.1 as Indicators
-import "../Components"
-
-Item {
-    id: indicatorRow
-
-    readonly property alias currentItem : itemView.currentItem
-    readonly property alias currentItemIndex: itemView.currentIndex
-    readonly property alias row: itemView
-    property QtObject indicatorsModel: null
-    property int overFlowWidth: width
-    property bool showAll: false
-    property real currentItemOffset: 0.0
-    property real unitProgress: 0.0
-
-    width: units.gu(40)
-    height: units.gu(3)
-
-    function setDefaultItem() {
-        // The leftmost indicator
-        setCurrentItemIndex(0);
-    }
-
-    function setCurrentItemIndex(index) {
-        itemView.currentIndex = index;
-    }
-
-    function setCurrentItem(item) {
-        if (item && item.hasOwnProperty("ownIndex")) {
-            itemView.currentIndex = item.ownIndex;
-        } else {
-            itemView.currentIndex = -1;
-        }
-    }
-
-    Timer {
-        id: allVisible
-        interval: 1000
-
-        onTriggered: {
-            showAll = false;
-        }
-    }
-
-    ListView {
-        id: itemView
-        objectName: "indicatorRowItems"
-        interactive: false
-        model: indicatorsModel ? indicatorsModel : null
-
-        width: childrenRect.width
-        height: indicatorRow.height
-        anchors.right: parent.right
-        orientation: ListView.Horizontal
-
-        property int lastCount: 0
-        onCountChanged: {
-            if (lastCount < count) {
-                showAll = true;
-                allVisible.start();
-            }
-            lastCount = count;
-        }
-
-        delegate: Item {
-            id: itemWrapper
-            objectName: "item" + index
-            height: indicatorRow.height
-            width: indicatorItem.width
-            opacity: 1 - indicatorRow.unitProgress
-            y: 0
-            state: "standard"
-
-            property int ownIndex: index
-            property bool highlighted: indicatorRow.unitProgress > 0 ? ListView.isCurrentItem : false
-            property bool dimmed: indicatorRow.unitProgress > 0 ? !ListView.isCurrentItem : false
-
-            property bool hidden: !showAll && !highlighted && (indicatorRow.state == "locked" || indicatorRow.state == "commit")
-            property bool overflow: row.width - itemWrapper.x > overFlowWidth
-
-            IndicatorItem {
-                id: indicatorItem
-                identifier: model.identifier
-                height: parent.height
-
-                dimmed: itemWrapper.dimmed
-
-                widgetSource: model.widgetSource
-                indicatorProperties : model.indicatorProperties
-            }
-
-            states: [
-                State {
-                    name: "standard"
-                    when: !hidden && !overflow && !highlighted
-                },
-                State {
-                    name: "highlighted"
-                    when: highlighted
-                    PropertyChanges { target: itemWrapper; opacity: 1.0 }
-                },
-                State {
-                    name: "hidden"
-                    when: hidden || overflow
-                    PropertyChanges { target: itemWrapper; opacity: 0.0 }
-                }
-            ]
-
-            Behavior on opacity { UbuntuNumberAnimation { duration: UbuntuAnimation.BriskDuration } }
-        }
-    }
-
-
-    Rectangle {
-        id: highlight
-        color: Theme.palette.selected.foreground
-        objectName: "highlight"
-        height: units.dp(2)
-        anchors.top: row.bottom
-        visible: indicatorRow.currentItem != null
-
-        property real intendedX: row.x + (indicatorRow.currentItem != null ? (indicatorRow.currentItem.x - row.originX) + centerOffset : 0)
-        x: intendedX >= row.x ? (intendedX + width <= row.x + row.width ? intendedX : row.x + row.width - width) : row.x // listview boundaries
-        width: indicatorRow.currentItem != null ? indicatorRow.currentItem.width : 0
-
-        property real centerOffset: {
-            if (indicatorRow.currentItemOffset > 0.1) {
-                return (indicatorRow.currentItemOffset - 0.1) * units.gu(0.4);
-            } else if (indicatorRow.currentItemOffset < -0.1) {
-                return (indicatorRow.currentItemOffset + 0.1) * units.gu(0.4);
-            }
-            return 0.0;
-        }
-
-        Behavior on width {
-            enabled: unitProgress > 0;
-            UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
-        }
-        Behavior on x {
-            enabled: unitProgress > 0;
-            UbuntuNumberAnimation { duration: UbuntuAnimation.FastDuration }
-        }
-    }
-}

=== removed file 'qml/Panel/Indicators.qml'
--- qml/Panel/Indicators.qml	2014-09-09 13:40:41 +0000
+++ qml/Panel/Indicators.qml	1970-01-01 00:00:00 +0000
@@ -1,415 +0,0 @@
-/*
- * Copyright (C) 2013 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.0
-import Ubuntu.Components 0.1
-import Ubuntu.Gestures 0.1
-import Unity.Indicators 0.1 as Indicators
-
-import "../Components"
-import "../Components/ListItems"
-import "Indicators"
-
-Showable {
-    id: indicators
-
-    property real openedHeight: units.gu(71)
-    property int panelHeight: units.gu(3)
-    property alias overFlowWidth: indicatorRow.overFlowWidth
-    property alias showAll: indicatorRow.showAll
-    // TODO: This should be sourced by device type (eg "desktop", "tablet", "phone"...)
-    property string profile: indicatorProfile
-
-    readonly property real hintValue: panelHeight + menuContent.headerHeight
-    readonly property int lockThreshold: openedHeight / 2
-    property bool fullyOpened: height == openedHeight
-    property bool partiallyOpened: height > panelHeight && !fullyOpened
-    property bool fullyClosed: height <= panelHeight
-    property bool contentEnabled: true
-    property bool initalizeItem: true
-    readonly property alias content: menuContent
-    property real unitProgress: (height - panelHeight) / (openedHeight - panelHeight)
-    property bool enableHint: true
-    property real showHintBottomMargin: 0
-
-    signal showTapped(point position)
-
-    // TODO: Perhaps we need a animation standard for showing/hiding? Each showable seems to
-    // use its own values. Need to ask design about this.
-    showAnimation: StandardAnimation {
-        property: "height"
-        to: openedHeight
-    }
-
-    hideAnimation: StandardAnimation {
-        property: "height"
-        duration: 350
-        to: panelHeight
-        easing.type: Easing.OutCubic
-    }
-
-    onOpenedHeightChanged: {
-        if (showAnimation.running) {
-            showAnimation.restart();
-        } else if (indicators.shown) {
-            height = openedHeight;
-        }
-    }
-
-    height: panelHeight
-    onHeightChanged: updateRevealProgressState(indicators.height - panelHeight - showHintBottomMargin, true)
-
-    function updateRevealProgressState(revealProgress, enableRelease) {
-        if (!showAnimation.running && !hideAnimation.running) {
-            if (revealProgress === 0) {
-                indicators.state = "initial";
-            } else if (enableHint && revealProgress > 0 && revealProgress <= hintValue) {
-                indicators.state = "hint";
-            } else if ((!enableHint || revealProgress > hintValue) && revealProgress < lockThreshold) {
-                indicators.state = "reveal";
-            } else if (revealProgress >= lockThreshold && lockThreshold > 0) {
-                indicators.state = "locked";
-            }
-        }
-    }
-
-    function calculateCurrentItem(xValue, useBuffer) {
-        var rowCoordinates;
-        var itemCoordinates;
-        var currentItem;
-        var distanceFromRightEdge;
-        var bufferExceeded = false;
-
-        if (indicators.state == "commit" || indicators.state == "locked" || showAnimation.running || hideAnimation.running) return;
-
-        /*
-          If user drags the indicator handle bar down a distance hintValue or less, this is 0.
-          If bar is dragged down a distance greater than or equal to lockThreshold, this is 1.
-          Otherwise it contains the bar's location as a fraction of the distance between hintValue (is 0) and lockThreshold (is 1).
-        */
-        var verticalProgress =
-            MathUtils.clamp((indicators.height - handle.height - hintValue) /
-                            (lockThreshold - hintValue), 0, 1);
-
-        /*
-          Vertical velocity check. Don't change the indicator if we're moving too quickly.
-        */
-        var verticalSpeed = Math.abs(yVelocityCalculator.calculate());
-        if (verticalSpeed >= 0.05 && !initalizeItem) {
-            return;
-        }
-
-        /*
-          Percentage of an indicator icon's width the user's press can stray horizontally from the
-          focused icon before we change focus to another icon. E.g. a value of 0.5 means you must
-          go right a distance of half an icon's width before focus moves to the icon on the right
-        */
-        var maxBufferThreshold = 0.5;
-
-        /*
-          To help users find the indicator of their choice while opening the indicators, we add logic to add a
-          left/right buffer to each icon so it is harder for the focus to be moved accidentally to another icon,
-          as the user moves their finger down, but yet allows them to switch indicator if they want.
-          This buffer is wider the further the user's finger is from the top of the screen.
-        */
-        var effectiveBufferThreshold = maxBufferThreshold * verticalProgress;
-
-        rowCoordinates = indicatorRow.mapToItem(indicatorRow.row, xValue, 0);
-        // get the current delegate
-        currentItem = indicatorRow.row.itemAt(rowCoordinates.x, 0);
-        if (currentItem) {
-            itemCoordinates = indicatorRow.row.mapToItem(currentItem, rowCoordinates.x, 0);
-            distanceFromRightEdge = (currentItem.width - itemCoordinates.x) / (currentItem.width);
-            if (currentItem != indicatorRow.currentItem) {
-                if (Math.abs(currentItem.ownIndex - indicatorRow.currentItemIndex) > 1) {
-                    bufferExceeded = true;
-                } else {
-                    if (indicatorRow.currentItemIndex < currentItem.ownIndex && distanceFromRightEdge < (1 - effectiveBufferThreshold)) {
-                        bufferExceeded = true;
-                    } else if (indicatorRow.currentItemIndex > currentItem.ownIndex && distanceFromRightEdge > effectiveBufferThreshold) {
-                        bufferExceeded = true;
-                    }
-                }
-                if ((!useBuffer || (useBuffer && bufferExceeded)) || indicatorRow.currentItemIndex < 0 || indicatorRow.currentItem == null)  {
-                    indicatorRow.setCurrentItem(currentItem);
-                }
-
-                // need to re-init the distanceFromRightEdge for offset calculation
-                itemCoordinates = indicatorRow.row.mapToItem(indicatorRow.currentItem, rowCoordinates.x, 0);
-                distanceFromRightEdge = (indicatorRow.currentItem.width - itemCoordinates.x) / (indicatorRow.currentItem.width);
-            }
-            indicatorRow.currentItemOffset = 1 - (distanceFromRightEdge * 2);
-        } else if (initalizeItem) {
-            indicatorRow.setDefaultItem();
-            indicatorRow.currentItemOffset = 0;
-        }
-        initalizeItem = indicatorRow.currentItem == null;
-    }
-
-    // eater
-    MouseArea {
-        anchors {
-            top: parent.top
-            bottom: handle.bottom
-            left: parent.left
-            right: parent.right
-        }
-    }
-
-    VisibleIndicators {
-        id: visibleIndicators
-    }
-
-    MenuContent {
-        id: menuContent
-        objectName: "menuContent"
-
-        anchors {
-            left: parent.left
-            right: parent.right
-            top: indicatorRow.bottom
-            bottom: handle.top
-        }
-        indicatorsModel: visibleIndicators.model
-        visible: indicators.partiallyOpened || indicators.fullyOpened
-        clip: indicators.partiallyOpened
-        enabled: contentEnabled
-
-        //small shadow gradient at bottom of menu
-        Rectangle {
-            anchors {
-                left: parent.left
-                right: parent.right
-                bottom: parent.bottom
-            }
-            height: units.gu(0.5)
-            gradient: Gradient {
-                GradientStop { position: 0.0; color: "transparent" }
-                GradientStop { position: 1.0; color: "black" }
-            }
-            opacity: 0.4
-        }
-    }
-
-    Rectangle {
-        id: handle
-
-        color:  menuContent.color
-
-        anchors {
-            left: parent.left
-            right: parent.right
-            bottom: parent.bottom
-        }
-        height: Math.max(Math.min(handleImage.height, indicators.height - handleImage.height), 0)
-        clip: height < handleImage.height
-        visible: menuContent.visible
-
-        BorderImage {
-            id: handleImage
-            source: "graphics/handle.sci"
-            height: panelHeight
-            anchors {
-                left: parent.left
-                right: parent.right
-                bottom: parent.bottom
-            }
-        }
-        MouseArea { //prevent clicks passing through
-            anchors.fill: parent
-        }
-    }
-
-    IndicatorRow {
-        id: indicatorRow
-        objectName: "indicatorRow"
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
-        height: indicators.panelHeight
-        indicatorsModel: visibleIndicators.model
-        state: indicators.state
-        unitProgress: indicators.unitProgress
-
-        EdgeDragArea {
-            id: rowDragArea
-            anchors.fill: indicatorRow
-            direction: Direction.Downwards
-            maxSilenceTime: 2000
-            distanceThreshold: 0
-
-            enabled: fullyOpened
-            onDraggingChanged: {
-                if (dragging) {
-                    initalizeItem = true;
-                    updateRevealProgressState(Math.max(touchSceneY - panelHeight, hintValue), false);
-                    indicators.calculateCurrentItem(touchX, false);
-                } else {
-                    indicators.state = "commit";
-                    indicatorRow.currentItemOffset = 0;
-                }
-            }
-
-            onTouchXChanged: {
-                indicators.calculateCurrentItem(touchX, true);
-            }
-            onTouchSceneYChanged: {
-                updateRevealProgressState(Math.max(touchSceneY - panelHeight, hintValue), false);
-                yVelocityCalculator.trackedPosition = touchSceneY;
-            }
-        }
-    }
-
-    Connections {
-        target: showAnimation
-        onRunningChanged: {
-            if (showAnimation.running) {
-                indicators.state = "commit";
-                indicatorRow.currentItemOffset = 0;
-            }
-        }
-    }
-
-    Connections {
-        target: hideAnimation
-        onRunningChanged: {
-            if (hideAnimation.running) {
-                indicators.state = "initial";
-                initalizeItem = true;
-                indicatorRow.currentItemOffset = 0;
-            }
-        }
-    }
-
-    QtObject {
-        id: d
-        property bool enableIndexChangeSignal: true
-        property var activeDragHandle: showDragHandle.dragging ? showDragHandle : hideDragHandle.dragging ? hideDragHandle : null
-    }
-
-    Connections {
-        target: menuContent
-        onCurrentMenuIndexChanged: {
-            var oldActive = d.enableIndexChangeSignal;
-            if (!oldActive) return;
-            d.enableIndexChangeSignal = false;
-
-            indicatorRow.setCurrentItemIndex(menuContent.currentMenuIndex);
-
-            d.enableIndexChangeSignal = oldActive;
-        }
-    }
-
-    Connections {
-        target: indicatorRow
-        onCurrentItemIndexChanged: {
-            var oldActive = d.enableIndexChangeSignal;
-            if (!oldActive) return;
-            d.enableIndexChangeSignal = false;
-
-            menuContent.setCurrentMenuIndex(indicatorRow.currentItemIndex, fullyOpened || partiallyOpened);
-
-            d.enableIndexChangeSignal = oldActive;
-        }
-    }
-    // connections to the active drag handle
-    Connections {
-        target: d.activeDragHandle
-        onTouchXChanged: {
-            indicators.calculateCurrentItem(d.activeDragHandle.touchX, true);
-        }
-        onTouchSceneYChanged: {
-            yVelocityCalculator.trackedPosition = d.activeDragHandle.touchSceneY;
-        }
-    }
-
-    DragHandle {
-        id: showDragHandle
-        anchors.bottom: parent.bottom
-        // go beyond parent so that it stays reachable, at the top of the screen.
-        anchors.bottomMargin: showHintBottomMargin
-        anchors.left: parent.left
-        anchors.right: parent.right
-        height: panelHeight
-        direction: Direction.Downwards
-        enabled: !indicators.shown && indicators.available
-        hintDisplacement: enableHint ? indicators.hintValue : 0
-        autoCompleteDragThreshold: maxTotalDragDistance / 2
-        stretch: true
-        maxTotalDragDistance: openedHeight - panelHeight
-        distanceThreshold: panelHeight
-
-        onTapped: showTapped(Qt.point(touchSceneX, touchSceneY));
-    }
-
-    DragHandle {
-        id: hideDragHandle
-        anchors.fill: handle
-        direction: Direction.Upwards
-        enabled: indicators.shown && indicators.available
-        hintDisplacement: indicators.hintValue
-        autoCompleteDragThreshold: maxTotalDragDistance / 6
-        stretch: true
-        maxTotalDragDistance: openedHeight - panelHeight
-        distanceThreshold: 0
-    }
-
-    AxisVelocityCalculator {
-        id: yVelocityCalculator
-    }
-
-    states: [
-        State {
-            name: "initial"
-        },
-        State {
-            name: "hint"
-            StateChangeScript {
-                script: {
-                    if (d.activeDragHandle) {
-                        calculateCurrentItem(d.activeDragHandle.touchX, false);
-                    }
-                }
-            }
-        },
-        State {
-            name: "reveal"
-            extend: "hint"
-        },
-        State {
-            name: "locked"
-            extend: "hint"
-        },
-        State {
-            name: "commit"
-            extend: "hint"
-        }
-    ]
-    state: "initial"
-
-    transitions: [
-        Transition  {
-            NumberAnimation {targets: [indicatorRow, menuContent]; property: "y"; duration: 300; easing.type: Easing.OutCubic}
-        }
-    ]
-
-    Component.onCompleted: initialise();
-    function initialise() {
-        visibleIndicators.load(profile);
-        indicatorRow.setDefaultItem();
-    }
-}

=== removed file 'qml/Panel/Indicators/DefaultIndicatorWidget.qml'
--- qml/Panel/Indicators/DefaultIndicatorWidget.qml	2014-08-20 08:39:09 +0000
+++ qml/Panel/Indicators/DefaultIndicatorWidget.qml	1970-01-01 00:00:00 +0000
@@ -1,119 +0,0 @@
-/*
- * Copyright 2013 Canonical Ltd.
- *
- * This program is free software; you can redistribute it and/or modify
- * it under the terms of the GNU Lesser 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 Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program.  If not, see <http://www.gnu.org/licenses/>.
- *
- * Authors:
- *      Nick Dedekind <[e-mail]>
- */
-
-import QtQuick 2.0
-import Ubuntu.Components 0.1
-import Ubuntu.Settings.Components 0.1
-
-IndicatorBase {
-    id: indicatorWidget
-
-    property int iconSize: units.gu(2)
-    property alias leftLabel: itemLeftLabel.text
-    property alias rightLabel: itemRightLabel.text
-    property var icons: undefined
-
-    width: itemRow.width
-    enabled: false
-
-    // FIXME: For now we will enable led indicator support only for messaging indicator
-    // in the future we should export a led API insted of doing that,
-    Loader {
-        id: indicatorLed
-        // only load source Component if the icons contains the new message icon
-        source: (indicatorWidget.icons && (String(indicatorWidget.icons).indexOf("indicator-messages-new") != -1)) ? Qt.resolvedUrl("IndicatorsLight.qml") : ""
-    }
-
-    Row {
-        id: itemRow
-        objectName: "itemRow"
-        anchors {
-            top: parent.top
-            bottom: parent.bottom
-            horizontalCenter: parent.horizontalCenter
-        }
-
-        Label {
-            id: itemLeftLabel
-            width: contentWidth + units.gu(1)
-            objectName: "leftLabel"
-            color: Theme.palette.selected.backgroundText
-            opacity: 0.8
-            font.family: "Ubuntu"
-            fontSize: "medium"
-            anchors.verticalCenter: parent.verticalCenter
-            visible: text != ""
-            horizontalAlignment: Text.AlignHCenter
-        }
-
-        Row {
-            id: iconRow
-            anchors {
-                top: parent.top
-                bottom: parent.bottom
-            }
-
-            Repeater {
-                model: indicatorWidget.icons
-
-                Item {
-                    width: itemImage.width + units.gu(1)
-                    height: iconRow.height
-
-                    StatusIcon {
-                        id: itemImage
-                        height: indicatorWidget.iconSize
-                        anchors.centerIn: parent
-                        source: modelData
-                        sets: ["status", "actions"]
-                        color: "#CCCCCC"
-                    }
-                }
-            }
-        }
-
-        Label {
-            id: itemRightLabel
-            width: contentWidth + units.gu(1)
-            objectName: "rightLabel"
-            color: Theme.palette.selected.backgroundText
-            opacity: 0.8
-            font.family: "Ubuntu"
-            fontSize: "medium"
-            anchors.verticalCenter: parent.verticalCenter
-            visible: text != ""
-            horizontalAlignment: Text.AlignHCenter
-        }
-    }
-
-    onRootActionStateChanged: {
-        if (rootActionState == undefined) {
-            leftLabel = "";
-            rightLabel = "";
-            icons = undefined;
-            enabled = false;
-            return;
-        }
-
-        leftLabel = rootActionState.leftLabel ? rootActionState.leftLabel : "";
-        rightLabel = rootActionState.rightLabel ? rootActionState.rightLabel : "";
-        icons = rootActionState.icons;
-        enabled = rootActionState.visible;
-    }
-}

=== modified file 'qml/Panel/Indicators/IndicatorBase.qml'
--- qml/Panel/Indicators/IndicatorBase.qml	2014-10-15 16:33:45 +0000
+++ qml/Panel/Indicators/IndicatorBase.qml	2014-10-15 16:33:46 +0000
@@ -32,8 +32,6 @@
     property string menuObjectPath
     property string rootMenuType: "com.canonical.indicator.root"
 
-    property string deviceMenuObjectPath: menuObjectPath
-
     property alias menuModel: cachedModel.model
     property alias rootActionState: rootAction
 
@@ -41,7 +39,7 @@
         id: cachedModel
         busName: indicatorItem.busName
         actions: { "indicator": indicatorItem.actionsObjectPath }
-        menuObjectPath: indicatorItem.deviceMenuObjectPath
+        menuObjectPath: indicatorItem.menuObjectPath
     }
 
     RootActionState {

=== modified file 'qml/Panel/Indicators/VisibleIndicators.qml'
--- qml/Panel/Indicators/VisibleIndicators.qml	2014-09-29 10:24:58 +0000
+++ qml/Panel/Indicators/VisibleIndicators.qml	2014-10-15 16:33:46 +0000
@@ -24,6 +24,10 @@
 Item {
     property SortFilterProxyModel model: filterModel
 
+    function initialise(profile) {
+        indicatorsModel.load(profile);
+    }
+
     SortFilterProxyModel {
         id: filterModel
         filterRole: Indicators.IndicatorsModelRole.IsVisible
@@ -36,7 +40,6 @@
         }
     }
 
-
     Indicators.IndicatorsModel {
         id: indicatorsModel
     }
@@ -78,8 +81,4 @@
             }
         }
     }
-
-    function load(profile) {
-        indicatorsModel.load(profile);
-    }
 }

=== renamed file 'qml/Panel/Indicators/client/IndicatorsPage.qml' => 'qml/Panel/Indicators/client/IndicatorRepresentation.qml'
--- qml/Panel/Indicators/client/IndicatorsPage.qml	2013-08-14 09:07:45 +0000
+++ qml/Panel/Indicators/client/IndicatorRepresentation.qml	2014-10-15 16:33:46 +0000
@@ -21,13 +21,13 @@
 import QtQuick 2.0
 import Ubuntu.Components 0.1
 import Ubuntu.Components.ListItems 0.1 as ListItem
+import "../.."
 
 Page {
-    id: page
+    id: root
 
     title: indicatorProperties && indicatorProperties.title ?  indicatorProperties.title : ""
     property variant indicatorProperties
-    property string pageSource : pageLoader.source
 
     anchors.fill: parent
 
@@ -44,6 +44,7 @@
         id: pageLoader
         objectName: "pageLoader"
         clip:true
+        asynchronous: true
 
         Rectangle {
             anchors.fill: pageLoader
@@ -58,15 +59,25 @@
             topMargin: units.gu(2)
             bottomMargin: units.gu(2)
         }
-        source : visualCheck.checked ? page.pageSource : "IndicatorsTree.qml"
+        sourceComponent: visualCheck.checked ? page : tree
 
-        onLoaded: {
-            for(var pName in indicatorProperties) {
-                if (item.hasOwnProperty(pName)) {
-                    item[pName] = indicatorProperties[pName];
-                }
-            }
-            item.start();
+        Component {
+            id: page
+            IndicatorPage {
+                identifier: model.identifier
+                busName: indicatorProperties.busName
+                actionsObjectPath: indicatorProperties.actionsObjectPath
+                menuObjectPath: indicatorProperties.menuObjectPath
+            }
+        }
+        Component {
+            id: tree
+            IndicatorsTree {
+                identifier: model.identifier
+                busName: indicatorProperties.busName
+                actionsObjectPath: indicatorProperties.actionsObjectPath
+                menuObjectPath: indicatorProperties.menuObjectPath
+            }
         }
     }
 
@@ -85,7 +96,7 @@
                 left: parent.left
             }
             text: "Back"
-            onClicked: page.pageStack.reset()
+            onClicked: root.pageStack.reset()
         }
     }
 }

=== modified file 'qml/Panel/Indicators/client/IndicatorsList.qml'
--- qml/Panel/Indicators/client/IndicatorsList.qml	2014-01-30 14:54:01 +0000
+++ qml/Panel/Indicators/client/IndicatorsList.qml	2014-10-15 16:33:46 +0000
@@ -57,8 +57,8 @@
                 text: identifier
 
                 onClicked: {
-                    var new_page = Qt.createComponent("IndicatorsPage.qml");
-                    page.pageStack.push(new_page.createObject(pages), {"indicatorProperties" : model.indicatorProperties, "pageSource" : model.pageSource});
+                    var new_page = Qt.createComponent("IndicatorRepresentation.qml");
+                    page.pageStack.push(new_page.createObject(pages), {"indicatorProperties" : model.indicatorProperties });
                 }
             }
         }

=== modified file 'qml/Panel/Indicators/client/IndicatorsTree.qml'
--- qml/Panel/Indicators/client/IndicatorsTree.qml	2013-11-24 02:23:56 +0000
+++ qml/Panel/Indicators/client/IndicatorsTree.qml	2014-10-15 16:33:46 +0000
@@ -20,36 +20,14 @@
 import QtQuick 2.0
 import Ubuntu.Components 0.1
 import Unity.Indicators 0.1 as Indicators
-import QMenuModel 0.1
-import Ubuntu.Components.ListItems 0.1 as ListItem
-
-Page {
-    id: page
-    anchors.fill: parent
-
-    property string busName: unityModel.busName
-    property string actionsObjectPath
-    property string menuObjectPath
-
-    property string deviceMenuObjectPath: menuObjectPath
-
-    function start() {
-    }
-
-    UnityMenuModel {
-        id: unityModel
-        busName: page.busName
-        actions: { "indicator": page.actionsObjectPath }
-        menuObjectPath: page.deviceMenuObjectPath
-    }
-
-    Indicators.RootActionState {
-        menu: unityModel
-    }
+import ".."
+
+IndicatorBase {
+    id: root
 
     Indicators.ModelPrinter {
         id: printer
-        model: unityModel
+        model: root.menuModel
     }
 
     Flickable {

=== added file 'qml/Panel/IndicatorsBar.qml'
--- qml/Panel/IndicatorsBar.qml	1970-01-01 00:00:00 +0000
+++ qml/Panel/IndicatorsBar.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,260 @@
+/*
+ * 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.2
+import Ubuntu.Components 1.1
+import "../Components"
+
+Item {
+    id: root
+    property alias expanded: row.expanded
+    property alias interactive: flickable.interactive
+    property alias indicatorsModel: row.indicatorsModel
+    property alias unitProgress: row.unitProgress
+    property alias enableLateralChanges: row.enableLateralChanges
+    property alias overFlowWidth: row.overFlowWidth
+    readonly property alias currentItemIndex: row.currentItemIndex
+    property real lateralPosition: -1
+
+    function selectItemAt(lateralPosition) {
+        if (!expanded) {
+            row.resetCurrentItem();
+        }
+        var mapped = root.mapToItem(row, lateralPosition, 0);
+        row.selectItemAt(mapped.x);
+    }
+
+    function setCurrentItemIndex(index) {
+        if (!expanded) {
+            row.resetCurrentItem();
+        }
+        row.setCurrentItemIndex(index);
+    }
+
+    function addScrollOffset(scrollAmmout) {
+        if (scrollAmmout < 0) { // left scroll
+            if (flickable.contentX < 0) return; // already off the left.
+            if (flickable.contentX + scrollAmmout < 0) scrollAmmout = -flickable.contentX; // going to be off the left
+        } else { // right scroll
+            if (flickable.contentX + flickable.width > row.width) return; // already off the right.
+            if (flickable.contentX + flickable.width + scrollAmmout > row.width) { // going to be off the right
+                scrollAmmout = row.width - (flickable.contentX + flickable.width);
+            }
+        }
+        d.scrollOffset = d.scrollOffset + scrollAmmout;
+    }
+
+    QtObject {
+        id: d
+        property var initialItem
+        // the non-expanded distance from row offset to center of initial item
+        property real originalDistanceFromRight: -1
+
+        // calculate the distance from row offset to center of initial item
+        property real distanceFromRight: {
+            if (originalDistanceFromRight == -1) return 0;
+            if (!initialItem) return 0;
+            return row.width - initialItem.x - initialItem.width /2;
+        }
+
+        // offset to the intially selected expanded item
+        property real rowOffset: 0
+        property real scrollOffset: 0
+        property real alignmentAdjustment: 0
+        property real combinedOffset: 0
+
+        // when the scroll offset changes, we need to reclaculate the relative lateral position
+        onScrollOffsetChanged: root.lateralPositionChanged()
+
+        onInitialItemChanged: {
+            originalDistanceFromRight = initialItem ? (row.width - initialItem.x - initialItem.width/2) : -1;
+        }
+
+        Behavior on alignmentAdjustment {
+            NumberAnimation { duration: UbuntuAnimation.BriskDuration; easing: UbuntuAnimation.StandardEasing}
+        }
+
+        function alignIndicators() {
+            flickable.resetContentXComponents();
+
+            if (expanded && !flickable.moving) {
+                 // gap between left and row?
+                if (row.width > flickable.width && flickable.contentX < 0) {
+                    d.alignmentAdjustment += flickable.contentX;
+                // current item overlap on left
+                } else if (row.currentItem.x < flickable.contentX) {
+                    d.alignmentAdjustment -= (row.currentItem.x - flickable.contentX);
+                // current item overlap on right
+                } else if (row.currentItem.x + row.currentItem.width > flickable.contentX + flickable.width) {
+                    d.alignmentAdjustment -= ((row.currentItem.x + row.currentItem.width) - (flickable.contentX + flickable.width));
+                }
+            }
+        }
+    }
+
+    Rectangle {
+        id: grayLine
+        height: units.dp(2)
+        width: parent.width
+        anchors.bottom: parent.bottom
+
+        color: "#4c4c4c"
+        opacity: expanded ? 1.0 : 0.0
+        Behavior on opacity { NumberAnimation { duration: UbuntuAnimation.SnapDuration } }
+    }
+
+    Item {
+        id: rowContainer
+        anchors.fill: parent
+        clip: expanded || row.width > rowContainer.width
+
+        Flickable {
+            id: flickable
+            objectName: "flickable"
+
+            anchors.fill: parent
+            contentWidth: row.width
+            interactive: false
+            // align right + offset from row selection + scrolling
+            contentX: row.width - flickable.width - d.combinedOffset
+
+            // contentX can change by user interaction as well as user offset changes
+            // This function re-aligns the offsets so that the offsets match the contentX
+            function resetContentXComponents() {
+                d.scrollOffset += (flickable.contentX - (row.width - flickable.width - d.combinedOffset));
+            }
+
+            rebound: Transition {
+                NumberAnimation {
+                    properties: "x"
+                    duration: 600
+                    easing.type: Easing.OutCubic
+                }
+            }
+
+            IndicatorItemRow {
+                id: row
+                objectName: "indicatorItemRow"
+                anchors {
+                    top: parent.top
+                    bottom: parent.bottom
+                }
+
+                lateralPosition: {
+                    if (root.lateralPosition == -1) return -1;
+
+                    var mapped = root.mapToItem(row, root.lateralPosition, 0);
+                    return Math.min(Math.max(mapped.x, 0), row.width);
+                }
+
+                onCurrentItemChanged: {
+                    if (!currentItem) d.initialItem = undefined;
+                    else if (!d.initialItem) d.initialItem = currentItem;
+                }
+
+                MouseArea {
+                    anchors.fill: parent
+                    enabled: root.expanded
+                    onClicked: {
+                        row.selectItemAt(mouse.x);
+                        d.alignIndicators();
+                    }
+                }
+            }
+
+        }
+    }
+
+    Timer {
+        id: alignmentTimer
+        interval: UbuntuAnimation.FastDuration // enough for row animation.
+        repeat: false
+
+        onTriggered: d.alignIndicators();
+    }
+
+    states: [
+        State {
+            name: "minimized"
+            when: !expanded
+            PropertyChanges {
+                target: d
+                rowOffset: 0
+                scrollOffset: 0
+                alignmentAdjustment: 0
+                combinedOffset: 0
+                restoreEntryValues: false
+            }
+        },
+        State {
+            name: "expanded"
+            when: expanded && !interactive
+
+            PropertyChanges {
+                target: d
+                combinedOffset: rowOffset + alignmentAdjustment - scrollOffset
+            }
+            PropertyChanges {
+                target: d
+                rowOffset: {
+                    if (!initialItem) return 0;
+                    if (distanceFromRight - initialItem.width <= 0) return 0;
+
+                    var rowOffset = distanceFromRight - originalDistanceFromRight;
+                    return rowOffset;
+                }
+                restoreEntryValues: false
+            }
+        }
+        , State {
+            name: "interactive"
+            when: expanded && interactive
+
+            StateChangeScript {
+                script: {
+                    // don't use row offset anymore.
+                    d.scrollOffset -= d.rowOffset;
+                    d.rowOffset = 0;
+                    d.initialItem = undefined;
+                    alignmentTimer.start();
+                }
+            }
+            PropertyChanges {
+                target: d
+                combinedOffset: rowOffset + alignmentAdjustment - scrollOffset
+                restoreEntryValues: false
+            }
+        }
+    ]
+
+    transitions: [
+        Transition {
+            from: "expanded"
+            to: "minimized"
+            PropertyAction {
+                target: d
+                properties: "rowOffset, scrollOffset, alignmentAdjustment"
+                value: 0
+            }
+            PropertyAnimation {
+                target: d
+                properties: "combinedOffset"
+                duration: UbuntuAnimation.SnapDuration
+                easing: UbuntuAnimation.StandardEasing
+            }
+        }
+    ]
+}

=== added file 'qml/Panel/IndicatorsMenu.qml'
--- qml/Panel/IndicatorsMenu.qml	1970-01-01 00:00:00 +0000
+++ qml/Panel/IndicatorsMenu.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,285 @@
+/*
+ * 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.2
+import Ubuntu.Components 1.1
+import Ubuntu.Gestures 0.1
+import "../Components"
+
+Showable {
+    id: root
+    property alias indicatorsModel: bar.indicatorsModel
+    property alias showDragHandle: __showDragHandle
+    property alias hideDragHandle: __hideDragHandle
+    property alias overFlowWidth: bar.overFlowWidth
+    property alias verticalVelocityThreshold: yVelocityCalculator.velocityThreshold
+    property int minimizedPanelHeight: units.gu(3)
+    property int expandedPanelHeight: units.gu(7)
+    property real openedHeight: units.gu(71)
+    readonly property real unitProgress: Math.max(0, (height - minimizedPanelHeight) / (openedHeight - minimizedPanelHeight))
+    readonly property bool fullyOpened: unitProgress >= 1
+    readonly property bool partiallyOpened: unitProgress > 0 && unitProgress < 1.0
+    readonly property bool fullyClosed: unitProgress == 0
+    property bool enableHint: true
+    property bool contentEnabled: true
+    property color panelColor: "black"
+
+    signal showTapped(point position)
+
+    // TODO: Perhaps we need a animation standard for showing/hiding? Each showable seems to
+    // use its own values. Need to ask design about this.
+    showAnimation: StandardAnimation {
+        property: "height"
+        to: openedHeight
+        duration: UbuntuAnimation.BriskDuration
+        easing.type: Easing.OutCubic
+    }
+
+    hideAnimation: StandardAnimation {
+        property: "height"
+        to: minimizedPanelHeight
+        duration: UbuntuAnimation.BriskDuration
+        easing.type: Easing.OutCubic
+    }
+
+    height: minimizedPanelHeight
+    onHeightChanged: {
+        var revealProgress = root.height - minimizedPanelHeight;
+
+        if (!showAnimation.running && !hideAnimation.running) {
+            if (revealProgress <= 0) {
+                root.state = "initial";
+            } else {
+                root.state = "reveal";
+            }
+        }
+    }
+    clip: root.partiallyOpened
+
+    // eater
+    MouseArea {
+        anchors.fill: parent
+    }
+
+    MenuContent {
+        id: content
+        objectName: "menuContent"
+
+        anchors {
+            left: parent.left
+            right: parent.right
+            top: bar.bottom
+        }
+        height: openedHeight - bar.height - handle.height
+        indicatorsModel: root.indicatorsModel
+        visible: root.unitProgress > 0
+        enabled: contentEnabled
+        currentMenuIndex: bar.currentItemIndex
+    }
+
+    Handle {
+        id: handle
+        anchors {
+            left: parent.left
+            right: parent.right
+            bottom: parent.bottom
+        }
+        height: units.gu(2)
+        active: d.activeDragHandle ? true : false
+
+        //small shadow gradient at bottom of menu
+        Rectangle {
+            anchors {
+                left: parent.left
+                right: parent.right
+                bottom: parent.top
+            }
+            height: units.gu(0.5)
+            gradient: Gradient {
+                GradientStop { position: 0.0; color: "transparent" }
+                GradientStop { position: 1.0; color: "black" }
+            }
+            opacity: 0.3
+        }
+    }
+
+    Rectangle {
+        anchors.fill: bar
+        color: panelColor
+    }
+
+    IndicatorsBar {
+        id: bar
+        objectName: "indicatorsBar"
+
+        anchors {
+            left: parent.left
+            right: parent.right
+        }
+        expanded: false
+        enableLateralChanges: false
+        lateralPosition: -1
+        unitProgress: root.unitProgress
+
+        height: expanded ? expandedPanelHeight : minimizedPanelHeight
+        Behavior on height { NumberAnimation { duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing } }
+    }
+
+    ScrollCalculator {
+        id: leftScroller
+        width: units.gu(5)
+        anchors.left: bar.left
+        height: bar.height
+
+        forceScrollingPercentage: 0.33
+        stopScrollThreshold: units.gu(0.75)
+        direction: Qt.RightToLeft
+        lateralPosition: -1
+
+        onScroll: bar.addScrollOffset(-scrollAmount);
+    }
+
+    ScrollCalculator {
+        id: rightScroller
+        width: units.gu(5)
+        anchors.right: bar.right
+        height: bar.height
+
+        forceScrollingPercentage: 0.33
+        stopScrollThreshold: units.gu(0.75)
+        direction: Qt.LeftToRight
+        lateralPosition: -1
+
+        onScroll: bar.addScrollOffset(scrollAmount);
+    }
+
+    DragHandle {
+        id: __showDragHandle
+        anchors.bottom: parent.bottom
+        anchors.left: parent.left
+        anchors.right: parent.right
+        height: minimizedPanelHeight
+        direction: Direction.Downwards
+        enabled: !root.shown && root.available
+        autoCompleteDragThreshold: maxTotalDragDistance / 2
+        stretch: true
+        distanceThreshold: minimizedPanelHeight
+        onTapped: showTapped(Qt.point(touchSceneX, touchSceneY));
+
+        // using hint regulates minimum to hint displacement, but in fullscreen mode, we need to do it manually.
+        overrideStartValue: enableHint ? minimizedPanelHeight : expandedPanelHeight + handle.height
+        maxTotalDragDistance: openedHeight - (enableHint ? minimizedPanelHeight : expandedPanelHeight + handle.height)
+        hintDisplacement: enableHint ? expandedPanelHeight - minimizedPanelHeight + handle.height : 0
+    }
+
+    DragHandle {
+        id: __hideDragHandle
+        anchors.fill: handle
+        direction: Direction.Upwards
+        enabled: root.shown && root.available
+        hintDisplacement: units.gu(3)
+        autoCompleteDragThreshold: maxTotalDragDistance / 6
+        stretch: true
+        maxTotalDragDistance: openedHeight - expandedPanelHeight - handle.height
+        distanceThreshold: 0
+    }
+
+    PanelVelocityCalculator {
+        id: yVelocityCalculator
+        velocityThreshold: 0.5
+        trackedValue: d.activeDragHandle ? d.activeDragHandle.touchSceneY : 0
+    }
+
+    Connections {
+        target: showAnimation
+        onRunningChanged: {
+            if (showAnimation.running) {
+                root.state = "commit";
+            }
+        }
+    }
+
+    Connections {
+        target: hideAnimation
+        onRunningChanged: {
+            if (hideAnimation.running) {
+                root.state = "initial";
+            }
+        }
+    }
+
+    QtObject {
+        id: d
+        property var activeDragHandle: showDragHandle.dragging ? showDragHandle : hideDragHandle.dragging ? hideDragHandle : null
+
+        property real rowMappedLateralPosition: {
+            if (!d.activeDragHandle) return -1;
+            return d.activeDragHandle.mapToItem(bar, d.activeDragHandle.touchX, 0).x;
+        }
+    }
+
+    states: [
+        State {
+            name: "initial"
+        },
+        State {
+            name: "reveal"
+            StateChangeScript {
+                script: {
+                    yVelocityCalculator.reset();
+                    // initial item selection
+                    bar.selectItemAt(d.activeDragHandle ? d.activeDragHandle.touchX : -1);
+                }
+            }
+            PropertyChanges {
+                target: bar
+                expanded: true
+                // changes to lateral touch position effect which indicator is selected
+                lateralPosition: d.rowMappedLateralPosition
+                // vertical velocity determines if changes in lateral position has an effect
+                enableLateralChanges: d.activeDragHandle &&
+                                      !yVelocityCalculator.velocityAboveThreshold
+            }
+            // left scroll bar handling
+            PropertyChanges {
+                target: leftScroller
+                lateralPosition: {
+                    if (!d.activeDragHandle) return -1;
+                    var mapped = d.activeDragHandle.mapToItem(leftScroller, d.activeDragHandle.touchX, 0);
+                    return mapped.x;
+                }
+            }
+            // right scroll bar handling
+            PropertyChanges {
+                target: rightScroller
+                lateralPosition: {
+                    if (!d.activeDragHandle) return -1;
+                    var mapped = d.activeDragHandle.mapToItem(rightScroller, d.activeDragHandle.touchX, 0);
+                    return mapped.x;
+                }
+            }
+        },
+        State {
+            name: "commit"
+            PropertyChanges {
+                target: bar
+                expanded: true
+                interactive: true
+            }
+        }
+    ]
+    state: "initial"
+}

=== modified file 'qml/Panel/MenuContent.qml'
--- qml/Panel/MenuContent.qml	2014-09-29 10:24:58 +0000
+++ qml/Panel/MenuContent.qml	2014-10-15 16:33:46 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2013 Canonical, Ltd.
+ * Copyright (C) 2013-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
@@ -14,125 +14,68 @@
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import QtQuick 2.0
+import QtQuick 2.2
 import QtQuick.Layouts 1.1
 import Ubuntu.Components 1.1
 import Unity.Indicators 0.1 as Indicators
 import Utils 0.1
 import "../Components"
-import "Indicators"
 
 Rectangle {
     id: content
 
     property QtObject indicatorsModel: null
-    readonly property alias currentMenuIndex: listViewHeader.currentIndex
+    property int currentMenuIndex: -1
     color: "#221e1c" // FIXME not in palette yet
-    property real headerHeight: listViewHeader.height
 
     width: units.gu(40)
     height: units.gu(42)
 
-    function setCurrentMenuIndex(index, animate) {
-        // FIXME - https://bugreports.qt-project.org/browse/QTBUG-41229
-        listViewHeader.currentIndex = -1;
-        listViewHeader.currentIndex = index;
-    }
-
-    ListView {
-        id: listViewHeader
-        objectName: "indicatorsHeaderListView"
-        model: content.indicatorsModel
-        clip: true
-
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
-        height: units.gu(8.5)
-
-        highlightFollowsCurrentItem: true
-        highlightMoveDuration: 0
-
-        orientation: ListView.Horizontal
-        snapMode: ListView.SnapOneItem
-        highlightRangeMode: ListView.StrictlyEnforceRange
-        boundsBehavior: Flickable.StopAtBounds
-        // Load all the indicator menus (a big number)
-        cacheBuffer: 1073741823
-
-        delegate: Header {
-            width: ListView.view.width
-            height: implicitHeight
-
-            title: indicatorDelegate.title !== "" ? indicatorDelegate.title : identifier
-
-            IndicatorDelegate {
-                id: indicatorDelegate
-                Component.onCompleted: {
-                    for(var pName in indicatorProperties) {
-                        if (indicatorDelegate.hasOwnProperty(pName)) {
-                            indicatorDelegate[pName] = indicatorProperties[pName];
-                        }
-                    }
-                }
-            }
-        }
+    onCurrentMenuIndexChanged: {
+        listViewContent.currentIndex = currentMenuIndex;
     }
 
     ListView {
         id: listViewContent
         objectName: "indicatorsContentListView"
-        anchors {
-            left: parent.left
-            right: parent.right
-            top: listViewHeader.bottom
-            bottom: parent.bottom
-        }
+        anchors.fill: parent
         model: content.indicatorsModel
         clip: true
 
-        currentIndex: listViewHeader.currentIndex
+        highlightFollowsCurrentItem: true
         interactive: false
         highlightMoveDuration: 0
         orientation: ListView.Horizontal
         // Load all the indicator menus (a big number)
         cacheBuffer: 1073741823
 
+        // for additions/removals.
+        onCountChanged: {
+            listViewContent.currentIndex = content.currentMenuIndex;
+        }
+
         delegate: Loader {
             id: loader
+
             width: ListView.view.width
             height: ListView.view.height
             objectName: identifier
-
-            source: pageSource
             asynchronous: true
 
+            sourceComponent: IndicatorPage {
+                objectName: identifier + "-page"
+
+                identifier: model.identifier
+                busName: indicatorProperties.busName
+                actionsObjectPath: indicatorProperties.actionsObjectPath
+                menuObjectPath: indicatorProperties.menuObjectPath
+            }
+
             onVisibleChanged: {
                 // Reset the indicator states
-                if (!visible && item && item["reset"]) {
-                    item.reset()
-                }
-            }
-
-            onLoaded: {
-                for(var pName in indicatorProperties) {
-                    if (item.hasOwnProperty(pName)) {
-                        item[pName] = indicatorProperties[pName]
-                    }
-                }
-            }
-
-            Binding {
-                target: loader.item
-                property: "identifier"
-                value: identifier
-            }
-
-            Binding {
-                target: loader.item
-                property: "objectName"
-                value: identifier + "-page"
+                if (!visible && status == Loader.Ready) {
+                    item.reset();
+                }
             }
         }
     }

=== removed file 'qml/Panel/Panel.qml'
--- qml/Panel/Panel.qml	2014-07-10 13:36:41 +0000
+++ qml/Panel/Panel.qml	1970-01-01 00:00:00 +0000
@@ -1,191 +0,0 @@
-/*
- * Copyright (C) 2013 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.0
-import Ubuntu.Components 0.1
-import Unity.Application 0.1
-import "../Components"
-import "../Components/ListItems"
-
-Item {
-    id: root
-    readonly property real panelHeight: indicatorArea.y + d.indicatorHeight
-    property alias indicators: __indicators
-    property alias callHint: __callHint
-    property bool fullscreenMode: false
-
-    Rectangle {
-        id: darkenedArea
-        property real darkenedOpacity: 0.6
-        anchors {
-            top: parent.top
-            topMargin: panelHeight
-            left: parent.left
-            right: parent.right
-            bottom: parent.bottom
-        }
-        color: "black"
-        opacity: indicators.unitProgress * darkenedOpacity
-
-        MouseArea {
-            anchors.fill: parent
-            enabled: indicators.shown
-            onClicked: if (indicators.fullyOpened) indicators.hide();
-        }
-    }
-
-    Item {
-        id: indicatorArea
-        objectName: "indicatorArea"
-
-        anchors.fill: parent
-
-        Behavior on anchors.topMargin { StandardAnimation {} }
-
-        BorderImage {
-            id: dropShadow
-            anchors {
-                fill: indicators
-                leftMargin: -units.gu(1)
-                bottomMargin: -units.gu(1)
-            }
-            visible: indicators.height > indicators.panelHeight
-            source: "graphics/rectangular_dropshadow.sci"
-        }
-
-        VerticalThinDivider {
-            id: indicatorDividor
-            anchors {
-                top: indicators.top
-                bottom: indicators.bottom
-                right: indicators.left
-
-                topMargin: indicatorArea.anchors.topMargin + indicators.panelHeight
-            }
-
-            width: units.dp(2)
-            source: "graphics/VerticalDivider.png"
-        }
-
-        Rectangle {
-            id: indicatorAreaBackground
-            color: callHint.visible ? "green" : "black"
-            anchors {
-                top: parent.top
-                left: parent.left
-                right: parent.right
-            }
-            height: indicators.panelHeight
-
-            Behavior on color { ColorAnimation { duration: UbuntuAnimation.FastDuration } }
-        }
-
-        PanelSeparatorLine {
-            id: nonIndicatorAreaSeparatorLine
-            anchors {
-                top: indicatorAreaBackground.bottom
-                left: parent.left
-                right: indicators.left
-            }
-            saturation: 1 - indicators.unitProgress
-        }
-
-        MouseArea {
-            anchors {
-                top: parent.top
-                left: parent.left
-                right: indicators.left
-            }
-            height: indicators.panelHeight
-            enabled: callHint.visible
-            onClicked: callHint.showLiveCall()
-        }
-
-        Indicators {
-            id: __indicators
-            objectName: "indicators"
-
-            anchors {
-                top: parent.top
-                right: parent.right
-            }
-
-            width: root.width
-            shown: false
-            panelHeight: units.gu(3)
-            openedHeight: root.height
-            overFlowWidth: {
-                if (callHint.visible) {
-                    return Math.max(root.width - (callHint.width + units.gu(2)), 0)
-                }
-                return root.width
-            }
-
-            enableHint: !callHint.active && !fullscreenMode
-            showHintBottomMargin: fullscreenMode ? -panelHeight : 0
-
-            onShowTapped: {
-                if (callHint.active) {
-                    callHint.showLiveCall();
-                }
-            }
-        }
-
-        ActiveCallHint {
-            id: __callHint
-            anchors {
-                top: parent.top
-                left: parent.left
-            }
-            height: indicators.panelHeight
-            visible: active && indicators.state == "initial"
-        }
-
-        PanelSeparatorLine {
-            id: indicatorsSeparatorLine
-            visible: true
-            anchors {
-                top: indicators.bottom
-                left: indicatorDividor.left
-                right: indicators.right
-            }
-        }
-    }
-
-    QtObject {
-        id: d
-        readonly property real indicatorHeight: indicators.panelHeight + indicatorsSeparatorLine.height
-    }
-
-    states: [
-        State {
-            name: "onscreen" //fully opaque and visible at top edge of screen
-            when: !fullscreenMode
-            PropertyChanges {
-                target: indicatorArea;
-                anchors.topMargin: 0
-            }
-        },
-        State {
-            name: "offscreen" //pushed off screen
-            when: fullscreenMode
-            PropertyChanges {
-                target: indicatorArea;
-                anchors.topMargin: indicators.state === "initial" ? -d.indicatorHeight : 0
-            }
-        }
-    ]
-}

=== added file 'qml/Panel/PanelVelocityCalculator.qml'
--- qml/Panel/PanelVelocityCalculator.qml	1970-01-01 00:00:00 +0000
+++ qml/Panel/PanelVelocityCalculator.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,54 @@
+/*
+ * 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.2
+import Ubuntu.Gestures 0.1
+
+Item {
+    id: root
+    property real trackedValue: 0
+    property bool velocityAboveThreshold: false
+    property real velocityThreshold: 0.4
+
+    function reset() {
+        velocityTimer.stop();
+        velocityAboveThreshold = false;
+        calc.reset();
+    }
+
+    function update() {
+        calc.trackedPosition = trackedValue;
+        velocityAboveThreshold = Math.abs(calc.calculate()) > velocityThreshold;
+
+        if (velocityAboveThreshold) { // only start timer if we're above the threshold.
+            velocityTimer.start();
+        } else {
+            velocityTimer.stop();
+        }
+    }
+
+    onTrackedValueChanged: update();
+
+    AxisVelocityCalculator {
+        id: calc
+    }
+
+    Timer {
+        id: velocityTimer
+        interval: 50
+        onTriggered: update();
+    }
+}

=== modified file 'qml/Shell.qml'
--- qml/Shell.qml	2014-10-08 20:36:48 +0000
+++ qml/Shell.qml	2014-10-15 16:33:46 +0000
@@ -36,6 +36,7 @@
 import "Components"
 import "Notifications"
 import "Stages"
+import "Panel/Indicators"
 import Unity.Notifications 1.0 as NotificationBackend
 import Unity.Session 0.1
 import Unity.DashCommunicator 0.1
@@ -235,7 +236,7 @@
                 target: applicationsDisplayLoader.item
                 property: "maximizedAppTopMargin"
                 // Not just using panel.panelHeight as that changes depending on the focused app.
-                value: panel.indicators.panelHeight
+                value: panel.indicators.minimizedPanelHeight + units.dp(2) // dp(2) for orange line
             }
             Binding {
                 target: applicationsDisplayLoader.item
@@ -613,7 +614,17 @@
                 available: edgeDemo.panelEnabled && (!shell.locked || AccountsService.enableIndicatorsWhileLocked) && !greeter.hasLockedApp
                 contentEnabled: edgeDemo.panelContentEnabled
                 width: parent.width > units.gu(60) ? units.gu(40) : parent.width
-                panelHeight: units.gu(3)
+
+                minimizedPanelHeight: units.gu(3)
+                expandedPanelHeight: units.gu(7)
+
+                indicatorsModel: visibleIndicators.model
+            }
+
+            VisibleIndicators {
+                id: visibleIndicators
+                // TODO: This should be sourced by device type (eg "desktop", "tablet", "phone"...)
+                Component.onCompleted: initialise(indicatorProfile)
             }
 
             property bool topmostApplicationIsFullscreen:
@@ -676,9 +687,9 @@
             model: NotificationBackend.Model
             margin: units.gu(1)
 
-            y: panel.panelHeight
+            y: topmostIsFullscreen ? 0 : panel.panelHeight
             width: parent.width
-            height: parent.height - panel.panelHeight
+            height: parent.height - (topmostIsFullscreen ? 0 : panel.panelHeight)
 
             states: [
                 State {

=== modified file 'tests/autopilot/unity8/indicators/tests/test_indicators.py'
--- tests/autopilot/unity8/indicators/tests/test_indicators.py	2014-10-09 13:57:46 +0000
+++ tests/autopilot/unity8/indicators/tests/test_indicators.py	2014-10-15 16:33:46 +0000
@@ -61,7 +61,7 @@
             self.skipTest('Nexus 10 does not have bluetooth at the moment.')
 
     def test_indicator_exists(self):
-        self.main_window._get_indicator_widget(
+        self.main_window._get_indicator_panel_item(
             self.indicator_name
         )
 

=== modified file 'tests/autopilot/unity8/shell/emulators/main_window.py'
--- tests/autopilot/unity8/shell/emulators/main_window.py	2014-08-12 17:30:05 +0000
+++ tests/autopilot/unity8/shell/emulators/main_window.py	2014-10-15 16:33:46 +0000
@@ -75,15 +75,15 @@
     def get_pinentryField(self):
         return self.select_single(objectName="pinentryField")
 
-    def _get_indicator_widget(self, indicator_name):
+    def _get_indicator_panel_item(self, indicator_name):
         return self.select_single(
-            'DefaultIndicatorWidget',
-            objectName=indicator_name+'-widget'
+            'IndicatorItem',
+            objectName=indicator_name+'-panelItem'
         )
 
     def _get_indicator_page(self, indicator_name):
         return self.select_single(
-            'DefaultIndicatorPage',
+            'IndicatorPage',
             objectName=indicator_name+'-page'
         )
 
@@ -93,12 +93,12 @@
 
         :returns: The indicator page.
         """
-        widget = self._get_indicator_widget(indicator_name)
+        widget = self._get_indicator_panel_item(indicator_name)
         start_x, start_y = input.get_center_point(widget)
         end_x = start_x
         end_y = self.height
         self.pointing_device.drag(start_x, start_y, end_x, end_y)
-        self.wait_select_single('Indicators', fullyOpened=True)
+        self.wait_select_single('IndicatorsMenu', fullyOpened=True)
         return self._get_indicator_page(indicator_name)
 
     @autopilot_logging.log_action(logger.info)

=== modified file 'tests/mocks/Unity/Indicators/Indicators.qmltypes'
--- tests/mocks/Unity/Indicators/Indicators.qmltypes	2014-10-15 16:33:45 +0000
+++ tests/mocks/Unity/Indicators/Indicators.qmltypes	2014-10-15 16:33:46 +0000
@@ -105,10 +105,8 @@
             values: {
                 "Identifier": 0,
                 "Position": 1,
-                "WidgetSource": 2,
-                "PageSource": 3,
-                "IndicatorProperties": 4,
-                "IsVisible": 5
+                "IndicatorProperties": 2,
+                "IsVisible": 3
             }
         }
     }

=== modified file 'tests/mocks/Unity/Indicators/IndicatorsModel.qml'
--- tests/mocks/Unity/Indicators/IndicatorsModel.qml	2014-10-15 16:33:45 +0000
+++ tests/mocks/Unity/Indicators/IndicatorsModel.qml	2014-10-15 16:33:46 +0000
@@ -38,14 +38,14 @@
         Indicators.UnityMenuModelCache.setCachedModelData("com.canonical.indicators.fake3",
                                            "/com/canonical/indicators/fake3",
                                            "/com/canonical/indicators/fake3",
-                                           getUnityMenuModelData("fake-indicator-sound",
+                                           getUnityMenuModelData("fake-indicator-messages",
                                                                  "Messages (F)",
                                                                  "",
                                                                  [ "image://theme/messages-new" ]));
         Indicators.UnityMenuModelCache.setCachedModelData("com.canonical.indicators.fake4",
                                            "/com/canonical/indicators/fake4",
                                            "/com/canonical/indicators/fake4",
-                                           getUnityMenuModelData("fake-indicator-power",
+                                           getUnityMenuModelData("fake-indicator-sound",
                                                                  "Sound (F)",
                                                                  "",
                                                                  [ "image://theme/audio-volume-high" ]));
@@ -56,6 +56,13 @@
                                                                  "Battery (F)",
                                                                  "",
                                                                  [ "image://theme/battery-020" ]));
+        Indicators.UnityMenuModelCache.setCachedModelData("com.canonical.indicators.fake6",
+                                           "/com/canonical/indicators/fake6",
+                                           "/com/canonical/indicators/fake6",
+                                           getUnityMenuModelData("fake-indicator-datetime",
+                                                                 "Upcoming Events (F)",
+                                                                 "12:04",
+                                                                 []));
     }
 
     function getUnityMenuModelData(identifier, title, label, icons) {
@@ -105,9 +112,7 @@
 
     property var originalModelData: [
         {
-            "identifier": "indicator-fake1",
-            "widgetSource": "Indicators/DefaultIndicatorWidget.qml",
-            "pageSource": "Indicators/DefaultIndicatorPage.qml",
+            "identifier": "fake-indicator-bluetooth",
             "indicatorProperties": {
                 "enabled": true,
                 "busName": "com.canonical.indicators.fake1",
@@ -116,9 +121,7 @@
             }
         },
         {
-            "identifier": "indicator-fake2",
-            "widgetSource": "Indicators/DefaultIndicatorWidget.qml",
-            "pageSource": "Indicators/DefaultIndicatorPage.qml",
+            "identifier": "fake-indicator-network",
             "indicatorProperties": {
                 "enabled": true,
                 "busName": "com.canonical.indicators.fake2",
@@ -127,9 +130,7 @@
             }
         },
         {
-            "identifier": "indicator-fake3",
-            "widgetSource": "Indicators/DefaultIndicatorWidget.qml",
-            "pageSource": "Indicators/DefaultIndicatorPage.qml",
+            "identifier": "fake-indicator-messages",
             "indicatorProperties": {
                 "enabled": true,
                 "busName": "com.canonical.indicators.fake3",
@@ -138,9 +139,7 @@
             }
         },
         {
-            "identifier": "indicator-fake4",
-            "widgetSource": "Indicators/DefaultIndicatorWidget.qml",
-            "pageSource": "Indicators/DefaultIndicatorPage.qml",
+            "identifier": "fake-indicator-sound",
             "indicatorProperties": {
                 "enabled": true,
                 "busName": "com.canonical.indicators.fake4",
@@ -149,15 +148,22 @@
             }
         },
         {
-            "identifier": "indicator-fake5",
-            "widgetSource": "Indicators/DefaultIndicatorWidget.qml",
-            "pageSource": "Indicators/DefaultIndicatorPage.qml",
+            "identifier": "fake-indicator-power",
             "indicatorProperties": {
                 "enabled": true,
                 "busName": "com.canonical.indicators.fake5",
                 "menuObjectPath": "/com/canonical/indicators/fake5",
                 "actionsObjectPath": "/com/canonical/indicators/fake5"
             }
+        },
+        {
+            "identifier": "fake-indicator-datetime",
+            "indicatorProperties": {
+                "enabled": true,
+                "busName": "com.canonical.indicators.fake6",
+                "menuObjectPath": "/com/canonical/indicators/fake6",
+                "actionsObjectPath": "/com/canonical/indicators/fake6"
+            }
         }
     ]
 

=== modified file 'tests/mocks/Unity/Indicators/fakeindicatorsmodel.cpp'
--- tests/mocks/Unity/Indicators/fakeindicatorsmodel.cpp	2014-10-15 16:33:45 +0000
+++ tests/mocks/Unity/Indicators/fakeindicatorsmodel.cpp	2014-10-15 16:33:46 +0000
@@ -110,8 +110,6 @@
     {
         roles[IndicatorsModelRole::Identifier] = "identifier";
         roles[IndicatorsModelRole::Position] = "position";
-        roles[IndicatorsModelRole::WidgetSource] = "widgetSource";
-        roles[IndicatorsModelRole::PageSource] = "pageSource";
         roles[IndicatorsModelRole::IndicatorProperties] = "indicatorProperties";
     }
     return roles;

=== modified file 'tests/qmltests/CMakeLists.txt'
--- tests/qmltests/CMakeLists.txt	2014-10-15 16:33:45 +0000
+++ tests/qmltests/CMakeLists.txt	2014-10-15 16:33:46 +0000
@@ -12,7 +12,6 @@
 set(qmltest_DEFAULT_TARGETS qmlunittests)
 set(qmltest_DEFAULT_NO_ADD_TEST FALSE)
 set(qmltest_DEFAULT_PROPERTIES ENVIRONMENT "QT_QPA_PLATFORM=minimal")
-add_qml_test(Panel IndicatorItem)
 add_qml_test(utils/Unity/Test UnityTest)
 
 set(qmltest_DEFAULT_TARGETS qmluitests)
@@ -72,13 +71,14 @@
 add_qml_test(Notifications Notifications)
 add_qml_test(Notifications VisualSnapDecisionsQueue)
 add_qml_test(Panel ActiveCallHint)
-add_qml_test(Panel IndicatorRow ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
-add_qml_test(Panel Indicators ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
+add_qml_test(Panel IndicatorItem)
+add_qml_test(Panel IndicatorItemRow ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
+add_qml_test(Panel IndicatorPage ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
+add_qml_test(Panel IndicatorsBar ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
+add_qml_test(Panel IndicatorsMenu ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
 add_qml_test(Panel MenuContent ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
 add_qml_test(Panel Panel ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
 add_qml_test(Panel SearchIndicator)
-add_qml_test(Panel/Indicators DefaultIndicatorWidget ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
-add_qml_test(Panel/Indicators DefaultIndicatorPage ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/QMenuModel")
 # These MenuItemFactory tests need the test/mocks/ to come before plugins/
 add_qml_test(Panel/Indicators MenuItemFactory IMPORT_PATHS ${CMAKE_BINARY_DIR}/tests/mocks ${qmltest_DEFAULT_IMPORT_PATHS})
 add_qml_test(Panel/Indicators MessageMenuItemFactory IMPORT_PATHS ${CMAKE_BINARY_DIR}/tests/mocks ${qmltest_DEFAULT_IMPORT_PATHS})

=== added file 'tests/qmltests/Panel/IndicatorTest.qml'
--- tests/qmltests/Panel/IndicatorTest.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/IndicatorTest.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,67 @@
+/*
+ * Copyright 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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import "../../../qml/Panel"
+import Ubuntu.Components 0.1
+import Unity.Test 0.1 as UT
+import Unity.Indicators 0.1 as Indicators
+
+Rectangle {
+    id: root
+    color: "white"
+
+    property alias indicatorsModel: __indicatorsModel
+    Indicators.IndicatorsModel {
+        id: __indicatorsModel
+        Component.onCompleted: load()
+    }
+
+    function insertIndicator(index) {
+        var i;
+        var insertIndex = 0;
+        var done = false;
+        for (i = index; !done && i >= 1; i--) {
+
+            var lookFor = indicatorsModel.originalModelData[i-1]["identifier"]
+
+            var j;
+            for (j = indicatorsModel.modelData.length-1; !done && j >= 0; j--) {
+                if (indicatorsModel.modelData[j]["identifier"] === lookFor) {
+                    insertIndex = j+1;
+                    done = true;
+                }
+            }
+        }
+        indicatorsModel.insert(insertIndex, indicatorsModel.originalModelData[index]);
+    }
+
+    function removeIndicator(index) {
+        var i;
+        for (i = 0; i < indicatorsModel.modelData.length; i++) {
+            if (indicatorsModel.modelData[i]["identifier"] === indicatorsModel.originalModelData[index]["identifier"]) {
+                indicatorsModel.remove(i);
+                break;
+            }
+        }
+    }
+
+    function resetData() {
+        indicatorsModel.load();
+    }
+}

=== removed file 'tests/qmltests/Panel/Indicators/tst_DefaultIndicatorWidget.qml'
--- tests/qmltests/Panel/Indicators/tst_DefaultIndicatorWidget.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/Indicators/tst_DefaultIndicatorWidget.qml	1970-01-01 00:00:00 +0000
@@ -1,52 +0,0 @@
-/*
- * Copyright 2013 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.0
-import QtTest 1.0
-import Unity.Test 0.1 as UT
-import QMenuModel 0.1
-import "../../../../qml/Panel/Indicators"
-
-Item {
-    id: testView
-    width: units.gu(40)
-    height: units.gu(70)
-
-   DefaultIndicatorWidget {
-        id: widget
-
-        anchors {
-            left: parent.left
-            top: parent.top
-        }
-
-        busName: "test"
-        actionsObjectPath: "test"
-        deviceMenuObjectPath: "test"
-
-        rootMenuType: ""
-
-        iconSize: units.gu(3.2)
-        height: units.gu(3)
-    }
-
-    UT.UnityTestCase {
-        name: "DefaultIndicatorWidget"
-        when: windowShown
-
-        // FIXME: add tests
-    }
-}

=== modified file 'tests/qmltests/Panel/tst_ActiveCallHint.qml'
--- tests/qmltests/Panel/tst_ActiveCallHint.qml	2014-09-11 14:53:35 +0000
+++ tests/qmltests/Panel/tst_ActiveCallHint.qml	2014-10-15 16:33:46 +0000
@@ -19,7 +19,6 @@
 import Unity.Test 0.1 as UT
 import Ubuntu.Telephony 0.1 as Telephony
 import Unity.Application 0.1
-import ".."
 import "../../../qml/Panel"
 
 Item {

=== added file 'tests/qmltests/Panel/tst_IndicatorItem.qml'
--- tests/qmltests/Panel/tst_IndicatorItem.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/tst_IndicatorItem.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,205 @@
+/*
+ * Copyright 2013-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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import Ubuntu.Components 0.1
+import Unity.Test 0.1 as UT
+import "../../../qml/Panel"
+
+Rectangle {
+    width: units.gu(80)
+    height: units.gu(30)
+    color: "white"
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.margins: units.gu(1)
+
+        Rectangle {
+            id: itemArea
+            color: "blue"
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            Rectangle {
+                color: "black"
+                anchors.fill: indicatorItem
+            }
+
+            IndicatorItem {
+                id: indicatorItem
+                height: expanded ? units.gu(7) : units.gu(3)
+                anchors.centerIn: parent
+                identifier: "indicator-test"
+
+                rootActionState {
+                    title: titleLabel.text
+                    leftLabel : leftLabel.text
+                    rightLabel : rightLabel.text
+                    icons : {
+                        var icons = [];
+                        var i = 0;
+                        if (iconEnabled.checked) {
+                            for (i = 0; i < String(iconCount.text); i++) {
+                                icons.push("image://theme/audio-volume-high");
+                            }
+                        }
+                        return icons;
+                    }
+                }
+
+                Behavior on height {
+                    NumberAnimation {
+                        id: heightAnimation
+                        duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing
+                    }
+                }
+            }
+        }
+
+        ColumnLayout {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: false
+
+            Button {
+                id: expandButton
+                Layout.fillWidth: true
+                text: indicatorItem.expanded ? "Collapse" : "Expand"
+                onClicked: indicatorItem.expanded = !indicatorItem.expanded
+            }
+
+            Button {
+                id: selectButton
+                Layout.fillWidth: true
+                text: indicatorItem.selected ? "Unselect" : "Select"
+                onClicked: indicatorItem.selected = !indicatorItem.selected
+            }
+
+            Rectangle {
+                Layout.preferredHeight: units.dp(1);
+                Layout.fillWidth: true;
+                color: "black"
+            }
+
+            RowLayout {
+                CheckBox { id: iconEnabled; checked: true }
+                Label { text: "icons    Count:" }
+                TextField { id: iconCount; text: "1"; enabled: iconEnabled.checked }
+            }
+
+            RowLayout {
+                Label { text: "Left Label:" }
+                TextField { id: leftLabel; text: "Left"}
+            }
+
+            RowLayout {
+                Label { text: "Right Label:" }
+                TextField { id: rightLabel; text: "Right"}
+            }
+
+            RowLayout {
+                Label { text: "Title:" }
+                TextField { id: titleLabel; text: "Title"}
+            }
+        }
+    }
+
+    UT.UnityTestCase {
+        name: "IndicatorItem"
+        when: windowShown
+
+        function init() {
+            indicatorItem.selected = false;
+            indicatorItem.expanded = false;
+            indicatorItem.rootActionState.title = "Test Title";
+            indicatorItem.rootActionState.leftLabel = "TestLeftLabel";
+            indicatorItem.rootActionState.rightLabel = "TestRightLabel";
+            indicatorItem.rootActionState.icons = [ "image://theme/audio-volume-high" ];
+
+            tryCompare(heightAnimation, "running", false);
+        }
+
+        function test_expand() {
+            indicatorItem.expanded = true;
+            tryCompare(indicatorItem, "height", units.gu(7));
+            indicatorItem.expanded = false;
+            tryCompare(indicatorItem, "height", units.gu(3));
+        }
+
+        function test_minimizedVisibility() {
+            compare(findChild(indicatorItem, "leftLabel").opacity, 1.0);
+            compare(findChild(indicatorItem, "rightLabel").opacity, 1.0);
+            compare(findChild(indicatorItem, "icons").opacity, 1.0);
+            compare(findChild(indicatorItem, "indicatorName").opacity, 0.0);
+        }
+
+        function test_expandIcon() {
+            indicatorItem.expanded = true;
+
+            tryCompare(findChild(indicatorItem, "leftLabel"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "rightLabel"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "icons"), "opacity", 1.0);
+            tryCompare(findChild(indicatorItem, "indicatorName"), "opacity", 1.0);
+        }
+
+        function test_expandRightLabel() {
+            indicatorItem.expanded = true;
+
+            indicatorItem.rootActionState.icons = [];
+
+            tryCompare(findChild(indicatorItem, "leftLabel"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "rightLabel"), "opacity", 1.0);
+            tryCompare(findChild(indicatorItem, "icons"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "indicatorName"), "opacity", 1.0);
+        }
+
+        function test_expandLeftLabel() {
+            indicatorItem.expanded = true;
+
+            indicatorItem.rootActionState.rightLabel = "";
+            indicatorItem.rootActionState.icons = [];
+
+            tryCompare(findChild(indicatorItem, "rightLabel"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "leftLabel"), "opacity", 1.0);
+            tryCompare(findChild(indicatorItem, "icons"), "opacity", 0.0);
+            tryCompare(findChild(indicatorItem, "indicatorName"), "opacity", 1.0);
+        }
+
+        function test_select() {
+            tryCompare(findChild(indicatorItem, "icon0"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "icon0"), "opacity", 1.0);
+            tryCompare(findChild(indicatorItem, "leftLabel"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "rightLabel"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "indicatorName"), "color", "#ededed");
+
+            indicatorItem.expanded = true;
+            tryCompare(findChild(indicatorItem, "icon0"), "color", "#4c4c4c");
+            tryCompare(findChild(indicatorItem, "icon0"), "opacity", 0.6);
+            tryCompare(findChild(indicatorItem, "leftLabel"), "color", "#4c4c4c");
+            tryCompare(findChild(indicatorItem, "rightLabel"), "color", "#4c4c4c");
+            tryCompare(findChild(indicatorItem, "indicatorName"), "color", "#4c4c4c");
+
+            indicatorItem.selected = true;
+            tryCompare(findChild(indicatorItem, "icon0"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "icon0"), "opacity", 1.0);
+            tryCompare(findChild(indicatorItem, "leftLabel"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "rightLabel"), "color", "#ededed");
+            tryCompare(findChild(indicatorItem, "indicatorName"), "color", "#ededed");
+        }
+    }
+}

=== removed file 'tests/qmltests/Panel/tst_IndicatorItem.qml'
--- tests/qmltests/Panel/tst_IndicatorItem.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/tst_IndicatorItem.qml	1970-01-01 00:00:00 +0000
@@ -1,50 +0,0 @@
-/*
- * Copyright 2013 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.0
-import QtTest 1.0
-import ".."
-import "../../../qml/Panel"
-import Ubuntu.Components 0.1
-import Unity.Test 0.1 as UT
-
-Rectangle {
-    width: units.gu(10)
-    height: units.gu(5)
-    color: "black"
-
-    IndicatorItem {
-        id: indicatorItem
-        anchors.fill: parent
-    }
-
-    UT.UnityTestCase {
-        name: "IndicatorItem"
-
-        function test_dimmed() {
-            indicatorItem.dimmed = false;
-            tryCompareFunction(function(){return indicatorItem.opacity}, 1.0);
-            indicatorItem.dimmed = true;
-            tryCompareFunction(function(){return indicatorItem.opacity < 1.0}, true);
-        }
-
-        function test_empty() {
-            compare(indicatorItem.indicatorVisible, false, "IndicatorItem should not be visible.");
-            indicatorItem.widgetSource = "../../../qml/Panel/Indicators/DefaultIndicatorWidget.qml";
-            tryCompare(indicatorItem, "indicatorVisible", true);
-        }
-    }
-}

=== added file 'tests/qmltests/Panel/tst_IndicatorItemRow.qml'
--- tests/qmltests/Panel/tst_IndicatorItemRow.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/tst_IndicatorItemRow.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,279 @@
+/*
+ * Copyright 2013-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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import "../../../qml/Panel"
+import Ubuntu.Components 0.1
+import Unity.Test 0.1 as UT
+import Unity.Indicators 0.1 as Indicators
+
+IndicatorTest {
+    id: root
+    width: units.gu(100)
+    height: units.gu(40)
+    color: "white"
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.margins: units.gu(1)
+
+        Rectangle {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            id: itemArea
+            color: "blue"
+
+            Rectangle {
+                color: "black"
+                anchors.fill: indicatorsRow
+            }
+
+            IndicatorItemRow {
+                id: indicatorsRow
+                height: expanded ? units.gu(7) : units.gu(3)
+                anchors.centerIn: parent
+                indicatorsModel: root.indicatorsModel
+                enableLateralChanges: ma.pressed
+
+                Behavior on height {
+                    NumberAnimation {
+                        id: heightAnimation
+                        duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing
+                    }
+                }
+
+                MouseArea {
+                    id: ma
+                    anchors.fill: parent
+                    onPositionChanged: {
+                        indicatorsRow.lateralPosition = mouse.x;
+                    }
+                    onPressed: {
+                        if (pressed) {
+                            indicatorsRow.lateralPosition = mouse.x;
+                            indicatorsRow.selectItemAt(mouse.x);
+                        }
+                    }
+                }
+            }
+        }
+
+        ColumnLayout {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: false
+
+            Button {
+                Layout.fillWidth: true
+                text: indicatorsRow.expanded ? "Collapse" : "Expand"
+                onClicked: indicatorsRow.expanded = !indicatorsRow.expanded
+            }
+
+            Rectangle {
+                Layout.preferredHeight: units.dp(1);
+                Layout.fillWidth: true;
+                color: "black"
+            }
+
+            Repeater {
+                model: indicatorsModel.originalModelData
+                RowLayout {
+                    CheckBox {
+                        checked: true
+                        onCheckedChanged: checked ? insertIndicator(index) : removeIndicator(index);
+                    }
+                    Label { text: modelData["identifier"] }
+                }
+            }
+        }
+    }
+
+    UT.UnityTestCase {
+        name: "IndicatorItemRow"
+        when: windowShown
+
+        function init() {
+            root.resetData();
+
+            indicatorsRow.resetCurrentItem();
+            indicatorsRow.lateralPosition = -1;
+
+            indicatorsRow.expanded = false;
+            tryCompare(heightAnimation, "running", false);
+            tryCompare(findChild(indicatorsRow, "highlight"), "highlightCenterOffset", 0);
+            wait(1); // row seems to take a bit of time for item x values to update.
+        }
+
+        function wait_for_expansion_to_settle() {
+            tryCompare(heightAnimation, "running", false);
+            wait(200); // put a little extra wait in for things to settle
+        }
+
+        function test_indicatorRowChanges_data() {
+            return [
+                { remove: [0, 2] },
+                { remove: [0, 1, 2, 3, 4] },
+            ];
+        }
+
+        // test the changes in the available indicators updates the
+        // indicators that are visible.
+        function test_indicatorRowChanges(data) {
+            var i;
+            var item;
+            var itemsToRemove = [0, 2];
+
+            verify(indicatorsModel.originalModelData.length > 0);
+            for (i = 0; i < indicatorsModel.originalModelData.length; i++) {
+                item = findChild(indicatorsRow, indicatorsModel.originalModelData[i]["identifier"] + "-panelItem");
+                verify(item);
+
+                compare(item.ownIndex, i, "Item at incorrect index");
+            }
+
+            for (i = data.remove.length-1; i >= 0; i--) {
+                removeIndicator(data.remove[i]);
+            }
+
+            // test removals
+            for (i = 0; i < indicatorsModel.originalModelData.length; i++) {
+                item = findChild(indicatorsRow, indicatorsModel.originalModelData[i]["identifier"] + "-panelItem");
+
+                verify(data.remove.indexOf(i) !== -1 ? (item === null) : (item !== null));
+            }
+
+            // test insertion
+            for (i = 0; i < data.remove.length; i++) {
+                insertIndicator(data.remove[i]);
+            }
+
+            for (i = 0; i < indicatorsModel.originalModelData.length; i++) {
+                item = findChild(indicatorsRow, indicatorsModel.originalModelData[i]["identifier"] + "-panelItem");
+                verify(item);
+
+                compare(item.ownIndex, i, "Item at incorrect index");
+            }
+        }
+
+        function test_validCurrentItem_data() {
+            return [
+                { index: 0 },
+                { index: 2 },
+                { index: 4 }
+            ];
+        }
+
+        // test selecting the item at it's position sets the current item of the row.
+        function test_validCurrentItem(data) {
+            var dataItem = findChild(indicatorsRow, indicatorsModel.originalModelData[data.index]["identifier"] + "-panelItem");
+            verify(dataItem !== null);
+
+            indicatorsRow.selectItemAt(dataItem.x + dataItem.width/2);
+            compare(indicatorsRow.currentItem, dataItem);
+        }
+
+        // tests item default selection (no item at position X)
+        function test_invalidCurrentItem() {
+            indicatorsRow.selectItemAt(-100);
+            var item = findChild(indicatorsRow, indicatorsModel.originalModelData[0]["identifier"] + "-panelItem");
+            compare(indicatorsRow.currentItem, item);
+        }
+
+        // testing that changing the lateral position offset of the row changes the current item.
+        function test_lateralPositionChangesCurrentItem_data() {
+            return [
+                { tag: "0 -> 4", from: 0, to: 4 },
+                { tag: "3 -> 1", from: 3, to: 1 }
+            ];
+        }
+
+        function test_lateralPositionChangesCurrentItem(data) {
+            indicatorsRow.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var fromItem = findChild(indicatorsRow, indicatorsModel.originalModelData[data.from]["identifier"] + "-panelItem");
+            verify(fromItem !== null);
+
+            var toItem = findChild(indicatorsRow, indicatorsModel.originalModelData[data.to]["identifier"] + "-panelItem");
+            verify(toItem !== null);
+
+            var fromPosition = indicatorsRow.mapFromItem(fromItem, fromItem.width/2, fromItem.height/2);
+            var toPosition = indicatorsRow.mapFromItem(toItem, toItem.width/2, toItem.height/2);
+
+            mousePress(indicatorsRow, fromPosition.x, fromPosition.y);
+            compare(indicatorsRow.currentItem, fromItem, "Initial item not selected");
+
+            // this uses the MouseArea above to change the indicatorRow lateralPosition
+            mouseFlick(indicatorsRow, fromPosition.x, fromPosition.y, toPosition.x, toPosition.y, false, false, units.gu(5), 30);
+
+            mouseRelease(indicatorsRow, fromPosition.x, fromPosition.y);
+            compare(indicatorsRow.currentItem, toItem, "Current item did not change to expected item");
+        }
+
+        // testing that positive changes to the lateral position offset shifts the highlight offset to the right
+        function test_positiveLateralPositionChangesHighlightOffset() {
+            indicatorsRow.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var highlight = findChild(indicatorsRow, "highlight");
+            var item = findChild(indicatorsRow, indicatorsModel.originalModelData[2]["identifier"] + "-panelItem");
+            verify(item !== null);
+            var mappedPosition = indicatorsRow.mapFromItem(item, item.width/2, item.height/2);
+
+            mousePress(indicatorsRow, mappedPosition.x, mappedPosition.y);
+            var originalHightlightX = highlight.x;
+            var offset = 1;
+            while((highlight.x - originalHightlightX) <= units.gu(0.5) && offset < units.gu(10)) {
+                mouseMove(indicatorsRow, mappedPosition.x + offset, mappedPosition.y, 10);
+                offset = offset + 2;
+            }
+            // verify that we hit the offset
+            verify((highlight.x - originalHightlightX) >= units.gu(0.5));
+            mouseRelease(indicatorsRow);
+
+            // should go back to 0
+            tryCompare(highlight, "highlightCenterOffset", 0);
+        }
+
+        // testing that negative changes to the lateral position offset shifts the highlight offset to the left
+        function test_negativeLateralPositionChangesHighlightOffset() {
+            indicatorsRow.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var highlight = findChild(indicatorsRow, "highlight");
+            var item = findChild(indicatorsRow, indicatorsModel.originalModelData[2]["identifier"] + "-panelItem");
+            verify(item !== null);
+            var mappedPosition = indicatorsRow.mapFromItem(item, item.width/2, item.height/2);
+
+            mousePress(indicatorsRow, mappedPosition.x, mappedPosition.y);
+            var originalHightlightX = highlight.x;
+            var offset = 1;
+            while((highlight.x - originalHightlightX) >= -units.gu(0.5) && offset < units.gu(10)) {
+                mouseMove(indicatorsRow, mappedPosition.x - offset, mappedPosition.y, 10);
+                offset = offset + 2;
+            }
+
+            // verify that we hit the offset
+            verify((highlight.x - originalHightlightX) <= -units.gu(0.5));
+            mouseRelease(indicatorsRow);
+
+            // should go back to 0
+            tryCompare(findChild(indicatorsRow, "highlight"), "highlightCenterOffset", 0);
+        }
+    }
+}

=== renamed file 'tests/qmltests/Panel/Indicators/tst_DefaultIndicatorPage.qml' => 'tests/qmltests/Panel/tst_IndicatorPage.qml'
--- tests/qmltests/Panel/Indicators/tst_DefaultIndicatorPage.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/tst_IndicatorPage.qml	2014-10-15 16:33:46 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013 Canonical Ltd.
+ * Copyright 2013-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
@@ -18,14 +18,14 @@
 import QtTest 1.0
 import Unity.Test 0.1 as UT
 import Unity.Indicators 0.1 as Indicators
-import "../../../../qml/Panel/Indicators"
+import "../../../qml/Panel"
 
 Item {
     id: testView
     width: units.gu(40)
     height: units.gu(70)
 
-    DefaultIndicatorPage {
+    IndicatorPage {
         id: page
         anchors.fill: parent
 
@@ -117,7 +117,7 @@
     }
 
     UT.UnityTestCase {
-        name: "DefaultIndicatorPage"
+        name: "IndicatorPage"
 
         function init() {
             initializeMenuData([]);

=== removed file 'tests/qmltests/Panel/tst_IndicatorRow.qml'
--- tests/qmltests/Panel/tst_IndicatorRow.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/tst_IndicatorRow.qml	1970-01-01 00:00:00 +0000
@@ -1,158 +0,0 @@
-/*
- * Copyright 2013 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.0
-import QtTest 1.0
-import Unity.Test 0.1 as UT
-import ".."
-import "../../../qml/Panel"
-import Unity.Indicators 0.1 as Indicators
-
-/*
-  This tests the IndicatorRow component by using a fake model to stage data in the indicators
-  A view will show with indicators at the top, as does in the shell.
-*/
-Item {
-    id: rootItem
-    width: units.gu(40)
-    height: units.gu(60)
-
-    PanelBackground {
-        anchors.fill: indicatorRow
-    }
-
-    IndicatorRow {
-        id: indicatorRow
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
-
-        indicatorsModel: indicatorModel
-
-        Component.onCompleted: indicatorModel.load("test1")
-    }
-
-    Indicators.IndicatorsModel {
-        id: indicatorModel
-    }
-
-    UT.UnityTestCase {
-        name: "IndicatorRow"
-        when: windowShown
-
-        function init() {
-            indicatorModel.load("test1");
-
-            indicatorRow.state = "initial";
-            indicatorRow.setCurrentItemIndex(-1);
-            indicatorRow.unitProgress = 0.0;
-        }
-
-        function get_indicator_item(index) {
-            return findChild(indicatorRow.row, "item" + index);
-        }
-
-        function test_set_current_item() {
-            indicatorRow.setCurrentItemIndex(0);
-            compare(indicatorRow.indicatorsModel.data(indicatorRow.currentItemIndex, Indicators.IndicatorsModelRole.Identifier),
-                    "indicator-fake1",
-                    "Incorrect item at position 0");
-
-            indicatorRow.setCurrentItemIndex(1);
-            compare(indicatorRow.indicatorsModel.data(indicatorRow.currentItemIndex, Indicators.IndicatorsModelRole.Identifier),
-                    "indicator-fake2",
-                    "Incorrect item at position 1");
-
-            indicatorRow.setCurrentItemIndex(2);
-            compare(indicatorRow.indicatorsModel.data(indicatorRow.currentItemIndex, Indicators.IndicatorsModelRole.Identifier),
-                    "indicator-fake3",
-                    "Incorrect item at position 2");
-        }
-
-        function test_highlight_data() {
-            return [
-                { index: 0, progress: 0.0, current: false, other: false },
-                { index: 0, progress: 0.1, current: true, other: false },
-                { index: 0, progress: 0.5, current: true, other: false },
-                { index: 0, progress: 1.0, current: true, other: false },
-                { index: 2, progress: 0.0, current: false, other: false },
-                { index: 2, progress: 0.1, current: true, other: false },
-                { index: 2, progress: 0.5, current: true, other: false },
-                { index: 2, progress: 1.0, current: true, other: false }
-            ];
-        }
-
-        function test_highlight(data) {
-            indicatorRow.unitProgress = data.progress;
-            indicatorRow.setCurrentItemIndex(data.index);
-
-            compare(indicatorRow.currentItem.highlighted, data.current, "Indicator hightlight did not match for current item");
-
-            for (var i = 0; i < indicatorRow.row.count; i++) {
-                compare(get_indicator_item(i).highlighted, i === data.index ? data.current: data.other, "Indicator hightlight did not match for item iter");
-            }
-        }
-
-        function test_opacity_data() {
-            return [
-                { index: 0, progress: 0.0, current: 1.0, other: 1.0 },
-                { index: 0, progress: 0.1, current: 1.0, other: 0.9 },
-                { index: 0, progress: 0.5, current: 1.0, other: 0.5 },
-                { index: 0, progress: 1.0, current: 1.0, other: 0.0 },
-                { index: 2, progress: 0.0, current: 1.0, other: 1.0 },
-                { index: 2, progress: 0.1, current: 1.0, other: 0.9 },
-                { index: 2, progress: 0.5, current: 1.0, other: 0.5 },
-                { index: 2, progress: 1.0, current: 1.0, other: 0.0 }
-            ];
-        }
-
-        function test_opacity(data) {
-            indicatorRow.unitProgress = data.progress;
-            indicatorRow.setCurrentItemIndex(data.index);
-
-            tryCompare(indicatorRow.currentItem, "opacity", data.current);
-
-            for (var i = 0; i < indicatorRow.row.count; i++) {
-                tryCompare(get_indicator_item(i), "opacity", i === data.index ? data.current: data.other);
-            }
-        }
-
-        function test_dimmed_data() {
-            return [
-                { index: 0, progress: 0.0, current: false, other: false },
-                { index: 0, progress: 0.1, current: false, other: true },
-                { index: 0, progress: 0.5, current: false, other: true },
-                { index: 0, progress: 1.0, current: false, other: true },
-                { index: 2, progress: 0.0, current: false, other: false },
-                { index: 2, progress: 0.1, current: false, other: true },
-                { index: 2, progress: 0.5, current: false, other: true },
-                { index: 2, progress: 1.0, current: false, other: true }
-            ];
-        }
-
-        function test_dimmed(data) {
-            indicatorRow.unitProgress = data.progress;
-            indicatorRow.setCurrentItemIndex(data.index);
-
-            compare(indicatorRow.currentItem.dimmed, data.current, "Indicator dim did not match for current item");
-
-            for (var i = 0; i < indicatorRow.row.count; i++) {
-                compare(get_indicator_item(i).dimmed, i === data.index ? data.current: data.other, "Indicator dim did not match for item iter");
-            }
-        }
-    }
-}

=== removed file 'tests/qmltests/Panel/tst_Indicators.qml'
--- tests/qmltests/Panel/tst_Indicators.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/tst_Indicators.qml	1970-01-01 00:00:00 +0000
@@ -1,231 +0,0 @@
-/*
- * Copyright 2013 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.0
-import QtTest 1.0
-import Unity.Test 0.1 as UT
-import Ubuntu.Components 0.1 as UC
-import ".."
-import "../../../qml/Panel"
-import "../../../qml/Components"
-
-/*
-  This tests the Indicators component by using a fake model to stage data in the indicators
-  A view will show with indicators at the top, as does in the shell. There is a clickable area
-  marked "Click Me" which can be used to expose the indicators.
-*/
-Item {
-    id: shell
-    width: units.gu(40)
-    height: units.gu(80)
-
-    PanelBackground {
-        anchors.fill: indicators
-    }
-
-    Indicators {
-        id: indicators
-        anchors {
-            right: parent.right
-        }
-        width: (shell.width > units.gu(60)) ? units.gu(40) : shell.width
-        y: 0
-        shown: false
-        profile: "test1"
-
-        openedHeight: parent.height - button.height
-    }
-
-    UC.Button {
-        id: button
-        text: indicators.shown ? "Hide" : "Show"
-        anchors {
-            bottom: shell.bottom
-            left: parent.left
-            right: parent.right
-        }
-        height: 50
-
-        onClicked: {
-            if (!indicators.shown) {
-                indicators.show();
-            } else {
-                indicators.hide();
-            }
-        }
-    }
-
-    UT.UnityTestCase {
-        name: "Indicators"
-        when: windowShown
-
-        function init() {
-            indicators.initialise();
-
-            indicators.hide();
-            tryCompare(indicators.hideAnimation, "running", false);
-            tryCompare(indicators, "state", "initial");
-        }
-
-        // Showing the indicators should fully open the indicator panel.
-        function test_show() {
-            indicators.show()
-            tryCompare(indicators, "fullyOpened", true);
-        }
-
-        // Test the change in the revealer lateral position changes the current panel menu to fit the position
-        // of the indicator in the row.
-        function test_change_revealer_lateral_position()
-        {
-            // tests changing the lateral position of the revealer activates the correct indicator items.
-
-            var indicatorRow = findChild(indicators, "indicatorRow")
-            verify(indicatorRow !== null);
-            var indicatorRowItems = findChild(indicatorRow, "indicatorRowItems");
-            verify(indicatorRowItems !== null);
-
-            for (var i = 0; i < indicatorRowItems.count; i++) {
-                var indicatorItem = findChild(indicatorRowItems, "item" + i);
-
-                if (!indicatorItem.visible)
-                    continue;
-
-                var indicatorPosition = indicators.mapFromItem(indicatorItem,
-                        indicatorItem.width/2, indicatorItem.height/2);
-
-                touchFlick(indicators,
-                           indicatorPosition.x, indicatorPosition.y,
-                           indicatorPosition.x, indicators.openedHeight * 0.4,
-                           true /* beginTouch */, false /* endTouch */);
-
-                compare(indicatorRow.currentItem, indicatorItem,
-                        "Incorrect item activated at position " + i);
-
-                touchFlick(indicators,
-                           indicatorPosition.x, indicators.openedHeight * 0.4,
-                           indicatorPosition.x, indicatorPosition.y,
-                           false /* beginTouch */, true /* endTouch */);
-
-                // wait until fully closed
-                tryCompare(indicators, "height", indicators.panelHeight);
-            }
-        }
-
-        // values for specific state changes are subject to internal decisions, so we can't
-        // determine the true height value which would cause the state to change without making
-        // too many assuptyions
-        // However, we can assume that a partially opened panel will not be initial, and fully
-        // opened panel will be locked.
-
-        function test_progress_changes_state_to_not_initial() {
-            indicators.height = indicators.openedHeight / 2
-            compare(indicators.state!="initial", true,
-                    "Indicators should not be in initial state when partially opened.");
-        }
-
-        function test_progress_changes_state_to_locked() {
-            indicators.height = indicators.openedHeight - indicators.panelHeight
-            compare(indicators.state, "locked", "Indicators should be locked when fully opened.");
-        }
-
-        function test_partially_open() {
-            indicators.height = indicators.openedHeight / 2
-            compare(indicators.partiallyOpened, true,
-                    "Indicator should show as partially opened when height is half of openedHeight");
-            compare(indicators.fullyOpened, false,
-                    "Indicator should not show as fully opened when height is half of openedHeight");
-        }
-
-        function test_fully_open() {
-            indicators.height = indicators.openedHeight
-            compare(indicators.partiallyOpened, false);
-            compare(indicators.fullyOpened, true);
-        }
-
-        function init_invisible_indicator(identifier) {
-            tryCompareFunction(function() { return findChild(indicators, identifier+"-delegate") !== undefined }, true);
-            var item = findChild(indicators, identifier+"-delegate");
-            verify(item !== null);
-
-            item.enabled = false;
-        }
-
-        function test_row_visible_menuContent_visible_data() { return [
-            {tag: "first", visible: [false, true, true, true, true] },
-            {tag: "adjacent", visible: [true, false, false, true, true] },
-            {tag: "bounds", visible: [false, true, true, true, false] },
-            {tag: "disjoint", visible: [true, false, true, false, true] },
-            {tag: "last", visible: [true, true, true, true, false] }];
-        }
-
-        function test_row_visible_menuContent_visible(data) {
-            indicators.show();
-
-            var contentListView = findChild(indicators, "indicatorsContentListView");
-            var indicatorRowItems = findChild(indicators, "indicatorRowItems");
-
-            var count = data.visible.length
-            for (var i = 0; i< data.visible.length; i++) {
-                if (data.visible[i] === false) {
-                    init_invisible_indicator("indicator-fake" + (i + 1));
-                    count--;
-                }
-            }
-
-            tryCompare(indicatorRowItems, "count", count);
-
-            for (i = 0; i < data.visible.length; i++) {
-                var widgetName = "indicator-fake" + (i + 1 + "-widget");
-                var pageName = "indicator-fake" + (i + 1 + "-page");
-
-                // check for item
-                tryCompareFunction(function() { return findChild(indicatorRowItems, widgetName) !== null }, data.visible[i]);
-
-                // check for tab
-                tryCompareFunction(function() { return findChild(contentListView, pageName) !== null }, data.visible[i]);
-            }
-        }
-
-        function test_indicator_visible_correct_menu_data() { return [
-            {tag: "current-first", currentIndex: 0, visible: [false, true, true, true, true], expectedIndex: 0, expextedMenu: "indicator-fake2"  },
-            {tag: "current-last", currentIndex: 4, visible: [true, true, true, true, false], expectedIndex: 3, expextedMenu: "indicator-fake4" },
-            {tag: "after", currentIndex: 0, visible: [true, false, true, true, true], expectedIndex: 0, expextedMenu: "indicator-fake1" },
-            {tag: "before", currentIndex: 1, visible: [false, true, true, true, true], expectedIndex: 1, expextedMenu: "indicator-fake2" }];
-        }
-
-        function test_indicator_visible_correct_menu(data) {
-            var contentListView = findChild(indicators, "indicatorsContentListView");
-            var indicatorRow = findChild(indicators, "indicatorRow");
-
-            indicators.show();
-            indicatorRow.setCurrentItemIndex(data.currentIndex);
-            tryCompare(indicators, "fullyOpened", true);
-
-            for (var i = 0; i< data.visible.length; i++) {
-                if (data.visible[i] === false) {
-                    init_invisible_indicator("indicator-fake" + (i + 1));
-                }
-            }
-
-            // check for current selected item
-            tryCompare(indicatorRow, "currentItemIndex", data.expectedIndex);
-
-            // check for current selected tab
-            tryCompareFunction(function() { return findChild(contentListView, data.expextedMenu) === contentListView.currentItem }, true);
-
-        }
-    }
-}

=== added file 'tests/qmltests/Panel/tst_IndicatorsBar.qml'
--- tests/qmltests/Panel/tst_IndicatorsBar.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/tst_IndicatorsBar.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,178 @@
+/*
+ * Copyright 2013-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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import "../../../qml/Panel"
+import Ubuntu.Components 0.1
+import Unity.Test 0.1 as UT
+import Unity.Indicators 0.1 as Indicators
+
+IndicatorTest {
+    id: root
+    width: units.gu(100)
+    height: units.gu(40)
+
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.margins: units.gu(1)
+
+        Rectangle {
+            id: itemArea
+            color: "blue"
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            Rectangle {
+                color: "black"
+                anchors.fill: indicatorsBar
+            }
+
+            IndicatorsBar {
+                id: indicatorsBar
+                height: expanded ? units.gu(7) : units.gu(3)
+                width: units.gu(30)
+                anchors.centerIn: parent
+                indicatorsModel: root.indicatorsModel
+
+                Behavior on height {
+                    NumberAnimation {
+                        id: heightAnimation
+                        duration: UbuntuAnimation.SnapDuration; easing: UbuntuAnimation.StandardEasing
+                    }
+                }
+
+                MouseArea {
+                    anchors.fill: parent
+                    enabled: !indicatorsBar.expanded
+                    onPressed: {
+                        indicatorsBar.selectItemAt(mouse.x);
+                        indicatorsBar.expanded = true
+                    }
+                }
+            }
+        }
+
+        ColumnLayout {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: false
+
+            Button {
+                Layout.fillWidth: true
+                text: indicatorsBar.expanded ? "Collapse" : "Expand"
+                onClicked: indicatorsBar.expanded = !indicatorsBar.expanded
+            }
+
+            Rectangle {
+                Layout.preferredHeight: units.dp(1);
+                Layout.fillWidth: true;
+                color: "black"
+            }
+
+            Repeater {
+                model: indicatorsModel.originalModelData
+                RowLayout {
+                    CheckBox {
+                        checked: true
+                        onCheckedChanged: checked ? insertIndicator(index) : removeIndicator(index);
+                    }
+                    Label { text: modelData["identifier"] }
+                }
+            }
+        }
+    }
+
+    UT.UnityTestCase {
+        name: "IndicatorsBar"
+        when: windowShown
+
+        function init() {
+            indicatorsBar.expanded = false;
+            tryCompare(heightAnimation, "running", false);
+        }
+
+        function test_expandSelectedItem_data() {
+            return [
+                { index: 0 },
+                { index: 2 },
+                { index: 4 }
+            ];
+        }
+
+        function wait_for_expansion_to_settle() {
+            tryCompare(heightAnimation, "running", false);
+            wait(200); // put a little extra wait in for things to settle
+        }
+
+        // Rough check that expanding a selected item keeps it within the area of the original item.
+        function test_expandSelectedItem(data) {
+            var dataItem = findChild(indicatorsBar, indicatorsModel.originalModelData[data.index]["identifier"] + "-panelItem");
+            verify(dataItem !== null);
+
+            var mappedPosition = indicatorsBar.mapFromItem(dataItem, dataItem.width/2, dataItem.height/2);
+
+            indicatorsBar.selectItemAt(mappedPosition.x);
+            indicatorsBar.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var mappedRect = indicatorsBar.mapFromItem(dataItem, 0, 0, dataItem.width, dataItem.height);
+
+            // mappedPosition contained within mappedRect
+            verify(mappedRect.x <= mappedPosition.x);
+            verify(mappedRect.x + mappedRect.width >= mappedPosition.x);
+        }
+
+        function test_scrollOffset() {
+            indicatorsBar.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var lastItemIndex = indicatorsModel.originalModelData.length-1;
+            var dataItem = findChild(indicatorsBar, indicatorsModel.originalModelData[lastItemIndex]["identifier"] + "-panelItem");
+            verify(dataItem !== null);
+
+            var row = findChild(indicatorsBar, "indicatorItemRow");
+            // test will not work without these conditions
+            verify(row.width >= indicatorsBar.width + dataItem.width);
+
+            var mappedPosition = indicatorsBar.mapFromItem(dataItem, dataItem.width/2, dataItem.height/2);
+            indicatorsBar.addScrollOffset(-dataItem.width);
+            var newMappedPosition = indicatorsBar.mapFromItem(dataItem, dataItem.width/2, dataItem.height/2);
+
+            compare(mappedPosition.x, newMappedPosition.x - dataItem.width);
+        }
+
+        function test_selectItemWhenExpanded_data() {
+            return [
+                { index: 3 },
+                { index: 4 }
+            ];
+        }
+
+        function test_selectItemWhenExpanded(data) {
+            indicatorsBar.expanded = true;
+            wait_for_expansion_to_settle();
+
+            var dataItem = findChild(indicatorsBar, indicatorsModel.originalModelData[data.index]["identifier"] + "-panelItem");
+            if (indicatorsBar.mapFromItem(dataItem, dataItem.width/2, dataItem.height/2).x < 0) {
+                skip("Out of bounds");
+            }
+            mouseClick(dataItem, dataItem.width/2, dataItem.height/2);
+            verify(dataItem.selected === true);
+        }
+    }
+}

=== added file 'tests/qmltests/Panel/tst_IndicatorsMenu.qml'
--- tests/qmltests/Panel/tst_IndicatorsMenu.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/tst_IndicatorsMenu.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,247 @@
+/*
+ * Copyright 2013-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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import "../../../qml/Panel"
+import Ubuntu.Components 0.1
+import Unity.Test 0.1 as UT
+import Unity.Indicators 0.1 as Indicators
+
+IndicatorTest {
+    id: root
+    width: units.gu(80)
+    height: units.gu(71)
+    color: "white"
+
+    property string indicatorProfile: "phone"
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.margins: units.gu(1)
+
+        Rectangle {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            id: itemArea
+            color: "blue"
+
+            IndicatorsMenu {
+                id: indicatorsMenu
+                width: units.gu(40)
+                anchors {
+                    top: parent.top
+                    right: parent.right
+                }
+                minimizedPanelHeight: units.gu(3)
+                expandedPanelHeight: units.gu(7)
+                openedHeight: parent.height
+                indicatorsModel: root.indicatorsModel
+                shown: false
+            }
+        }
+
+        ColumnLayout {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: false
+
+            Button {
+                Layout.fillWidth: true
+                text: indicatorsMenu.shown ? "Hide" : "Show"
+                onClicked: {
+                    if (indicatorsMenu.shown) {
+                        indicatorsMenu.hide();
+                    } else {
+                        indicatorsMenu.show();
+                    }
+                }
+            }
+
+            Rectangle {
+                Layout.preferredHeight: units.dp(1);
+                Layout.fillWidth: true;
+                color: "black"
+            }
+
+            Repeater {
+                model: indicatorsModel.originalModelData
+                RowLayout {
+                    CheckBox {
+                        checked: true
+                        onCheckedChanged: checked ? insertIndicator(index) : removeIndicator(index);
+                    }
+                    Label { text: modelData["identifier"] }
+                }
+            }
+        }
+    }
+
+    UT.UnityTestCase {
+        id: testCase
+        name: "IndicatorsMenu"
+        when: windowShown
+
+        function init() {
+            indicatorsMenu.hide();
+            tryCompare(indicatorsMenu.hideAnimation, "running", false);
+            compare(indicatorsMenu.state, "initial");
+
+            indicatorsMenu.verticalVelocityThreshold = 0.5
+        }
+
+        function get_indicator_item(index) {
+            var indicatorItem = findChild(indicatorsMenu, indicatorsModel.originalModelData[index]["identifier"] + "-panelItem");
+            verify(indicatorItem !== null);
+
+            return indicatorItem;
+        }
+
+        // Showing the indicators should fully open the indicator panel.
+        function test_showAndHide() {
+            indicatorsMenu.show();
+            tryCompare(indicatorsMenu, "fullyOpened", true);
+
+            indicatorsMenu.hide();
+            tryCompare(indicatorsMenu, "fullyClosed", true);
+        }
+
+        // Test that closing the indicators ends up in the correct position.
+        function test_hideEndsInCorrectPosition() {
+            var indicatorsBar = findChild(indicatorsMenu, "indicatorsBar");
+            var flickable = findChild(indicatorsBar, "flickable");
+
+            var originalContentX = flickable.contentX;
+
+            indicatorsMenu.show();
+            indicatorsBar.setCurrentItemIndex(0);
+            tryCompare(indicatorsMenu, "fullyOpened", true);
+
+            indicatorsMenu.hide();
+            tryCompare(flickable, "contentX", originalContentX);
+        }
+
+        function test_progress_changes_state_to_reveal() {
+            indicatorsMenu.height = indicatorsMenu.openedHeight / 2;
+            compare(indicatorsMenu.state, "reveal", "Indicators should be revealing when partially opened.");
+
+            indicatorsMenu.height = indicatorsMenu.openedHeight;
+            compare(indicatorsMenu.state, "reveal", "Indicators should still be revealing when fully opened.");
+        }
+
+        function test_open_state() {
+            compare(indicatorsMenu.fullyClosed, true, "Indicator should show as fully closed.");
+            compare(indicatorsMenu.partiallyOpened, false, "Indicator should not show as partially opened");
+            compare(indicatorsMenu.fullyOpened, false, "Indicator should not show as fully opened");
+
+            indicatorsMenu.height = indicatorsMenu.openedHeight / 2
+            compare(indicatorsMenu.fullyClosed, false, "Indicator should not show as fully closed.");
+            compare(indicatorsMenu.partiallyOpened, true, "Indicator should show as partially opened");
+            compare(indicatorsMenu.fullyOpened, false, "Indicator should not show as fully opened");
+
+            indicatorsMenu.height = indicatorsMenu.openedHeight;
+            compare(indicatorsMenu.fullyClosed, false, "Indicator should not show as fully closed.");
+            compare(indicatorsMenu.partiallyOpened, false, "Indicator should show as partially opened");
+            compare(indicatorsMenu.fullyOpened, true, "Indicator should not show as fully opened");
+        }
+
+        // Pressing on the indicator panel should activate the indicator hints
+        // and expose the header
+        function test_hint() {
+            var indicatorItem = get_indicator_item(0);
+            var mappedPosition = root.mapFromItem(indicatorItem, indicatorItem.width/2, indicatorItem.height/2);
+
+            touchPress(indicatorsMenu, mappedPosition.x, indicatorsMenu.minimizedPanelHeight / 2);
+
+            // hint animation should be run, meaning that indicators will move downwards
+            // by hintValue pixels without any drag taking place
+            tryCompareFunction(function() { return indicatorsMenu.height }, indicatorsMenu.expandedPanelHeight + units.gu(2));
+            tryCompare(indicatorsMenu, "partiallyOpened", true);
+
+            touchRelease(indicatorsMenu, mappedPosition.x, indicatorsMenu.minimizedPanelHeight / 2);
+        }
+
+        // tests swiping on an indicator item activates the correct item.
+        function test_swipeForCurrentItem()
+        {
+            var indicatorItemRow = findChild(indicatorsMenu, "indicatorItemRow");
+            verify(indicatorItemRow !== null);
+
+            for (var i = 0; i < indicatorsModel.originalModelData.length; i++) {
+                var indicatorItem = get_indicator_item(i);
+
+                var mappedPosition = root.mapFromItem(indicatorItem, indicatorItem.width/2, indicatorItem.height/2);
+
+                touchFlick(indicatorsMenu,
+                           mappedPosition.x, mappedPosition.y,
+                           mappedPosition.x, indicatorsMenu.openedHeight / 2,
+                           true /* beginTouch */, false /* endTouch */);
+
+                compare(indicatorItemRow.currentItem, indicatorItem,
+                        "Incorrect item activated at position " + i);
+
+                touchFlick(indicatorItemRow,
+                           mappedPosition.x, indicatorsMenu.openedHeight / 2,
+                           mappedPosition.x, mappedPosition.y,
+                           false /* beginTouch */, true /* endTouch */);
+
+                // wait until fully closed
+                tryCompare(indicatorsMenu, "fullyClosed", true);
+            }
+        }
+
+        // Test the vertical velocity check when flicking the indicators open at an angle.
+        // If the vertical velocity is above a specific point, we shouldnt change active indicators
+        // if the x position changes
+        function test_verticalVelocityDetector() {
+            indicatorsMenu.verticalVelocityThreshold = 0;
+            verify(indicatorsModel.originalModelData.length >= 2);
+
+            var indicatorItemRow = findChild(indicatorsMenu, "indicatorItemRow");
+            verify(indicatorItemRow !== null);
+
+            // Get the first indicator
+            var firstItem = get_indicator_item(0);
+            var firstItemMappedPosition = root.mapFromItem(firstItem, firstItem.width/2, firstItem.height/2);
+
+            // 1) Drag the mouse down to hint a bit
+            touchFlick(indicatorsMenu,
+                       firstItemMappedPosition.x, indicatorsMenu.minimizedPanelHeight / 2,
+                       firstItemMappedPosition.x, indicatorsMenu.minimizedPanelHeight * 2,
+                       true /* beginTouch */, false /* endTouch */);
+
+            tryCompare(indicatorItemRow, "currentItem", firstItem)
+
+            // next time position will have moved.
+            var nextItem = get_indicator_item(1);
+            var nextItemMappedPosition = root.mapFromItem(nextItem, nextItem.width/2, nextItem.height/2);
+
+            // 1) Flick mouse down to bottom
+            touchFlick(indicatorsMenu,
+                       firstItemMappedPosition.x, indicatorsMenu.minimizedPanelHeight * 2,
+                       nextItemMappedPosition.x, indicatorsMenu.openedHeight / 3,
+                       false /* beginTouch */, false /* endTouch */,
+                       units.gu(50) /* speed */, 5 /* iterations */); // more samples needed for accurate velocity
+
+            compare(indicatorItemRow.currentItem, firstItem, "First indicator should still be the current item");
+            // after waiting in the same spot with touch down, it should update to the next item.
+            tryCompare(indicatorItemRow, "currentItem", nextItem);
+
+            touchRelease(indicatorsMenu, nextItemMappedPosition.x, indicatorsMenu.openedHeight / 3);
+        }
+    }
+}

=== modified file 'tests/qmltests/Panel/tst_MenuContent.qml'
--- tests/qmltests/Panel/tst_MenuContent.qml	2014-10-15 16:33:45 +0000
+++ tests/qmltests/Panel/tst_MenuContent.qml	2014-10-15 16:33:46 +0000
@@ -1,5 +1,5 @@
 /*
- * Copyright 2013 Canonical Ltd.
+ * Copyright 2013-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
@@ -17,12 +17,11 @@
 import QtQuick 2.0
 import QtTest 1.0
 import Unity.Test 0.1 as UT
-import ".."
 import "../../../qml/Panel"
 import Unity.Indicators 0.1 as Indicators
 
-Item {
-    id: shell
+IndicatorTest {
+    id: root
     width: units.gu(40)
     height: units.gu(70)
 
@@ -30,15 +29,9 @@
     Item { id: greeter }
     Item { id: handle }
 
-
-    Indicators.IndicatorsModel {
-        id: indicatorsModel
-        Component.onCompleted: load("test1")
-    }
-
     MenuContent {
         id: menuContent
-        indicatorsModel: indicatorsModel
+        indicatorsModel: root.indicatorsModel
         height: parent.height - 50
     }
 
@@ -107,7 +100,7 @@
 
         // Check that the correct menus are displayed for the requested item.
         function test_show_menu() {
-            var menuCount = indicatorsModel.count;
+            var menuCount = root.indicatorsModel.count;
             verify(menuCount > 0, "Menu count should be greater than zero");
 
             var listView = menu_content_test.findChild(menuContent, "indicatorsContentListView")
@@ -126,14 +119,13 @@
 
         // Tests QTBUG-30632 - asynchronous loader crashes when changing index quickly.
         function test_multi_activate() {
-            var menuCount = indicatorsModel.count;
+            var menuCount = root.indicatorsModel.count;
             verify(menuCount > 0, "Menu count should be greater than zero");
 
             for (var i = 0; i < 100; i++) {
                 activate_content(i % menuCount);
                 compare(menuContent.currentMenuIndex, i%menuCount);
             }
-            wait(100);
         }
     }
 }

=== added file 'tests/qmltests/Panel/tst_Panel.qml'
--- tests/qmltests/Panel/tst_Panel.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Panel/tst_Panel.qml	2014-10-15 16:33:46 +0000
@@ -0,0 +1,297 @@
+/*
+ * Copyright 2013-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.1
+import QtQuick.Layouts 1.1
+import QtTest 1.0
+import Unity.Test 0.1 as UT
+import Ubuntu.Components 0.1
+import Unity.Indicators 0.1 as Indicators
+import Ubuntu.Telephony 0.1 as Telephony
+import "../../../qml/Panel"
+
+IndicatorTest {
+    id: root
+    width: units.gu(100)
+    height: units.gu(71)
+    color: "white"
+
+    property string indicatorProfile: "phone"
+
+    RowLayout {
+        anchors.fill: parent
+        anchors.margins: units.gu(1)
+        clip: true
+
+        Rectangle {
+            Layout.fillWidth: true
+            Layout.fillHeight: true
+
+            id: itemArea
+            color: "blue"
+
+            Panel {
+                id: panel
+                anchors.fill: parent
+                indicators {
+                    width: parent.width > units.gu(60) ? units.gu(40) : parent.width
+                    indicatorsModel: root.indicatorsModel
+                }
+
+                property real panelAndSeparatorHeight: panel.indicators.minimizedPanelHeight + units.dp(2)
+            }
+        }
+
+        ColumnLayout {
+            Layout.alignment: Qt.AlignTop
+            Layout.fillWidth: false
+
+            Button {
+                Layout.fillWidth: true
+                text: panel.indicators.shown ? "Hide" : "Show"
+                onClicked: {
+                    if (panel.indicators.shown) {
+                        panel.indicators.hide();
+                    } else {
+                        panel.indicators.show();
+                    }
+                }
+            }
+
+            Button {
+                text: panel.fullscreenMode ? "Maximize" : "FullScreen"
+                Layout.fillWidth: true
+                onClicked: panel.fullscreenMode = !panel.fullscreenMode
+            }
+
+            Button {
+                Layout.fillWidth: true
+                text: callManager.hasCalls ? "Called" : "No Calls"
+                onClicked: {
+                    if (callManager.foregroundCall) {
+                        callManager.foregroundCall = null;
+                    } else {
+                        callManager.foregroundCall = phoneCall;
+                    }
+                }
+            }
+
+            Rectangle {
+                Layout.preferredHeight: units.dp(1);
+                Layout.fillWidth: true;
+                color: "black"
+            }
+
+            Repeater {
+                model: indicatorsModel.originalModelData
+                RowLayout {
+                    CheckBox {
+                        checked: true
+                        onCheckedChanged: checked ? insertIndicator(index) : removeIndicator(index);
+                    }
+                    Label { text: modelData["identifier"] }
+                }
+            }
+        }
+    }
+
+    Telephony.CallEntry {
+        id: phoneCall
+        phoneNumber: "[phone]"
+    }
+
+    UT.UnityTestCase {
+        name: "Panel"
+        when: windowShown
+
+        function init() {
+            panel.fullscreenMode = false;
+            callManager.foregroundCall = null;
+
+            panel.indicators.hide();
+            // Wait for animation to complete
+            tryCompare(panel.indicators.hideAnimation, "running", false);
+
+            // Wait for the indicators to get into position.
+            // (switches between normal and fullscreen modes are animated)
+            var indicatorArea = findChild(panel, "indicatorArea");
+            tryCompare(indicatorArea, "y", 0);
+        }
+
+        function get_indicator_item(index) {
+            var indicatorItem = findChild(panel, indicatorsModel.originalModelData[index]["identifier"]+"-panelItem");
+            verify(indicatorItem !== null);
+
+            return indicatorItem;
+        }
+
+        function test_drag_show_data() {
+            return [
+                { tag: "pinned", fullscreen: false, call: null,
+                            indicatorY: 0 },
+                { tag: "fullscreen", fullscreen: true, call: null,
+                            indicatorY: -panel.panelAndSeparatorHeight },
+                { tag: "pinned-callActive", fullscreen: false, call: phoneCall,
+                            indicatorY: 0},
+                { tag: "fullscreen-callActive", fullscreen: true, call: phoneCall,
+                            indicatorY: -panel.panelAndSeparatorHeight }
+            ];
+        }
+
+        // Dragging from a indicator item in the panel will gradually expose the
+        // indicators, first by running the hint animation, then after dragging down will
+        // expose more of the panel, binding it to the selected indicator and opening it's menu.
+        // Tested from first Y pixel to check for swipe from offscreen.
+        function test_drag_show(data) {
+            panel.fullscreenMode = data.fullscreen;
+            callManager.foregroundCall = data.call;
+
+            var indicatorRow = findChild(panel.indicators, "indicatorItemRow");
+            verify(indicatorRow !== null);
+
+            var menuContent = findChild(panel.indicators, "menuContent");
+            verify(menuContent !== null);
+
+            var indicatorArea = findChild(panel, "indicatorArea");
+            verify(indicatorArea !== null);
+
+            // Wait for the indicators to get into position.
+            // (switches between normal and fullscreen modes are animated)
+            tryCompareFunction(function() { return indicatorArea.y }, data.indicatorY);
+
+            for (var i = 0; i < indicatorsModel.originalModelData.length; i++) {
+                var indicatorItem = get_indicator_item(i);
+
+                var startXPosition = root.mapFromItem(indicatorItem, indicatorItem.width / 2, 0).x;
+                var startYPosition = root.mapFromItem(panel, 0, 0).y;
+
+                touchFlick(panel,
+                           startXPosition, startYPosition,
+                           startXPosition, panel.height,
+                           true /* beginTouch */, false /* endTouch */, units.gu(5), 15);
+
+                // Indicators height should follow the drag, and therefore increase accordingly.
+                // They should be at least half-way through the screen
+                tryCompareFunction(
+                    function() {return panel.indicators.height >= panel.height * 0.5},
+                    true);
+
+                touchRelease(panel, startXPosition, panel.height);
+
+                compare(indicatorRow.currentItemIndex, i,  "Indicator item should be activated at position " + i);
+                compare(menuContent.currentMenuIndex, i, "Menu conetent should be activated for item at position " + i);
+
+                // init for next indicatorItem
+                panel.indicators.hide();
+                tryCompare(panel.indicators.hideAnimation, "running", false);
+                tryCompare(panel.indicators, "state", "initial");
+            }
+        }
+
+        function test_drag_hide_data() {
+            return [
+                { tag: "pinned", fullscreen: false, call: null,
+                            indicatorY: 0 },
+                { tag: "fullscreen", fullscreen: true, call: null,
+                            indicatorY: -panel.panelAndSeparatorHeight },
+                { tag: "pinned-callActive", fullscreen: false, call: phoneCall,
+                            indicatorY: 0},
+                { tag: "fullscreen-callActive", fullscreen: true, call: phoneCall,
+                            indicatorY: -panel.panelAndSeparatorHeight }
+            ];
+        }
+
+        // Dragging the shown indicators up from bottom of panel will hide the indicators
+        // Tested from last Y pixel to check for swipe from offscreen.
+        function test_drag_hide(data) {
+            panel.fullscreenMode = data.fullscreen;
+            callManager.foregroundCall = data.call;
+
+            var indicatorRow = findChild(panel.indicators, "indicatorItemRow");
+            verify(indicatorRow !== null);
+
+            var menuContent = findChild(panel.indicators, "menuContent");
+            verify(menuContent !== null);
+
+            var indicatorArea = findChild(panel, "indicatorArea");
+            verify(indicatorArea !== null);
+
+            // Wait for the indicators to get into position.
+            // (switches between normal and fullscreen modes are animated)
+            tryCompareFunction(function() { return indicatorArea.y }, data.indicatorY);
+
+            var startXPosition = root.mapFromItem(panel.indicators, panel.indicators.width / 2, 0).x;
+            var startYPosition = root.mapFromItem(panel, 0, panel.height).y;
+
+            panel.indicators.show();
+            tryCompare(panel.indicators.showAnimation, "running", false);
+            tryCompare(panel.indicators, "unitProgress", 1);
+
+
+            touchFlick(panel.indicators,
+                       startXPosition, startYPosition,
+                       startXPosition, 0,
+                       true /* beginTouch */, false /* endTouch */, units.gu(5), 15);
+
+            // Indicators height should follow the drag, and therefore increase accordingly.
+            // They should be at least half-way through the screen
+            tryCompareFunction(
+                function() {return panel.indicators.height <= panel.height * 0.5},
+                true);
+
+            touchRelease(panel.indicators, startXPosition, 0);
+
+            tryCompare(panel.indicators.hideAnimation, "running", true);
+            tryCompare(panel.indicators.hideAnimation, "running", false);
+            tryCompare(panel.indicators, "state", "initial");
+        }
+
+        function test_hint_data() {
+            return [
+                { tag: "normal", fullscreen: false, call: null, hintExpected: true},
+                { tag: "fullscreen", fullscreen: true, call: null, hintExpected: false},
+                { tag: "call hint", fullscreen: false, call: phoneCall, hintExpected: false},
+            ];
+        }
+
+        function test_hint(data) {
+            panel.fullscreenMode = data.fullscreen;
+            callManager.foregroundCall = data.call;
+
+            if (data.fullscreen) {
+                // Wait for the indicators to get into position.
+                // (switches between normal and fullscreen modes are animated)
+                var indicatorArea = findChild(panel, "indicatorArea");
+                tryCompare(indicatorArea, "y", -panel.panelHeight);
+            }
+
+            var indicatorItem = get_indicator_item(0);
+            var mappedPosition = root.mapFromItem(indicatorItem, indicatorItem.width / 2, indicatorItem.height / 2);
+
+            touchPress(panel, mappedPosition.x, panel.indicators.minimizedPanelHeight / 2);
+
+            // Give some time for a hint animation to change things, if any
+            wait(500);
+
+            // no hint animation when fullscreen
+            compare(panel.indicators.fullyClosed, !data.hintExpected, "Indicator should be fully closed");
+            compare(panel.indicators.partiallyOpened, data.hintExpected, "Indicator should be partialy opened");
+            compare(panel.indicators.fullyOpened, false, "Indicator should not be fully opened");
+
+            touchRelease(panel, mappedPosition.x, panel.minimizedPanelHeight / 2);
+        }
+    }
+}

=== removed file 'tests/qmltests/Panel/tst_Panel.qml'
--- tests/qmltests/Panel/tst_Panel.qml	2014-07-10 13:36:41 +0000
+++ tests/qmltests/Panel/tst_Panel.qml	1970-01-01 00:00:00 +0000
@@ -1,337 +0,0 @@
-/*
- * Copyright 2013 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.0
-import QtTest 1.0
-import Unity.Test 0.1 as UT
-import Ubuntu.Components 0.1 as UC
-import Ubuntu.Telephony 0.1 as Telephony
-import ".."
-import "../../../qml/Panel"
-
-/*
-  This tests the Panel component using a fake model to stage data in the indicators
-  A view will show with indicators at the top, as does in the shell. This can be controlled
-  as in the shell.
-*/
-Item {
-    id: shell
-    width: units.gu(40)
-    height: units.gu(80)
-
-    Panel {
-        id: panel
-        anchors {
-            left: parent.left
-            right: parent.right
-        }
-        height: parent.height - row.height
-        fullscreenMode: false
-
-        indicators {
-            profile: "test1"
-            panelHeight: units.gu(5)
-        }
-        callHint {
-            height: units.gu(4)
-        }
-
-        property real panelAndSeparatorHeight: panel.indicators.panelHeight + units.dp(2)
-    }
-
-
-    Row {
-        id: row
-        anchors {
-            bottom: shell.bottom
-            left: parent.left
-            right: parent.right
-        }
-        height: 50
-
-        UC.Button {
-            text: panel.indicators.shown ? "Hide" : "Show"
-            anchors {
-                top: parent.top
-                bottom: parent.bottom
-            }
-            width: parent.width/3
-
-            onClicked: {
-                if (panel.indicators.shown) {
-                    panel.indicators.hide();
-                } else {
-                    panel.indicators.show();
-                }
-            }
-        }
-
-        UC.Button {
-            text: panel.fullscreenMode ? "Maximize" : "FullScreen"
-            anchors {
-                top: parent.top
-                bottom: parent.bottom
-            }
-            width: parent.width/3
-
-            onClicked: panel.fullscreenMode = !panel.fullscreenMode
-        }
-
-        UC.Button {
-            text: callManager.hasCalls ? "Called" : "No Calls"
-            anchors {
-                top: parent.top
-                bottom: parent.bottom
-            }
-            width: parent.width/3
-
-            onClicked: {
-                if (callManager.foregroundCall) {
-                    callManager.foregroundCall = null;
-                } else {
-                    callManager.foregroundCall = phoneCall;
-                }
-            }
-        }
-    }
-
-    Telephony.CallEntry {
-        id: phoneCall
-        phoneNumber: "[phone]"
-    }
-
-    UT.UnityTestCase {
-        name: "Panel"
-        when: windowShown
-
-        function init() {
-            panel.indicators.initialise();
-            panel.fullscreenMode = false;
-
-            panel.indicators.hide();
-            // Wait for animation to complete
-            tryCompare(panel.indicators.hideAnimation, "running", false);
-            callManager.foregroundCall = null;
-
-            // Wait for the indicators to get into position.
-            // (switches between normal and fullscreen modes are animated)
-            var indicatorArea = findChild(panel, "indicatorArea");
-            tryCompare(indicatorArea, "y", 0);
-        }
-
-        function get_indicator_item(index) {
-            var indicatorRow = findChild(panel.indicators, "indicatorRow");
-            verify(indicatorRow !== null);
-
-            return findChild(indicatorRow.row, "item" + index);
-        }
-
-        function get_indicator_item_position(index) {
-            var indicatorRow = findChild(panel.indicators, "indicatorRow");
-            verify(indicatorRow !== null);
-
-            var indicatorItem = get_indicator_item(index);
-            verify(indicatorItem !== null);
-
-            return panel.mapFromItem(indicatorItem, indicatorItem.width/2, indicatorItem.height/2);
-        }
-
-        // Pressing on the indicator panel should activate the indicator hints
-        // and expose a portion of the conent.
-        function test_hint() {
-            var indicatorItemCoord = get_indicator_item_position(0);
-
-            touchPress(panel, indicatorItemCoord.x, panel.indicators.panelHeight / 2);
-
-            // hint animation should be run, meaning that indicators will move downwards
-            // by hintValue pixels without any drag taking place
-            tryCompareFunction(function() { return panel.indicators.height },
-                                panel.indicators.panelHeight + panel.indicators.hintValue);
-            tryCompare(panel.indicators, "partiallyOpened", true);
-            tryCompare(panel.indicators, "fullyOpened", false);
-
-            touchRelease(panel, indicatorItemCoord.x, panel.indicators.panelHeight/2);
-        }
-
-        // Pressing on the top edge of the screen should have no effect if the panel
-        // is hidden (fullscreen), which is the case when a fullscreen app is being shown
-        function test_noHintOnFullscreenMode() {
-            panel.fullscreenMode = true;
-            // Wait for the indicators to get into position.
-            // (switches between normal and fullscreen modes are animated)
-            var indicatorArea = findChild(panel, "indicatorArea");
-            tryCompare(indicatorArea, "y", -panel.panelHeight);
-
-            var indicatorItemCoord = get_indicator_item_position(0);
-
-            touchPress(panel, indicatorItemCoord.x, panel.indicators.panelHeight / 2);
-
-            // Give some time for a hint animation to change things, if any
-            wait(500);
-
-            // no hint animation when fullscreen
-            compare(panel.indicators.partiallyOpened, false,
-                    "Indicator should not be partially opened when panel is pressed in" +
-                    " fullscreenmode");
-            compare(panel.indicators.fullyOpened, false, "Indicator should not be partially" +
-                   " opened when panel is pressed in fullscreenmode");
-
-            touchRelease(panel, indicatorItemCoord.x, panel.panelHeight/2);
-        }
-
-        // Pressing on the top edge of the indicator should have no effect if the panel
-        // has an active call
-        function test_noHintOnActiveCall() {
-            callManager.foregroundCall = phoneCall;
-
-            var indicatorItemCoord = get_indicator_item_position(0);
-
-            touchPress(panel, indicatorItemCoord.x, panel.callHint.height + panel.indicators.panelHeight / 2);
-
-            // Give some time for a hint animation to change things, if any
-            wait(500);
-
-            // no hint animation when fullscreen
-            compare(panel.indicators.partiallyOpened, false,
-                    "Indicator should not be partially opened when panel is pressed in" +
-                    " fullscreenmode");
-            compare(panel.indicators.fullyOpened, false, "Indicator should not be partially" +
-                   " opened when panel is pressed in fullscreenmode");
-
-            touchRelease(panel, indicatorItemCoord.x, panel.panelHeight/2);
-        }
-
-        function test_drag_show_data() {
-            return [
-                { tag: "pinned", fullscreenFlag: false, alreadyOpen: false, call: null,
-                            indicatorY: 0 },
-                { tag: "fullscreen", fullscreenFlag: true, alreadyOpen: false, call: null,
-                            indicatorY: -panel.panelAndSeparatorHeight },
-                { tag: "pinned-alreadyOpen", fullscreenFlag: false, alreadyOpen: true, call: null,
-                            indicatorY: 0 },
-                { tag: "fullscreen-alreadyOpen", fullscreenFlag: true, alreadyOpen: true, call: null,
-                            indicatorY: 0 },
-                { tag: "pinned-callActive", fullscreenFlag: false, alreadyOpen: false, call: phoneCall,
-                            indicatorY: 0},
-                { tag: "fullscreen-callActive", fullscreenFlag: true, alreadyOpen: false, call: phoneCall,
-                            indicatorY: -panel.panelAndSeparatorHeight }
-            ];
-        }
-
-        // Dragging from a indicator item in the panel will gradually expose the
-        // indicators, first by running the hint animation, then after dragging down will
-        // expose more of the panel, binding it to the selected indicator and opening it's menu.
-        function test_drag_show(data) {
-            panel.fullscreenMode = data.fullscreenFlag;
-            callManager.foregroundCall = data.call;
-
-            if (data.alreadyOpen) {
-                panel.indicators.show();
-                tryCompare(panel.indicators, "fullyOpened", true);
-            }
-
-            var indicatorRow = findChild(panel.indicators, "indicatorRow");
-            verify(indicatorRow !== null);
-
-            var menuContent = findChild(panel.indicators, "menuContent");
-            verify(menuContent !== null);
-
-            var indicatorArea = findChild(panel, "indicatorArea");
-            verify(indicatorArea !== null);
-
-            // Wait for the indicators to get into position.
-            // (switches between normal and fullscreen modes are animated)
-            tryCompareFunction(function() { return indicatorArea.y }, data.indicatorY);
-
-            // do this for each indicator item
-            for (var i = 0; i < indicatorRow.row.count; i++) {
-
-                var indicatorItem = get_indicator_item(i);
-                verify(indicatorItem !== null);
-
-                if (!indicatorItem.visible)
-                    continue;
-
-                var indicatorItemCoord = get_indicator_item_position(i);
-
-                touchPress(panel,
-                           indicatorItemCoord.x, panel.indicators.panelHeight / 2);
-
-                // 1) Drag the mouse down
-                touchFlick(panel,
-                           indicatorItemCoord.x, panel.indicators.panelHeight / 2,
-                           indicatorItemCoord.x, panel.height,
-                           false /* beginTouch */, false /* endTouch */);
-
-                // Indicators height should follow the drag, and therefore increase accordingly.
-                // They should be at least half-way through the screen
-                tryCompareFunction(
-                    function() {return panel.indicators.height >= panel.height * 0.5},
-                    true);
-
-                touchRelease(panel, indicatorItemCoord.x, panel.height);
-
-                compare(indicatorRow.currentItem, indicatorItem,
-                        "Incorrect item activated at position " + i);
-                compare(menuContent.currentMenuIndex, i, "Menu conetent should be enabled for item at position " + i);
-
-                // init for next indicatorItem
-                if (!data.alreadyOpen) {
-                    panel.indicators.hide();
-                    tryCompare(panel.indicators.hideAnimation, "running", false);
-                    tryCompare(panel.indicators, "state", "initial");
-                }
-            }
-        }
-
-        // Test the vertical velocity check when flicking the indicators open at an angle.
-        // If the vertical velocity is above a specific point, we shouldnt change active indicators
-        // if the x position changes
-        function test_vertical_velocity_detector() {
-            panel.fullscreenMode = false;
-
-            var indicatorRow = findChild(panel.indicators, "indicatorRow");
-            verify(indicatorRow !== null);
-
-            // Get the first indicator
-            var indicatorItemFirst = get_indicator_item(0);
-            verify(indicatorItemFirst !== null);
-
-            var indicatorItemCoordFirst = get_indicator_item_position(0);