Changes to the Demo

- Feed Reader now shows one entry at a time
- Category dropdown removed form the Map. It is included as part of the example code
- Changed the categories that do not return results

3 files changed, 74 insertions, 4 deletions

diff --git a/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.html b/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.html
index 213b4602..6c3a5298 100644
--- a/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.html
+++ b/node_modules/montage/ui/feed-reader/feed-entry.reel/feed-entry.html
@@ -61,7 +61,6 @@
        .feed-entry {
            padding: 10px;
            margin: 3px 0;
-           border: 1px solid #aaa;
        }
        .feed-entry h2 {
            font-size: 24px;
diff --git a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html
index a3523001..646fd01e 100644
--- a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html
+++ b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.html
@@ -53,7 +53,15 @@
         "module": "montage/ui/feed-reader/feed-reader.reel",
         "name": "FeedReader",
         "properties": {
-            "element": {"#": "feed-reader"}
+            "element": {"#": "feed-reader"},
+            "repetition": {"@": "repetition"}
+        },
+        "bindings": {
+            "items": {
+                "boundObject": {"@": "repetition"},
+                "boundObjectPropertyPath": "objects",
+                "oneway": true
+            }
         }
     }
     
@@ -61,8 +69,20 @@
     </script>
 
     <style>
-       .feed-reader {
-           padding: 10px;
+       div.feed-reader  {
+           padding: 10px;          
+       }
+       
+       .feed-entry {
+           display: none;
+       }
+       
+       .montage-hidden {
+           display: none;
+       }
+       
+       .active {
+           display: block;
        }
        
     </style>
diff --git a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js
index 838a957d..d5c9ca17 100644
--- a/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js
+++ b/node_modules/montage/ui/feed-reader/feed-reader.reel/feed-reader.js
@@ -40,7 +40,13 @@ exports.FeedReader = Montage.create(Component, {
             this._fetchFeed();
         }
     },
+    
+    // time in ms between slides
+    interval: {value: 3000, distinct: true},
+    
+    repetition: {enumerable: false, value: null},
 
+    maxEntries: {value: 10, distinct: true},
     entries: {value: null},
 
 
@@ -55,6 +61,51 @@ exports.FeedReader = Montage.create(Component, {
             //Notifier.hide();
         }
     },
+    
+    
+    feedEntryTimer: {enumerable: false, value: null},
+    _items: {
+        value: null
+    },
+    items: {
+        get: function() {
+            return this._items;
+        },
+        set: function(value) {
+            this._items = value;
+            // reset the counter
+            console.log('got items');
+            this.activeIndex = 0;
+            
+            if(this.feedEntryTimer) {
+                window.clearInterval(this.feedEntryTimer);
+            }
+            var self = this, maxEntries = self.maxEntries;
+            
+            this.feedEntryTimer = setInterval(function() {
+                var index = self.activeIndex + 1;
+                if(index > maxEntries) {
+                    index = 0;
+                }
+                if(index < 0) {
+                    index = 0;
+                }
+                self.activeIndex = index;
+                
+            }, this.interval);
+        }
+    },
+    
+    _activeIndex: {value: null},
+    activeIndex: {
+        get: function() {
+            return this._activeIndex || 0;
+        },
+        set: function(value) {
+            this._activeIndex = value;
+            this.repetition.activeIndexes = [value];
+        }
+    },
 
     _fetchFeed: {
         value: function() {