reveal-ck 3.6.0 → 3.7.0

data/files/reveal.js/plugin/math/math.js

@@ -7,14 +7,17 @@
 var RevealMath = window.RevealMath || (function(){
 
 	var options = Reveal.getConfig().math || {};
-	options.mathjax = options.mathjax || 'http://cdn.mathjax.org/mathjax/latest/MathJax.js';
+	options.mathjax = options.mathjax || 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js';
 	options.config = options.config || 'TeX-AMS_HTML-full';
 
 	loadScript( options.mathjax + '?config=' + options.config, function() {
 
 		MathJax.Hub.Config({
 			messageStyle: 'none',
-			tex2jax: { inlineMath: [['$','$'],['\\(','\\)']] },
+			tex2jax: {
+				inlineMath: [['$','$'],['\\(','\\)']] ,
+				skipTags: ['script','noscript','style','textarea','pre']
+			},
 			skipStartupTypeset: true
 		});
 

data/files/reveal.js/plugin/multiplex/client.js

@@ -8,6 +8,6 @@
 		if (data.socketId !== socketId) { return; }
 		if( window.location.host === 'localhost:1947' ) return;
 
-		Reveal.slide(data.indexh, data.indexv, data.indexf, 'remote');
+		Reveal.setState(data.state);
 	});
 }());

data/files/reveal.js/plugin/multiplex/index.js

@@ -1,37 +1,45 @@
+var http        = require('http');
 var express		= require('express');
 var fs			= require('fs');
 var io			= require('socket.io');
 var crypto		= require('crypto');
 
-var app			= express.createServer();
-var staticDir	= express.static;
+var app       	= express();
+var staticDir 	= express.static;
+var server    	= http.createServer(app);
 
-io				= io.listen(app);
+io = io(server);
 
 var opts = {
-	port: 1948,
+	port: process.env.PORT || 1948,
 	baseDir : __dirname + '/../../'
 };
 
-io.sockets.on('connection', function(socket) {
-	socket.on('slidechanged', function(slideData) {
-		if (typeof slideData.secret == 'undefined' || slideData.secret == null || slideData.secret === '') return;
-		if (createHash(slideData.secret) === slideData.socketId) {
-			slideData.secret = null;
-			socket.broadcast.emit(slideData.socketId, slideData);
+io.on( 'connection', function( socket ) {
+	socket.on('multiplex-statechanged', function(data) {
+		if (typeof data.secret == 'undefined' || data.secret == null || data.secret === '') return;
+		if (createHash(data.secret) === data.socketId) {
+			data.secret = null;
+			socket.broadcast.emit(data.socketId, data);
 		};
 	});
 });
 
-app.configure(function() {
-	[ 'css', 'js', 'plugin', 'lib' ].forEach(function(dir) {
-		app.use('/' + dir, staticDir(opts.baseDir + dir));
-	});
+[ 'css', 'js', 'plugin', 'lib' ].forEach(function(dir) {
+	app.use('/' + dir, staticDir(opts.baseDir + dir));
 });
 
 app.get("/", function(req, res) {
 	res.writeHead(200, {'Content-Type': 'text/html'});
-	fs.createReadStream(opts.baseDir + '/index.html').pipe(res);
+
+	var stream = fs.createReadStream(opts.baseDir + '/index.html');
+	stream.on('error', function( error ) {
+		res.write('<style>body{font-family: sans-serif;}</style><h2>reveal.js multiplex server.</h2><a href="/token">Generate token</a>');
+		res.end();
+	});
+	stream.on('readable', function() {
+		stream.pipe(res);
+	});
 });
 
 app.get("/token", function(req,res) {
@@ -47,7 +55,7 @@ var createHash = function(secret) {
 };
 
 // Actually listen
-app.listen(opts.port || null);
+server.listen( opts.port || null );
 
 var brown = '\033[33m',
 	green = '\033[32m',

data/files/reveal.js/plugin/multiplex/master.js

@@ -1,51 +1,31 @@
 (function() {
+
 	// Don't emit events from inside of notes windows
 	if ( window.location.search.match( /receiver/gi ) ) { return; }
 
 	var multiplex = Reveal.getConfig().multiplex;
 
-	var socket = io.connect(multiplex.url);
-
-	var notify = function( slideElement, indexh, indexv, origin ) {
-		if( typeof origin === 'undefined' && origin !== 'remote' ) {
-			var nextindexh;
-			var nextindexv;
-
-			var fragmentindex = Reveal.getIndices().f;
-			if (typeof fragmentindex == 'undefined') {
-				fragmentindex = 0;
-			}
-
-			if (slideElement.nextElementSibling && slideElement.parentNode.nodeName == 'SECTION') {
-				nextindexh = indexh;
-				nextindexv = indexv + 1;
-			} else {
-				nextindexh = indexh + 1;
-				nextindexv = 0;
-			}
-
-			var slideData = {
-				indexh : indexh,
-				indexv : indexv,
-				indexf : fragmentindex,
-				nextindexh : nextindexh,
-				nextindexv : nextindexv,
-				secret: multiplex.secret,
-				socketId : multiplex.id
-			};
-
-			socket.emit('slidechanged', slideData);
-		}
-	}
-
-	Reveal.addEventListener( 'slidechanged', function( event ) {
-		notify( event.currentSlide, event.indexh, event.indexv, event.origin );
-	} );
-
-	var fragmentNotify = function( event ) {
-		notify( Reveal.getCurrentSlide(), Reveal.getIndices().h, Reveal.getIndices().v, event.origin );
+	var socket = io.connect( multiplex.url );
+
+	function post() {
+
+		var messageData = {
+			state: Reveal.getState(),
+			secret: multiplex.secret,
+			socketId: multiplex.id
+		};
+
+		socket.emit( 'multiplex-statechanged', messageData );
+
 	};
 
-	Reveal.addEventListener( 'fragmentshown', fragmentNotify );
-	Reveal.addEventListener( 'fragmenthidden', fragmentNotify );
+	// Monitor events that trigger a change in state
+	Reveal.addEventListener( 'slidechanged', post );
+	Reveal.addEventListener( 'fragmentshown', post );
+	Reveal.addEventListener( 'fragmenthidden', post );
+	Reveal.addEventListener( 'overviewhidden', post );
+	Reveal.addEventListener( 'overviewshown', post );
+	Reveal.addEventListener( 'paused', post );
+	Reveal.addEventListener( 'resumed', post );
+
 }());

data/files/reveal.js/plugin/multiplex/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "reveal-js-multiplex",
+  "version": "1.0.0",
+  "description": "reveal.js multiplex server",
+  "homepage": "http://lab.hakim.se/reveal-js",
+  "scripts": {
+    "start": "node index.js"
+  },
+  "engines": {
+    "node": "~4.1.1"
+  },
+  "dependencies": {
+    "express": "~4.13.3",
+    "grunt-cli": "~0.1.13",
+    "mustache": "~2.2.1",
+    "socket.io": "~1.3.7"
+  },
+  "license": "MIT"
+}

data/files/reveal.js/plugin/notes-server/client.js

@@ -41,10 +41,15 @@
 	}
 
 	// When a new notes window connects, post our current state
-	socket.on( 'connect', function( data ) {
+	socket.on( 'new-subscriber', function( data ) {
 		post();
 	} );
 
+	// When the state changes from inside of the speaker view
+	socket.on( 'statechanged-speaker', function( data ) {
+		Reveal.setState( data.state );
+	} );
+
 	// Monitor events that trigger a change in state
 	Reveal.addEventListener( 'slidechanged', post );
 	Reveal.addEventListener( 'fragmentshown', post );

data/files/reveal.js/plugin/notes-server/index.js

@@ -1,39 +1,42 @@
+var http      = require('http');
 var express   = require('express');
 var fs        = require('fs');
 var io        = require('socket.io');
-var _         = require('underscore');
 var Mustache  = require('mustache');
 
-var app       = express.createServer();
+var app       = express();
 var staticDir = express.static;
+var server    = http.createServer(app);
 
-io            = io.listen(app);
+io = io(server);
 
 var opts = {
 	port :      1947,
 	baseDir :   __dirname + '/../../'
 };
 
-io.sockets.on( 'connection', function( socket ) {
+io.on( 'connection', function( socket ) {
 
-	socket.on( 'connect', function( data ) {
-		socket.broadcast.emit( 'connect', data );
+	socket.on( 'new-subscriber', function( data ) {
+		socket.broadcast.emit( 'new-subscriber', data );
 	});
 
 	socket.on( 'statechanged', function( data ) {
+		delete data.state.overview;
 		socket.broadcast.emit( 'statechanged', data );
 	});
 
-});
-
-app.configure( function() {
-
-	[ 'css', 'js', 'images', 'plugin', 'lib' ].forEach( function( dir ) {
-		app.use( '/' + dir, staticDir( opts.baseDir + dir ) );
+	socket.on( 'statechanged-speaker', function( data ) {
+		delete data.state.overview;
+		socket.broadcast.emit( 'statechanged-speaker', data );
 	});
 
 });
 
+[ 'css', 'js', 'images', 'plugin', 'lib' ].forEach( function( dir ) {
+	app.use( '/' + dir, staticDir( opts.baseDir + dir ) );
+});
+
 app.get('/', function( req, res ) {
 
 	res.writeHead( 200, { 'Content-Type': 'text/html' } );
@@ -52,7 +55,7 @@ app.get( '/notes/:socketId', function( req, res ) {
 });
 
 // Actually listen
-app.listen( opts.port || null );
+server.listen( opts.port || null );
 
 var brown = '\033[33m',
 	green = '\033[32m',
@@ -62,5 +65,5 @@ var slidesLocation = 'http://localhost' + ( opts.port ? ( ':' + opts.port ) : ''
 
 console.log( brown + 'reveal.js - Speaker Notes' + reset );
 console.log( '1. Open the slides at ' + green + slidesLocation + reset );
-console.log( '2. Click on the link your JS console to go to the notes page' );
+console.log( '2. Click on the link in your JS console to go to the notes page' );
 console.log( '3. Advance through your slides and your notes will advance automatically' );

data/files/reveal.js/plugin/notes-server/notes.html

@@ -8,6 +8,7 @@
 		<style>
 			body {
 				font-family: Helvetica;
+				font-size: 18px;
 			}
 
 			#current-slide,
@@ -30,15 +31,26 @@
 				position: absolute;
 				top: 10px;
 				left: 10px;
-				font-weight: bold;
-				font-size: 14px;
 				z-index: 2;
-				color: rgba( 255, 255, 255, 0.9 );
+			}
+
+			.overlay-element {
+				height: 34px;
+				line-height: 34px;
+				padding: 0 10px;
+				text-shadow: none;
+				background: rgba( 220, 220, 220, 0.8 );
+				color: #222;
+				font-size: 14px;
+			}
+
+			.overlay-element.interactive:hover {
+				background: rgba( 220, 220, 220, 1 );
 			}
 
 			#current-slide {
 				position: absolute;
-				width: 65%;
+				width: 60%;
 				height: 100%;
 				top: 0;
 				left: 0;
@@ -47,19 +59,20 @@
 
 			#upcoming-slide {
 				position: absolute;
-				width: 35%;
+				width: 40%;
 				height: 40%;
 				right: 0;
 				top: 0;
 			}
 
+			/* Speaker controls */
 			#speaker-controls {
 				position: absolute;
 				top: 40%;
 				right: 0;
-				width: 35%;
+				width: 40%;
 				height: 60%;
-
+				overflow: auto;
 				font-size: 18px;
 			}
 
@@ -124,26 +137,108 @@
 					font-size: 1.2em;
 				}
 
+			/* Layout selector */
+			#speaker-layout {
+				position: absolute;
+				top: 10px;
+				right: 10px;
+				color: #222;
+				z-index: 10;
+			}
+				#speaker-layout select {
+					position: absolute;
+					width: 100%;
+					height: 100%;
+					top: 0;
+					left: 0;
+					border: 0;
+					box-shadow: 0;
+					cursor: pointer;
+					opacity: 0;
+
+					font-size: 1em;
+					background-color: transparent;
+
+					-moz-appearance: none;
+					-webkit-appearance: none;
+					-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+				}
+
+				#speaker-layout select:focus {
+					outline: none;
+					box-shadow: none;
+				}
+
 			.clear {
 				clear: both;
 			}
 
-			@media screen and (max-width: 1080px) {
-				#speaker-controls {
-					font-size: 16px;
-				}
+			/* Speaker layout: Wide */
+			body[data-speaker-layout="wide"] #current-slide,
+			body[data-speaker-layout="wide"] #upcoming-slide {
+				width: 50%;
+				height: 45%;
+				padding: 6px;
 			}
 
-			@media screen and (max-width: 900px) {
-				#speaker-controls {
-					font-size: 14px;
-				}
+			body[data-speaker-layout="wide"] #current-slide {
+				top: 0;
+				left: 0;
 			}
 
-			@media screen and (max-width: 800px) {
-				#speaker-controls {
-					font-size: 12px;
-				}
+			body[data-speaker-layout="wide"] #upcoming-slide {
+				top: 0;
+				left: 50%;
+			}
+
+			body[data-speaker-layout="wide"] #speaker-controls {
+				top: 45%;
+				left: 0;
+				width: 100%;
+				height: 50%;
+				font-size: 1.25em;
+			}
+
+			/* Speaker layout: Tall */
+			body[data-speaker-layout="tall"] #current-slide,
+			body[data-speaker-layout="tall"] #upcoming-slide {
+				width: 45%;
+				height: 50%;
+				padding: 6px;
+			}
+
+			body[data-speaker-layout="tall"] #current-slide {
+				top: 0;
+				left: 0;
+			}
+
+			body[data-speaker-layout="tall"] #upcoming-slide {
+				top: 50%;
+				left: 0;
+			}
+
+			body[data-speaker-layout="tall"] #speaker-controls {
+				padding-top: 40px;
+				top: 0;
+				left: 45%;
+				width: 55%;
+				height: 100%;
+				font-size: 1.25em;
+			}
+
+			/* Speaker layout: Notes only */
+			body[data-speaker-layout="notes-only"] #current-slide,
+			body[data-speaker-layout="notes-only"] #upcoming-slide {
+				display: none;
+			}
+
+			body[data-speaker-layout="notes-only"] #speaker-controls {
+				padding-top: 40px;
+				top: 0;
+				left: 0;
+				width: 100%;
+				height: 100%;
+				font-size: 1.25em;
 			}
 
 		</style>
@@ -152,7 +247,7 @@
 	<body>
 
 		<div id="current-slide"></div>
-		<div id="upcoming-slide"><span class="label">UPCOMING:</span></div>
+		<div id="upcoming-slide"><span class="overlay-element label">Upcoming</span></div>
 		<div id="speaker-controls">
 			<div class="speaker-controls-time">
 				<h4 class="label">Time <span class="reset-button">Click to Reset</span></h4>
@@ -170,6 +265,10 @@
 				<div class="value"></div>
 			</div>
 		</div>
+		<div id="speaker-layout" class="overlay-element interactive">
+			<span class="speaker-layout-label"></span>
+			<select class="speaker-layout-dropdown"></select>
+		</div>
 
 		<script src="/socket.io/socket.io.js"></script>
 		<script src="/plugin/markdown/marked.js"></script>
@@ -182,11 +281,20 @@
 				currentState,
 				currentSlide,
 				upcomingSlide,
+				layoutLabel,
+				layoutDropdown,
 				connected = false;
 
 			var socket = io.connect( window.location.origin ),
 				socketId = '{{socketId}}';
 
+			var SPEAKER_LAYOUTS = {
+				'default': 'Default',
+				'wide': 'Wide',
+				'tall': 'Tall',
+				'notes-only': 'Notes only'
+			};
+
 			socket.on( 'statechanged', function( data ) {
 
 				// ignore data from sockets that aren't ours
@@ -195,7 +303,6 @@
 				if( connected === false ) {
 					connected = true;
 
-					setupIframes( data );
 					setupKeyboard();
 					setupNotes();
 					setupTimer();
@@ -206,13 +313,28 @@
 
 			} );
 
+			setupLayout();
+
+			// Load our presentation iframes
+			setupIframes();
+
+			// Once the iframes have loaded, emit a signal saying there's
+			// a new subscriber which will trigger a 'statechanged'
+			// message to be sent back
 			window.addEventListener( 'message', function( event ) {
 
 				var data = JSON.parse( event.data );
 
 				if( data && data.namespace === 'reveal' ) {
 					if( /ready/.test( data.eventName ) ) {
-						socket.emit( 'connect', { socketId: socketId } );
+						socket.emit( 'new-subscriber', { socketId: socketId } );
+					}
+				}
+
+				// Messages sent by reveal.js inside of the current slide preview
+				if( data && data.namespace === 'reveal' ) {
+					if( /slidechanged|fragmentshown|fragmenthidden|overviewshown|overviewhidden|paused|resumed/.test( data.eventName ) && currentState !== JSON.stringify( data.state ) ) {
+						socket.emit( 'statechanged-speaker', { state: data.state } );
 					}
 				}
 
@@ -267,7 +389,7 @@
 			/**
 			 * Creates the preview iframes.
 			 */
-			function setupIframes( data ) {
+			function setupIframes() {
 
 				var params = [
 					'receiver',
@@ -277,9 +399,8 @@
 					'backgroundTransition=none'
 				].join( '&' );
 
-				var hash = '#/' + data.state.indexh + '/' + data.state.indexv;
-				var currentURL = '/?' + params + '&postMessageEvents=true' + hash;
-				var upcomingURL = '/?' + params + '&controls=false' + hash;
+				var currentURL = '/?' + params + '&postMessageEvents=true';
+				var upcomingURL = '/?' + params + '&controls=false';
 
 				currentSlide = document.createElement( 'iframe' );
 				currentSlide.setAttribute( 'width', 1280 );
@@ -351,6 +472,74 @@
 
 			}
 
+			/**
+				 * Sets up the speaker view layout and layout selector.
+				 */
+				function setupLayout() {
+
+					layoutDropdown = document.querySelector( '.speaker-layout-dropdown' );
+					layoutLabel = document.querySelector( '.speaker-layout-label' );
+
+					// Render the list of available layouts
+					for( var id in SPEAKER_LAYOUTS ) {
+						var option = document.createElement( 'option' );
+						option.setAttribute( 'value', id );
+						option.textContent = SPEAKER_LAYOUTS[ id ];
+						layoutDropdown.appendChild( option );
+					}
+
+					// Monitor the dropdown for changes
+					layoutDropdown.addEventListener( 'change', function( event ) {
+
+						setLayout( layoutDropdown.value );
+
+					}, false );
+
+					// Restore any currently persisted layout
+					setLayout( getLayout() );
+
+				}
+
+				/**
+				 * Sets a new speaker view layout. The layout is persisted
+				 * in local storage.
+				 */
+				function setLayout( value ) {
+
+					var title = SPEAKER_LAYOUTS[ value ];
+
+					layoutLabel.innerHTML = 'Layout' + ( title ? ( ': ' + title ) : '' );
+					layoutDropdown.value = value;
+
+					document.body.setAttribute( 'data-speaker-layout', value );
+
+					// Persist locally
+					if( window.localStorage ) {
+						window.localStorage.setItem( 'reveal-speaker-layout', value );
+					}
+
+				}
+
+				/**
+				 * Returns the ID of the most recently set speaker layout
+				 * or our default layout if none has been set.
+				 */
+				function getLayout() {
+
+					if( window.localStorage ) {
+						var layout = window.localStorage.getItem( 'reveal-speaker-layout' );
+						if( layout ) {
+							return layout;
+						}
+					}
+
+					// Default to the first record in the layouts hash
+					for( var id in SPEAKER_LAYOUTS ) {
+						return id;
+					}
+
+				}
+
 			function zeroPadInteger( num ) {
 
 				var str = '00' + parseInt( num );