From 401c554c8001a6c444c1e70d5e5cd728d7740b38 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Tue, 3 Jan 2012 22:25:15 -0800 Subject: [PATCH] removed dependency on classList (#9) --- css/main.css | 2 +- js/reveal.js | 58 +++++++++++++++++++++++++++++++++------------------- 2 files changed, 38 insertions(+), 22 deletions(-) diff --git a/css/main.css b/css/main.css index 2a590b73..98471edc 100644 --- a/css/main.css +++ b/css/main.css @@ -41,7 +41,7 @@ html, body { } html { - background: #555a5f; + background: #1c1e20; background: -moz-radial-gradient(center, ellipse cover, #555a5f 0%, #1c1e20 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#555a5f), color-stop(100%,#1c1e20)); background: -webkit-radial-gradient(center, ellipse cover, #555a5f 0%,#1c1e20 100%); diff --git a/js/reveal.js b/js/reveal.js index 767c4b97..75d31415 100644 --- a/js/reveal.js +++ b/js/reveal.js @@ -121,6 +121,8 @@ var Reveal = (function(){ if( !supports2DTransforms && !supports3DTransforms ) { document.body.setAttribute( 'class', 'no-transforms' ); + // If the browser doesn't support transforms we won't be + // using JavaScript to control the presentation return; } @@ -160,11 +162,11 @@ var Reveal = (function(){ } if( config.transition !== 'default' ) { - dom.wrapper.classList.add( config.transition ); + addClass( dom.wrapper, config.transition ); } if( config.theme !== 'default' ) { - dom.wrapper.classList.add( config.theme ); + addClass( dom.wrapper, config.theme ); } if( config.rollingLinks ) { @@ -304,8 +306,8 @@ var Reveal = (function(){ for( var i = 0, len = nodes.length; i < len; i++ ) { var node = nodes[i]; - if( node.textContent && ( !node.className || !node.className.match( /roll/g ) ) ) { - node.className += ' roll'; + if( node.textContent && ( !node.className || !hasClass( node, 'roll' ) ) ) { + addClass( node, 'roll' ); node.innerHTML = '' + node.innerHTML + ''; } }; @@ -320,7 +322,7 @@ var Reveal = (function(){ * can't be improved. */ function activateOverview() { - dom.wrapper.classList.add( 'overview' ); + addClass( dom.wrapper, 'overview' ); var horizontalSlides = Array.prototype.slice.call( document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR ) ); @@ -336,7 +338,7 @@ var Reveal = (function(){ hslide.style.OTransform = htransform; hslide.style.transform = htransform; - if( !hslide.classList.contains( 'stack' ) ) { + if( !hasClass( hslide, 'stack' ) ) { // Navigate to this slide on click hslide.addEventListener( 'click', onOverviewSlideClicked, true ); } @@ -367,7 +369,7 @@ var Reveal = (function(){ * active slide. */ function deactivateOverview() { - dom.wrapper.classList.remove( 'overview' ); + removeClass( dom.wrapper, 'overview' ); var slides = Array.prototype.slice.call( document.querySelectorAll( '#reveal .slides section' ) ); @@ -394,7 +396,7 @@ var Reveal = (function(){ * false otherwise */ function overviewIsActive() { - return dom.wrapper.classList.contains( 'overview' ); + return hasClass( dom.wrapper, 'overview' ); } /** @@ -438,7 +440,7 @@ var Reveal = (function(){ // Enforce max and minimum index bounds index = Math.max(Math.min(index, slides.length - 1), 0); - slides[index].setAttribute('class', 'present'); + slides[index].className = 'present'; for( var i = 0; i < slides.length; i++ ) { var slide = slides[i]; @@ -451,16 +453,16 @@ var Reveal = (function(){ if( i < index ) { // Any element previous to index is given the 'past' class - slide.setAttribute('class', 'past'); + slide.className = 'past'; } else if( i > index ) { // Any element subsequent to index is given the 'future' class - slide.setAttribute('class', 'future'); + slide.className = 'future'; } // If this element contains vertical slides if( slide.querySelector( 'section' ) ) { - slide.classList.add( 'stack' ); + addClass( slide, 'stack' ); } } } @@ -505,13 +507,13 @@ var Reveal = (function(){ // Remove the 'enabled' class from all directions [ dom.controlsLeft, dom.controlsRight, dom.controlsUp, dom.controlsDown ].forEach( function( node ) { - node.classList.remove( 'enabled' ); + removeClass( node, 'enabled' ); } ) - if( routes.left ) dom.controlsLeft.classList.add( 'enabled' ); - if( routes.right ) dom.controlsRight.classList.add( 'enabled' ); - if( routes.up ) dom.controlsUp.classList.add( 'enabled' ); - if( routes.down ) dom.controlsDown.classList.add( 'enabled' ); + if( routes.left ) addClass( dom.controlsLeft, 'enabled' ); + if( routes.right ) addClass( dom.controlsRight, 'enabled' ); + if( routes.up ) addClass( dom.controlsUp, 'enabled' ); + if( routes.down ) addClass( dom.controlsDown, 'enabled' ); } /** @@ -573,7 +575,7 @@ var Reveal = (function(){ if( document.querySelector( VERTICAL_SLIDES_SELECTOR + '.present' ) ) { var verticalFragments = document.querySelectorAll( VERTICAL_SLIDES_SELECTOR + '.present .fragment:not(.visible)' ); if( verticalFragments.length ) { - verticalFragments[0].classList.add( 'visible' ); + addClass( verticalFragments[0], 'visible' ); return true; } } @@ -581,7 +583,7 @@ var Reveal = (function(){ else { var horizontalFragments = document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR + '.present .fragment:not(.visible)' ); if( horizontalFragments.length ) { - horizontalFragments[0].classList.add( 'visible' ); + addClass( horizontalFragments[0], 'visible' ); return true; } } @@ -600,7 +602,7 @@ var Reveal = (function(){ if( document.querySelector( VERTICAL_SLIDES_SELECTOR + '.present' ) ) { var verticalFragments = document.querySelectorAll( VERTICAL_SLIDES_SELECTOR + '.present .fragment.visible' ); if( verticalFragments.length ) { - verticalFragments[ verticalFragments.length - 1 ].classList.remove( 'visible' ); + removeClass( verticalFragments[ verticalFragments.length - 1 ], 'visible' ); return true; } } @@ -608,7 +610,7 @@ var Reveal = (function(){ else { var horizontalFragments = document.querySelectorAll( HORIZONTAL_SLIDES_SELECTOR + '.present .fragment.visible' ); if( horizontalFragments.length ) { - horizontalFragments[ horizontalFragments.length - 1 ].classList.remove( 'visible' ); + removeClass( horizontalFragments[ horizontalFragments.length - 1 ], 'visible' ); return true; } } @@ -616,6 +618,20 @@ var Reveal = (function(){ return false; } + function hasClass( node, klass ) { + return !!node.className.match( klass ); + } + + function addClass( node, klass ) { + if( !hasClass( node, klass ) ) { + node.className += ' ' + klass; + } + } + + function removeClass( node, klass ) { + node.className = node.className.replace( klass, '' ); + } + /** * Triggers a navigation to the specified indices. *