diff options
author | Eric Bidelman | 2012-04-08 18:39:24 -0700 |
---|---|---|
committer | Eric Bidelman | 2012-04-08 18:39:24 -0700 |
commit | d370b1d98b2a3375cb6093d70fcbf791c867b46d (patch) | |
tree | 46bb07c49ac509b92d89b8c7431fe2105f0f25f9 /js | |
parent | 79c730f664bd8bda196c13282c5650f4ab282b25 (diff) | |
download | io-slides-remote-d370b1d98b2a3375cb6093d70fcbf791c867b46d.tar.gz |
Segue slides animate on ever slide enter
Diffstat (limited to 'js')
-rw-r--r-- | js/slides.js | 22 |
1 files changed, 20 insertions, 2 deletions
diff --git a/js/slides.js b/js/slides.js index dab51f9..e48924c 100644 --- a/js/slides.js +++ b/js/slides.js | |||
@@ -64,24 +64,42 @@ SlideDeck.prototype.addEventListeners_ = function() { | |||
64 | false); | 64 | false); |
65 | window.addEventListener('popstate', this.handlePopState_.bind(this), false); | 65 | window.addEventListener('popstate', this.handlePopState_.bind(this), false); |
66 | 66 | ||
67 | // Google Developer icon gray bar should reanimate on every slide enter. | 67 | // Google Developer icon gray bar and segue slide titles should reanimate on |
68 | // every slide enter. | ||
68 | var gbars = document.querySelectorAll('slide > .gdbar'); | 69 | var gbars = document.querySelectorAll('slide > .gdbar'); |
69 | for (var i = 0, gbar; gbar = gbars[i]; ++i) { | 70 | for (var i = 0, gbar; gbar = gbars[i]; ++i) { |
70 | var slide = gbar.parentElement; | 71 | var slide = gbar.parentElement; |
72 | |||
71 | slide.addEventListener('slideenter', function(e) { | 73 | slide.addEventListener('slideenter', function(e) { |
72 | this.buildNextItem_(); | 74 | this.buildNextItem_(); |
75 | if (e.target.classList.contains('segue')) { | ||
76 | e.target.querySelector('hgroup').classList.add('on'); | ||
77 | } | ||
73 | }.bind(this), false); | 78 | }.bind(this), false); |
79 | |||
74 | slide.addEventListener('slideleave', function(e) { | 80 | slide.addEventListener('slideleave', function(e) { |
75 | var bar = e.target.querySelector('.gdbar'); | 81 | var bar = e.target.querySelector('.gdbar'); |
76 | bar.classList.remove('build-current'); | 82 | bar.classList.remove('build-current'); |
77 | bar.classList.add('to-build'); | 83 | bar.classList.add('to-build'); |
84 | if (e.target.classList.contains('segue')) { | ||
85 | e.target.querySelector('hgroup').classList.remove('on'); | ||
86 | } | ||
78 | }, false); | 87 | }, false); |
79 | } | 88 | } |
89 | |||
90 | // document.addEventListener('webkitTransitionEnd', function(e) { | ||
91 | // var el = e.target; | ||
92 | // var property = e.propertyName; | ||
93 | // if (el.classList.contains('gdbar') && property == 'background-size') { | ||
94 | // console.log('done'); | ||
95 | // el.parentElement.parentElement.querySelector('article hgroup').classList.add('on'); | ||
96 | // } | ||
97 | // }, false); | ||
80 | }; | 98 | }; |
81 | 99 | ||
82 | /** | 100 | /** |
83 | * @private | 101 | * @private |
84 | * @param {Event} e | 102 | * @param {Event} e The pop event. |
85 | */ | 103 | */ |
86 | SlideDeck.prototype.handlePopState_ = function(e) { | 104 | SlideDeck.prototype.handlePopState_ = function(e) { |
87 | if (e.state != null) { | 105 | if (e.state != null) { |