How to use server side speaker notes of reveal.js

I want to use the server side speaker notes of reveal.js so that I can use other devices to switch slides while my presentation is running on my laptop. I followed the instructions on reveal.js github page and now have a full installation.

I am able to use the speaker notes on my laptop without a problem. So I tried the server side speaker notes following these instructions. Thus when I run the server and go to localhost:1947 using a browser a popup opens which looks like the normal speaker notes page. I now have three problems:

1) My notes do not show up in the popup page. Even though they did in the normal speaker notes page.

2) If i sweep through slides in the popup page they don't change in the main page

3) The "Upcoming" section in the popup page doesn't update. But it did in the normal speaker notes.

I'm using an ubuntu 13.10 64bit system. I have node.js v0.10.26, express 2.5.8 and grunt v0.4.4 installed. I also installed socket.io using:

sudo npm install socket.io

Could this be some compatibility issue or is it me whose doing something wrong? I've never worked with node.js or socket.io so I'm not sure where to look.

EDIT:

I add a minimal example here. Though in order to use it you need to put it in index.html in reveal.js directory and install plugins using:

npm install

then in order to run it enter this command:

node plugin/notes-server/

you also need to have node.js and grunt installed. after running you can open the slides from localhost:1947. When you open this page a pop-up will appear which is the notes page and you should be able to change slides in the main page from there. Unfortunately I can't. index.html:

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">

    <title>minimal sample</title>
    <link rel="stylesheet" href="css/reveal.min.css">
    <link rel="stylesheet" href="css/theme/default.css" id="theme">
</head>

<body>

    <div class="reveal">
        <div class="slides">
            <section>
                <h1>Reveal.js</h1>
                <h3>HTML Presentations Made Easy</h3>
                <p>
                    <small>Created by <a href="http://hakim.se">Hakim El Hattab</a> / <a href="http://twitter.com/hakimel">@hakimel</a></small>
                </p>
            </section>

            <section>
                <h2>Heads Up</h2>
                <p>
                    reveal.js is a framework for easily creating beautiful presentations using HTML. You'll need a browser with
                    support for CSS 3D transforms to see it in its full glory.
                </p>
            </section>
        </div>
    </div>

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

    <script>
        Reveal.initialize({
            dependencies: [
                { src: 'socket.io/socket.io.js', async: true },
                { src: 'plugin/notes-server/client.js', async: true }
            ]
        });

    </script>

</body>

slides

server notes (popup)

Recommended topics

Hot tags