Index: samples/third_party/todomvc_performance/js_todomvc/elements/td-model.html |
diff --git a/samples/third_party/todomvc_performance/js_todomvc/elements/td-model.html b/samples/third_party/todomvc_performance/js_todomvc/elements/td-model.html |
new file mode 100755 |
index 0000000000000000000000000000000000000000..19f3d2204332eca9d0136ae222d137f1fa87567a |
--- /dev/null |
+++ b/samples/third_party/todomvc_performance/js_todomvc/elements/td-model.html |
@@ -0,0 +1,74 @@ |
+<link rel="import" href="../components/polymer/polymer.html"> |
+ |
+<polymer-element name="td-model" attributes="filter items storageId"> |
+ <script> |
+ Polymer('td-model', { |
+ filtered: null, |
+ completedCount: 0, |
+ activeCount: 0, |
+ allCompleted: false, |
+ ready: function() { |
+ this.asyncMethod(function() { |
+ this.items = this.items || []; |
+ }); |
+ }, |
+ filterChanged: function() { |
+ this.filterItems(); |
+ }, |
+ itemsChanged: function() { |
+ this.completedCount = |
+ this.items.filter(this.filters.completed).length; |
+ this.activeCount = this.items.length - this.completedCount; |
+ this.allCompleted = this.completedCount && !this.activeCount; |
+ this.filterItems(); |
+ if (this.storage) { |
+ this.storage.value = this.items; |
+ this.storage.save(); |
+ } |
+ }, |
+ storageIdChanged: function() { |
+ this.storage = document.querySelector('#' + this.storageId); |
+ this.storage && (this.items = this.storage.value); |
+ }, |
+ filterItems: function() { |
+ var fn = this.filters[this.filter]; |
+ this.filtered = fn ? this.items.filter(fn) : this.items; |
+ }, |
+ newItem: function(title) { |
+ title = String(title).trim(); |
+ if (title) { |
+ var item = { |
+ title: title, |
+ completed: false |
+ }; |
+ this.items.push(item); |
+ this.itemsChanged(); |
+ } |
+ }, |
+ destroyItem: function(item) { |
+ var i = this.items.indexOf(item); |
+ if (i >= 0) { |
+ this.items.splice(i, 1); |
+ } |
+ this.itemsChanged(); |
+ }, |
+ clearItems: function(){ |
+ this.items = this.items.filter(this.filters.active); |
+ }, |
+ setItemsCompleted: function(completed) { |
+ this.items.forEach(function(item) { |
+ item.completed = completed; |
+ }); |
+ this.itemsChanged(); |
+ }, |
+ filters: { |
+ active: function(item) { |
+ return !item.completed; |
+ }, |
+ completed: function(item) { |
+ return item.completed; |
+ } |
+ } |
+ }); |
+ </script> |
+</polymer-element> |