From 54a8b7c30ab8ca909b71ef15b9c89cb940b77022 Mon Sep 17 00:00:00 2001 From: Kishore Subramanian Date: Tue, 20 Mar 2012 14:01:07 -0700 Subject: Reset the animation event handlers/timer when the display mode changes. --- .../ui/feed-reader/feed-reader.reel/feed-reader.js | 61 +++++++++++----------- 1 file changed, 31 insertions(+), 30 deletions(-) (limited to 'node_modules/montage') 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 49ce6523..0d5d7bb1 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,35 +40,39 @@ exports.FeedReader = Montage.create(Component, { this._fetchFeed(); } }, - + // time in ms between slides interval: {value: 3, distinct: true}, maxEntries: {value: 10, distinct: true}, - + entries: {value: null}, - + _feedDisplayMode: {value: null}, feedDisplayMode: { get: function() { return this._feedDisplayMode; }, set: function(value) { - this._feedDisplayMode = value; + + this.removeEntryAnimation(); + this._feedDisplayMode = value; + + this.addEntryAnimation(); } }, - - + + feedEntryTimer: {enumerable: false, value: null}, - + activeFeedEntry: {value: null}, _activeIndex: {value: null}, activeIndex: { get: function() { return this._activeIndex || 0; }, - set: function(index) { + set: function(index) { if(this.entries) { var max = this.entries.length-1; if(index > max) { @@ -77,17 +81,17 @@ exports.FeedReader = Montage.create(Component, { if(index < 0) { index = 0; } - this._activeIndex = index; - this.activeFeedEntry = this.entries[this._activeIndex]; + this._activeIndex = index; + this.activeFeedEntry = this.entries[this._activeIndex]; } else { this._activeIndex = 0; - } + } } }, _fetchFeed: { value: function() { - + var url = this.feedURL; var feed = new google.feeds.Feed(url); feed.setNumEntries(10); @@ -100,43 +104,40 @@ exports.FeedReader = Montage.create(Component, { if(result.error) { self.entries = []; } else { - //console.log('entries: ', result.feed.entries); - self.addEntryAnimation(); + //console.log('entries: ', result.feed.entries); + self.addEntryAnimation(); self.entries = result.feed.entries; this._activeIndex = 0; } - - + + }); } }, - + addEntryAnimation: { value: function() { var self = this; if("animation" == this.feedDisplayMode) { - this.element.addEventListener('webkitAnimationStart', this); this.element.addEventListener('webkitAnimationIteration', this); this.element.addEventListener('webkitAnimationEnd', this); - - - } else { - // timer + // timer this.feedEntryTimer = setInterval(function() { self.activeIndex = self.activeIndex + 1; }, (this.interval * 1000)); } } }, - + removeEntryAnimation: { value: function() { - if("animation" == this.feedDisplayMode) { + if("animation" == this.feedDisplayMode) { this.element.removeEventListener('webkitAnimationStart', this); this.element.removeEventListener('webkitAnimationIteration', this); this.element.removeEventListener('webkitAnimationEnd', this); + } else { if(this.feedEntryTimer) { window.clearInterval(this.feedEntryTimer); @@ -144,34 +145,34 @@ exports.FeedReader = Montage.create(Component, { } } }, - + handleWebkitAnimationStart: { value: function() { console.log('animation start'); } }, - + handleWebkitAnimationIteration: { value: function() { console.log('animation iteration'); this.activeIndex = this.activeIndex + 1; } }, - + handleWebkitAnimationEnd: { value: function() { console.log('animation end'); } }, - + prepareForDraw: { value: function() { } }, - + draw: { value: function() { - + } } -- cgit v1.2.3