on xenial help sign in
This gets most of the cards used nowadays in the scopes on the desktop to work
b50c047Albert Astals
plugins/Dash/CardCreator.js+49−21
@@ -1,8 +1,7 @@
1−
2.pragma library
1.pragma library
3
2
4/*
3/*
5− * Copyright (C) 2013 Canonical, Ltd.
4+ * Copyright (C) 2014 Canonical, Ltd.
6 *
5 *
7 * This program is free software; you can redistribute it and/or modify
6 * This program is free software; you can redistribute it and/or modify
8 * it under the terms of the GNU General Public License as published by
7 * it under the terms of the GNU General Public License as published by
@@ -46,6 +45,7 @@ function createCardComponent(parent, template, components) {
46 var hasTitle = components["title"] || false;
45 var hasTitle = components["title"] || false;
47 var hasMascot = components["mascot"] || false;
46 var hasMascot = components["mascot"] || false;
48 var hasSubtitle = components["subtitle"] || false;
47 var hasSubtitle = components["subtitle"] || false;
48+ var hasHeaderRow = hasMascot && hasTitle;
49 var mascotImageHeight = 'units.gu(5.625)';
49 var mascotImageHeight = 'units.gu(5.625)';
50
50
51 if (hasBackground) {
51 if (hasBackground) {
@@ -210,18 +210,40 @@ function createCardComponent(parent, template, components) {
210 anchors.topMargin: units.gu(1);';
210 anchors.topMargin: units.gu(1);';
211 }
211 }
212 }
212 }
213+ var headerLeftAnchor;
214+ if (isHorizontal) {
215+ if (hasArt) {
216+ headerLeftAnchor = 'anchors.left: artShapeHolder.right; \
217+ anchors.leftMargin: units.gu(1);';
218+ } else {
219+ headerLeftAnchor = 'anchors.left: parent.left;';
220+ }
221+ } else {
222+ headerLeftAnchor = 'anchors.left: parent.left; \
223+ anchors.leftMargin: units.gu(1);';
224+ }
225+
226+ if (hasHeaderRow) {
227+ code += 'Row { \
228+ id: row; \
229+ objectName: "outerRow"; \
230+ property real margins: units.gu(1); \
231+ spacing: margins; \
232+ ' + headerVerticalAnchors + '\
233+ ' + headerLeftAnchor + '\
234+ anchors.right: parent.right; \
235+ anchors.margins: margins;';
236+ }
213
237
214 if (hasMascot) {
238 if (hasMascot) {
215 var useMascotShape = !hasBackground && !inOverlay;
239 var useMascotShape = !hasBackground && !inOverlay;
216 var anchors = "";
240 var anchors = "";
217− if (isHorizontal) {
241+ if (!hasHeaderRow) {
218− anchors += 'anchors.left: artShapeHolder.right; \
242+ anchors += headerLeftAnchor;
219− anchors.leftMargin: units.gu(1);';
243+ anchors += headerVerticalAnchors;
220 } else {
244 } else {
221− anchors += 'anchors.left: parent.left; \
245+ anchors = "anchors.verticalCenter: parent.verticalCenter;"
222− anchors.leftMargin: units.gu(1);';
223 }
246 }
224− anchors += headerVerticalAnchors;
225
247
226 if (useMascotShape) {
248 if (useMascotShape) {
227 code += 'Loader { \
249 code += 'Loader { \
@@ -280,13 +302,10 @@ function createCardComponent(parent, template, components) {
280 if (hasMascot && hasSubtitle) {
302 if (hasMascot && hasSubtitle) {
281 titleAnchors = 'anchors { left: parent.left; right: parent.right }';
303 titleAnchors = 'anchors { left: parent.left; right: parent.right }';
282 subtitleAnchors = titleAnchors;
304 subtitleAnchors = titleAnchors;
283− code += 'Item { \
284− ' + anchors + '\
285− height: mascotImage.height; \
286− Column { \
305+ code += 'Column { \
287− anchors.verticalCenter: parent.verticalCenter; \
306+ anchors.verticalCenter: parent.verticalCenter; \
288− spacing: units.dp(2); \
307+ spacing: units.dp(2); \
289− width: parent.width - x;';
308+ width: parent.width - x;';
290 } else {
309 } else {
291 titleAnchors = anchors;
310 titleAnchors = anchors;
292 subtitleAnchors = 'anchors.left: parent.left; \
311 subtitleAnchors = 'anchors.left: parent.left; \
@@ -317,24 +336,29 @@ function createCardComponent(parent, template, components) {
317 ' + subtitleAnchors + '\
336 ' + subtitleAnchors + '\
318 elide: Text.ElideRight; \
337 elide: Text.ElideRight; \
319 fontSize: "small"; \
338 fontSize: "small"; \
320− wrapMode: Text.Wrap; \
321− maximumLineCount: 2; \
322 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
339 font.pixelSize: Math.round(FontUtils.sizeToPixels(fontSize) * fontScale); \
323 color: ' + color + '; \
340 color: ' + color + '; \
341+ visible: titleLabel.text; \
324− text: cardData && cardData["subtitle"] || " "; \
342+ text: cardData && cardData["subtitle"] || ""; \
325 font.weight: Font.Light; \
343 font.weight: Font.Light; \
326 horizontalAlignment: root.headerAlignment; \
344 horizontalAlignment: root.headerAlignment; \
327 }';
345 }';
328
346
329− // Close Column and Item
347+ // Close Column
330 if (hasMascot)
348 if (hasMascot)
331− code += '} }';
349+ code += '}';
332 }
350 }
333 }
351 }
334
352
353+ if (hasHeaderRow) {
354+ // Close Row
355+ code += '}';
356+ }
357+
335 if (hasSummary) {
358 if (hasSummary) {
336 var summaryTopAnchor;
359 var summaryTopAnchor;
337 if (isHorizontal) summaryTopAnchor = "artShapeHolder.bottom";
360 if (isHorizontal) summaryTopAnchor = "artShapeHolder.bottom";
361+ else if (hasHeaderRow) summaryTopAnchor = "row.bottom";
338 else if (hasMascot) summaryTopAnchor = "mascotImage.bottom";
362 else if (hasMascot) summaryTopAnchor = "mascotImage.bottom";
339 else if (hasSubtitle) summaryTopAnchor = "subtitleLabel.bottom";
363 else if (hasSubtitle) summaryTopAnchor = "subtitleLabel.bottom";
340 else if (hasTitle) summaryTopAnchor = "titleLabel.bottom";
364 else if (hasTitle) summaryTopAnchor = "titleLabel.bottom";
@@ -371,10 +395,14 @@ function createCardComponent(parent, template, components) {
371 code += 'implicitHeight: summary.y + summary.height + (summary.text && backgroundLoader.active ? units.gu(1) : 0);';
395 code += 'implicitHeight: summary.y + summary.height + (summary.text && backgroundLoader.active ? units.gu(1) : 0);';
372 } else if (hasSummary) {
396 } else if (hasSummary) {
373 code += 'implicitHeight: summary.y + summary.height;';
397 code += 'implicitHeight: summary.y + summary.height;';
398+ } else if (hasHeaderRow) {
399+ code += 'implicitHeight: row.y + row.height + units.gu(1);';
374 } else if (hasMascot) {
400 } else if (hasMascot) {
375 code += 'implicitHeight: mascotImage.y + mascotImage.height;';
401 code += 'implicitHeight: mascotImage.y + mascotImage.height;';
402+ } else if (hasSubtitle) {
403+ code += 'implicitHeight: subtitleLabel.y + subtitleLabel.height + units.gu(1);';
376 } else if (hasTitle) {
404 } else if (hasTitle) {
377− code += 'implicitHeight: titleLabel.y + titleLabel.height;';
405+ code += 'implicitHeight: titleLabel.y + titleLabel.height + units.gu(1);';
378 }
406 }
379 code += '}';
407 code += '}';
380
408