From 4c5b15d0b92cae5828df5d39c5e5a51e68242752 Mon Sep 17 00:00:00 2001 From: Hakim El Hattab Date: Sun, 4 May 2014 09:32:00 +0200 Subject: [PATCH] update server side notes to match client side plugin --- plugin/notes-server/client.js | 69 +++-- plugin/notes-server/index.js | 47 ++-- plugin/notes-server/notes.html | 442 +++++++++++++++++++++++++-------- 3 files changed, 395 insertions(+), 163 deletions(-) diff --git a/plugin/notes-server/client.js b/plugin/notes-server/client.js index ee60ff7..f7ecfa2 100644 --- a/plugin/notes-server/client.js +++ b/plugin/notes-server/client.js @@ -1,55 +1,28 @@ (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 ); + var socket = io.connect( window.location.origin ), + socketId = Math.random().toString().slice( 2 ); console.log( 'View slide notes at ' + window.location.origin + '/notes/' + socketId ); window.open( window.location.origin + '/notes/' + socketId, 'notes-' + socketId ); - // Fires when a fragment is shown - Reveal.addEventListener( 'fragmentshown', function( event ) { - var fragmentData = { - fragment : 'next', - socketId : socketId - }; - socket.emit('fragmentchanged', fragmentData); - } ); + /** + * Posts the current slide data to the notes window + */ + function post() { - // Fires when a fragment is hidden - Reveal.addEventListener( 'fragmenthidden', function( event ) { - var fragmentData = { - fragment : 'previous', - socketId : socketId - }; - socket.emit( 'fragmentchanged', fragmentData ); - } ); - - // Fires when slide is changed - Reveal.addEventListener( 'slidechanged', function( event ) { - var nextindexh, - nextindexv, - slideElement = event.currentSlide, + var slideElement = Reveal.getCurrentSlide(), notesElement = slideElement.querySelector( 'aside.notes' ); - if( slideElement.nextElementSibling && slideElement.parentNode.nodeName == 'SECTION' ) { - nextindexh = event.indexh; - nextindexv = event.indexv + 1; - } else { - nextindexh = event.indexh + 1; - nextindexv = 0; - } - var messageData = { - notes : '', - indexh : event.indexh, - indexv : event.indexv, - nextindexh : nextindexh, - nextindexv : nextindexv, - socketId : socketId, - markdown : false + notes: '', + markdown: false, + socketId: socketId, + state: Reveal.getState() }; // Look for notes defined in a slide attribute @@ -63,6 +36,20 @@ messageData.markdown = typeof notesElement.getAttribute( 'data-markdown' ) === 'string'; } - socket.emit( 'slidechanged', messageData ); - } ); + socket.emit( 'state', messageData ); + + } + + // 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 ); + + // Post the initial state + post(); + }()); diff --git a/plugin/notes-server/index.js b/plugin/notes-server/index.js index 5535c90..b6779d3 100644 --- a/plugin/notes-server/index.js +++ b/plugin/notes-server/index.js @@ -14,46 +14,49 @@ var opts = { baseDir : __dirname + '/../../' }; -io.sockets.on('connection', function(socket) { - socket.on('slidechanged', function(slideData) { - socket.broadcast.emit('slidedata', slideData); - }); - socket.on('fragmentchanged', function(fragmentData) { - socket.broadcast.emit('fragmentdata', fragmentData); +io.sockets.on( 'connection', function( socket ) { + + socket.on( 'state', function( state ) { + socket.broadcast.emit( 'state', state ); }); + }); -app.configure(function() { - [ 'css', 'js', 'images', 'plugin', 'lib' ].forEach(function(dir) { - app.use('/' + dir, staticDir(opts.baseDir + dir)); +app.configure( function() { + + [ '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'}); - fs.createReadStream(opts.baseDir + '/index.html').pipe(res); +app.get('/', function( req, res ) { + + res.writeHead( 200, { 'Content-Type': 'text/html' } ); + fs.createReadStream( opts.baseDir + '/index.html' ).pipe( res ); + }); -app.get("/notes/:socketId", function(req, res) { +app.get( '/notes/:socketId', function( req, res ) { - fs.readFile(opts.baseDir + 'plugin/notes-server/notes.html', function(err, data) { - res.send(Mustache.to_html(data.toString(), { + fs.readFile( opts.baseDir + 'plugin/notes-server/notes.html', function( err, data ) { + res.send( Mustache.to_html( data.toString(), { socketId : req.params.socketId })); }); - // fs.createReadStream(opts.baseDir + 'notes-server/notes.html').pipe(res); + }); // Actually listen -app.listen(opts.port || null); +app.listen( opts.port || null ); var brown = '\033[33m', green = '\033[32m', reset = '\033[0m'; -var slidesLocation = "http://localhost" + ( opts.port ? ( ':' + opts.port ) : '' ); +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( "3. Advance through your slides and your notes will advance automatically" ); +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( '3. Advance through your slides and your notes will advance automatically' ); diff --git a/plugin/notes-server/notes.html b/plugin/notes-server/notes.html index 25d1a62..4ff48f1 100644 --- a/plugin/notes-server/notes.html +++ b/plugin/notes-server/notes.html @@ -3,8 +3,6 @@ - - reveal.js - Slide Notes -
- -
+
+
UPCOMING:
+
+
+

Time Click to Reset

+
+ 0:00 AM +
+
+ 00:00:00 +
+
+
-
- - UPCOMING: +
-