1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
|
// Filter popup
enyo.kind({
name: "Abcd.FilterPopup",
kind: "onyx.Popup",
classes: "filter-popup",
centered: true,
modal: true,
floating: true,
published: {
filter: null,
},
events: {
onFilterChanged: ""
},
components: [
{name: "box", classes: "filterBox", components: [
]},
{name: "trash", kind: "Image", src: "images/trashcan.png", classes: "trashButton", ontap: "trashTaped"},
],
// Constructor
create: function() {
this.inherited(arguments);
this.filterChanged();
},
rendered: function() {
// Delete all
var items = [];
enyo.forEach(this.$.box.getControls(), function(item) {
items.push(item);
});
for (var i = 0 ; i < items.length ; i++) {
items[i].destroy();
}
// Display themes
var length = Abcd.themes.length;
for (var i = 0 ; i < length ; i++) {
this.$.box.createComponent(
{ kind: "Abcd.Theme", index: i, ontap: "displayCollections" },
{ owner: this }
).render();
}
// Display letters
for (var i = 0 ; i < 26 ; i++) {
var letter = String.fromCharCode(65+i).toLowerCase();
this.$.box.createComponent(
{ kind: "Abcd.Letter", letter: letter,
selected: (this.filter != null&&this.filter.letter == letter), ontap: "filterOnLetter" },
{ owner: this }
).render();
}
},
filterChanged: function() {
this.render();
},
// Trash taped, remove filter
trashTaped: function() {
this.hide();
this.filter = null;
this.doFilterChanged();
},
// Tap on a letter, filter on this letter
filterOnLetter: function(l, e) {
if (!Abcd.letters.hasOwnProperty(l.letter) || Abcd.letters[l.letter].length < 3)
return;
this.hide();
this.filter = l;
this.doFilterChanged();
}
});
|