diff options
Diffstat (limited to 'js')
-rw-r--r-- | js/slides.js | 25 |
1 files changed, 17 insertions, 8 deletions
diff --git a/js/slides.js b/js/slides.js index c6fe1ed..f6d5cc6 100644 --- a/js/slides.js +++ b/js/slides.js | |||
@@ -3,6 +3,7 @@ | |||
3 | */ | 3 | */ |
4 | function SlideDeck() { | 4 | function SlideDeck() { |
5 | this.curSlide_ = 0; | 5 | this.curSlide_ = 0; |
6 | this.prevSlide_ = 0; | ||
6 | this.slides = []; | 7 | this.slides = []; |
7 | this.config_ = null; | 8 | this.config_ = null; |
8 | 9 | ||
@@ -63,10 +64,15 @@ SlideDeck.prototype.addEventListeners_ = function() { | |||
63 | false); | 64 | false); |
64 | window.addEventListener('popstate', this.handlePopState_.bind(this), false); | 65 | window.addEventListener('popstate', this.handlePopState_.bind(this), false); |
65 | 66 | ||
66 | var self = this; | 67 | // Google Developer icon gray bar should reanimate on every slide enter. |
67 | var titleSlide = document.querySelector('#title-slide'); | 68 | var titleSlide = document.querySelector('#title-slide'); |
68 | titleSlide.addEventListener('slideenter', function(e) { | 69 | titleSlide.addEventListener('slideenter', function(e) { |
69 | self.buildNextItem_(); | 70 | this.buildNextItem_(); |
71 | }.bind(this), false); | ||
72 | titleSlide.addEventListener('slideleave', function(e) { | ||
73 | var bar = e.target.querySelector('.gdbar'); | ||
74 | bar.classList.remove('build-current'); | ||
75 | bar.classList.add('to-build'); | ||
70 | }, false); | 76 | }, false); |
71 | }; | 77 | }; |
72 | 78 | ||
@@ -236,6 +242,7 @@ SlideDeck.prototype.buildNextItem_ = function() { | |||
236 | */ | 242 | */ |
237 | SlideDeck.prototype.prevSlide = function(opt_dontPush) { | 243 | SlideDeck.prototype.prevSlide = function(opt_dontPush) { |
238 | if (this.curSlide_ > 0) { | 244 | if (this.curSlide_ > 0) { |
245 | this.prevSlide_ = this.curSlide_; | ||
239 | this.curSlide_--; | 246 | this.curSlide_--; |
240 | 247 | ||
241 | this.updateSlides_(opt_dontPush); | 248 | this.updateSlides_(opt_dontPush); |
@@ -252,6 +259,7 @@ SlideDeck.prototype.nextSlide = function(opt_dontPush) { | |||
252 | } | 259 | } |
253 | 260 | ||
254 | if (this.curSlide_ < this.slides_.length - 1) { | 261 | if (this.curSlide_ < this.slides_.length - 1) { |
262 | this.prevSlide_ = this.curSlide_; | ||
255 | this.curSlide_++; | 263 | this.curSlide_++; |
256 | 264 | ||
257 | this.updateSlides_(opt_dontPush); | 265 | this.updateSlides_(opt_dontPush); |
@@ -264,7 +272,7 @@ SlideDeck.prototype.nextSlide = function(opt_dontPush) { | |||
264 | * Triggered when a slide enter/leave event should be dispatched. | 272 | * Triggered when a slide enter/leave event should be dispatched. |
265 | * | 273 | * |
266 | * @param {string} type The type of event to trigger | 274 | * @param {string} type The type of event to trigger |
267 | * (e.g. 'onslideenter', 'onslideleave'). | 275 | * (e.g. 'slideenter', 'slideleave'). |
268 | * @param {number} slideNo The index of the slide that is being left. | 276 | * @param {number} slideNo The index of the slide that is being left. |
269 | */ | 277 | */ |
270 | SlideDeck.prototype.triggerSlideEvent = function(type, slideNo) { | 278 | SlideDeck.prototype.triggerSlideEvent = function(type, slideNo) { |
@@ -281,7 +289,7 @@ SlideDeck.prototype.triggerSlideEvent = function(type, slideNo) { | |||
281 | 289 | ||
282 | // Dispatch event to listeners setup using addEventListener. | 290 | // Dispatch event to listeners setup using addEventListener. |
283 | var evt = document.createEvent('Event'); | 291 | var evt = document.createEvent('Event'); |
284 | evt.initEvent(type.substring(2), true, true); | 292 | evt.initEvent(type, true, true); |
285 | evt.slideNumber = slideNo + 1; // Make it readable | 293 | evt.slideNumber = slideNo + 1; // Make it readable |
286 | evt.slide = el; | 294 | evt.slide = el; |
287 | 295 | ||
@@ -295,7 +303,7 @@ SlideDeck.prototype.updateSlides_ = function(opt_dontPush) { | |||
295 | var dontPush = opt_dontPush || false; | 303 | var dontPush = opt_dontPush || false; |
296 | 304 | ||
297 | var curSlide = this.curSlide_; | 305 | var curSlide = this.curSlide_; |
298 | for (var i = 0; i < this.slides_.length; i++) { | 306 | for (var i = 0; i < this.slides_.length; ++i) { |
299 | switch (i) { | 307 | switch (i) { |
300 | case curSlide - 2: | 308 | case curSlide - 2: |
301 | this.updateSlideClass_(i, 'far-past'); | 309 | this.updateSlideClass_(i, 'far-past'); |
@@ -318,8 +326,9 @@ SlideDeck.prototype.updateSlides_ = function(opt_dontPush) { | |||
318 | } | 326 | } |
319 | }; | 327 | }; |
320 | 328 | ||
321 | this.triggerSlideEvent('onslideleave', curSlide - 1); | 329 | //this.triggerSlideEvent('slideleave', curSlide - 1); |
322 | this.triggerSlideEvent('onslideenter', curSlide); | 330 | this.triggerSlideEvent('slideleave', this.prevSlide_); |
331 | this.triggerSlideEvent('slideenter', curSlide); | ||
323 | 332 | ||
324 | window.setTimeout(this.disableSlideFrames_.bind(this, curSlide - 2), 301); | 333 | window.setTimeout(this.disableSlideFrames_.bind(this, curSlide - 2), 301); |
325 | 334 | ||
@@ -413,7 +422,7 @@ SlideDeck.prototype.updateSlideClass_ = function(slideNo, className) { | |||
413 | el.classList.add(className); | 422 | el.classList.add(className); |
414 | } | 423 | } |
415 | 424 | ||
416 | for (var i = 0, slideClass; slideClass = this.SLIDE_CLASSES_[i]; i++) { | 425 | for (var i = 0, slideClass; slideClass = this.SLIDE_CLASSES_[i]; ++i) { |
417 | if (className != slideClass) { | 426 | if (className != slideClass) { |
418 | el.classList.remove(slideClass); | 427 | el.classList.remove(slideClass); |
419 | } | 428 | } |