Quickie keyboard controlled slideshow w/ mp3 and video and autotimer support.

• Originally made for Aaron Renier's performance at Brain Frame 5
• Then used for Jeremy Tinder's performance at Brain Frame 9
• Then added video support for my own performance at Brain Frame 12
• Finally, added auto_timer support for the Brain Frame 19 finale.

After watching people struggle while projected on a giant screen in front of an audience navigating Finder + Preview + View > Enter Full Screen, sometimes trying to queue up songs on iTunes, and even worse, switching back to Finder to open a video mid-slideshow, I put this together.

Not terribly user-friendly atm, but I built it for myself. Still handy as a jumping point if you want a quick, customizable slideshow to run locally off your laptop. (Just double click index.html after putting up your own images and editing slides.js.)

Starts with a placeholder page (that I change like a total nerd for every show). You can click on it to start, or press right arrow or space to progress to next slide. Left arrow goes back a slide. Esc reloads the site/app/whateverthisis, jumping you back to the placeholder page.

Mp3s will only play if you are progressing forward, so you can go back a few slides without restarting the music if you skipped ahead accidentally.

Upload images to /img/, mp3s to /mp3/, and videos to /videos/, then edit the slides array in /js/slides.js.

Per-slide options:

bgcolor: '#000'

sets the background color for the slide

image: 'black.png'

slide image filename, loads from /img/filename

mp3: ''

optional mp3 filename, will load from /mp3/filename

mp3_start: 0

optional ability to start midway into an mp3, in seconds

video: ''

if image is not set and video is set, it will load & autoplay a video from /videos/filename

auto: 0

will set a autotimer to jump to next slide if > 0.

There are also a few options at the top of slides.js:

var full_screen_images = false;

set to true for fullscreen images (otherwise it will center the image, best for smaller panels)

var cross_fade = false;

set to true for crossfaded images (this felt weird for comics but it can be nice if you use this for something else)