aboutsummaryrefslogtreecommitdiff
path: root/plugin/multiplex
diff options
context:
space:
mode:
authorDavid Banham <david.banham@gmail.com>2012-08-05 23:48:55 +1000
committerDavid Banham <david.banham@gmail.com>2012-08-05 23:48:55 +1000
commit976536d15ec7859313dcbce33c97fdfd69c00eb1 (patch)
treec3e3042c9af198dbf092e9e56ef590277359ab3a /plugin/multiplex
parent79299d00710e61c7b9cbd9bfda87168b958a836d (diff)
downloadfreenode-live-2017-presentation-976536d15ec7859313dcbce33c97fdfd69c00eb1.tar
freenode-live-2017-presentation-976536d15ec7859313dcbce33c97fdfd69c00eb1.tar.gz
Added multiplexing server
Diffstat (limited to 'plugin/multiplex')
-rw-r--r--plugin/multiplex/client.js12
-rw-r--r--plugin/multiplex/index.js62
-rw-r--r--plugin/multiplex/master.js32
-rw-r--r--plugin/multiplex/notes.html109
4 files changed, 215 insertions, 0 deletions
diff --git a/plugin/multiplex/client.js b/plugin/multiplex/client.js
new file mode 100644
index 0000000..5e6b556
--- /dev/null
+++ b/plugin/multiplex/client.js
@@ -0,0 +1,12 @@
+(function() {
+ var socketId = multiplex.id;
+ var socket = io.connect(multiplex.url);
+
+ socket.on(multiplex.id, function(data) {
+ // ignore data from sockets that aren't ours
+ if (data.socketId !== socketId) { return; }
+ if( window.location.host === 'localhost:1947' ) return;
+
+ Reveal.navigateTo(data.indexh, data.indexv, false);
+ });
+}());
diff --git a/plugin/multiplex/index.js b/plugin/multiplex/index.js
new file mode 100644
index 0000000..7e3f872
--- /dev/null
+++ b/plugin/multiplex/index.js
@@ -0,0 +1,62 @@
+var express = require('express');
+var fs = require('fs');
+var io = require('socket.io');
+var _ = require('underscore');
+var Mustache = require('mustache');
+var crypto = require('crypto');
+
+var app = express.createServer();
+var staticDir = express.static;
+
+io = io.listen(app);
+
+var opts = {
+ port : 1948,
+ baseDir : __dirname + '/../../'
+};
+
+io.sockets.on('connection', function(socket) {
+ socket.on('slidechanged', function(slideData) {
+ console.log(slideData);
+ if (createHash(slideData.secret) === slideData.socketId) {
+ slideData.secret = null;
+ socket.broadcast.emit(slideData.socketId, slideData);
+ };
+ });
+});
+
+app.configure(function() {
+ [ 'css', 'js', 'plugin', '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("/token", function(req,res) {
+ var ts = new Date().getTime();
+ var rand = Math.floor(Math.random()*9999999);
+ var secret = ts.toString() + rand.toString();
+ res.send({secret: secret, socketId: createHash(secret)});
+});
+
+var createHash = function(secret) {
+ var cipher = crypto.createCipher('blowfish', secret);
+ return(cipher.final('hex'));
+};
+
+// Actually listen
+app.listen(opts.port || null);
+
+var brown = '\033[33m',
+ green = '\033[32m',
+ reset = '\033[0m';
+
+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" );
diff --git a/plugin/multiplex/master.js b/plugin/multiplex/master.js
new file mode 100644
index 0000000..cf629d9
--- /dev/null
+++ b/plugin/multiplex/master.js
@@ -0,0 +1,32 @@
+(function() {
+ // don't emit events from inside the previews themselves
+ if ( window.location.search.match( /receiver/gi ) ) { return; }
+
+ var socket = io.connect(multiplex.url);
+
+ 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 = {
+ indexh : event.indexh,
+ indexv : event.indexv,
+ nextindexh : nextindexh,
+ nextindexv : nextindexv,
+ secret: multiplex.secret,
+ socketId : multiplex.id
+ };
+
+ socket.emit('slidechanged', slideData);
+ } );
+}());
diff --git a/plugin/multiplex/notes.html b/plugin/multiplex/notes.html
new file mode 100644
index 0000000..88924c0
--- /dev/null
+++ b/plugin/multiplex/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>