Merge lp:~saviq/unity8/dash-header-style into lp:unity8

[Michał Sawicz]

Add dash PageHeader styling.

 * 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?
Yes.

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

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

 * If you changed the UI, has there been a design review?
N/A

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1063
http://jenkins.qa.ubuntu.com/job/unity8-ci/3493/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/2223
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-utopic/495
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-amd64-ci/587
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-armhf-ci/587
        deb: http://jenkins.qa.ubuntu.com/job/unity8-utopic-armhf-ci/587/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-i386-ci/587
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-mako/2433
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/3404
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/3404/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/10124

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

review: Needs Fixing (continuous-integration)

[lp:~saviq/unity8/dash-header-style]

1064. By Michał Sawicz on 2014-07-21

More background tests.

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1064
http://jenkins.qa.ubuntu.com/job/unity8-ci/3495/
Executed test runs:
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/2228
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-utopic/497
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-amd64-ci/589
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-armhf-ci/589
        deb: http://jenkins.qa.ubuntu.com/job/unity8-utopic-armhf-ci/589/artifact/work/output/*zip*/output.zip
    SUCCESS: http://jenkins.qa.ubuntu.com/job/unity8-utopic-i386-ci/589
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-runner-mako/2436
    SUCCESS: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/3410
        deb: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/3410/artifact/work/output/*zip*/output.zip
    SUCCESS: http://s-jenkins.ubuntu-ci:8080/job/touch-flash-device/10129

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

review: Needs Fixing (continuous-integration)

[Albert Astals Cid (aacid)]

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

 * Did CI run pass? If not, please explain why.
No, but the failing tests are known to fail/be unstable so that's fine.

review: Approve

[lp:~saviq/unity8/dash-header-style]

1065. By Michał Sawicz on 2014-07-21

Merge trunk.

1066. By Michał Sawicz on 2014-07-21

Merge drop-filtergrid

[PS Jenkins bot (ps-jenkins)]

FAILED: Continuous integration, rev:1064
http://jenkins.qa.ubuntu.com/job/unity8-ci/3521/
Executed test runs:
    FAILURE: http://jenkins.qa.ubuntu.com/job/generic-deb-autopilot-utopic-touch/2278/console
    UNSTABLE: http://jenkins.qa.ubuntu.com/job/unity-phablet-qmluitests-utopic/522
    FAILURE: http://jenkins.qa.ubuntu.com/job/unity8-utopic-amd64-ci/615/console
    FAILURE: http://jenkins.qa.ubuntu.com/job/unity8-utopic-armhf-ci/615/console
    FAILURE: http://jenkins.qa.ubuntu.com/job/unity8-utopic-i386-ci/615/console
    FAILURE: http://jenkins.qa.ubuntu.com/job/generic-mediumtests-builder-utopic-armhf/3472/console

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

review: Needs Fixing (continuous-integration)

Unmerged revisions

=== renamed file 'tests/autopilot/.project' => '.project'
--- tests/autopilot/.project	2013-11-18 12:05:58 +0000
+++ .project	2014-07-21 23:38:21 +0000
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <projectDescription>
-	<name>Unity8 Autopilot</name>
+	<name>Unity8</name>
 	<comment></comment>
 	<projects>
 	</projects>

=== renamed file 'tests/autopilot/.pydevproject' => '.pydevproject'
--- tests/autopilot/.pydevproject	2013-11-18 12:05:58 +0000
+++ .pydevproject	2014-07-21 23:38:21 +0000
@@ -1,7 +1,9 @@
 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <?eclipse-pydev version="1.0"?><pydev_project>
 <pydev_pathproperty name="org.python.pydev.PROJECT_SOURCE_PATH">
-<path>/Unity8 Autopilot</path>
+<path>/Unity8/tests/autopilot</path>
+<path>/Unity8/.bazaar</path>
+<path>/Unity8/tests/whitespace</path>
 </pydev_pathproperty>
 <pydev_property name="org.python.pydev.PYTHON_PROJECT_VERSION">python 2.7</pydev_property>
 <pydev_property name="org.python.pydev.PYTHON_PROJECT_INTERPRETER">Default</pydev_property>

=== added directory '.settings'
=== added file '.settings/Autopilot List.launch'
--- .settings/Autopilot List.launch	1970-01-01 00:00:00 +0000
+++ .settings/Autopilot List.launch	2014-07-21 23:38:21 +0000
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<launchConfiguration type="org.python.pydev.debug.regularLaunchConfigurationType">
+<stringAttribute key="bad_container_name" value="/Unity8/.pyd"/>
+<listAttribute key="org.eclipse.debug.core.MAPPED_RESOURCE_PATHS"/>
+<listAttribute key="org.eclipse.debug.core.MAPPED_RESOURCE_TYPES"/>
+<listAttribute key="org.eclipse.debug.ui.favoriteGroups">
+<listEntry value="org.eclipse.debug.ui.launchGroup.run"/>
+</listAttribute>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_LOCATION" value="/usr/bin/autopilot"/>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_OTHER_WORKING_DIRECTORY" value=""/>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_TOOL_ARGUMENTS" value="list unity8"/>
+<stringAttribute key="org.python.pydev.debug.ATTR_INTERPRETER" value="__default"/>
+<stringAttribute key="org.python.pydev.debug.ATTR_PROJECT" value="Unity8"/>
+</launchConfiguration>

=== added file '.settings/Autopilot Run.launch'
--- .settings/Autopilot Run.launch	1970-01-01 00:00:00 +0000
+++ .settings/Autopilot Run.launch	2014-07-21 23:38:21 +0000
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<launchConfiguration type="org.python.pydev.debug.regularLaunchConfigurationType">
+<listAttribute key="org.eclipse.debug.core.MAPPED_RESOURCE_PATHS"/>
+<listAttribute key="org.eclipse.debug.core.MAPPED_RESOURCE_TYPES"/>
+<listAttribute key="org.eclipse.debug.ui.favoriteGroups">
+<listEntry value="org.eclipse.debug.ui.launchGroup.debug"/>
+<listEntry value="org.eclipse.debug.ui.launchGroup.run"/>
+</listAttribute>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_LOCATION" value="/usr/bin/autopilot"/>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_OTHER_WORKING_DIRECTORY" value=""/>
+<stringAttribute key="org.eclipse.ui.externaltools.ATTR_TOOL_ARGUMENTS" value="run ${string_prompt:the test suite to run:unity8}"/>
+<stringAttribute key="org.python.pydev.debug.ATTR_INTERPRETER" value="__default"/>
+<stringAttribute key="org.python.pydev.debug.ATTR_PROJECT" value="Unity8"/>
+</launchConfiguration>

=== modified file 'plugins/Dash/ScopeStyle.qml'
--- plugins/Dash/ScopeStyle.qml	2014-07-08 08:30:46 +0000
+++ plugins/Dash/ScopeStyle.qml	2014-07-21 23:38:21 +0000
@@ -70,6 +70,12 @@
     /// Source of the logo image for the header
     readonly property url headerLogo: "logo" in d.headerStyle ? d.headerStyle["logo"] : ""
 
+    /// Background style for the header
+    readonly property url headerBackground: "background" in d.headerStyle ? d.headerStyle["background"] : ""
+
+    /// Foreground color for the header
+    readonly property color headerForeground: "foreground-color" in d.headerStyle ? d.headerStyle["foreground-color"] : foreground
+
     //! @cond
     property var d: QtObject {
         readonly property real foregroundLuminance: luminance(foreground)

=== added file 'qml/Components/Background.qml'
--- qml/Components/Background.qml	1970-01-01 00:00:00 +0000
+++ qml/Components/Background.qml	2014-07-21 23:38:21 +0000
@@ -0,0 +1,77 @@
+/*
+ * 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.0
+
+Loader {
+    id: root
+    anchors.fill: parent
+
+    property url style
+    readonly property var parsedStyle: String(style)
+        .match(/^(color|gradient):\/\/\/(?:(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))(?:\/(#(?:[0-9a-f]{3,4}){1,2}|[a-z]{3,}))?\/?$/i)
+
+    sourceComponent: {
+        if (style == "") return null;
+        if (!parsedStyle) return image;
+        if (parsedStyle[1] === "color") return solid
+        if (parsedStyle[1] === "gradient") return gradient
+    }
+
+    onLoaded: if (item.hasOwnProperty("parsedStyle")) {
+        item.parsedStyle = Qt.binding(function() { return root.parsedStyle } );
+    }
+
+    Component {
+        id: solid
+
+        Rectangle {
+            objectName: "solid"
+
+            property var parsedStyle
+
+            color: parsedStyle ? parsedStyle[2] : "#ffffff"
+        }
+    }
+
+    Component {
+        id: gradient
+
+        Rectangle {
+            objectName: "gradient"
+
+            property var parsedStyle
+
+            gradient: Gradient {
+                GradientStop { position: 0; color: parsedStyle ? parsedStyle[2] : "#000000" }
+                GradientStop { position: 1; color: parsedStyle ? parsedStyle[3] : "#000000" }
+            }
+        }
+    }
+
+    Component {
+        id: image
+
+        Image {
+            objectName: "image"
+
+            source: width > 0 && height > 0 && root.style
+
+            sourceSize.width: width
+            sourceSize.height: height
+        }
+    }
+}

=== removed file 'qml/Components/FilterGrid.qml'
--- qml/Components/FilterGrid.qml	2014-05-23 13:52:36 +0000
+++ qml/Components/FilterGrid.qml	1970-01-01 00:00:00 +0000
@@ -1,124 +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 Utils 0.1
-import "../Components"
-
-/*
-    A ResponsiveGridView that can optionally have the number of rows being displayed
-    reduced to collapsedRowCount, in which case a button saying "View all (123)"
-    will be shown at the bottom. If clicked, FilterGrid will them expand vertically
-    to display all rows.
- */
-Item {
-    id: root
-
-    /* Whether, when collapsed, a button should be displayed enabling the user to expand
-       the grid to its full size. */
-    readonly property bool expandable: model.count > rowsWhenCollapsed * iconTileGrid.columns
-
-    property var model: null
-
-    /* Maximum number of rows to be show when filter=true. */
-    property int collapsedRowCount: 2
-    property int uncollapsedRowCount: Math.ceil(model.count / columns)
-    /* Never show more rows than model would fill up. */
-    readonly property int rowsWhenCollapsed: Math.min(collapsedRowCount, uncollapsedRowCount)
-    readonly property int collapsedHeight: iconTileGrid.contentHeightForRows(rowsWhenCollapsed)
-    readonly property int uncollapsedHeight: iconTileGrid.contentHeightForRows(uncollapsedRowCount)
-
-    property alias minimumHorizontalSpacing: iconTileGrid.minimumHorizontalSpacing
-    property alias maximumNumberOfColumns: iconTileGrid.maximumNumberOfColumns
-    property alias columns: iconTileGrid.columns
-    property alias delegateWidth: iconTileGrid.delegateWidth
-    property alias delegateHeight: iconTileGrid.delegateHeight
-    property alias verticalSpacing: iconTileGrid.verticalSpacing
-    readonly property alias margins: iconTileGrid.margins
-    property alias delegate: iconTileGrid.delegate
-    property alias cellWidth: iconTileGrid.cellWidth
-    property alias cellHeight: iconTileGrid.cellHeight
-    property alias displayMarginBeginning: iconTileGrid.displayMarginBeginning
-    property alias displayMarginEnd: iconTileGrid.displayMarginEnd
-    readonly property alias originY: iconTileGrid.originY
-    readonly property alias flicking: iconTileGrid.flicking
-    readonly property alias moving: iconTileGrid.moving
-    readonly property alias pressDelay: iconTileGrid.pressDelay
-    property alias highlightIndex: iconTileGrid.highlightIndex
-    readonly property alias currentItem: iconTileGrid.currentItem
-    readonly property alias filtered: d.filter
-
-    QtObject {
-        id: d
-        // We do have filter and collapsed properties because we need to decouple
-        // the real filtering with the animation since the closing animation
-        // i.e. setFilter(false. true) we still need to not be filtering until
-        // the animation finishes otherwise we hide the items when the animation
-        // is still running
-        property bool filter: true
-        property bool collapsed: true
-    }
-
-    height: d.collapsed ? root.collapsedHeight : root.uncollapsedHeight
-    clip: filterAnimation.running
-
-    Behavior on height {
-        id: heightBehaviour
-        enabled: false
-        NumberAnimation {
-            id: filterAnimation
-            // Duration and easing here match the ListViewWithPageHeader::m_contentYAnimation
-            // otherwise since both animations can run at the same time you'll get
-            // some visual weirdness.
-            duration: 200
-            easing.type: Easing.InOutQuad
-            onRunningChanged: {
-                if (!running) {
-                    d.filter = d.collapsed;
-                }
-                heightBehaviour.enabled = false;
-            }
-        }
-    }
-
-    function setFilter(filter, animate) {
-        heightBehaviour.enabled = animate;
-        d.collapsed = filter;
-        if (!animate || !filter) {
-            d.filter = filter;
-        }
-   }
-
-    ResponsiveGridView {
-        id: iconTileGrid
-
-        anchors { left: parent.left; right: parent.right }
-        height: totalContentHeight
-        interactive: false
-
-        minimumHorizontalSpacing: units.gu(0.5)
-        maximumNumberOfColumns: 6
-        delegateWidth: units.gu(11)
-        delegateHeight: units.gu(9.5)
-        verticalSpacing: units.gu(2)
-
-        model: LimitProxyModel {
-            model: root.model
-            limit: d.filter ? rowsWhenCollapsed * iconTileGrid.columns : -1
-        }
-    }
-}

=== modified file 'qml/Components/PageHeader.qml'
--- qml/Components/PageHeader.qml	2014-07-09 19:44:02 +0000
+++ qml/Components/PageHeader.qml	2014-07-21 23:38:21 +0000
@@ -127,6 +127,11 @@
         property bool showSearch: false
         property var popover: null
 
+        Background {
+            objectName: "headerBackground"
+            style: scopeStyle.headerBackground
+        }
+
         Behavior on contentY {
             UbuntuNumberAnimation {
                 id: openSearchAnimation
@@ -225,7 +230,7 @@
                 height: headerContainer.height
                 contentHeight: height
                 separatorSource: ""
-                textColor: root.scopeStyle ? root.scopeStyle.foreground : "grey"
+                textColor: root.scopeStyle ? root.scopeStyle.headerForeground : "grey"
                 property var styledItem: header
                 property string title: root.title
                 property var config: PageHeadConfiguration {

=== modified file 'qml/Components/ResponsiveGridView.qml'
--- qml/Components/ResponsiveGridView.qml	2014-05-15 14:50:23 +0000
+++ qml/Components/ResponsiveGridView.qml	2014-07-21 23:38:21 +0000
@@ -44,10 +44,11 @@
     property alias displayMarginBeginning: gridView.displayMarginBeginning
     property alias displayMarginEnd: gridView.displayMarginEnd
     property alias highlightIndex: gridView.highlightIndex
+    property alias cacheBuffer: gridView.cacheBuffer
     readonly property alias currentItem: gridView.currentItem
 
     function contentHeightForRows(rows) {
-        return rows * cellHeight + verticalSpacing
+        return rows * cellHeight;
     }
 
     GridView {

=== modified file 'qml/Dash/CardCarousel.qml'
--- qml/Dash/CardCarousel.qml	2014-07-09 19:44:02 +0000
+++ qml/Dash/CardCarousel.qml	2014-07-21 23:38:21 +0000
@@ -21,13 +21,8 @@
 DashRenderer {
     id: cardCarousel
 
-    property alias cacheBuffer: carousel.cacheBuffer
-    property alias itemComponent: carousel.itemComponent
-    property alias minimumTileWidth: carousel.minimumTileWidth
-    property alias selectedItemScaleFactor: carousel.selectedItemScaleFactor
-    property alias tileAspectRatio: carousel.tileAspectRatio
-
-    height: carousel.implicitHeight + units.gu(6)
+    expandedHeight: carousel.implicitHeight + units.gu(6)
+    collapsedHeight: expandedHeight
 
     Carousel {
         id: carousel

=== renamed file 'qml/Dash/CardFilterGrid.qml' => 'qml/Dash/CardGrid.qml'
--- qml/Dash/CardFilterGrid.qml	2014-07-08 08:30:46 +0000
+++ qml/Dash/CardGrid.qml	2014-07-21 23:38:21 +0000
@@ -18,33 +18,32 @@
 import "../Components"
 
 DashRenderer {
-    id: genericFilterGrid
-
-    expandable: filterGrid.expandable
-    collapsedHeight: filterGrid.collapsedHeight
-    uncollapsedHeight: filterGrid.uncollapsedHeight
-    originY: filterGrid.originY
-    height: filterGrid.height
-    filtered: filterGrid.filtered
-
-    function setFilter(filter, animate) {
-        filterGrid.setFilter(filter, animate)
+    id: root
+
+    readonly property int collapsedRows: {
+        if (!cardTool || !cardTool.template || typeof cardTool.template["collapsed-rows"] != "number") return 2;
+        return cardTool.template["collapsed-rows"];
     }
 
-    FilterGrid {
-        id: filterGrid
-        width: genericFilterGrid.width
+    expandedHeight: grid.totalContentHeight
+    collapsedHeight: Math.min(grid.contentHeightForRows(collapsedRows), expandedHeight)
+    originY: grid.originY
+
+    ResponsiveGridView {
+        id: grid
+        anchors.fill: parent
         minimumHorizontalSpacing: units.gu(1)
         delegateWidth: cardTool.cardWidth
         delegateHeight: cardTool.cardHeight
         verticalSpacing: units.gu(1)
-        model: genericFilterGrid.model
-        collapsedRowCount: Math.min(2, cardTool && cardTool.template && cardTool.template["collapsed-rows"] || 2)
-        displayMarginBeginning: genericFilterGrid.displayMarginBeginning
-        displayMarginEnd: genericFilterGrid.displayMarginEnd
+        model: root.model
+        displayMarginBeginning: root.displayMarginBeginning
+        displayMarginEnd: root.displayMarginEnd
+        cacheBuffer: 0
+        interactive: false
         delegate: Item {
-            width: filterGrid.cellWidth
-            height: filterGrid.cellHeight
+            width: grid.cellWidth
+            height: grid.cellHeight
             Loader {
                 id: loader
                 sourceComponent: cardTool.cardComponent
@@ -58,12 +57,12 @@
                     item.template = Qt.binding(function() { return cardTool.template; });
                     item.components = Qt.binding(function() { return cardTool.components; });
                     item.headerAlignment = Qt.binding(function() { return cardTool.headerAlignment; });
-                    item.scopeStyle = genericFilterGrid.scopeStyle;
+                    item.scopeStyle = root.scopeStyle;
                 }
                 Connections {
                     target: loader.item
-                    onClicked: genericFilterGrid.clicked(index, result)
-                    onPressAndHold: genericFilterGrid.pressAndHold(index)
+                    onClicked: root.clicked(index, result)
+                    onPressAndHold: root.pressAndHold(index)
                 }
             }
         }

=== modified file 'qml/Dash/CardVerticalJournal.qml'
--- qml/Dash/CardVerticalJournal.qml	2014-07-09 19:44:02 +0000
+++ qml/Dash/CardVerticalJournal.qml	2014-07-21 23:38:21 +0000
@@ -23,33 +23,14 @@
 
     readonly property double collapseLimit: units.gu(35)
 
-    uncollapsedHeight: cardVerticalJournal.implicitHeight
-    collapsedHeight: Math.min(collapseLimit, cardVerticalJournal.implicitHeight)
-    expandable: uncollapsedHeight > collapseLimit
+    expandedHeight: Math.max(cardVerticalJournal.implicitHeight, minHeight)
+    collapsedHeight: Math.max(Math.min(collapseLimit, cardVerticalJournal.implicitHeight), minHeight)
 
     // This minHeight is used as bootstrapper for the height. Vertical Journal
     // is special by the fact that it doesn't know how to calculate its implicit height unless we give it
     // enough height that it can start creating its children so we make sure it has enough height for that
     // in case the model is non empty
     readonly property double minHeight: root.model.count >= 1 ? cardVerticalJournal.rowSpacing + 1 : 0
-    height: filtered ? Math.max(collapsedHeight, minHeight) : uncollapsedHeight
-
-    Behavior on height {
-        id: heightBehaviour
-        enabled: false
-        animation: UbuntuNumberAnimation {
-            onRunningChanged: {
-                if (!running) {
-                    heightBehaviour.enabled = false
-                }
-            }
-        }
-    }
-
-    function setFilter(filter, animate) {
-        heightBehaviour.enabled = animate;
-        filtered = filter;
-    }
 
     ResponsiveVerticalJournal {
         id: cardVerticalJournal

=== modified file 'qml/Dash/DashRenderer.qml'
--- qml/Dash/DashRenderer.qml	2014-07-08 08:30:46 +0000
+++ qml/Dash/DashRenderer.qml	2014-07-21 23:38:21 +0000
@@ -17,15 +17,9 @@
 import QtQuick 2.0
 
 Item {
-    // Can the item be expanded?
-    property bool expandable: false
-
-    // In case it can be expanded, is it filtered
-    property bool filtered: true
-
-    property int collapsedHeight: height
-
-    property int uncollapsedHeight: height
+    property int collapsedHeight
+
+    property int expandedHeight
 
     property int displayMarginBeginning: 0
 
@@ -50,7 +44,4 @@
     /// Emitted when the user pressed and held on an item
     /// @param index is the index of the held item
     signal pressAndHold(int index)
-
-    function setFilter(filter, animate) {
-    }
 }

=== modified file 'qml/Dash/GenericScopeView.qml'
--- qml/Dash/GenericScopeView.qml	2014-07-17 13:10:45 +0000
+++ qml/Dash/GenericScopeView.qml	2014-07-21 23:38:21 +0000
@@ -128,11 +128,21 @@
             highlightWhenPressed: false
             showDivider: false
 
-            readonly property bool expandable: rendererLoader.item ? rendererLoader.item.expandable : false
-            readonly property bool filtered: rendererLoader.item ? rendererLoader.item.filtered : true
+            readonly property bool expandable: {
+                if (categoryView.model.count === 1) return false;
+                if (cardTool.template && cardTool.template["collapsed-rows"] === 0) return false;
+                if (item && item.expandedHeight > item.collapsedHeight) return true;
+                return false;
+            }
+            property bool expanded: false
             readonly property string category: categoryId
             readonly property var item: rendererLoader.item
 
+            function expand(expand, animate) {
+                heightBehaviour.enabled = animate;
+                expanded = expand;
+            }
+
             CardTool {
                 id: cardTool
                 objectName: "cardTool"
@@ -142,6 +152,18 @@
                 viewWidth: parent.width
             }
 
+            onExpandableChanged: {
+                // This can happen with the VJ that doesn't know how height it will be on creation
+                // so doesn't set expandable until a bit too late for onLoaded
+                if (expandable) {
+                    var shouldExpand = baseItem.category === categoryView.expandedCategoryId;
+                    baseItem.expand(shouldExpand, false /*animate*/);
+                }
+            }
+
+            onHeightChanged: rendererLoader.updateDelegateCreationRange();
+            onYChanged: rendererLoader.updateDelegateCreationRange();
+
             Loader {
                 id: rendererLoader
                 anchors {
@@ -151,13 +173,27 @@
                     topMargin: hasSectionHeader ? 0 : units.gu(2)
                 }
 
+                Behavior on height {
+                    id: heightBehaviour
+                    enabled: false
+                    animation: UbuntuNumberAnimation {
+                        onRunningChanged: {
+                            if (!running) {
+                                heightBehaviour.enabled = false
+                            }
+                        }
+                    }
+                }
+
+                height: baseItem.expandable && !baseItem.expanded ? item.collapsedHeight : item.expandedHeight
+
                 source: {
                     switch (cardTool.categoryLayout) {
                         case "carousel": return "CardCarousel.qml";
                         case "vertical-journal": return "CardVerticalJournal.qml";
                         case "running-apps": return "Apps/RunningApplicationsGrid.qml";
                         case "grid":
-                        default: return "CardFilterGrid.qml";
+                        default: return "CardGrid.qml";
                     }
                 }
 
@@ -176,9 +212,9 @@
                     }
                     item.objectName = Qt.binding(function() { return categoryId })
                     item.scopeStyle = scopeView.scopeStyle;
-                    if (item.expandable) {
-                        var shouldFilter = categoryId != categoryView.expandedCategoryId;
-                        item.setFilter(shouldFilter, false /*animate*/);
+                    if (baseItem.expandable) {
+                        var shouldExpand = categoryId === categoryView.expandedCategoryId;
+                        baseItem.expand(shouldExpand, false /*animate*/);
                     }
                     updateDelegateCreationRange();
                     item.cardTool = cardTool;
@@ -211,14 +247,6 @@
                         previewListView.currentIndex = index;
                         previewListView.open = true
                     }
-                    onExpandableChanged: {
-                        // This can happen with the VJ that doesn't know how height it will be on creation
-                        // so doesn't set expandable until a bit too late for onLoaded
-                        if (rendererLoader.item.expandable) {
-                            var shouldFilter = baseItem.category != categoryView.expandedCategoryId;
-                            rendererLoader.item.setFilter(shouldFilter, false /*animate*/);
-                        }
-                    }
                 }
                 Connections {
                     target: categoryView
@@ -227,17 +255,17 @@
                     }
                     function collapseAllButExpandedCategory() {
                         var item = rendererLoader.item;
-                        if (item.expandable) {
-                            var shouldFilter = categoryId != categoryView.expandedCategoryId;
-                            if (shouldFilter != item.filter) {
+                        if (baseItem.expandable) {
+                            var shouldExpand = categoryId === categoryView.expandedCategoryId;
+                            if (shouldExpand != baseItem.expanded) {
                                 // If the filter animation will be seen start it, otherwise, just flip the switch
-                                var shrinkingVisible = shouldFilter && y + item.collapsedHeight < categoryView.height;
-                                var growingVisible = !shouldFilter && y + height < categoryView.height;
-                                if (!previewListView.open || !shouldFilter) {
+                                var shrinkingVisible = !shouldExpand && y + item.collapsedHeight < categoryView.height;
+                                var growingVisible = shouldExpand && y + height < categoryView.height;
+                                if (!previewListView.open || shouldExpand) {
                                     var animate = shrinkingVisible || growingVisible;
-                                    item.setFilter(shouldFilter, animate)
-                                    if (!shouldFilter && !previewListView.open) {
-                                        categoryView.maximizeVisibleArea(index, item.uncollapsedHeight);
+                                    baseItem.expand(shouldExpand, animate)
+                                    if (shouldExpand && !previewListView.open) {
+                                        categoryView.maximizeVisibleArea(index, item.expandedHeight);
                                     }
                                 }
                             }
@@ -304,9 +332,6 @@
                     z: -1
                 }
             }
-
-            onHeightChanged: rendererLoader.updateDelegateCreationRange();
-            onYChanged: rendererLoader.updateDelegateCreationRange();
         }
 
         sectionProperty: "name"
@@ -318,7 +343,7 @@
             textColor: scopeStyle ? scopeStyle.foreground : "grey"
             image: {
                 if (delegate && delegate.expandable)
-                    return delegate.filtered ? "graphics/header_handlearrow.png" : "graphics/header_handlearrow2.png"
+                    return delegate.expanded ? "graphics/header_handlearrow2.png" : "graphics/header_handlearrow.png"
                 return "";
             }
             onClicked: {

=== modified file 'tests/autopilot/unity8/shell/emulators/dash.py'
--- tests/autopilot/unity8/shell/emulators/dash.py	2014-07-09 18:31:52 +0000
+++ tests/autopilot/unity8/shell/emulators/dash.py	2014-07-21 23:38:21 +0000
@@ -40,7 +40,7 @@
 
     def get_applications_grid(self):
         get_grid = self.get_scope('clickscope').wait_select_single(
-            'CardFilterGrid', objectName='local')
+            'CardGrid', objectName='local')
         return get_grid
 
     def get_application_icon(self, text):
@@ -196,9 +196,12 @@
         category_element = self._get_category_element(category)
         application_cards = category_element.select_many('AbstractButton')
 
-        # sort by y, x
+        # sort by y, x, filter those out of view
+        categoryBottom = category_element.globalRect.y \
+            + category_element.height
         application_cards = sorted(
-            application_cards,
+            (card for card in application_cards
+                if card.globalRect.y < categoryBottom),
             key=lambda card: (card.globalRect.y, card.globalRect.x))
 
         result = []

=== modified file 'tests/autopilot/unity8/shell/tests/test_emulators.py'
--- tests/autopilot/unity8/shell/tests/test_emulators.py	2014-07-09 13:16:20 +0000
+++ tests/autopilot/unity8/shell/tests/test_emulators.py	2014-07-21 23:38:21 +0000
@@ -191,9 +191,9 @@
     def _get_number_of_application_slots(self, category):
         category_element = self.applications_scope._get_category_element(
             category)
-        grid = category_element.select_single('CardFilterGrid')
-        filtergrid = grid.select_single('FilterGrid')
-        if (grid.filtered):
-            return filtergrid.collapsedRowCount * filtergrid.columns
+        cardgrid = category_element.select_single('CardGrid')
+        if (category_element.expanded):
+            return cardgrid.select_single('QQuickGridView').count
         else:
-            return filtergrid.uncollapsedRowCount * filtergrid.columns
+            return cardgrid.collapsedRows \
+                * cardgrid.select_single('ResponsiveGridView').columns

=== modified file 'tests/mocks/Ubuntu/Telephony/CMakeLists.txt'
--- tests/mocks/Ubuntu/Telephony/CMakeLists.txt	2014-04-30 18:06:38 +0000
+++ tests/mocks/Ubuntu/Telephony/CMakeLists.txt	2014-07-21 23:38:21 +0000
@@ -11,12 +11,4 @@
 
 qt5_use_modules(FakeUbuntuTelephonyQml Core Quick)
 
-# copy files into build directory for shadow builds
-add_custom_target(UbuntuTelephonyQmlDirFile ALL
-    COMMAND cp "${CMAKE_CURRENT_SOURCE_DIR}/qmldir" ${CMAKE_CURRENT_BINARY_DIR}
-    DEPENDS qmldir
-)
-
-install(TARGETS FakeUbuntuTelephonyQml
-    DESTINATION ${SHELL_INSTALL_QML}/mocks/Ubuntu/Telephony
-    )
+add_unity8_mock(Ubuntu.Telephony 0.1 Ubuntu/Telephony TARGETS FakeUbuntuTelephonyQml)

=== modified file 'tests/mocks/Unity/fake_categories.cpp'
--- tests/mocks/Unity/fake_categories.cpp	2014-07-08 11:04:55 +0000
+++ tests/mocks/Unity/fake_categories.cpp	2014-07-21 23:38:21 +0000
@@ -145,9 +145,12 @@
                 } else {
                     map["category-layout"] = "carousel";
                     map["card-size"] = "medium";
-                    map["collapsed-rows"] = 2;
                     map["overlay"] = true;
                 }
+                if (index.row() == 19) {
+                    map["category-layout"] = "grid";
+                    map["collapsed-rows"] = 0;
+                }
                 map["card-size"] = "small";
                 return map;
             }

=== modified file 'tests/mocks/Unity/fake_scope.cpp'
--- tests/mocks/Unity/fake_scope.cpp	2014-07-09 19:44:02 +0000
+++ tests/mocks/Unity/fake_scope.cpp	2014-07-21 23:38:21 +0000
@@ -24,7 +24,7 @@
 {
 }
 
-Scope::Scope(QString const& id, QString const& name, bool visible, QObject* parent)
+Scope::Scope(QString const& id, QString const& name, bool visible, QObject* parent, int categories)
     : unity::shell::scopes::ScopeInterface(parent)
     , m_id(id)
     , m_name(name)
@@ -33,7 +33,7 @@
     , m_isActive(false)
     , m_currentDeparment("root")
     , m_previewRendererName("preview-generic")
-    , m_categories(new Categories(20, this))
+    , m_categories(new Categories(categories, this))
 {
 }
 
@@ -182,14 +182,16 @@
 
 QVariantMap Scope::customizations() const
 {
-    QVariantMap m;
+    QVariantMap m, h;
     if (m_id == "clickscope") {
+        h["foreground-color"] = "yellow";
         m["background-color"] = "red";
         m["foreground-color"] = "blue";
+        m["page-header"] = h;
     } else if (m_id == "MockScope5") {
-        QVariantMap pageHeader;
-        pageHeader["logo"] = QUrl("../../../tests/qmltests/Components/tst_PageHeader/logo-ubuntu-orange.svg");
-        m["page-header"] = pageHeader;
+        h["background"] = "gradient:///lightgrey/grey";
+        h["logo"] = QUrl("../../../tests/qmltests/Components/tst_PageHeader/logo-ubuntu-orange.svg");
+        m["page-header"] = h;
     }
     return m;
 }

=== modified file 'tests/mocks/Unity/fake_scope.h'
--- tests/mocks/Unity/fake_scope.h	2014-07-08 09:23:14 +0000
+++ tests/mocks/Unity/fake_scope.h	2014-07-21 23:38:21 +0000
@@ -30,7 +30,7 @@
 
 public:
     Scope(QObject* parent = 0);
-    Scope(QString const& id, QString const& name, bool visible, QObject* parent = 0);
+    Scope(QString const& id, QString const& name, bool visible, QObject* parent = 0, int categories = 20);
 
     /* getters */
     QString id() const override;

=== modified file 'tests/mocks/Unity/fake_scopes.cpp'
--- tests/mocks/Unity/fake_scopes.cpp	2014-06-12 14:08:54 +0000
+++ tests/mocks/Unity/fake_scopes.cpp	2014-07-21 23:38:21 +0000
@@ -46,6 +46,7 @@
     addScope(new Scope("MockScope2", "Music", false, this));
     addScope(new Scope("clickscope", "Apps", true, this));
     addScope(new Scope("MockScope5", "Videos", true, this));
+    addScope(new Scope("SingleCategoryScope", "Single", true, this, 1));
 
     if (!m_loaded) {
         m_loaded = true;

=== modified file 'tests/plugins/Dash/tst_ScopeStyle.qml'
--- tests/plugins/Dash/tst_ScopeStyle.qml	2014-07-08 08:30:46 +0000
+++ tests/plugins/Dash/tst_ScopeStyle.qml	2014-07-21 23:38:21 +0000
@@ -36,8 +36,8 @@
         property var styles: [
             {},
             { "foreground-color": "red", "background-color": "black", "page-header": { "logo": "/foo/bar" } },
-            { "foreground-color": "green", "background-color": "white" },
-            { "foreground-color": "blue", "background-color": "darkgrey" },
+            { "foreground-color": "green", "background-color": "white", "page-header": { "foreground-color": "black" } },
+            { "foreground-color": "blue", "background-color": "darkgrey", "page-header": { "background": "gradient:///white/blue" } },
         ]
 
         function cleanup() {
@@ -147,5 +147,30 @@
             tool.style = testCase.styles[data.index];
             compare(tool.headerLogo, data.headerLogo, "Header logo was incorrect.");
         }
+
+        function test_headerForeground_data() {
+            return [
+                { tag: "default", index: 0, headerForeground: "grey" },
+                { tag: "black", index: 2, headerForeground: "black" },
+            ];
+        }
+
+        function test_headerForeground(data) {
+            tool.style = testCase.styles[data.index];
+            verify(Qt.colorEqual(tool.headerForeground, data.headerForeground),
+                   "Header foreground not equal: %1 != %2".arg(tool.headerForeground).arg(data.headerForeground));
+        }
+
+        function test_headerBackground_data() {
+            return [
+                { tag: "default", index: 0, headerBackground: "" },
+                { tag: "black", index: 3, headerBackground: "gradient:///white/blue" },
+            ];
+        }
+
+        function test_headerBackground(data) {
+            tool.style = testCase.styles[data.index];
+            compare(tool.headerBackground, data.headerBackground, "Header background was incorrect.");
+        }
     }
 }

=== modified file 'tests/qmltests/CMakeLists.txt'
--- tests/qmltests/CMakeLists.txt	2014-07-15 14:14:59 +0000
+++ tests/qmltests/CMakeLists.txt	2014-07-21 23:38:21 +0000
@@ -21,10 +21,10 @@
 
 add_qml_test(. Shell ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/LightDM/single")
 add_qml_test(. ShellWithPin ENVIRONMENT "LD_LIBRARY_PATH=${CMAKE_BINARY_DIR}/tests/mocks/LightDM/single-pin")
+add_qml_test(Components Background)
 add_qml_test(Components Carousel)
 add_qml_test(Components DraggingArea)
 add_qml_test(Components EdgeDemoOverlay)
-add_qml_test(Components FilterGrid)
 add_qml_test(Components LazyImage)
 add_qml_test(Components Rating)
 add_qml_test(Components ResponsiveFlowView)

=== added file 'tests/qmltests/Components/tst_Background.qml'
--- tests/qmltests/Components/tst_Background.qml	1970-01-01 00:00:00 +0000
+++ tests/qmltests/Components/tst_Background.qml	2014-07-21 23:38:21 +0000
@@ -0,0 +1,90 @@
+/*
+ * 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 QtTest 1.0
+import Unity.Test 0.1
+
+import "../../../qml/Components"
+
+Rectangle {
+    width: units.gu(40)
+    height: units.gu(71)
+
+    Background {
+        id: background
+    }
+
+    UnityTestCase {
+        id: testCase
+        name: "Background"
+        when: windowShown
+
+        SignalSpy {
+            id: loadedSpy
+            target: background
+            signalName: "loaded"
+        }
+
+        function cleanup() {
+            background.style = "";
+            loadedSpy.clear();
+        }
+
+        function test_style_data() {
+            return [
+                { tag: "empty", style: "" },
+                { tag: "solid", style: "color:///black" },
+                { tag: "gradient", style: "gradient:///black/red" },
+                { tag: "image", style: "/some/path" },
+            ];
+        }
+
+        function test_style(data) {
+            background.style = data.style;
+            expectFail("empty", "Empty style should not create a background.");
+            loadedSpy.wait();
+            compare(background.item.objectName, data.tag, "Background should be %1".arg(data.style));
+        }
+
+        function test_solid() {
+            background.style = "color:///black";
+            loadedSpy.wait();
+
+            verify(Qt.colorEqual(background.item.color, "black"),
+                   "Solid color not equal: %1 != black".arg(background.item.color));
+        }
+
+        function test_gradient() {
+            background.style = "gradient:///black/red";
+            loadedSpy.wait();
+
+            var stops = background.item.gradient.stops;
+
+            verify(Qt.colorEqual(stops[0].color, "black"),
+                   "Top gradient color not equal: %1 != black".arg(stops[0].color));
+            verify(Qt.colorEqual(stops[1].color, "red"),
+                   "Bottom gradient color not equal: %1 != black".arg(stops[1].color));
+        }
+
+        function test_image() {
+            background.style = "/some/path";
+            loadedSpy.wait();
+
+            compare(background.item.source, Qt.resolvedUrl("/some/path"), "Image path is incorrect.");
+        }
+    }
+}

=== removed file 'tests/qmltests/Components/tst_FilterGrid.qml'
--- tests/qmltests/Components/tst_FilterGrid.qml	2014-05-01 14:25:18 +0000
+++ tests/qmltests/Components/tst_FilterGrid.qml	1970-01-01 00:00:00 +0000
@@ -1,190 +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 "../../../qml/Components"
-import Ubuntu.Components.ListItems 0.1 as ListItem
-import Ubuntu.Components 0.1
-import Unity.Test 0.1 as UT
-import Utils 0.1
-
-/*
-  You should see 6 green squares (from "A" to "F") and a button "View all (12)".
-  Once you press that button other 6 green squares (from "G" to "L") should show up.
-*/
-Rectangle {
-    width: gridRect.width + controls.width
-    height: units.gu(50)
-    color: "white"
-
-    Column {
-        id: controls
-        width: units.gu(30)
-        height: parent.height
-        anchors.top: parent.top
-        anchors.right: parent.right
-        ListItem.ValueSelector {
-            id: collapsedRowCountSelector
-            text: "collapsedRowCount"
-            values: [1,2,3,4]
-            selectedIndex: 1
-        }
-        Row {
-            spacing: units.gu(1)
-            Label { anchors.verticalCenter: parent.verticalCenter
-                    text: "Filter" }
-            CheckBox {
-                id: filterCheckBox
-                checked: true
-                onCheckedChanged: filterGrid.setFilter(checked, false /*animate*/)
-            }
-        }
-    }
-
-    ListModel {
-        id: fakeModel
-        ListElement { name: "A" }
-        ListElement { name: "B" }
-        ListElement { name: "C" }
-        ListElement { name: "D" }
-        ListElement { name: "E" }
-        ListElement { name: "F" }
-        ListElement { name: "G" }
-        ListElement { name: "H" }
-        ListElement { name: "I" }
-        ListElement { name: "J" }
-        ListElement { name: "K" }
-        ListElement { name: "L" }
-    }
-
-    ListModel {
-        id: fakeModelTwoItems
-        ListElement { name: "A" }
-        ListElement { name: "B" }
-    }
-
-    ListModel {
-        id: fakeModelFourItems
-        ListElement { name: "A" }
-        ListElement { name: "B" }
-        ListElement { name: "C" }
-        ListElement { name: "D" }
-    }
-
-    Rectangle {
-        id: gridRect
-        width: units.gu(30)
-        height: parent.height
-        color: "grey"
-        anchors.top: parent.top
-        anchors.left: parent.left
-
-        FilterGrid {
-            id: filterGrid
-            anchors.fill: parent
-            model: fakeModel
-            maximumNumberOfColumns: 3
-            collapsedRowCount:
-                collapsedRowCountSelector.values[collapsedRowCountSelector.selectedIndex]
-            minimumHorizontalSpacing: units.gu(1)
-            delegateWidth: units.gu(6)
-            delegateHeight: units.gu(6)
-            verticalSpacing: units.gu(1)
-
-            delegate: Rectangle {
-                // So that it can be identified by countVisibleDelegates()
-                property bool isGridDelegate: true
-
-                color: "green"
-                width: units.gu(6)
-                height: units.gu(6)
-                Text {
-                    anchors.centerIn: parent
-                    text: name
-                }
-            }
-        }
-    }
-
-    UT.UnityTestCase {
-        name: "FilterGrid"
-        when: windowShown
-
-        function init() {
-            filterGrid.model = fakeModel
-        }
-
-        function cleanup() {
-            filterCheckBox.checked = true
-            collapsedRowCountSelector.selectedIndex = 1
-        }
-
-        function test_turningFilterOffShowsAllElements() {
-            tryCompareFunction(countVisibleDelegates, 6)
-
-            filterCheckBox.checked = false
-
-            tryCompareFunction(countVisibleDelegates, 12)
-        }
-
-        function test_collapsedRowCount() {
-            for (var i = 0; i < 4; ++i) {
-                collapsedRowCountSelector.selectedIndex = i
-                // We have 3 elements per row.
-                // row count == index + 1
-                tryCompareFunction(countVisibleDelegates, 3*(i+1))
-            }
-        }
-
-        function test_modelSizeAffectsCollapsedRowCount_data() {
-            return [
-                { tag: "2 items, collapsedRows 1", model: fakeModelTwoItems, collapsedRowCountIndex: 0,
-                  rowsWhenCollapsed: 1, visibleDelegates: 2 },
-                { tag: "2 items, collapsedRows 2", model: fakeModelTwoItems, collapsedRowCountIndex: 1,
-                  rowsWhenCollapsed: 1, visibleDelegates: 2 },
-                { tag: "4 items, collapsedRows 1", model: fakeModelFourItems, collapsedRowCountIndex: 0,
-                  rowsWhenCollapsed: 1, visibleDelegates: 3 },
-                { tag: "4 items, collapsedRows 2", model: fakeModelFourItems, collapsedRowCountIndex: 1,
-                  rowsWhenCollapsed: 2, visibleDelegates: 4 },
-            ]
-        }
-
-        function test_modelSizeAffectsCollapsedRowCount(data) {
-            filterGrid.model = data.model
-            collapsedRowCountSelector.selectedIndex = data.collapsedRowCountIndex
-
-            tryCompare(filterGrid, "rowsWhenCollapsed", data.rowsWhenCollapsed)
-            tryCompareFunction(countVisibleDelegates, data.visibleDelegates)
-        }
-
-        function countVisibleDelegates() {
-            return __countVisibleDelegates(filterGrid.visibleChildren, 0)
-        }
-
-        function __countVisibleDelegates(objList, total) {
-            for (var i = 0; i < objList.length; ++i) {
-                var child = objList[i];
-                if (child.isGridDelegate !== undefined) {
-                    ++total;
-                } else {
-                    total = __countVisibleDelegates(child.visibleChildren, total)
-                }
-            }
-            return total
-        }
-    }
-}

=== modified file 'tests/qmltests/Dash/tst_Dash.qml'
--- tests/qmltests/Dash/tst_Dash.qml	2014-07-03 11:15:16 +0000
+++ tests/qmltests/Dash/tst_Dash.qml	2014-07-21 23:38:21 +0000
@@ -86,7 +86,7 @@
             tryCompare(dashContentList, "count", 0);
             scopes.load();
             tryCompare(scopes, "loaded", true);
-            tryCompare(dashContentList, "count", 3);
+            tryCompare(dashContentList, "count", 4);
 
             verify(dashContentList != undefined);
             tryCompare(dashContentList, "currentIndex", data.visualIndex);

=== modified file 'tests/qmltests/Dash/tst_DashContent.qml'
--- tests/qmltests/Dash/tst_DashContent.qml	2014-07-15 08:22:19 +0000
+++ tests/qmltests/Dash/tst_DashContent.qml	2014-07-21 23:38:21 +0000
@@ -61,6 +61,11 @@
         signalName: "movementStarted"
     }
 
+    SignalSpy {
+        id: loadedSpy
+        signalName: "loaded"
+    }
+
     UT.UnityTestCase {
         name: "DashContent"
         when: scopesModel.loaded && windowShown
@@ -78,6 +83,7 @@
 
         function cleanup() {
             movementStartedSpy.clear();
+            loadedSpy.clear();
             dashContent.visible = true;
 
             var dashContentList = findChild(dashContent, "dashContentList");
@@ -116,10 +122,11 @@
 
         function test_show_header_on_list_movement() {
             var dashContentList = findChild(dashContent, "dashContentList");
-            verify(dashContentList != undefined);
-            var categoryListView = findChild(dashContentList, "categoryListView");
-            verify(categoryListView != undefined);
+            verify(dashContentList !== null);
+            var scope = findChild(dashContent, "MockScope1 loader");
+            waitForRendering(scope);
 
+            var categoryListView = findChild(scope, "categoryListView");
             waitForRendering(categoryListView);
 
             categoryListView.contentY = units.gu(15);
@@ -133,10 +140,12 @@
 
         function test_set_current_scope_reset() {
             var dashContentList = findChild(dashContent, "dashContentList");
-            verify(dashContentList != undefined);
+            verify(dashContentList, "Couldn't find dashContentList");
+            var scope = findChild(dashContent, "MockScope1 loader");
+
+            tryCompare(scope, "status", Loader.Ready);
+
             var categoryListView = findChild(dashContentList, "categoryListView");
-            verify(categoryListView != undefined);
-
             categoryListView.contentY = units.gu(10);
 
             compare(dashContentList.currentItem.item.objectName,  "MockScope1")

=== modified file 'tests/qmltests/Dash/tst_GenericScopeView.qml'
--- tests/qmltests/Dash/tst_GenericScopeView.qml	2014-07-14 14:15:25 +0000
+++ tests/qmltests/Dash/tst_GenericScopeView.qml	2014-07-21 23:38:21 +0000
@@ -54,12 +54,13 @@
             when: scopes.loaded && windowShown
 
             property Item previewListView: findChild(genericScopeView, "previewListView")
+            property Item header: findChild(genericScopeView, "scopePageHeader")
 
             function init() {
                 genericScopeView.scope = scopes.getScope(1)
                 shell.width = units.gu(120)
                 genericScopeView.categoryView.positionAtBeginning();
-                tryCompare(genericScopeView.categoryView, "contentY", 0)
+                waitForRendering(genericScopeView.categoryView);
             }
 
             function test_isActive() {
@@ -105,8 +106,6 @@
             }
 
             function test_filter_expand_collapse() {
-                // wait for the item to be there
-                waitForRendering(genericScopeView);
                 tryCompareFunction(function() { return findChild(genericScopeView, "dashSectionHeader0") != null; }, true);
 
                 var header = findChild(genericScopeView, "dashSectionHeader0")
@@ -114,18 +113,18 @@
 
                 waitForRendering(header);
                 verify(category.expandable);
-                verify(category.filtered);
+                verify(!category.expanded);
 
                 var initialHeight = category.height;
                 var middleHeight;
                 mouseClick(header, header.width / 2, header.height / 2);
                 tryCompareFunction(function() { middleHeight = category.height; return category.height > initialHeight; }, true);
-                tryCompare(category, "filtered", false);
+                tryCompare(category, "expanded", true);
                 tryCompareFunction(function() { return category.height > middleHeight; }, true);
 
                 mouseClick(header, header.width / 2, header.height / 2);
                 verify(category.expandable);
-                tryCompare(category, "filtered", true);
+                tryCompare(category, "expanded", false);
             }
 
             function test_filter_expand_expand_collapse() {
@@ -137,51 +136,75 @@
 
                 var header2 = findChild(genericScopeView, "dashSectionHeader2")
                 var category2 = findChild(genericScopeView, "dashCategory2")
-                var category2FilterGrid = category2.children[1].children[2];
-                verify(UT.Util.isInstanceOf(category2FilterGrid, "CardFilterGrid"));
 
                 waitForRendering(header2);
                 verify(category2.expandable);
-                verify(category2.filtered);
+                verify(!category2.expanded);
 
                 mouseClick(header2, header2.width / 2, header2.height / 2);
-                tryCompare(category2, "filtered", false);
-                tryCompare(category2FilterGrid, "filtered", false);
+                tryCompare(category2, "expanded", true);
 
                 categoryListView.positionAtBeginning();
 
                 var header0 = findChild(genericScopeView, "dashSectionHeader0")
                 var category0 = findChild(genericScopeView, "dashCategory0")
                 mouseClick(header0, header0.width / 2, header0.height / 2);
-                tryCompare(category0, "filtered", false);
-                tryCompare(category2, "filtered", true);
-                tryCompare(category2FilterGrid, "filtered", true);
+                tryCompare(category0, "expanded", true);
+                tryCompare(category2, "expanded", false);
                 mouseClick(header0, header0.width / 2, header0.height / 2);
-                tryCompare(category0, "filtered", true);
-                tryCompare(category2, "filtered", true);
+                tryCompare(category0, "expanded", false);
+                tryCompare(category2, "expanded", false);
             }
 
             function test_narrow_delegate_ranges_expand() {
-                tryCompareFunction(function() { return findChild(genericScopeView, "dashCategory0") != undefined; }, true);
+                tryCompareFunction(function() { return findChild(genericScopeView, "dashCategory0") !== null; }, true);
                 var category = findChild(genericScopeView, "dashCategory0")
-                tryCompare(category, "filtered", true);
+                tryCompare(category, "expanded", false);
 
                 shell.width = units.gu(20)
                 var categoryListView = findChild(genericScopeView, "categoryListView");
                 categoryListView.contentY = units.gu(20);
                 var header0 = findChild(genericScopeView, "dashSectionHeader0")
                 mouseClick(header0, header0.width / 2, header0.height / 2);
-                tryCompare(category, "filtered", false);
+                tryCompare(category, "expanded", true);
                 tryCompareFunction(function() { return category.item.height == genericScopeView.height - category.item.displayMarginBeginning - category.item.displayMarginEnd; }, true);
                 mouseClick(header0, header0.width / 2, header0.height / 2);
-                tryCompare(category, "filtered", true);
+                tryCompare(category, "expanded", false);
+            }
+
+            function test_forced_category_expansion() {
+                tryCompareFunction(function() {
+                    mouseFlick(genericScopeView, genericScopeView.width/2, genericScopeView.height,
+                               genericScopeView.width/2, genericScopeView.y)
+                    return findChild(genericScopeView, "dashCategory19") !== null;
+                }, true);
+                var category = findChild(genericScopeView, "dashCategory19")
+                compare(category.expandable, false, "Category with collapsed-rows: 0 should not be expandable");
+
+                var grid = findChild(category, "19");
+                verify(grid, "Could not find the category renderer.");
+
+                compare(grid.height, grid.expandedHeight, "Category with collapsed-rows: 0 should always be expanded.");
+            }
+
+            function test_single_category_expansion() {
+                genericScopeView.scope = scopes.getScope(4);
+
+                tryCompareFunction(function() { return findChild(genericScopeView, "dashCategory0") != undefined; }, true);
+                var category = findChild(genericScopeView, "dashCategory0")
+                compare(category.expandable, false, "Only category should not be expandable.");
+
+                var grid = findChild(category, "0");
+                verify(grid, "Could not find the category renderer.");
+
+                compare(grid.height, grid.expandedHeight, "Only category should always be expanded");
             }
 
             function openPreview() {
                 tryCompareFunction(function() {
-                                        var filterGrid = findChild(genericScopeView, "0");
-                                        if (filterGrid != null) {
-                                            var tile = findChild(filterGrid, "delegate0");
+                                        var cardGrid = findChild(genericScopeView, "0");
+                                        if (cardGrid != null) {
+                                            var tile = findChild(cardGrid, "delegate0");
                                             return tile != null;
                                         }
                                         return false;
@@ -257,13 +280,33 @@
                 closePreview();
             }
 
-            function test_haeder_logo() {
-                genericScopeView.scope = scopes.getScope(3);
+            function test_header_style_data() {
+                return [
+                    { tag: "Default", index: 0, foreground: "grey", background: "", logo: "" },
+                    { tag: "Foreground", index: 2, foreground: "yellow", background: "", logo: "" },
+                    { tag: "Logo+Background", index: 3, foreground: "grey", background: "gradient:///lightgrey/grey",
+                      logo: Qt.resolvedUrl("../Components/tst_PageHeader/logo-ubuntu-orange.svg") },
+                ];
+            }
+
+            function test_header_style(data) {
+                genericScopeView.scope = scopes.getScope(data.index);
+                waitForRendering(genericScopeView);
+                verify(header, "Could not find the header.");
+
+                var innerHeader = findChild(header, "innerPageHeader");
+                verify(innerHeader, "Could not find the inner header");
+                verify(Qt.colorEqual(innerHeader.textColor, data.foreground),
+                       "Foreground color not equal: %1 != %2".arg(innerHeader.textColor).arg(data.foreground));
+
+                var background = findChild(header, "headerBackground");
+                verify(background, "Could not find the background");
+                compare(background.style, data.background);
 
                 var image = findChild(genericScopeView, "titleImage");
-                verify(image, "Could not find the title image");
-                compare(image.source, Qt.resolvedUrl("../Components/tst_PageHeader/logo-ubuntu-orange.svg"), "Title image has the wrong source");
-
+                if (data.logo == "") expectFail(data.tag, "Title image should not exist.");
+                verify(image, "Could not find the title image.");
+                compare(image.source, data.logo, "Title image has the wrong source");
             }
         }
     }