Skip to content

Commit

Permalink
rewrote initialization code for clarity and brevity (#105)
Browse files Browse the repository at this point in the history
  • Loading branch information
hakimel committed Aug 12, 2012
1 parent 1ba1ca1 commit 49e8e0d
Show file tree
Hide file tree
Showing 3 changed files with 169 additions and 142 deletions.
82 changes: 24 additions & 58 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
<head>
<meta charset="utf-8">

<title>reveal.js - HTML5 Presentations</title>
<title>reveal.js - The HTML Presentation Framework</title>

<meta name="description" content="A framework for easily creating beautiful presentations using HTML">
<meta name="author" content="Hakim El Hattab">
Expand All @@ -21,9 +21,8 @@
<link rel="stylesheet" href="lib/css/zenburn.css">

<script>
// If the query includes print-pdf we'll use the PDF print sheet
var printStyle = window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper';
document.write( '<link rel="stylesheet" href="css/print/' + printStyle + '.css" type="text/css" media="print">' );
// If the query includes 'print-pdf' we'll use the PDF print sheet
document.write( '<link rel="stylesheet" href="css/print/' + ( window.location.search.match( /print-pdf/gi ) ? 'pdf' : 'paper' ) + '.css" type="text/css" media="print">' );
</script>

<!--[if lt IE 9]>
Expand Down Expand Up @@ -283,62 +282,29 @@ <h3>BY Hakim El Hattab / hakim.se</h3>
</div>

<script src="lib/js/head.min.js"></script>
<script src="js/reveal.min.js"></script>

<script>
head.ready( function() {

// Fires when a slide with data-state=customevent is activated
Reveal.addEventListener( 'customevent', function() {
console.log( '"customevent" has fired' );
} );

// Fires each time a new slide is activated
Reveal.addEventListener( 'slidechanged', function( event ) {
// event.previousSlide, event.currentSlide, event.indexh, event.indexv
} );

// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,

transition: Reveal.getQueryHash().transition || 'default' // default/cube/page/concave/linear(2d)
});

// Load highlight.js for syntax highlighting of code samples
head.js( 'lib/js/highlight.js', function() {
hljs.initHighlightingOnLoad();
} );

} );

// Scripts that should be loaded before initializing
var scripts = [];

// If the browser doesn't support classList, load a polyfill
if( !document.body.classList ) {
head.js( 'lib/js/classList.js' );
}

// Load markdown parser if there are slides defined using markdown
if( document.querySelector( '[data-markdown]' ) ) {
scripts.push( 'lib/js/showdown.js' );
scripts.push( 'lib/js/data-markdown.js' );
}

scripts.push( 'js/reveal.min.js' );

// If we're runnning the notes server we need to include some additional JS
// TODO Is there a better way to determine if we're running the notes server?
if( window.location.host === 'localhost:1947' ) {
scripts.push( 'socket.io/socket.io.js' );
scripts.push( 'plugin/speakernotes/client.js' );
}

// Load the scripts and, when completed, initialize reveal.js
head.js.apply( null, scripts );

// Full list of configuration options available here:
// https://github.com/hakimel/reveal.js#configuration
Reveal.initialize({
controls: true,
progress: true,
history: true,

transition: Reveal.getQueryHash().transition || 'default', // default/cube/page/concave/linear(2d)

// Optional libraries used to extend on reveal.js
dependencies: [
{ src: 'lib/js/highlight.js', async: true, callback: function() { window.hljs.initHighlightingOnLoad(); } },
{ src: 'lib/js/classList.js', condition: function() { return !document.body.classList; } },
{ src: 'lib/js/showdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'lib/js/data-markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
{ src: 'socket.io/socket.io.js', async: true, condition: function() { return window.location.host === 'localhost:1947'; } },
{ src: 'plugin/speakernotes/client.js', async: true, condition: function() { return window.location.host === 'localhost:1947'; } },
]
});

</script>

Expand Down
107 changes: 83 additions & 24 deletions js/reveal.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*!
* reveal.js 2.0 r17
* reveal.js 2.0 r18
* http://lab.hakim.se/reveal-js
* MIT licensed
*
Expand Down Expand Up @@ -40,7 +40,10 @@ var Reveal = (function(){
rollingLinks: true,

// Transition style
transition: 'default' // default/cube/page/concave/linear(2d)
transition: 'default', // default/cube/page/concave/linear(2d),

// Script dependencies to load
dependencies: []
},

// The horizontal and verical index of the currently active slide
Expand Down Expand Up @@ -71,9 +74,6 @@ var Reveal = (function(){
'msTransform' in document.body.style ||
'OTransform' in document.body.style ||
'transform' in document.body.style,

// Detect support for elem.classList
supportsClassList = !!document.body.classList;

// Throttles mouse wheel navigation
mouseWheelTimeout = 0,
Expand All @@ -96,46 +96,35 @@ var Reveal = (function(){


/**
* Starts up the slideshow by applying configuration
* options and binding various events.
* Starts up the presentation if the client is capable.
*/
function initialize( options ) {

if( ( !supports2DTransforms && !supports3DTransforms ) || !supportsClassList ) {
if( ( !supports2DTransforms && !supports3DTransforms ) ) {
document.body.setAttribute( 'class', 'no-transforms' );

// If the browser doesn't support core features we won't be
// using JavaScript to control the presentation
return;
}

// Copy options over to our config object
extend( config, options );

// Cache references to DOM elements
dom.wrapper = document.querySelector( '.reveal' );
dom.progress = document.querySelector( '.reveal .progress' );
dom.progressbar = document.querySelector( '.reveal .progress span' );

if ( config.controls ) {
dom.controls = document.querySelector( '.reveal .controls' );
dom.controlsLeft = document.querySelector( '.reveal .controls .left' );
dom.controlsRight = document.querySelector( '.reveal .controls .right' );
dom.controlsUp = document.querySelector( '.reveal .controls .up' );
dom.controlsDown = document.querySelector( '.reveal .controls .down' );
}

// Copy options over to our config object
extend( config, options );

// Subscribe to input
addEventListeners();

// Updates the presentation to match the current configuration values
configure();

// Read the initial hash
readURL();

// Start auto-sliding if it's enabled
cueAutoSlide();
// Loads the dependencies and continues to #start() once done
load();

// Set up hiding of the browser address bar
if( navigator.userAgent.match( /(iphone|ipod|android)/i ) ) {
Expand All @@ -150,6 +139,76 @@ var Reveal = (function(){

}

/**
* Loads the dependencies of reveal.js. Dependencies are
* defined via the configuration option 'dependencies'
* and will be loaded prior to starting/binding reveal.js.
* Some dependencies may have an 'async' flag, if so they
* will load after reveal.js has been started up.
*/
function load() {
var scripts = [],
scriptsAsync = [];

for( var i = 0, len = config.dependencies.length; i < len; i++ ) {
var s = config.dependencies[i];

// Load if there's no condition or the condition is truthy
if( !s.condition || s.condition() ) {
if( s.async ) {
scriptsAsync.push( s.src );
}
else {
scripts.push( s.src );
}

// Extension may contain callback functions
if( typeof s.callback === 'function' ) {
head.ready( s.src.match( /([\w\d_-]*)\.?[^\\\/]*$/i )[0], s.callback );
}
}
}

// Called once synchronous scritps finish loading
function proceed() {
// Load asynchronous scripts
head.js.apply( null, scriptsAsync );

start();
}

if( scripts.length ) {
head.ready( proceed );

// Load synchronous scripts
head.js.apply( null, scripts );
}
else {
proceed();
}
}

/**
* Starts up reveal.js by binding input events and navigating
* to the current URL deeplink if there is one.
*/
function start() {
// Subscribe to input
addEventListeners();

// Updates the presentation to match the current configuration values
configure();

// Read the initial hash
readURL();

// Start auto-sliding if it's enabled
cueAutoSlide();
}

/**
* Applies the configuration settings from the config object.
*/
function configure() {
if( supports3DTransforms === false ) {
config.transition = 'linear';
Expand Down
Loading

0 comments on commit 49e8e0d

Please sign in to comment.