Quick Update

Written by Hunter Jansen on September 29, 2014

So with the start of classes and the downright oppressive amount of heat in my apartment, progress with my side projects has been going a bit slower than I’d like. That said, my newest secret project did get introduced to one of my classes and the response was pretty neato.

My new secret project - What’s that? I call it: Show Me The Thing. It’s a presentation platform! The fun thing about it is that it allows all attendees to view the presentation on their devices if they want. Using the power of websockets via socket.io, the presenter can control the presentation via any device and have the slides progress on every connected device. What’s also fun is that by using a /#solo flag when navigating to the url and flip through the slides at their leisure.

More details!

Show me the thing will be:

  • Fully mobile friendly! You can view and control presentations via your phone
  • Themeable, for now there’s going to be a single default theme, but as it grows more will be added and community themes should be easy to incorporate
  • Fully Customizable - more on that in a future post
  • Slide creators using markdown - For now the first few iterations of a slide creation engine is going to use markdown converted to HTML; primarily because it’s the easiest way to go for now (and it’s cleaner)

Tech

So for this I’m going to be using (as of this point, this could change):

  • Angular ( To allow easy templating of different slide types)
  • Foundation (For Styling)
  • Node (Server)
  • Express (Server)
  • Socket.io (Web sockets)
  • Bower (Dependency Management)
  • Animate css ( For Transitions)
  • Highlights.js ( For Code Highlighting - this might change depending on how well the markdown gets rendered)
  • Gulp (For all tasks you’d expect, and converting md to HTML)
  • Gulp-Markdown (This is the first markdown to HTML engine I’m investigating, so it may or may not change)
  • Presenter notes will be available down the line!
  • CoffeeScript, just because

Example!

This is a suuuuuper early version with everything hardcoded in place that I used to give a presentation.

You can currently view the live demo here.

In order to view the presentation in solo mode add a ‘/#solo’ to the address. In order to switch to presentation mode go to ‘/#master’ and type ‘iamthemaster’

The source code is here

If you choose to clone it, you’ll want to change the line in SMTT.coffee:

SMTT.socket = io.connect("http://www.calmlycoding.com:7777")

to

SMTT.socket = io.connect("http://www.localhost:7777")

then all you need to do is run gulp on the root of the directory and it’ll start on your localhost:7777

Until Next time -Hunter