@@ -61,6 +61,7 @@ var kBackgroundLoaderCode = 'Loader {\n\
6161// %1 is used as anchors of artShapeHolder
6262// %2 is used as image width
6363// %3 is used as image height
64+// %4 is used as image fallback
6465var kArtShapeHolderCode = 'Item { \n\
6566 id: artShapeHolder; \n\
6667 height: root.fixedArtShapeSize.height > 0 ? root.fixedArtShapeSize.height : artShapeLoader.height; \n\
@@ -69,7 +70,8 @@ var kArtShapeHolderCode = 'Item { \n\
6970 Loader { \n\
7071 id: artShapeLoader; \n\
7172 objectName: "artShapeLoader"; \n\
72− active: cardData && cardData["art"] || false; \n\
73+ readonly property string cardArt: cardData && cardData["art"] || "%4"; \n\
74+ active: cardArt != "" || false; \n\
7375 asynchronous: root.asynchronous; \n\
7476 visible: status == Loader.Ready; \n\
7577 sourceComponent: Item { \n\
@@ -127,7 +129,7 @@ var kArtShapeHolderCode = 'Item { \n\
127129 CroppedImageMinimumSourceSize { \n\
128130 id: artImage; \n\
129131 objectName: "artImage"; \n\
130− source: cardData && cardData["art"] || ""; \n\
132+ source: artShapeLoader.cardArt; \n\
131133 asynchronous: root.asynchronous; \n\
132134 width: %2; \n\
133135 height: %3; \n\
@@ -205,11 +207,12 @@ var kMascotShapeLoaderCode = 'Loader { \n\
205207
206208// %1 is used as anchors of mascotImage
207209// %2 is used as visible of mascotImage
210+// %3 is used as fallback image
208211var kMascotImageCode = 'CroppedImageMinimumSourceSize { \n\
209212 id: mascotImage; \n\
210213 objectName: "mascotImage"; \n\
211214 anchors { %1 } \n\
212− source: cardData && cardData["mascot"] || ""; \n\
215+ source: cardData && cardData["mascot"] || "%3"; \n\
213216 width: units.gu(6); \n\
214217 height: units.gu(5.625); \n\
215218 horizontalAlignment: Image.AlignHCenter; \n\
@@ -390,8 +393,8 @@ function cardString(template, components) {
390393 heightCode = 'width / artShape.aspect';
391394 }
392395
393− code += kArtShapeHolderCode.arg(artAnchors).arg(widthCode).arg(heightCode);
394396 var fallback = components["art"] && components["art"]["fallback"] || "";
397+ code += kArtShapeHolderCode.arg(artAnchors).arg(widthCode).arg(heightCode).arg(fallback);
395398 if (fallback !== "") {
396399 code += 'Connections { target: artShapeLoader.item ? artShapeLoader.item.image : null; onStatusChanged: if (artShapeLoader.item.image.status === Image.Error) artShapeLoader.item.image.source = "%1"; } \n'.arg(fallback);
397400 }
@@ -473,8 +476,8 @@ function cardString(template, components) {
473476 }
474477
475478 var mascotImageVisible = useMascotShape ? 'false' : 'showHeader';
476− mascotCode = kMascotImageCode.arg(mascotAnchors).arg(mascotImageVisible);
477479 var fallback = components["mascot"] && components["mascot"]["fallback"] || "";
480+ mascotCode = kMascotImageCode.arg(mascotAnchors).arg(mascotImageVisible).arg(fallback);
478481 if (fallback !== "") {
479482 code += 'Connections { target: mascotImage; onStatusChanged: if (mascotImage.status === Image.Error) mascotImage.source = "%1"; } \n'.arg(fallback);
480483 }