Permalink
Browse files

adjustments to custom state events

  • Loading branch information...
hakimel committed Mar 31, 2012
1 parent 2c78eea commit 8dc7ae85a1794f35d56caa943e1e384a45c478dd
Showing with 34 additions and 17 deletions.
  1. +1 −5 css/main.css
  2. +7 −1 index.html
  3. +26 −11 js/reveal.js
View
@@ -901,11 +901,7 @@ html {
* STATES
*********************************************/
-.blur body {
-
-}
-
-.blur #reveal * {
+.blurred #reveal * {
color: rgba( 255, 255, 255, 0 );
text-shadow: 0px 0px 5px #fff;
View
@@ -114,7 +114,7 @@ <h2>Fantastic Ordered List</h2>
</ol>
</section>
- <section data-state="blur">
+ <section data-state="blurred">
<h2>Global State</h2>
<p>
If you set <code>data-state="something"</code> on a slide, <code>"something"</code>
@@ -253,6 +253,12 @@ <h3 class="inverted">BY Hakim El Hattab / hakim.se</h3>
transition: query.transition || 'default' // default/cube/page/concave/linear(2d)
});
+ // Example of binding an event to a state. This listener will trigger
+ // when the slide with 'data-state="blurred"' is opened.
+ document.querySelector( '#reveal' ).addEventListener( 'blurred', function() {
+
+ }, false );
+
hljs.initHighlightingOnLoad();
</script>
View
@@ -200,8 +200,6 @@ var Reveal = (function(){
case 40: navigateDown(); break; // down
}
- slide();
-
event.preventDefault();
}
@@ -490,21 +488,38 @@ var Reveal = (function(){
* set indices.
*/
function slide() {
- // Clean up the current state
- while( state.length ) {
- document.documentElement.classList.remove( state.pop() );
- }
+ // Remember the state before this slide
+ var stateBefore = state.concat();
+
+ // Reset the state array
+ state.length = 0;
+ // Activate and transition to the new slide
indexh = updateSlides( HORIZONTAL_SLIDES_SELECTOR, indexh );
indexv = updateSlides( VERTICAL_SLIDES_SELECTOR, indexv );
// Apply the new state
- for( var i = 0, len = state.length; i < len; i++ ) {
+ stateLoop: for( var i = 0, len = state.length; i < len; i++ ) {
+ // Check if this state existed on the previous slide. If it
+ // did, we will avoid adding it repeatedly.
+ for( var j = 0; j < stateBefore.length; j++ ) {
+ if( stateBefore[j] === state[i] ) {
+ stateBefore.splice( j, 1 );
+ continue stateLoop;
+ }
+ }
+
document.documentElement.classList.add( state[i] );
- // dispatch custom event
- var event = document.createEvent("HTMLEvents");
- event.initEvent(state[i], true, true);
- document.dispatchEvent(event);
+
+ // Dispatch custom event
+ var event = document.createEvent( "HTMLEvents" );
+ event.initEvent( state[i], false, true );
+ dom.wrapper.dispatchEvent( event );
+ }
+
+ // Clean up the remaints of the previous state
+ while( stateBefore.length ) {
+ document.documentElement.classList.remove( stateBefore.pop() );
}
// Update progress if enabled

0 comments on commit 8dc7ae8

Please sign in to comment.