@@ -59,14 +59,34 @@ var kBackgroundLoaderCode = 'Loader {\n\
5959 } \n\
6060 }\n';
6161
62+// %1 is the visible code
63+// %2 is the aspect of the UbuntuShape
64+var kArtUbuntuShapeCode = 'UbuntuShape { \n\
65+ anchors.fill: parent; \n\
66+ visible: %1; \n\
67+ source: artImage; \n\
68+ sourceFillMode: UbuntuShape.PreserveAspectCrop; \n\
69+ radius: "medium"; \n\
70+ aspect: %2; \n\
71+ }';
72+
73+// %1 is the visible code
74+var kArtProportionalShapeCode = 'ProportionalShape { \n\
75+ anchors.fill: parent; \n\
76+ visible: %1; \n\
77+ source: artImage; \n\
78+ aspect: UbuntuShape.DropShadow; \n\
79+ }';
80+
6281// %1 is used as anchors of artShapeHolder
6382// %2 is used as image width
6483// %3 is used as image height
65−// %4 is whether the image or the Loader with the UbuntuShape/ProportionalShape should be visible
84+// %4 is whether the image should be visible
6685// %5 is used as aspect ratio fallback
6786// %6 is whether the loader should be asynchronous or not
68−// %7 is injected as code to artImage
69−// %8 is used as image fallback
87+// %7 is the shape code we want to use
88+// %8 is injected as code to artImage
89+// %9 is used as image fallback
7090var kArtShapeHolderCode = 'Item { \n\
7191 id: artShapeHolder; \n\
7292 height: root.fixedArtShapeSize.height > 0 ? root.fixedArtShapeSize.height : artShapeLoader.height; \n\
@@ -75,7 +95,7 @@ var kArtShapeHolderCode = 'Item { \n\
7595 Loader { \n\
7696 id: artShapeLoader; \n\
7797 objectName: "artShapeLoader"; \n\
78− readonly property string cardArt: cardData && cardData["art"] || %8; \n\
98+ readonly property string cardArt: cardData && cardData["art"] || %9; \n\
7999 active: cardArt != ""; \n\
80100 asynchronous: %6; \n\
81101 visible: status == Loader.Ready; \n\
@@ -84,31 +104,7 @@ var kArtShapeHolderCode = 'Item { \n\
84104 objectName: "artShape"; \n\
85105 visible: image.status == Image.Ready; \n\
86106 readonly property alias image: artImage; \n\
87− Loader { \n\
88− anchors.fill: parent; \n\
89− visible: %4; \n\
90− sourceComponent: root.artShapeStyle === "icon" ? artShapeIconComponent : artShapeShapeComponent; \n\
91− Component { \n\
92− id: artShapeShapeComponent; \n\
93− UbuntuShape { \n\
94− source: artImage; \n\
95− sourceFillMode: UbuntuShape.PreserveAspectCrop; \n\
96− radius: "medium"; \n\
97− aspect: { \n\
98− switch (root.artShapeStyle) { \n\
99− case "inset": return UbuntuShape.Inset; \n\
100− case "shadow": return UbuntuShape.DropShadow; \n\
101− default: \n\
102− case "flat": return UbuntuShape.Flat; \n\
103− } \n\
104− } \n\
105− } \n\
106− } \n\
107− Component { \n\
108− id: artShapeIconComponent; \n\
109− ProportionalShape { source: artImage; aspect: UbuntuShape.DropShadow; } \n\
110− } \n\
111− } \n\
107+ %7 \n\
112108 readonly property real fixedArtShapeSizeAspect: (root.fixedArtShapeSize.height > 0 && root.fixedArtShapeSize.width > 0) ? root.fixedArtShapeSize.width / root.fixedArtShapeSize.height : -1; \n\
113109 readonly property real aspect: fixedArtShapeSizeAspect > 0 ? fixedArtShapeSizeAspect : %5; \n\
114110 Component.onCompleted: { updateWidthHeightBindings(); } \n\
@@ -127,10 +123,10 @@ var kArtShapeHolderCode = 'Item { \n\
127123 objectName: "artImage"; \n\
128124 source: artShapeLoader.cardArt; \n\
129125 asynchronous: %6; \n\
130− visible: !%4; \n\
126+ visible: %4; \n\
131127 width: %2; \n\
132128 height: %3; \n\
133− %7 \n\
129+ %8 \n\
134130 } \n\
135131 } \n\
136132 } \n\
@@ -316,7 +312,7 @@ var kTouchdownCode = 'UbuntuShape { \n\
316312 id: touchdown; \n\
317313 objectName: "touchdown"; \n\
318314 anchors { %1 } \n\
319− visible: root.artShapeStyle != "shadow" && root.artShapeStyle != "icon" && root.pressed; \n\
315+ visible: root.pressed; \n\
320316 radius: "medium"; \n\
321317 borderSource: "radius_pressed.sci" \n\
322318 }\n';
@@ -399,7 +395,7 @@ function sanitizeColor(colorString) {
399395 return colorString;
400396}
401397
402−function cardString(template, components, isCardTool) {
398+function cardString(template, components, isCardTool, artShapeStyle) {
403399 var code;
404400
405401 var templateInteractive = (template == null ? true : (template["non-interactive"] !== undefined ? !template["non-interactive"] : true)) ? "true" : "false";
@@ -407,7 +403,6 @@ function cardString(template, components, isCardTool) {
407403 code = 'AbstractButton { \n\
408404 id: root; \n\
409405 property var cardData; \n\
410− property string artShapeStyle: "inset"; \n\
411406 property string backgroundShapeStyle: "inset"; \n\
412407 property real fontScale: 1.0; \n\
413408 property var scopeStyle: null; \n\
@@ -504,17 +499,32 @@ function cardString(template, components, isCardTool) {
504499 var fallbackStatusCode = "";
505500 var fallbackURICode = '""';
506501 if (fallback !== "") {
507− // fallbackStatusCode has %6 in it because we want to substitute it for fallbackURICode
508− // which in kArtShapeHolderCode is %8
509− fallbackStatusCode += 'onStatusChanged: if (status === Image.Error) source = %8;';
502+ // fallbackStatusCode has %9 in it because we want to substitute it for fallbackURICode
503+ // which in kArtShapeHolderCode is %9
504+ fallbackStatusCode += 'onStatusChanged: if (status === Image.Error) source = %9;';
510505 fallbackURICode = 'decodeURI("%1")'.arg(fallback);
511506 }
507+ var artShapeHolderShapeCode;
508+ if (artShapeStyle === "icon") {
509+ artShapeHolderShapeCode = kArtProportionalShapeCode.arg(isConciergeMode ? "false" : "true");
510+ } else {
511+ var artShapeHolderShapeAspect;
512+ switch (artShapeStyle) {
513+ case "inset": artShapeHolderShapeAspect = "UbuntuShape.Inset"; break;
514+ case "shadow": artShapeHolderShapeAspect = "UbuntuShape.DropShadow"; break;
515+ default:
516+ case "flat": artShapeHolderShapeAspect = "UbuntuShape.Flat"; break;
517+ }
518+ artShapeHolderShapeCode = kArtUbuntuShapeCode.arg(isConciergeMode ? "false" : "true")
519+ .arg(artShapeHolderShapeAspect);
520+ }
512521 code += kArtShapeHolderCode.arg(artAnchors)
513522 .arg(widthCode)
514523 .arg(heightCode)
515− .arg(isConciergeMode ? "false" : "true")
524+ .arg(isConciergeMode ? "true" : "false")
516525 .arg(aspectRatio)
517526 .arg(asynchronous)
527+ .arg(artShapeHolderShapeCode)
518528 .arg(fallbackStatusCode)
519529 .arg(fallbackURICode);
520530 } else {
@@ -839,15 +849,17 @@ function cardString(template, components, isCardTool) {
839849 code += kSummaryLabelCode.arg(summaryTopAnchor).arg(summaryTopMargin).arg(summaryColor);
840850 }
841851
842− var touchdownAnchors;
843− if (hasBackground) {
844− touchdownAnchors = 'fill: backgroundLoader';
845− } else if (touchdownOnArtShape) {
846− touchdownAnchors = 'fill: artShapeHolder';
847− } else {
848− touchdownAnchors = 'fill: root'
852+ if (artShapeStyle != "shadow" && artShapeStyle != "icon") {
853+ var touchdownAnchors;
854+ if (hasBackground) {
855+ touchdownAnchors = 'fill: backgroundLoader';
856+ } else if (touchdownOnArtShape) {
857+ touchdownAnchors = 'fill: artShapeHolder';
858+ } else {
859+ touchdownAnchors = 'fill: root'
860+ }
861+ code += kTouchdownCode.arg(touchdownAnchors);
849862 }
850− code += kTouchdownCode.arg(touchdownAnchors);
851863
852864 var implicitHeight = 'implicitHeight: ';
853865 if (hasSummary) {
@@ -880,13 +892,13 @@ function cardString(template, components, isCardTool) {
880892 return code;
881893}
882894
883−function createCardComponent(parent, template, components, isCardTool, identifier) {
895+function createCardComponent(parent, template, components, isCardTool, artShapeStyle, identifier) {
884896 var imports = 'import QtQuick 2.4; \n\
885897 import Ubuntu.Components 1.3; \n\
886898 import Ubuntu.Settings.Components 0.1; \n\
887899 import Dash 0.1;\n\
888900 import Utils 0.1;\n';
889− var card = cardString(template, components, isCardTool);
901+ var card = cardString(template, components, isCardTool, artShapeStyle);
890902 var code = imports + 'Component {\n' + card + '}\n';
891903
892904 try {