2
* Copyright (C) 2013 Canonical, Ltd.
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.
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.
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/>.
19
import Ubuntu.Components 0.1
20
import Unity.Test 0.1 as UT
21
import "../../../qml/Dash"
22
import "CardHelpers.js" as Helpers
30
property string defaultLayout: '
34
"category-layout": "grid",
35
"card-layout": "vertical",
36
"card-size": "medium",
55
"full": "image://theme/rating-star-full",
56
"half": "image://theme/rating-star-half",
57
"empty": "image://theme/rating-star-empty"
65
property string cardData: '
67
"art": "../../tests/qmltests/Dash/artwork/music-player-design.png",
68
"mascot": "../../tests/qmltests/Dash/artwork/avatar.png",
71
"summary": "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
74
property string fullMapping: '
78
"subtitle": "subtitle",
83
property var cardsModel: [
85
"name": "Art, header, summary - vertical",
86
"layout": { "components": JSON.parse(fullMapping) }
89
"name": "Art, header, summary - vertical, small",
90
"layout": { "template": { "card-size": "small" }, "components": JSON.parse(fullMapping) }
93
"name": "Art, header, summary - vertical, large",
94
"layout": { "template": { "card-size": "large" }, "components": JSON.parse(fullMapping) }
97
"name": "Art, header, summary - vertical, wide",
98
"layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "art": { "aspect-ratio": 2 } }) }
101
"name": "Art, title - vertical, fitted",
102
"layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "art": { "fill-mode": "fit" } }) }
105
"name": "Art, header, summary - horizontal",
106
"layout": { "template": { "card-layout": "horizontal" },
107
"components": JSON.parse(fullMapping) }
110
"name": "Art, header - vertical",
111
"layout": { "components": Helpers.update(JSON.parse(root.fullMapping), { "summary": undefined }) }
114
"name": "Header title only - horizontal",
115
"layout": { "template": { "card-layout": "horizontal" },
116
"components": { "title": "title" } }
122
anchors { top: parent.top; left: parent.left; margins: units.gu(1) }
124
template: Helpers.update(JSON.parse(root.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['template'];
125
components: Helpers.update(JSON.parse(root.defaultLayout), Helpers.tryParse(layoutArea.text, layoutError))['components'];
126
cardData: Helpers.mapData(dataArea.text, components, dataError)
130
anchors { top: parent.top; bottom: parent.bottom; right: parent.right}
135
anchors { fill: parent; margins: units.gu(1) }
141
delegate: OptionSelectorDelegate { text: modelData.name }
142
onSelectedIndexChanged: updateAreas()
143
Component.onCompleted: updateAreas()
145
function updateAreas() {
146
var element = cardsModel[selectedIndex];
148
layoutArea.text = JSON.stringify(element.layout, undefined, 2) || "{}";
149
// FIXME: don't overwrite data
150
var data = JSON.parse(root.cardData);
151
Helpers.update(data, element.data);
152
dataArea.text = JSON.stringify(data, undefined, 2) || "{}";
154
layoutArea.text = "";
163
anchors { left: parent.left; right: parent.right }
169
anchors { left: parent.left; right: parent.right }
176
anchors { left: parent.left; right: parent.right }
182
anchors { left: parent.left; right: parent.right }
195
property Item header: findChild(card, "cardHeader")
196
property Item art: findChild(card, "artShape")
197
property Item artImage: findChild(card, "artImage")
198
property Item summary: findChild(card, "summaryLabel")
200
function initTestCase() {
201
verify(typeof testCase.header === "object", "Couldn't find header object.");
202
verify(typeof testCase.art === "object", "Couldn't find art object.");
203
verify(typeof testCase.artImage === "object", "Couldn't find artImage object.");
204
verify(typeof testCase.summary === "object", "Couldn't find summary object.");
208
selector.selectedIndex = -1;
212
function test_header_binding_data() {
214
{ tag: "Mascot", property: "mascot", value: Qt.resolvedUrl("artwork/avatar.png"), index: 0 },
215
{ tag: "Title", property: "title", value: "foo", index: 0 },
216
{ tag: "Subtitle", property: "subtitle", value: "bar", index: 0 },
220
function test_header_binding(data) {
221
selector.selectedIndex = data.index;
222
tryCompare(testCase.header, data.property, data.value);
225
function test_card_binding_data() {
227
{ tag: "Art", object: artImage, property: "source", value: Qt.resolvedUrl("artwork/music-player-design.png"), index: 0 },
228
{ tag: "Summary", object: summary, property: "text", field: "summary", index: 0 },
229
{ tag: "Fit", object: art, fill: Image.PreserveAspectFit, index: 4 },
233
function test_card_binding(data) {
234
selector.selectedIndex = data.index;
236
if (data.hasOwnProperty('value')) {
237
tryCompare(data.object, data.property, data.value);
240
if (data.hasOwnProperty('field')) {
241
tryCompare(data.object, data.property, card.cardData[data.field]);
245
function test_card_size_data() {
247
{ tag: "Medium", width: units.gu(18.5), index: 0 },
248
{ tag: "Small", width: units.gu(12), size: "small", index: 0 },
249
{ tag: "Large", width: units.gu(38), size: "large", index: 0 },
250
{ tag: "Wide", width: units.gu(18.5), aspect: 0.5, index: 0 },
251
{ tag: "Horizontal", width: units.gu(38), index: 5 },
252
// Make sure card ends with header when there's no summary
253
{ tag: "NoSummary", height: function() { return header.y + header.height }, index: 6 },
254
{ tag: "HorizontalNoSummary", height: function() { return header.height }, card_layout: "horizontal", index: 6 },
258
function test_card_size(data) {
259
selector.selectedIndex = data.index;
261
if (data.hasOwnProperty("size")) {
262
card.template['card-size'] = data.size;
263
card.templateChanged();
266
if (data.hasOwnProperty("card_layout")) {
267
card.template['card-layout'] = data.card_layout;
268
card.templateChanged();
271
if (data.hasOwnProperty("aspect")) {
272
card.components['art']['aspect-ratio'] = data.aspect;
273
card.componentsChanged();
276
if (data.hasOwnProperty("width")) {
277
tryCompare(card, "width", data.width);
280
if (typeof data.height === "function") {
281
tryCompareFunction(function() { return card.height === data.height() }, true);
282
} else if (data.hasOwnProperty("height")) {
283
tryCompare(card, "height", data.height);
287
function test_art_size_data() {
289
{ tag: "Medium", width: units.gu(18.5), fill: Image.PreserveAspectCrop, index: 0 },
290
{ tag: "Small", width: units.gu(12), index: 1 },
291
{ tag: "Large", width: units.gu(38), index: 2 },
292
{ tag: "Wide", height: units.gu(19), size: "large", index: 3 },
293
{ tag: "Fit", height: units.gu(38), size: "large", width: units.gu(19), index: 4 },
294
{ tag: "VerticalWidth", width: function() { return header.width }, index: 0 },
295
{ tag: "HorizontalHeight", height: function() { return header.height }, index: 5 },
296
{ tag: "HorizontalWidth", width: function() { return header.x }, index: 5 },
300
function test_art_size(data) {
301
selector.selectedIndex = data.index;
303
if (data.hasOwnProperty("size")) {
304
card.template['card-size'] = data.size;
305
card.templateChanged();
308
if (data.hasOwnProperty("aspect")) {
309
card.components['art']['aspect-ratio'] = data.aspect;
310
card.componentsChanged();
313
if (data.hasOwnProperty("width")) {
314
if (typeof data.width === "function") {
315
tryCompareFunction(function() { return art.width === data.width() }, true);
316
} else tryCompare(art, "width", data.width);
319
if (data.hasOwnProperty("height")) {
320
if (typeof data.height === "function") {
321
tryCompareFunction(function() { return art.height === data.height() }, true);
322
} else tryCompare(art, "height", data.height);
325
if (data.hasOwnProperty("fill")) {
326
tryCompare(artImage, "fillMode", data.fill);
330
function test_art_layout_data() {
332
{ tag: "Vertical", left: function() { return 0 }, index: 0},
333
{ tag: "Horizontal", left: function() { return art.width }, index: 5 },
337
function test_art_layout(data) {
338
selector.selectedIndex = data.index;
340
tryCompare(testCase.header, "x", data.left());
343
function test_header_layout_data() {
345
{ tag: "Vertical", top: function() { return art.y + art.height },
346
left: function() { return art.x }, index: 0 },
347
{ tag: "Horizontal", top: function() { return art.y },
348
left: function() { return art.x + art.width }, index: 5 },
352
function test_header_layout(data) {
353
selector.selectedIndex = data.index;
355
tryCompareFunction(function() { return testCase.header.y === data.top() }, true);
356
tryCompareFunction(function() { return testCase.header.x === data.left() }, true);
359
function test_art_visibility() {
360
selector.selectedIndex = 7
362
tryCompare(testCase.artImage, "source", "")
363
compare(testCase.art.visible, false)
364
compare(testCase.art.height, 0)
365
compare(testCase.art.width, 0)