diff options
| -rw-r--r-- | .gitignore | 1 | ||||
| -rw-r--r-- | README.md | 21 | ||||
| -rw-r--r-- | css/main.css | 10 | ||||
| -rw-r--r-- | index.html | 28 | ||||
| -rw-r--r-- | js/reveal.min.js | 63 | ||||
| -rw-r--r-- | lib/highlight/highlight.js (renamed from lib/highlight.js) | 0 | ||||
| -rw-r--r-- | lib/highlight/zenburn.css (renamed from lib/zenburn.css) | 0 | ||||
| -rw-r--r-- | lib/leaguegothic/LICENSE (renamed from assets/fonts/leaguegothic/LICENSE) | 0 | ||||
| -rw-r--r-- | lib/leaguegothic/league_gothic-webfont.ttf (renamed from assets/fonts/leaguegothic/league_gothic-webfont.ttf) | bin | 42324 -> 42324 bytes | |||
| -rw-r--r-- | lib/polyfills/classList.js (renamed from lib/classList.js) | 0 | ||||
| -rw-r--r-- | lib/slidenotes/client.js | 35 | ||||
| -rw-r--r-- | lib/slidenotes/index.js | 47 | ||||
| -rw-r--r-- | lib/slidenotes/notes.html | 109 | ||||
| -rw-r--r-- | package.json | 20 |
14 files changed, 263 insertions, 71 deletions
@@ -2,3 +2,4 @@ .svn log/*.log tmp/** +node_modules/ @@ -104,6 +104,25 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) { } ); ``` +## Speaker Notes + +If you're interested in using speaker notes, reveal.js comes with a Node server that allows you to deliver your presentation in one browser while viewing speaker notes in another. + +To include speaker notes in your presentation, simply add an `<aside class="notes">` element to any slide. These notes will be hidden in the main presentation view. + +You'll also need to [install Node.js](http://nodejs.org/); then, install the server dependencies by running `npm install`. + +Once Node.js and the dependencies are installed, run the following command from the root directory: + + node lib/slidenotes + +By default, the slides will be served at [localhost:1947](http://localhost:1947). + +You can change the appearance of the speaker notes by editing the file at `lib/slidenotes/notes.html`. + +### Known Issues + +- The notes page is supposed to show the current slide and the next slide, but when it first starts, it always shows the first slide in both positions. ## Examples @@ -140,6 +159,8 @@ Reveal.addEventListener( 'fragmenthidden', function( event ) { - API methods for adding or removing all event listeners - The 'slidechange' event now includes currentSlide and previousSlide - Fixed bug where 'slidechange' was firing twice when history was enabled +- Changed /lib structure +- Slide notes by [rmurphey](https://github.com/rmurphey) #### 1.3 - Revised keyboard shortcuts, including ESC for overview, N for next, P for previous. Thanks [mahemoff](https://github.com/mahemoff) diff --git a/css/main.css b/css/main.css index 920307e..ba33137 100644 --- a/css/main.css +++ b/css/main.css @@ -12,7 +12,7 @@ @font-face { font-family: 'League Gothic'; - src: url('../assets/fonts/leaguegothic/league_gothic-webfont.ttf') format('truetype'); + src: url('../lib/leaguegothic/league_gothic-webfont.ttf') format('truetype'); font-weight: normal; font-style: normal; } @@ -952,6 +952,10 @@ body { background: rgba( 0, 0, 0, 0.6 ); } +/********************************************* + * SPEAKER NOTES + *********************************************/ - - +.reveal aside.notes { + display: none; +} @@ -4,7 +4,7 @@ <head> <meta charset="utf-8"> - <title>reveal.js</title> + <title>reveal.js - HTML5 Presentations</title> <meta name="description" content="An easy to use CSS 3D slideshow tool for quickly creating good looking HTML presentations."> <meta name="author" content="Hakim El Hattab"> @@ -18,7 +18,7 @@ <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/print.css" type="text/css" media="print"> - <link rel="stylesheet" href="lib/zenburn.css"> + <link rel="stylesheet" href="lib/highlight/zenburn.css"> </head> <body> @@ -48,6 +48,10 @@ <p> <i><small>- <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small></i> </p> + + <aside class="notes"> + Oh hey, these are some notes. They'll be hidden in your presentation, but you can see them if you run the speaker notes server. + </aside> </section> <!-- Example of nested vertical slides --> @@ -260,14 +264,15 @@ linkify( 'a' ); </div> <!-- Optional libraries for code syntax highlighting and classList support in IE9 --> - <script src="lib/highlight.js"></script> - <script src="lib/classList.js"></script> + <script src="lib/highlight/highlight.js"></script> + <script src="lib/polyfills/classList.js"></script> <script src="js/reveal.js"></script> <script> // Parse the query string into a key/value object var query = {}; + location.search.replace( /[A-Z0-9]+?=(\w*)/gi, function(a) { query[ a.split( '=' ).shift() ] = a.split( '=' ).pop(); } ); @@ -308,8 +313,21 @@ linkify( 'a' ); transition: query.transition || 'default' // default/cube/page/concave/linear(2d) }); + // Fire off syntax highlighting for potential code samples in the slides hljs.initHighlightingOnLoad(); - </script> + // If we're runnning the notes node server we need to include some + // additional JS + if( window.location.host === 'localhost:1947' ) { + var notes_socket = document.createElement( 'script' ); + notes_socket.setAttribute( 'src', 'socket.io/socket.io.js' ); + document.body.appendChild( notes_socket ); + + var notes_client = document.createElement( 'script' ); + notes_client.setAttribute( 'src', 'lib/slidenotes/client.js' ); + document.body.appendChild( notes_client ); + } + </script> + </body> </html>
\ No newline at end of file diff --git a/js/reveal.min.js b/js/reveal.min.js deleted file mode 100644 index 7a68ab0..0000000 --- a/js/reveal.min.js +++ /dev/null @@ -1,63 +0,0 @@ -/*! - * reveal.js 1.4 - * http://lab.hakim.se/reveal-js - * MIT licensed - * - * Copyright (C) 2012 Hakim El Hattab, http://hakim.se - */ -var Reveal=(function(){var j=".reveal .slides>section",a=".reveal .slides>section.present>section",e=!!("ontouchstart" in window),k=0,c=0,H={controls:true,progress:false,history:false,loop:false,mouseWheel:true,rollingLinks:true,transition:"default",theme:"default"},T=[],d={},J=document.body.style.WebkitPerspective!==undefined||document.body.style.MozPerspective!==undefined||document.body.style.msPerspective!==undefined||document.body.style.OPerspective!==undefined||document.body.style.perspective!==undefined,l=document.body.style.WebkitTransform!==undefined||document.body.style.MozTransform!==undefined||document.body.style.msTransform!==undefined||document.body.style.OTransform!==undefined||document.body.style.transform!==undefined,x=!!document.body.classList; -mouseWheelTimeout=0,writeURLTimeout=0,touch={startX:0,startY:0,startSpan:0,startCount:0,handled:false,threshold:40};function h(V){if((!l&&!J)||!x){document.body.setAttribute("class","no-transforms"); -return;}d.wrapper=document.querySelector(".reveal");d.progress=document.querySelector(".reveal .progress");d.progressbar=document.querySelector(".reveal .progress span"); -if(H.controls){d.controls=document.querySelector(".reveal .controls");d.controlsLeft=document.querySelector(".reveal .controls .left");d.controlsRight=document.querySelector(".reveal .controls .right"); -d.controlsUp=document.querySelector(".reveal .controls .up");d.controlsDown=document.querySelector(".reveal .controls .down");}z();q(H,V);C();D();if(navigator.userAgent.match(/(iphone|ipod|android)/i)){document.documentElement.style.overflow="scroll"; -document.body.style.height="120%";window.addEventListener("load",P,false);window.addEventListener("orientationchange",P,false);}}function C(){if(J===false){H.transition="linear"; -}if(H.controls&&d.controls){d.controls.style.display="block";}if(H.progress){d.progress.style.display="block";}if(H.transition!=="default"){d.wrapper.classList.add(H.transition); -}if(H.theme!=="default"){d.wrapper.classList.add(H.theme);}if(H.mouseWheel){document.addEventListener("DOMMouseScroll",m,false);document.addEventListener("mousewheel",m,false); -}if(H.rollingLinks){E();}}function z(){document.addEventListener("keydown",S,false);document.addEventListener("touchstart",v,false);document.addEventListener("touchmove",R,false); -document.addEventListener("touchend",L,false);window.addEventListener("hashchange",t,false);if(H.controls&&d.controls){d.controlsLeft.addEventListener("click",n(w),false); -d.controlsRight.addEventListener("click",n(i),false);d.controlsUp.addEventListener("click",n(r),false);d.controlsDown.addEventListener("click",n(A),false); -}}function K(){document.removeEventListener("keydown",S,false);document.removeEventListener("touchstart",v,false);document.removeEventListener("touchmove",R,false); -document.removeEventListener("touchend",L,false);window.removeEventListener("hashchange",t,false);if(H.controls&&d.controls){d.controlsLeft.removeEventListener("click",n(w),false); -d.controlsRight.removeEventListener("click",n(i),false);d.controlsUp.removeEventListener("click",n(r),false);d.controlsDown.removeEventListener("click",n(A),false); -}}function q(W,V){for(var X in V){W[X]=V[X];}}function I(X,V){var Y=X.x-V.x,W=X.y-V.y;return Math.sqrt(Y*Y+W*W);}function n(V){return function(W){W.preventDefault(); -V.call();};}function P(){setTimeout(function(){window.scrollTo(0,1);},0);}function S(W){if(W.target.contentEditable!="inherit"||W.shiftKey||W.altKey||W.ctrlKey||W.metaKey){return; -}var V=false;switch(W.keyCode){case 80:case 33:N();V=true;break;case 78:case 34:u();V=true;break;case 72:case 37:w();V=true;break;case 76:case 39:i();V=true; -break;case 75:case 38:r();V=true;break;case 74:case 40:A();V=true;break;case 36:F(0);V=true;break;case 35:F(Number.MAX_VALUE);V=true;break;case 32:O()?Q():u(); -V=true;break;case 13:if(O()){Q();V=true;}break;}if(V){W.preventDefault();}else{if(W.keyCode===27&&J){if(O()){Q();}else{B();}W.preventDefault();}}}function v(V){touch.startX=V.touches[0].clientX; -touch.startY=V.touches[0].clientY;touch.startCount=V.touches.length;if(V.touches.length===2){touch.startSpan=I({x:V.touches[1].clientX,y:V.touches[1].clientY},{x:touch.startX,y:touch.startY}); -}}function R(aa){if(!touch.handled){var Y=aa.touches[0].clientX;var X=aa.touches[0].clientY;if(aa.touches.length===2&&touch.startCount===2){var Z=I({x:aa.touches[1].clientX,y:aa.touches[1].clientY},{x:touch.startX,y:touch.startY}); -if(Math.abs(touch.startSpan-Z)>touch.threshold){touch.handled=true;if(Z<touch.startSpan){B();}else{Q();}}}else{if(aa.touches.length===1){var W=Y-touch.startX,V=X-touch.startY; -if(W>touch.threshold&&Math.abs(W)>Math.abs(V)){touch.handled=true;w();}else{if(W<-touch.threshold&&Math.abs(W)>Math.abs(V)){touch.handled=true;i();}else{if(V>touch.threshold){touch.handled=true; -r();}else{if(V<-touch.threshold){touch.handled=true;A();}}}}}}aa.preventDefault();}}function L(V){touch.handled=false;}function m(V){clearTimeout(mouseWheelTimeout); -mouseWheelTimeout=setTimeout(function(){var W=V.detail||-V.wheelDelta;if(W>0){u();}else{N();}},100);}function t(V){D();}function E(){if(J){var W=document.querySelectorAll(".reveal .slides section a:not(.image)"); -for(var X=0,V=W.length;X<V;X++){var Y=W[X];if(Y.textContent&&!Y.querySelector("img")&&(!Y.className||!Y.classList.contains(Y,"roll"))){Y.classList.add("roll"); -Y.innerHTML='<span data-title="'+Y.text+'">'+Y.innerHTML+"</span>";}}}}function B(){d.wrapper.classList.add("overview");var V=Array.prototype.slice.call(document.querySelectorAll(j)); -for(var aa=0,Y=V.length;aa<Y;aa++){var X=V[aa],ae="translateZ(-2500px) translate("+((aa-k)*105)+"%, 0%)";X.setAttribute("data-index-h",aa);X.style.display="block"; -X.style.WebkitTransform=ae;X.style.MozTransform=ae;X.style.msTransform=ae;X.style.OTransform=ae;X.style.transform=ae;if(!X.classList.contains("stack")){X.addEventListener("click",y,true); -}var ad=Array.prototype.slice.call(X.querySelectorAll("section"));for(var Z=0,W=ad.length;Z<W;Z++){var ac=ad[Z],ab="translate(0%, "+((Z-c)*105)+"%)";ac.setAttribute("data-index-h",aa); -ac.setAttribute("data-index-v",Z);ac.style.display="block";ac.style.WebkitTransform=ab;ac.style.MozTransform=ab;ac.style.msTransform=ab;ac.style.OTransform=ab; -ac.style.transform=ab;ac.addEventListener("click",y,true);}}}function Q(){d.wrapper.classList.remove("overview");var Y=Array.prototype.slice.call(document.querySelectorAll(".reveal .slides section")); -for(var X=0,V=Y.length;X<V;X++){var W=Y[X];W.style.WebkitTransform="";W.style.MozTransform="";W.style.msTransform="";W.style.OTransform="";W.style.transform=""; -W.removeEventListener("click",y);}b();}function O(){return d.wrapper.classList.contains("overview");}function y(V){if(O()){V.preventDefault();Q();k=this.getAttribute("data-index-h"); -c=this.getAttribute("data-index-v");b();}}function U(W,Y){var aa=Array.prototype.slice.call(document.querySelectorAll(W)),ab=aa.length;if(ab){if(H.loop){Y%=ab; -if(Y<0){Y=ab+Y;}}Y=Math.max(Math.min(Y,ab-1),0);for(var Z=0;Z<ab;Z++){var V=aa[Z];if(O()===false){var ac=Math.abs((Y-Z)%(ab-3))||0;V.style.display=ac>3?"none":"block"; -}aa[Z].classList.remove("past");aa[Z].classList.remove("present");aa[Z].classList.remove("future");if(Z<Y){aa[Z].classList.add("past");}else{if(Z>Y){aa[Z].classList.add("future"); -}}if(V.querySelector("section")){aa[Z].classList.add("stack");}}aa[Y].classList.add("present");var X=aa[Y].getAttribute("data-state");if(X){T=T.concat(X.split(" ")); -}}else{Y=0;}return Y;}function b(ab,ag){var Y=T.concat();T.length=0;var af=k,W=c;k=U(j,ab===undefined?k:ab);c=U(a,ag===undefined?c:ag);stateLoop:for(var Z=0,ad=T.length; -Z<ad;Z++){for(var X=0;X<Y.length;X++){if(Y[X]===T[Z]){Y.splice(X,1);continue stateLoop;}}document.documentElement.classList.add(T[Z]);o(T[Z]);}while(Y.length){document.documentElement.classList.remove(Y.pop()); -}if(H.progress){d.progressbar.style.width=(k/(document.querySelectorAll(j).length-1))*window.innerWidth+"px";}if(O()){B();}p();clearTimeout(writeURLTimeout); -writeURLTimeout=setTimeout(g,1500);if(k!==af||c!==W){var V=document.querySelectorAll(j);var aa=V[af],ae=V[k];var ac=aa.querySelectorAll("section");currentVerticalSlides=ae.querySelectorAll("section"); -o("slidechanged",{indexh:k,indexv:c,previousSlide:ac[W]||aa,currentSlide:currentVerticalSlides[c]||ae});}}function p(){if(!H.controls||!d.controls){return; -}var V=f();[d.controlsLeft,d.controlsRight,d.controlsUp,d.controlsDown].forEach(function(W){W.classList.remove("enabled");});if(V.left){d.controlsLeft.classList.add("enabled"); -}if(V.right){d.controlsRight.classList.add("enabled");}if(V.up){d.controlsUp.classList.add("enabled");}if(V.down){d.controlsDown.classList.add("enabled"); -}}function f(){var V=document.querySelectorAll(j);var W=document.querySelectorAll(a);return{left:k>0,right:k<V.length-1,up:c>0,down:c<W.length-1};}function D(){var V=window.location.hash.slice(2).split("/"); -k=parseInt(V[0])||0;c=parseInt(V[1])||0;F(k,c);}function g(){if(H.history){var V="/";if(k>0||c>0){V+=k;}if(c>0){V+="/"+c;}window.location.hash=V;}}function o(W,V){var X=document.createEvent("HTMLEvents",1,2); -X.initEvent(W,true,true);q(X,V);d.wrapper.dispatchEvent(X);}function s(){if(document.querySelector(a+".present")){var W=document.querySelectorAll(a+".present .fragment:not(.visible)"); -if(W.length){W[0].classList.add("visible");o("fragmentshown",{fragment:W[0]});return true;}}else{var V=document.querySelectorAll(j+".present .fragment:not(.visible)"); -if(V.length){V[0].classList.add("visible");o("fragmentshown",{fragment:V[0]});return true;}}return false;}function G(){if(document.querySelector(a+".present")){var W=document.querySelectorAll(a+".present .fragment.visible"); -if(W.length){W[W.length-1].classList.remove("visible");o("fragmenthidden",{fragment:W[0]});return true;}}else{var V=document.querySelectorAll(j+".present .fragment.visible"); -if(V.length){V[V.length-1].classList.remove("visible");o("fragmenthidden",{fragment:V[0]});return true;}}return false;}function F(W,V){b(W,V);}function w(){if(O()||G()===false){b(k-1,0); -}}function i(){if(O()||s()===false){b(k+1,0);}}function r(){if(O()||G()===false){b(k,c-1);}}function A(){if(O()||s()===false){b(k,c+1);}}function N(){if(G()===false){if(f().up){r(); -}else{var V=document.querySelector(".reveal .slides>section.past:nth-child("+k+")");if(V){c=(V.querySelectorAll("section").length+1)||0;k--;b();}}}}function u(){if(s()===false){f().down?A():i(); -}}function M(){if(O()){Q();}else{B();}}return{initialize:h,navigateTo:F,navigateLeft:w,navigateRight:i,navigateUp:r,navigateDown:A,navigatePrev:N,navigateNext:u,toggleOverview:M,addEventListeners:z,removeEventListeners:K,addEventListener:function(W,X,V){(d.wrapper||document.querySelector(".reveal")).addEventListener(W,X,V); -},removeEventListener:function(W,X,V){(d.wrapper||document.querySelector(".reveal")).removeEventListener(W,X,V);}};})();
\ No newline at end of file diff --git a/lib/highlight.js b/lib/highlight/highlight.js index 12d24df..12d24df 100644 --- a/lib/highlight.js +++ b/lib/highlight/highlight.js diff --git a/lib/zenburn.css b/lib/highlight/zenburn.css index f4070ca..f4070ca 100644 --- a/lib/zenburn.css +++ b/lib/highlight/zenburn.css diff --git a/assets/fonts/leaguegothic/LICENSE b/lib/leaguegothic/LICENSE index 29513e9..29513e9 100644 --- a/assets/fonts/leaguegothic/LICENSE +++ b/lib/leaguegothic/LICENSE diff --git a/assets/fonts/leaguegothic/league_gothic-webfont.ttf b/lib/leaguegothic/league_gothic-webfont.ttf Binary files differindex 29f896a..29f896a 100644 --- a/assets/fonts/leaguegothic/league_gothic-webfont.ttf +++ b/lib/leaguegothic/league_gothic-webfont.ttf diff --git a/lib/classList.js b/lib/polyfills/classList.js index 44f2b4c..44f2b4c 100644 --- a/lib/classList.js +++ b/lib/polyfills/classList.js diff --git a/lib/slidenotes/client.js b/lib/slidenotes/client.js new file mode 100644 index 0000000..1aba8b8 --- /dev/null +++ b/lib/slidenotes/client.js @@ -0,0 +1,35 @@ +(function() { + // don't emit events from inside the previews themselves + if ( window.location.search.match( /receiver/gi ) ) { return; } + + var socket = io.connect(window.location.origin); + var socketId = Math.random().toString().slice(2); + + console.log('View slide notes at ' + window.location.origin + '/notes/' + socketId); + + Reveal.addEventListener( 'slidechanged', function( event ) { + var nextindexh; + var nextindexv; + var slideElement = event.currentSlide; + + if (slideElement.nextElementSibling && slideElement.parentNode.nodeName == 'SECTION') { + nextindexh = event.indexh; + nextindexv = event.indexv + 1; + } else { + nextindexh = event.indexh + 1; + nextindexv = 0; + } + + var notes = slideElement.querySelector('aside.notes'); + var slideData = { + notes : notes ? notes.innerHTML : '', + indexh : event.indexh, + indexv : event.indexv, + nextindexh : nextindexh, + nextindexv : nextindexv, + socketId : socketId + }; + + socket.emit('slidechanged', slideData); + } ); +}()); diff --git a/lib/slidenotes/index.js b/lib/slidenotes/index.js new file mode 100644 index 0000000..206996d --- /dev/null +++ b/lib/slidenotes/index.js @@ -0,0 +1,47 @@ +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 staticDir = express.static; + +io = io.listen(app); + +var opts = { + port : 1947, + baseDir : __dirname + '/../../' +}; + +io.sockets.on('connection', function(socket) { + socket.on('slidechanged', function(slideData) { + socket.broadcast.emit('slidedata', slideData); + }); +}); + +app.configure(function() { + [ 'css', 'assets', 'js', 'lib' ].forEach(function(dir) { + app.use('/' + dir, staticDir(opts.baseDir + dir)); + }); +}); + +app.get("/", function(req, res) { + fs.createReadStream(opts.baseDir + '/index.html').pipe(res); +}); + +app.get("/notes/:socketId", function(req, res) { + + fs.readFile(opts.baseDir + 'lib/slidenotes/notes.html', function(err, data) { + res.send(Mustache.to_html(data.toString(), { + socketId : req.params.socketId + })); + }); + // fs.createReadStream(opts.baseDir + 'slidenotes/notes.html').pipe(res); +}); + +// Actually listen +app.listen(opts.port || null); + +console.log("Open the slides at http://localhost" + (opts.port ? (':' + opts.port) : '') + " and look for a link to the speaker notes in the console"); +console.log("Advance through your slides and your notes will advance automatically"); diff --git a/lib/slidenotes/notes.html b/lib/slidenotes/notes.html new file mode 100644 index 0000000..88924c0 --- /dev/null +++ b/lib/slidenotes/notes.html @@ -0,0 +1,109 @@ +<!doctype html> +<html lang="en"> + <head> + <meta charset="utf-8"> + + <title>reveal.js - Slide Notes</title> + + <style> + body { + font-family: Helvetica; + } + + #notes { + font-size: 24px; + width: 640px; + margin-top: 5px; + } + + #wrap-current-slide { + width: 640px; + height: 512px; + float: left; + overflow: hidden; + } + + #current-slide { + width: 1280px; + height: 1024px; + border: none; + -moz-transform: scale(0.5); + -moz-transform-origin: 0 0; + -o-transform: scale(0.5); + -o-transform-origin: 0 0; + -webkit-transform: scale(0.5); + -webkit-transform-origin: 0 0; + } + + #wrap-next-slide { + width: 320px; + height: 256px; + float: left; + margin: 0 0 0 10px; + overflow: hidden; + } + + #next-slide { + width: 1280px; + height: 1024px; + border: none; + -moz-transform: scale(0.25); + -moz-transform-origin: 0 0; + -o-transform: scale(0.25); + -o-transform-origin: 0 0; + -webkit-transform: scale(0.25); + -webkit-transform-origin: 0 0; + } + + .slides { + position: relative; + margin-bottom: 10px; + border: 1px solid black; + border-radius: 2px; + background: rgb(28, 30, 32); + } + + .slides span { + position: absolute; + top: 3px; + left: 3px; + font-weight: bold; + font-size: 14px; + color: rgba( 255, 255, 255, 0.9 ); + } + </style> + </head> + + <body> + + <div id="wrap-current-slide" class="slides"> + <iframe src="/?receiver" width="1280" height="1024" id="current-slide"></iframe> + </div> + + <div id="wrap-next-slide" class="slides"> + <iframe src="/?receiver" width="640" height="512" id="next-slide"></iframe> + <span>UPCOMING:</span> + </div> + <div id="notes"></div> + + <script src="/socket.io/socket.io.js"></script> + + <script> + var socketId = '{{socketId}}'; + var socket = io.connect(window.location.origin); + var notes = document.getElementById('notes'); + var currentSlide = document.getElementById('current-slide'); + var nextSlide = document.getElementById('next-slide'); + + socket.on('slidedata', function(data) { + // ignore data from sockets that aren't ours + if (data.socketId !== socketId) { return; } + + notes.innerHTML = data.notes; + currentSlide.contentWindow.Reveal.navigateTo(data.indexh, data.indexv); + nextSlide.contentWindow.Reveal.navigateTo(data.nextindexh, data.nextindexv); + }); + </script> + + </body> +</html> diff --git a/package.json b/package.json new file mode 100644 index 0000000..fa85011 --- /dev/null +++ b/package.json @@ -0,0 +1,20 @@ +{ + "author": "Hakim El Hattab", + "name": "reveal.js", + "description": "HTML5 Slideware with Presenter Notes", + "version": "1.5.0", + "repository": { + "type": "git", + "url": "git://github.com/hakimel/reveal.js.git" + }, + "engines": { + "node": "~0.6.8" + }, + "dependencies": { + "underscore" : "1.3.3", + "express" : "2.5.9", + "socket.io" : "0.9.6", + "mustache" : "0.4.0" + }, + "devDependencies": {} +} |