Merge lp:~aacid/unity8/recoverArtIfChanges into lp:unity8

[Albert Astals Cid]

Change the art back to the cardData value if it changes from broken to valid image

 * Are there any related MPs required for this MP to build/function as expected?
Prereq

 * Did you perform an exploratory manual test run of your code change and any related functionality?
No since as far as i know there's no scope doing this

 * 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

[lp:~aacid/unity8/recoverArtIfChanges]

2216. By Albert Astals Cid on 2016-05-09

Merge

Unmerged revisions

=== modified file 'plugins/Dash/CardCreator.js'
--- plugins/Dash/CardCreator.js	2016-03-10 16:53:04 +0000
+++ plugins/Dash/CardCreator.js	2016-03-18 11:31:31 +0000
@@ -59,14 +59,30 @@
                                 } \n\
                             }\n';
 
+// %1 is the aspect of the UbuntuShape
+var kArtUbuntuShapeCode = 'UbuntuShape { \n\
+                                anchors.fill: parent; \n\
+                                source: artImage; \n\
+                                sourceFillMode: UbuntuShape.PreserveAspectCrop; \n\
+                                radius: "medium"; \n\
+                                aspect: %1; \n\
+                            }';
+
+var kArtProportionalShapeCode = 'ProportionalShape { \n\
+                                    anchors.fill: parent; \n\
+                                    source: artImage; \n\
+                                    aspect: UbuntuShape.DropShadow; \n\
+                                 }';
+
 // %1 is used as anchors of artShapeHolder
 // %2 is used as image width
 // %3 is used as image height
-// %4 is used for artShapeSource.hideSource and inner Loader visible
+// %4 is whether the image should be visible
 // %5 is used as aspect ratio fallback
 // %6 is whether the loader should be asynchronous or not
-// %7 is injected as code to artImage
-// %8 is used as image fallback
+// %7 is the shape code we want to use
+// %8 is injected as code to artImage
+// %9 is used as image fallback
 var kArtShapeHolderCode = 'Item { \n\
                             id: artShapeHolder; \n\
                             height: root.fixedArtShapeSize.height > 0 ? root.fixedArtShapeSize.height : artShapeLoader.height; \n\
@@ -75,7 +91,8 @@
                             Loader { \n\
                                 id: artShapeLoader; \n\
                                 objectName: "artShapeLoader"; \n\
-                                readonly property string cardArt: cardData && cardData["art"] || %8; \n\
+                                readonly property string cardArt: cardData && cardData["art"] || %9; \n\
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } } \n\
                                 active: cardArt != ""; \n\
                                 asynchronous: %6; \n\
                                 visible: status == Loader.Ready; \n\
@@ -84,39 +101,7 @@
                                     objectName: "artShape"; \n\
                                     visible: image.status == Image.Ready; \n\
                                     readonly property alias image: artImage; \n\
-                                    ShaderEffectSource { \n\
-                                        id: artShapeSource; \n\
-                                        sourceItem: artImage; \n\
-                                        anchors.centerIn: parent; \n\
-                                        width: 1; \n\
-                                        height: 1; \n\
-                                        hideSource: %4; \n\
-                                    } \n\
-                                    Loader { \n\
-                                        anchors.fill: parent; \n\
-                                        visible: %4; \n\
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent; \n\
-                                        Component { \n\
-                                            id: artShapeShapeComponent; \n\
-                                            UbuntuShape { \n\
-                                                source: artShapeSource; \n\
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop; \n\
-                                                radius: "medium"; \n\
-                                                aspect: { \n\
-                                                    switch (root.artShapeStyle) { \n\
-                                                        case "inset": return UbuntuShape.Inset; \n\
-                                                        case "shadow": return UbuntuShape.DropShadow; \n\
-                                                        default: \n\
-                                                        case "flat": return UbuntuShape.Flat; \n\
-                                                    } \n\
-                                                } \n\
-                                            } \n\
-                                        } \n\
-                                        Component { \n\
-                                            id: artShapeIconComponent; \n\
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; } \n\
-                                        } \n\
-                                    } \n\
+                                    %7 \n\
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1; \n\
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : %5; \n\
                                     Component.onCompleted: { updateWidthHeightBindings(); } \n\
@@ -135,9 +120,10 @@
                                         objectName: "artImage"; \n\
                                         source: artShapeLoader.cardArt; \n\
                                         asynchronous: %6; \n\
+                                        visible: %4; \n\
                                         width: %2; \n\
                                         height: %3; \n\
-                                        %7 \n\
+                                        %8 \n\
                                     } \n\
                                 } \n\
                             } \n\
@@ -325,7 +311,7 @@
                         id: touchdown; \n\
                         objectName: "touchdown"; \n\
                         anchors { %1 } \n\
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; \n\
+                        visible: root.pressed; \n\
                         radius: "medium"; \n\
                         borderSource: "radius_pressed.sci" \n\
                     }\n';
@@ -408,7 +394,7 @@
     return colorString;
 }
 
-function cardString(template, components, isCardTool) {
+function cardString(template, components, isCardTool, artShapeStyle) {
     var code;
 
     var templateInteractive = (template == null ? true : (template["non-interactive"] !== undefined ? !template["non-interactive"] : true)) ? "true" : "false";
@@ -416,7 +402,6 @@
     code = 'AbstractButton { \n\
                 id: root; \n\
                 property var cardData; \n\
-                property string artShapeStyle: "inset"; \n\
                 property string backgroundShapeStyle: "inset"; \n\
                 property real fontScale: 1.0; \n\
                 property var scopeStyle: null; \n\
@@ -513,17 +498,35 @@
         var fallbackStatusCode = "";
         var fallbackURICode = '""';
         if (fallback !== "") {
-            // fallbackStatusCode has %6 in it because we want to substitute it for fallbackURICode
-            // which in kArtShapeHolderCode is %8
-            fallbackStatusCode += 'onStatusChanged: if (status === Image.Error) source = %8;';
+            // fallbackStatusCode has %9 in it because we want to substitute it for fallbackURICode
+            // which in kArtShapeHolderCode is %9
+            fallbackStatusCode += 'onStatusChanged: if (status === Image.Error) source = %9;';
             fallbackURICode = 'decodeURI("%1")'.arg(fallback);
         }
+        var artShapeHolderShapeCode;
+        if (!isConciergeMode) {
+            if (artShapeStyle === "icon") {
+                artShapeHolderShapeCode = kArtProportionalShapeCode;
+            } else {
+                var artShapeHolderShapeAspect;
+                switch (artShapeStyle) {
+                    case "inset": artShapeHolderShapeAspect = "UbuntuShape.Inset"; break;
+                    case "shadow": artShapeHolderShapeAspect = "UbuntuShape.DropShadow"; break;
+                    default:
+                    case "flat": artShapeHolderShapeAspect = "UbuntuShape.Flat"; break;
+                }
+                artShapeHolderShapeCode = kArtUbuntuShapeCode.arg(artShapeHolderShapeAspect);
+            }
+        } else {
+            artShapeHolderShapeCode = "";
+        }
         code += kArtShapeHolderCode.arg(artAnchors)
                                    .arg(widthCode)
                                    .arg(heightCode)
-                                   .arg(isConciergeMode ? "false" : "true")
+                                   .arg(isConciergeMode ? "true" : "false")
                                    .arg(aspectRatio)
                                    .arg(asynchronous)
+                                   .arg(artShapeHolderShapeCode)
                                    .arg(fallbackStatusCode)
                                    .arg(fallbackURICode);
     } else {
@@ -848,15 +851,17 @@
         code += kSummaryLabelCode.arg(summaryTopAnchor).arg(summaryTopMargin).arg(summaryColor);
     }
 
-    var touchdownAnchors;
-    if (hasBackground) {
-        touchdownAnchors = 'fill: backgroundLoader';
-    } else if (touchdownOnArtShape) {
-        touchdownAnchors = 'fill: artShapeHolder';
-    } else {
-        touchdownAnchors = 'fill: root'
+    if (artShapeStyle != "shadow" && artShapeStyle != "icon") {
+        var touchdownAnchors;
+        if (hasBackground) {
+            touchdownAnchors = 'fill: backgroundLoader';
+        } else if (touchdownOnArtShape) {
+            touchdownAnchors = 'fill: artShapeHolder';
+        } else {
+            touchdownAnchors = 'fill: root'
+        }
+        code += kTouchdownCode.arg(touchdownAnchors);
     }
-    code += kTouchdownCode.arg(touchdownAnchors);
 
     var implicitHeight = 'implicitHeight: ';
     if (hasSummary) {
@@ -889,13 +894,13 @@
     return code;
 }
 
-function createCardComponent(parent, template, components, isCardTool, identifier) {
+function createCardComponent(parent, template, components, isCardTool, artShapeStyle, identifier) {
     var imports = 'import QtQuick 2.4; \n\
                    import Ubuntu.Components 1.3; \n\
                    import Ubuntu.Settings.Components 0.1; \n\
                    import Dash 0.1;\n\
                    import Utils 0.1;\n';
-    var card = cardString(template, components, isCardTool);
+    var card = cardString(template, components, isCardTool, artShapeStyle);
     var code = imports + 'Component {\n' + card + '}\n';
 
     try {
 
=== modified file 'plugins/Dash/CardCreatorCache.qml'
--- plugins/Dash/CardCreatorCache.qml	2016-02-16 14:26:58 +0000
+++ plugins/Dash/CardCreatorCache.qml	2016-03-18 11:31:31 +0000
@@ -23,7 +23,7 @@
 
     property var cache: new Object();
 
-    function getCardComponent(template, components, isCardTool) {
+    function getCardComponent(template, components, isCardTool, artShapeStyle) {
         if (template === undefined || components === undefined)
             return undefined;
 
@@ -32,7 +32,7 @@
         var allString = tString + cString + isCardTool;
         var component = cache[allString];
         if (component === undefined) {
-            component = CardCreator.createCardComponent(root, template, components, isCardTool, allString);
+            component = CardCreator.createCardComponent(root, template, components, isCardTool, artShapeStyle, allString);
             cache[allString] = component;
         }
         return component;
 
=== modified file 'qml/Dash/CardCarousel.qml'
--- qml/Dash/CardCarousel.qml	2016-02-16 15:09:55 +0000
+++ qml/Dash/CardCarousel.qml	2016-03-18 11:31:31 +0000
@@ -66,7 +66,6 @@
                 item.cardData = Qt.binding(function() { return model; });
                 item.fontScale = Qt.binding(function() { return carousel.fontScale; });
                 item.showHeader = Qt.binding(function() { return loader.explicitlyScaled; });
-                item.artShapeStyle = "shadow";
                 item.scopeStyle = cardCarousel.scopeStyle;
             }
         }
 
=== modified file 'qml/Dash/CardGrid.qml'
--- qml/Dash/CardGrid.qml	2016-02-16 15:09:55 +0000
+++ qml/Dash/CardGrid.qml	2016-03-18 11:31:31 +0000
@@ -25,7 +25,6 @@
         if (!cardTool || !cardTool.template || typeof cardTool.template["collapsed-rows"] != "number") return 2;
         return cardTool.template["collapsed-rows"];
     }
-    property string artShapeStyle: "inset";
     property string backgroundShapeStyle: "inset";
     property alias minimumHorizontalSpacing: grid.minimumHorizontalSpacing
 
@@ -71,7 +70,6 @@
                     item.fixedArtShapeSize = Qt.binding(function() { return cardTool.artShapeSize; });
                     item.cardData = Qt.binding(function() { return model; });
                     item.scopeStyle = root.scopeStyle;
-                    item.artShapeStyle = root.artShapeStyle;
                     item.backgroundShapeStyle = root.backgroundShapeStyle;
                 }
                 Connections {
 
=== modified file 'qml/Dash/CardTool.qml'
--- qml/Dash/CardTool.qml	2016-02-17 10:51:17 +0000
+++ qml/Dash/CardTool.qml	2016-03-18 11:31:31 +0000
@@ -66,7 +66,11 @@
         return layout;
     }
 
-    property var cardComponent: CardCreatorCache.getCardComponent(cardTool.template, cardTool.components, false);
+
+    // Not readonly because gets overwritten from GenericScopeView in some cases
+    property string artShapeStyle: categoryLayout === "carousel" ? "shadow" : "inset"
+
+    property var cardComponent: CardCreatorCache.getCardComponent(cardTool.template, cardTool.components, false, artShapeStyle);
 
     // FIXME: Saviq
     // Only way for the card below to actually be laid out completely.
@@ -193,7 +197,7 @@
             "summary": "—\n—\n—\n—\n—",
             "attributes": attributesModel.model
         }
-        sourceComponent: CardCreatorCache.getCardComponent(cardTool.template, cardTool.components, true);
+        sourceComponent: CardCreatorCache.getCardComponent(cardTool.template, cardTool.components, true, artShapeStyle);
         onLoaded: {
             item.objectName = "cardToolCard";
             item.width = Qt.binding(function() { return cardTool.cardWidth !== -1 ? cardTool.cardWidth : item.implicitWidth; });
 
=== modified file 'qml/Dash/GenericScopeView.qml'
--- qml/Dash/GenericScopeView.qml	2016-03-10 22:39:17 +0000
+++ qml/Dash/GenericScopeView.qml	2016-03-18 11:31:31 +0000
@@ -342,10 +342,10 @@
                     if (scope && scope.id === "clickscope") {
                         if (categoryId === "predefined" || categoryId === "local") {
                             cardTool.artShapeSize = Qt.binding(function() { return Qt.size(units.gu(8), units.gu(7.5)) });
-                            item.artShapeStyle = "icon";
+                            cardTool.artShapeStyle = "icon";
                         } else {
                             // Should be ubuntu store icon
-                            item.artShapeStyle = "flat";
+                            cardTool.artShapeStyle = "flat";
                             item.backgroundShapeStyle = "shadow";
                         }
                     }
 
=== modified file 'tests/plugins/Dash/cardcreator/1.res'
--- tests/plugins/Dash/cardcreator/1.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/1.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -22,6 +21,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: true; 
                                 visible: status == Loader.Ready; 
@@ -30,38 +30,12 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: true;
-                                    }
-                                    Loader {
+                                    UbuntuShape {
                                         anchors.fill: parent;
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
+                                        source: artImage;
+                                        sourceFillMode: UbuntuShape.PreserveAspectCrop;
+                                        radius: "medium";
+                                        aspect: UbuntuShape.Inset;
                                     }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1.6;
@@ -81,7 +55,8 @@
                                         objectName: "artImage"; 
                                         source: artShapeLoader.cardArt;
                                         asynchronous: true;
-                                        width: root.width; 
+                                        visible: false;
+                                        width: root.width;
                                         height: width / artShape.aspect; 
                                     } 
                                 } 
@@ -112,7 +87,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: artShapeHolder }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/1.res.cardcreator'
--- tests/plugins/Dash/cardcreator/1.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/1.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -21,6 +20,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: false;
                                 visible: status == Loader.Ready; 
@@ -29,38 +29,12 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: true;
-                                    }
-                                    Loader {
+                                    UbuntuShape {
                                         anchors.fill: parent;
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
+                                        source: artImage;
+                                        sourceFillMode: UbuntuShape.PreserveAspectCrop;
+                                        radius: "medium";
+                                        aspect: UbuntuShape.Inset;
                                     }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1.6;
@@ -80,6 +54,7 @@
                                         objectName: "artImage"; 
                                         source: artShapeLoader.cardArt;
                                         asynchronous: false;
+                                        visible: false;
                                         width: root.width; 
                                         height: width / artShape.aspect; 
                                     } 
@@ -111,7 +86,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: artShapeHolder }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/1.tst'
--- tests/plugins/Dash/cardcreator/1.tst	2014-08-08 08:54:12 +0000
+++ tests/plugins/Dash/cardcreator/1.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-layout":"vertical","card-size":"small","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":1.6,"field":"art"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: inset
 result: 1.res
 
=== modified file 'tests/plugins/Dash/cardcreator/10.res'
--- tests/plugins/Dash/cardcreator/10.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/10.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -127,13 +126,5 @@
  
                                 ] 
                     }
-UbuntuShape { 
-                        id: touchdown; 
-                        objectName: "touchdown"; 
-                        anchors { fill: backgroundLoader } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
-                        radius: "medium"; 
-                        borderSource: "radius_pressed.sci" 
-                    }
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/10.res.cardcreator'
--- tests/plugins/Dash/cardcreator/10.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/10.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -125,13 +124,5 @@
  
                                 ] 
                     }
-UbuntuShape { 
-                        id: touchdown; 
-                        objectName: "touchdown"; 
-                        anchors { fill: backgroundLoader } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
-                        radius: "medium"; 
-                        borderSource: "radius_pressed.sci" 
-                    }
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/10.tst'
--- tests/plugins/Dash/cardcreator/10.tst	2016-01-25 16:49:26 +0000
+++ tests/plugins/Dash/cardcreator/10.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":{"elements":["#E9E9E9"],"type":"color"},"card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2, "card-background": { "type": "color", "elements": [ "\\", ": 3; } Item { } function moo ()  { \"" ] } }
 components: {"art":{"aspect-ratio":1},"background":{"field":"background"},"mascot":{"field":"icon"},"subtitle":{"field":"author"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: shadow
 result: 10.res
 \ No newline at end of file
 
=== modified file 'tests/plugins/Dash/cardcreator/11.res'
--- tests/plugins/Dash/cardcreator/11.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/11.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -60,6 +59,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || decodeURI("%5C");
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: true;
                                 visible: status == Loader.Ready; 
@@ -68,40 +68,14 @@
                                     objectName: "artShape"; 
                                     visible: image.status == Image.Ready; 
                                     readonly property alias image: artImage; 
-                                    ShaderEffectSource { 
-                                        id: artShapeSource; 
-                                        sourceItem: artImage; 
-                                        anchors.centerIn: parent; 
-                                        width: 1; 
-                                        height: 1; 
-                                        hideSource: true;
-                                    } 
-                                    Loader { 
-                                        anchors.fill: parent; 
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent; 
-                                        Component { 
-                                            id: artShapeShapeComponent; 
-                                            UbuntuShape { 
-                                                source: artShapeSource; 
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop; 
-                                                radius: "medium"; 
-                                                aspect: { 
-                                                    switch (root.artShapeStyle) { 
-                                                        case "inset": return UbuntuShape.Inset; 
-                                                        case "shadow": return UbuntuShape.DropShadow; 
-                                                        default: 
-                                                        case "flat": return UbuntuShape.Flat; 
-                                                    } 
-                                                } 
-                                            } 
-                                        } 
-                                        Component { 
-                                            id: artShapeIconComponent; 
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; } 
-                                        } 
-                                    } 
-                                    readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1; 
+                                    UbuntuShape {
+                                        anchors.fill: parent;
+                                        source: artImage;
+                                        sourceFillMode: UbuntuShape.PreserveAspectCrop;
+                                        radius: "medium";
+                                        aspect: UbuntuShape.Flat;
+                                    }
+                                    readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1;
                                     Component.onCompleted: { updateWidthHeightBindings(); } 
                                     Connections { target: root; onFixedArtShapeSizeChanged: updateWidthHeightBindings(); } 
@@ -119,6 +93,7 @@
                                         objectName: "artImage"; 
                                         source: artShapeLoader.cardArt;
                                         asynchronous: true;
+                                        visible: false;
                                         width: root.width; 
                                         height: width / artShape.aspect; 
                                         onStatusChanged: if (status === Image.Error) source = decodeURI("%5C");
@@ -206,7 +181,7 @@
                         id: touchdown; 
                         objectName: "touchdown"; 
                         anchors { fill: backgroundLoader } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
+                        visible: root.pressed;
                         radius: "medium"; 
                         borderSource: "radius_pressed.sci" 
                     }
 
=== modified file 'tests/plugins/Dash/cardcreator/11.res.cardcreator'
--- tests/plugins/Dash/cardcreator/11.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/11.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -59,6 +58,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: false;
                                 visible: status == Loader.Ready; 
@@ -67,39 +67,13 @@
                                     objectName: "artShape"; 
                                     visible: image.status == Image.Ready; 
                                     readonly property alias image: artImage; 
-                                    ShaderEffectSource { 
-                                        id: artShapeSource; 
-                                        sourceItem: artImage; 
-                                        anchors.centerIn: parent; 
-                                        width: 1; 
-                                        height: 1; 
-                                        hideSource: true;
-                                    } 
-                                    Loader { 
-                                        anchors.fill: parent; 
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent; 
-                                        Component { 
-                                            id: artShapeShapeComponent; 
-                                            UbuntuShape { 
-                                                source: artShapeSource; 
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop; 
-                                                radius: "medium"; 
-                                                aspect: { 
-                                                    switch (root.artShapeStyle) { 
-                                                        case "inset": return UbuntuShape.Inset; 
-                                                        case "shadow": return UbuntuShape.DropShadow; 
-                                                        default: 
-                                                        case "flat": return UbuntuShape.Flat; 
-                                                    } 
-                                                } 
-                                            } 
-                                        } 
-                                        Component { 
-                                            id: artShapeIconComponent; 
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; } 
-                                        } 
-                                    } 
+                                    UbuntuShape {
+                                        anchors.fill: parent;
+                                        source: artImage;
+                                        sourceFillMode: UbuntuShape.PreserveAspectCrop;
+                                        radius: "medium";
+                                        aspect: UbuntuShape.Flat;
+                                    }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1; 
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1;
                                     Component.onCompleted: { updateWidthHeightBindings(); } 
@@ -118,6 +92,7 @@
                                         objectName: "artImage"; 
                                         source: artShapeLoader.cardArt;
                                         asynchronous: false;
+                                        visible: false;
                                         width: root.width; 
                                         height: width / artShape.aspect; 
                                     } 
@@ -202,7 +177,7 @@
                         id: touchdown; 
                         objectName: "touchdown"; 
                         anchors { fill: backgroundLoader } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
+                        visible: root.pressed;
                         radius: "medium"; 
                         borderSource: "radius_pressed.sci" 
                     }
 
=== modified file 'tests/plugins/Dash/cardcreator/11.tst'
--- tests/plugins/Dash/cardcreator/11.tst	2016-01-25 16:49:26 +0000
+++ tests/plugins/Dash/cardcreator/11.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":{"elements":["#E9E9E9"],"type":"color"},"card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2 }
 components: {"art":{"aspect-ratio":1,"field":"art","fallback":"\\"},"background":{"field":"background"},"mascot":{"field":"icon","fallback":"\""},"subtitle":{"field":"author"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: flat
 result: 11.res
 \ No newline at end of file
 
=== modified file 'tests/plugins/Dash/cardcreator/2.res'
--- tests/plugins/Dash/cardcreator/2.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/2.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -126,13 +125,5 @@
  
                                 ] 
                     }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/2.res.cardcreator'
--- tests/plugins/Dash/cardcreator/2.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/2.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -124,13 +123,5 @@
  
                                 ] 
                     }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/2.tst'
--- tests/plugins/Dash/cardcreator/2.tst	2014-08-08 08:54:12 +0000
+++ tests/plugins/Dash/cardcreator/2.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":{"elements":["#E9E9E9"],"type":"color"},"card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":1},"background":{"field":"background"},"mascot":{"field":"icon"},"subtitle":{"field":"author"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: icon
 result: 2.res
 
=== modified file 'tests/plugins/Dash/cardcreator/3.res'
--- tests/plugins/Dash/cardcreator/3.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/3.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -22,6 +21,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || decodeURI("IHAVE%5C%22ESCAPED%5C%22QUOTES%5C%22");
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: true;
                                 visible: status == Loader.Ready;
@@ -30,38 +30,10 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: true;
-                                    }
-                                    Loader {
+                                    ProportionalShape {
                                         anchors.fill: parent;
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
+                                        source: artImage;
+                                        aspect: UbuntuShape.DropShadow;
                                     }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 0.75;
@@ -81,6 +53,7 @@
                                         objectName: "artImage";
                                         source: artShapeLoader.cardArt;
                                         asynchronous: true;
+                                        visible: false;
                                         width: root.width;
                                         height: width / artShape.aspect;
                                         onStatusChanged: if (status === Image.Error) source = decodeURI("IHAVE%5C%22ESCAPED%5C%22QUOTES%5C%22");
@@ -127,13 +100,5 @@
                             text: cardData && cardData["subtitle"] || ""; 
                             font.weight: Font.Light; 
                         }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: artShapeHolder }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: subtitleLabel.y + subtitleLabel.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/3.res.cardcreator'
--- tests/plugins/Dash/cardcreator/3.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/3.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -21,6 +20,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: false;
                                 visible: status == Loader.Ready;
@@ -29,38 +29,10 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: true;
-                                    }
-                                    Loader {
+                                    ProportionalShape {
                                         anchors.fill: parent;
-                                        visible: true;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
+                                        source: artImage;
+                                        aspect: UbuntuShape.DropShadow;
                                     }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 0.75;
@@ -80,6 +52,7 @@
                                         objectName: "artImage";
                                         source: artShapeLoader.cardArt;
                                         asynchronous: false;
+                                        visible: false;
                                         width: root.width;
                                         height: width / artShape.aspect;
                                     }
@@ -125,13 +98,5 @@
                             text: cardData && cardData["subtitle"] || ""; 
                             font.weight: Font.Light; 
                         }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: artShapeHolder }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: subtitleLabel.y + subtitleLabel.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/3.tst'
--- tests/plugins/Dash/cardcreator/3.tst	2016-01-21 22:44:41 +0000
+++ tests/plugins/Dash/cardcreator/3.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-layout":"vertical","card-size":"small","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":0.75,"field":"art","fallback":"IHAVE\\\"ESCAPED\\\"QUOTES\\\""},"subtitle":{"field":"price"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: icon
 result: 3.res
 
=== modified file 'tests/plugins/Dash/cardcreator/4.res'
--- tests/plugins/Dash/cardcreator/4.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/4.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null;
@@ -103,7 +102,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: root }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/4.res.cardcreator'
--- tests/plugins/Dash/cardcreator/4.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/4.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null;
@@ -101,7 +100,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: root }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/4.tst'
--- tests/plugins/Dash/cardcreator/4.tst	2014-08-08 08:54:12 +0000
+++ tests/plugins/Dash/cardcreator/4.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-layout":"horizontal","card-size":"large","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":1},"mascot":{"field":"mascot"},"subtitle":{"field":"domain"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: flat
 result: 4.res
 
=== modified file 'tests/plugins/Dash/cardcreator/5.res'
--- tests/plugins/Dash/cardcreator/5.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/5.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -22,6 +21,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: true;
                                 visible: status == Loader.Ready;
@@ -30,39 +30,6 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: false;
-                                    }
-                                    Loader {
-                                        anchors.fill: parent;
-                                        visible: false;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
-                                    }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1;
                                     Component.onCompleted: { updateWidthHeightBindings(); }
@@ -81,6 +48,7 @@
                                         objectName: "artImage";
                                         source: artShapeLoader.cardArt;
                                         asynchronous: true;
+                                        visible: true;
                                         width: root.width;
                                         height: width / artShape.aspect;
                                     }
@@ -145,13 +113,5 @@
                             text: cardData && cardData["subtitle"] || ""; 
                             font.weight: Font.Light; 
                         }
-UbuntuShape { 
-    id: touchdown; 
-    objectName: "touchdown"; 
-    anchors { fill: artShapeHolder } 
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium"; 
-    borderSource: "radius_pressed.sci" 
-}
 implicitHeight: artShapeHolder.height;
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/5.res.cardcreator'
--- tests/plugins/Dash/cardcreator/5.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/5.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -21,6 +20,7 @@
                                 id: artShapeLoader; 
                                 objectName: "artShapeLoader"; 
                                 readonly property string cardArt: cardData && cardData["art"] || "";
+                                onCardArtChanged: { if (item) { item.image.source = cardArt; } }
                                 active: cardArt != "";
                                 asynchronous: false;
                                 visible: status == Loader.Ready;
@@ -29,39 +29,6 @@
                                     objectName: "artShape";
                                     visible: image.status == Image.Ready;
                                     readonly property alias image: artImage;
-                                    ShaderEffectSource {
-                                        id: artShapeSource;
-                                        sourceItem: artImage;
-                                        anchors.centerIn: parent;
-                                        width: 1;
-                                        height: 1;
-                                        hideSource: false;
-                                    }
-                                    Loader {
-                                        anchors.fill: parent;
-                                        visible: false;
-                                        sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent;
-                                        Component {
-                                            id: artShapeShapeComponent;
-                                            UbuntuShape {
-                                                source: artShapeSource;
-                                                sourceFillMode: UbuntuShape.PreserveAspectCrop;
-                                                radius: "medium";
-                                                aspect: {
-                                                    switch (root.artShapeStyle) {
-                                                        case "inset": return UbuntuShape.Inset;
-                                                        case "shadow": return UbuntuShape.DropShadow;
-                                                        default:
-                                                        case "flat": return UbuntuShape.Flat;
-                                                    }
-                                                }
-                                            }
-                                        }
-                                        Component {
-                                            id: artShapeIconComponent;
-                                            ProportionalShape { source: artShapeSource; aspect: UbuntuShape.DropShadow; }
-                                        }
-                                    }
                                     readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1;
                                     readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : 1;
                                     Component.onCompleted: { updateWidthHeightBindings(); }
@@ -80,6 +47,7 @@
                                         objectName: "artImage";
                                         source: artShapeLoader.cardArt;
                                         asynchronous: false;
+                                        visible: true;
                                         width: root.width;
                                         height: width / artShape.aspect;
                                     }
@@ -144,13 +112,5 @@
                             text: cardData && cardData["subtitle"] || ""; 
                             font.weight: Font.Light; 
                         }
-UbuntuShape { 
-    id: touchdown; 
-    objectName: "touchdown"; 
-    anchors { fill: artShapeHolder } 
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium"; 
-    borderSource: "radius_pressed.sci" 
-}
 implicitHeight: artShapeHolder.height;
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/5.tst'
--- tests/plugins/Dash/cardcreator/5.tst	2016-01-28 14:11:14 +0000
+++ tests/plugins/Dash/cardcreator/5.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"non-interactive":true,"card-layout":"vertical","card-size":"medium","category-layout":"carousel","collapsed-rows":2,"overlay":true}
 components: {"art":{"aspect-ratio":1,"field":"art","conciergeMode":true},"subtitle":{"field":"artist"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: shadow
 result: 5.res
 
=== modified file 'tests/plugins/Dash/cardcreator/6.res'
--- tests/plugins/Dash/cardcreator/6.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/6.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton {
                 id: root;
                 property var cardData;
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0;
                 property var scopeStyle: null;
@@ -119,7 +118,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/6.res.cardcreator'
--- tests/plugins/Dash/cardcreator/6.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/6.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton {
                 id: root;
                 property var cardData;
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0;
                 property var scopeStyle: null;
@@ -118,7 +117,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/6.tst'
--- tests/plugins/Dash/cardcreator/6.tst	2015-05-13 10:21:18 +0000
+++ tests/plugins/Dash/cardcreator/6.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":"http://assets.ubuntu.com/sites/ubuntu/latest/u/img/logos/logo-ubuntu-grey.png","card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":1},"background":{"field":"background"},"subtitle":{"field":"author"},"title":{"field":"title"},"emblem":{"field":"source"},"attributes":{}}
+artShapeStyle: inset
 result: 6.res
 
=== modified file 'tests/plugins/Dash/cardcreator/7.res'
--- tests/plugins/Dash/cardcreator/7.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/7.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -139,13 +138,5 @@
  
                                 ] 
                     }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/7.res.cardcreator'
--- tests/plugins/Dash/cardcreator/7.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/7.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -137,13 +136,5 @@
  
                                 ] 
                     }
-UbuntuShape {
-    id: touchdown;
-    objectName: "touchdown";
-    anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
-    radius: "medium";
-    borderSource: "radius_pressed.sci"
-}
 implicitHeight: row.y + row.height + units.gu(1);
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/7.tst'
--- tests/plugins/Dash/cardcreator/7.tst	2015-05-13 10:21:18 +0000
+++ tests/plugins/Dash/cardcreator/7.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":{"elements":["#E9E9E9","#E9AAE9"],"type":"color"},"card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2}
 components: {"art":{"aspect-ratio":1},"background":{"field":"background"},"mascot":{"field":"icon"},"subtitle":{"field":"author"},"title":{"field":"title"},"attributes":{"field":"attributes","max-count":2}}
+artShapeStyle: icon
 result: 7.res
 
=== modified file 'tests/plugins/Dash/cardcreator/8.res'
--- tests/plugins/Dash/cardcreator/8.res	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/8.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData;
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -101,7 +100,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/8.res.cardcreator'
--- tests/plugins/Dash/cardcreator/8.res.cardcreator	2016-02-17 10:51:17 +0000
+++ tests/plugins/Dash/cardcreator/8.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData;
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -99,7 +98,7 @@
     id: touchdown;
     objectName: "touchdown";
     anchors { fill: backgroundLoader }
-    visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed;
+    visible: root.pressed;
     radius: "medium";
     borderSource: "radius_pressed.sci"
 }
 
=== modified file 'tests/plugins/Dash/cardcreator/8.tst'
--- tests/plugins/Dash/cardcreator/8.tst	2015-06-22 08:29:55 +0000
+++ tests/plugins/Dash/cardcreator/8.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-background":{"elements":["#E9E9E9","#E9AAE9"],"type":"color"},"card-layout":"vertical","card-size":"medium","category-layout":"grid","collapsed-rows":2}
 components: {"background":{"field":"background"},"mascot":{"field":"icon"},"title":{"field":"title"},"attributes":{}}
+artShapeStyle: inset
 result: 8.res
 
=== modified file 'tests/plugins/Dash/cardcreator/9.res'
--- tests/plugins/Dash/cardcreator/9.res	2016-03-10 16:53:04 +0000
+++ tests/plugins/Dash/cardcreator/9.res	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -112,7 +111,7 @@
                         id: touchdown; 
                         objectName: "touchdown"; 
                         anchors { fill: root } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
+                        visible: root.pressed;
                         radius: "medium"; 
                         borderSource: "radius_pressed.sci" 
                     }
 
=== modified file 'tests/plugins/Dash/cardcreator/9.res.cardcreator'
--- tests/plugins/Dash/cardcreator/9.res.cardcreator	2016-03-10 16:53:04 +0000
+++ tests/plugins/Dash/cardcreator/9.res.cardcreator	2016-03-18 11:31:31 +0000
@@ -1,7 +1,6 @@
 AbstractButton { 
                 id: root; 
                 property var cardData; 
-                property string artShapeStyle: "inset"; 
                 property string backgroundShapeStyle: "inset"; 
                 property real fontScale: 1.0; 
                 property var scopeStyle: null; 
@@ -111,7 +110,7 @@
                         id: touchdown; 
                         objectName: "touchdown"; 
                         anchors { fill: root } 
-                        visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; 
+                        visible: root.pressed;
                         radius: "medium"; 
                         borderSource: "radius_pressed.sci" 
                     }
 
=== modified file 'tests/plugins/Dash/cardcreator/9.tst'
--- tests/plugins/Dash/cardcreator/9.tst	2015-07-06 07:52:35 +0000
+++ tests/plugins/Dash/cardcreator/9.tst	2016-03-18 11:31:31 +0000
@@ -1,3 +1,4 @@
 template: {"card-layout":"horizontal","card-size":"medium","category-layout":"grid","collapsed-rows":2,"quick-preview-type": "audio"}
 components: {"art":{"aspect-ratio":1},"subtitle":{"field":"author"},"title":{"field":"title"}, "quickPreviewData": "quickPreviewData"}
+artShapeStyle: inset
 result: 9.res
 
=== modified file 'tests/plugins/Dash/cardcreatortest.cpp'
--- tests/plugins/Dash/cardcreatortest.cpp	2016-02-16 13:34:54 +0000
+++ tests/plugins/Dash/cardcreatortest.cpp	2016-03-18 11:31:31 +0000
@@ -73,6 +73,7 @@
     {
         const QString templateString("template: ");
         const QString componentsString("components: ");
+        const QString artShapeStyleString("artShapeStyle: ");
         const QString resultString("result: ");
 
         const QString testDirPath = DASHVIEWSTEST_FOLDER "/cardcreator/";
@@ -87,24 +88,26 @@
 
             QVERIFY(lines[0].startsWith(templateString));
             QVERIFY(lines[1].startsWith(componentsString));
-            QVERIFY(lines[2].startsWith(resultString));
+            QVERIFY(lines[2].startsWith(artShapeStyleString));
+            QVERIFY(lines[3].startsWith(resultString));
 
             const QString templateJSON = lines[0].mid(templateString.length());
             const QString componentsJSON = lines[1].mid(componentsString.length());
-            const QString resultFileName = lines[2].mid(resultString.length());
+            const QString artShapeStyle = lines[2].mid(artShapeStyleString.length());
+            const QString resultFileName = lines[3].mid(resultString.length());
             QVariant cardStringResult;
             QVariant createCardComponentResult;
 
-            QMetaObject::invokeMethod(view->rootObject(), "cardString", Q_RETURN_ARG(QVariant, cardStringResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, false));
+            QMetaObject::invokeMethod(view->rootObject(), "cardString", Q_RETURN_ARG(QVariant, cardStringResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, false), Q_ARG(QVariant, artShapeStyle));
             compareFileContents(testDirPath + resultFileName, cardStringResult.toString());
 
-            QMetaObject::invokeMethod(view->rootObject(), "cardString", Q_RETURN_ARG(QVariant, cardStringResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, true));
+            QMetaObject::invokeMethod(view->rootObject(), "cardString", Q_RETURN_ARG(QVariant, cardStringResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, true), Q_ARG(QVariant, artShapeStyle));
             compareFileContents(testDirPath + resultFileName + ".cardcreator", cardStringResult.toString());
 
-            QMetaObject::invokeMethod(view->rootObject(), "createCardComponent", Q_RETURN_ARG(QVariant, createCardComponentResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, false));
+            QMetaObject::invokeMethod(view->rootObject(), "createCardComponent", Q_RETURN_ARG(QVariant, createCardComponentResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, false), Q_ARG(QVariant, artShapeStyle));
             QVERIFY(createCardComponentResult.toBool());
 
-            QMetaObject::invokeMethod(view->rootObject(), "createCardComponent", Q_RETURN_ARG(QVariant, createCardComponentResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, true));
+            QMetaObject::invokeMethod(view->rootObject(), "createCardComponent", Q_RETURN_ARG(QVariant, createCardComponentResult), Q_ARG(QVariant, templateJSON), Q_ARG(QVariant, componentsJSON), Q_ARG(QVariant, true), Q_ARG(QVariant, artShapeStyle));
             QVERIFY(createCardComponentResult.toBool());
         }
     }
 
=== modified file 'tests/plugins/Dash/cardcreatortest.qml'
--- tests/plugins/Dash/cardcreatortest.qml	2016-02-16 13:34:54 +0000
+++ tests/plugins/Dash/cardcreatortest.qml	2016-03-18 11:31:31 +0000
@@ -19,11 +19,11 @@
 
 Item {
     id: root
-    function cardString(template, components, isCardCreator) {
-        return CardCreator.cardString(JSON.parse(template), JSON.parse(components), isCardCreator);
+    function cardString(template, components, isCardCreator, artShapeStyle) {
+        return CardCreator.cardString(JSON.parse(template), JSON.parse(components), isCardCreator, artShapeStyle);
     }
 
-    function createCardComponent(template, components, isCardCreator) {
-        return CardCreator.createCardComponent(root, JSON.parse(template), JSON.parse(components), isCardCreator) !== null;
+    function createCardComponent(template, components, isCardCreator, artShapeStyle) {
+        return CardCreator.createCardComponent(root, JSON.parse(template), JSON.parse(components), isCardCreator, artShapeStyle) !== null;
     }
 }
 
=== modified file 'tests/qmltests/Dash/tst_Card.qml'
--- tests/qmltests/Dash/tst_Card.qml	2016-02-11 13:13:31 +0000
+++ tests/qmltests/Dash/tst_Card.qml	2016-03-18 11:31:31 +0000
@@ -485,6 +485,18 @@
             tryCompare(art, "visible", true);
             compare(artImage.source, Qt.resolvedUrl("artwork/checkers.png"));
 
+            card.cardData["art"] = "somethingbroken";
+            card.cardDataChanged();
+            waitForRendering(card);
+            tryCompare(art, "visible", true);
+            compare(artImage.source, Qt.resolvedUrl("artwork/checkers.png"));
+
+            card.cardData["art"] = Qt.resolvedUrl("artwork/music-player-design.png");
+            card.cardDataChanged();
+            waitForRendering(card);
+            tryCompare(art, "visible", true);
+            compare(artImage.source, Qt.resolvedUrl("artwork/music-player-design.png"));
+
             card.cardData["mascot"] = "somethingbroken2";
             card.cardDataChanged();
             compare(mascotImage.status, Image.Error);