Unity 8
 All Classes Functions Properties
CardTool.qml
1 /*
2  * Copyright (C) 2014 Canonical, Ltd.
3  *
4  * This program is free software; you can redistribute it and/or modify
5  * it under the terms of the GNU General Public License as published by
6  * the Free Software Foundation; version 3.
7  *
8  * This program is distributed in the hope that it will be useful,
9  * but WITHOUT ANY WARRANTY; without even the implied warranty of
10  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11  * GNU General Public License for more details.
12  *
13  * You should have received a copy of the GNU General Public License
14  * along with this program. If not, see <http://www.gnu.org/licenses/>.
15  */
16 
17 import QtQuick 2.0
18 
29 Item {
30  id: cardTool
31 
35  property int count
36 
40  property real viewWidth
41 
45  readonly property real carouselSelectedItemScaleFactor: 1.38 // XXX assuming 1.38 carousel scaling factor for cards
46 
50  property var template
51 
55  property var components
56 
60  property string categoryLayout: {
61  var layout = template["category-layout"];
62 
63  // carousel fallback mode to grid
64  if (layout === "carousel" && count <= Math.ceil(carouselTool.realPathItemCount)) layout = "grid";
65  return layout;
66  }
67 
68  // FIXME: Saviq
69  // Only way for the card below to actually be laid out completely.
70  // If invisible or in "data" array, some components are not taken into account.
71  width: 0
72  height: 0
73  clip: true
74 
80  readonly property var cardWidth: {
81  switch (categoryLayout) {
82  case "grid":
83  case "vertical-journal":
84  if (template["card-layout"] === "horizontal") return units.gu(38);
85  switch (template["card-size"]) {
86  case "small": return units.gu(12);
87  case "large": return units.gu(38);
88  }
89  return units.gu(18.5);
90  case "carousel":
91  return carouselTool.minimumTileWidth;
92  case undefined:
93  case "organic-grid":
94  case "journal":
95  default:
96  return undefined;
97  }
98  }
99 
105  readonly property var cardHeight: {
106  switch (categoryLayout) {
107  case "journal":
108  if (template["card-size"] >= 12 && template["card-size"] <= 38) return units.gu(template["card-size"]);
109  return units.gu(18.5);
110  case "grid":
111  return card.implicitHeight
112  case "carousel":
113  return cardWidth / (components ? components["art"]["aspect-ratio"] : 1)
114  case undefined:
115  case "organic-grid":
116  case "vertical-journal":
117  default:
118  return undefined;
119  }
120  }
121 
125  readonly property alias headerHeight: card.headerHeight
126 
130  readonly property int headerAlignment: {
131  var subtitle = components["subtitle"];
132  var price = components["price"];
133  var summary = components["summary"];
134 
135  var hasSubtitle = subtitle && (typeof subtitle === "string" || subtitle["field"])
136  var hasPrice = price && (typeof price === "string" || subtitle["field"]);
137  var hasSummary = summary && (typeof summary === "string" || summary["field"])
138 
139  var isOnlyTextComponent = !hasSubtitle && !hasPrice && !hasSummary;
140  if (!isOnlyTextComponent) return Text.AlignLeft;
141 
142  return (template["card-layout"] === "horizontal") ? Text.AlignLeft : Text.AlignHCenter;
143  }
144 
145  QtObject {
146  id: carouselTool
147 
148  property real minimumTileWidth: {
149  if (cardTool.viewWidth === undefined) return undefined;
150  if (cardTool.viewWidth <= units.gu(40)) return units.gu(18);
151  if (cardTool.viewWidth >= units.gu(128)) return units.gu(26);
152  return units.gu(18 + Math.round((cardTool.viewWidth - units.gu(40)) / units.gu(11)));
153  }
154 
155  readonly property real pathItemCount: 4.8457
156 
157  property real realPathItemCount: {
158  var scaledMinimumTileWidth = minimumTileWidth / cardTool.carouselSelectedItemScaleFactor;
159  var tileWidth = Math.max(cardTool.viewWidth / pathItemCount, scaledMinimumTileWidth);
160  return Math.min(cardTool.viewWidth / tileWidth, pathItemCount);
161  }
162  }
163 
164  Card {
165  id: card
166  objectName: "cardToolCard"
167  template: cardTool.template
168  components: cardTool.components
169 
170  width: cardTool.cardWidth || implicitWidth
171  height: cardTool.cardHeight || implicitHeight
172 
173  property var fields: ["art", "mascot", "title", "subtitle", "summary"]
174  property var maxData: {
175  "art": Qt.resolvedUrl("graphics/checkers.png"),
176  "mascot": Qt.resolvedUrl("graphics/checkers.png"),
177  "title": "—\n—",
178  "subtitle": "—",
179  "summary": "—\n—\n—\n—\n—"
180  }
181 
182  onComponentsChanged: {
183  var data = {};
184  for (var k in fields) {
185  var component = components[fields[k]];
186  var key = fields[k];
187  if ((typeof component === "string" && component.length > 0) ||
188  (typeof component === "object" && component !== null
189  && typeof component["field"] === "string" && component["field"].length > 0)) {
190  data[key] = maxData[key];
191  }
192  }
193  cardData = data;
194  }
195  }
196 }