OLD | NEW |
| (Empty) |
1 <link rel="import" href="../components/polymer/polymer.html"> | |
2 | |
3 <polymer-element name="td-model" attributes="filter items storageId"> | |
4 <script> | |
5 Polymer('td-model', { | |
6 filtered: null, | |
7 completedCount: 0, | |
8 activeCount: 0, | |
9 allCompleted: false, | |
10 ready: function() { | |
11 this.asyncMethod(function() { | |
12 this.items = this.items || []; | |
13 }); | |
14 }, | |
15 filterChanged: function() { | |
16 this.filterItems(); | |
17 }, | |
18 itemsChanged: function() { | |
19 this.completedCount = | |
20 this.items.filter(this.filters.completed
).length; | |
21 this.activeCount = this.items.length - this.comp
letedCount; | |
22 this.allCompleted = this.completedCount && !this
.activeCount; | |
23 this.filterItems(); | |
24 if (this.storage) { | |
25 this.storage.value = this.items; | |
26 this.storage.save(); | |
27 } | |
28 }, | |
29 storageIdChanged: function() { | |
30 this.storage = document.querySelector('#' + this
.storageId); | |
31 this.storage && (this.items = this.storage.value
); | |
32 }, | |
33 filterItems: function() { | |
34 var fn = this.filters[this.filter]; | |
35 this.filtered = fn ? this.items.filter(fn) : thi
s.items; | |
36 }, | |
37 newItem: function(title) { | |
38 title = String(title).trim(); | |
39 if (title) { | |
40 var item = { | |
41 title: title, | |
42 completed: false | |
43 }; | |
44 this.items.push(item); | |
45 this.itemsChanged(); | |
46 } | |
47 }, | |
48 destroyItem: function(item) { | |
49 var i = this.items.indexOf(item); | |
50 if (i >= 0) { | |
51 this.items.splice(i, 1); | |
52 } | |
53 this.itemsChanged(); | |
54 }, | |
55 clearItems: function(){ | |
56 this.items = this.items.filter(this.filters.acti
ve); | |
57 }, | |
58 setItemsCompleted: function(completed) { | |
59 this.items.forEach(function(item) { | |
60 item.completed = completed; | |
61 }); | |
62 this.itemsChanged(); | |
63 }, | |
64 filters: { | |
65 active: function(item) { | |
66 return !item.completed; | |
67 }, | |
68 completed: function(item) { | |
69 return item.completed; | |
70 } | |
71 } | |
72 }); | |
73 </script> | |
74 </polymer-element> | |
OLD | NEW |