slide-drive icon indicating copy to clipboard operation
slide-drive copied to clipboard

Allow media to be embedded in slides, synchronized

Open banksJeremy opened this issue 12 years ago • 1 comments

Greg suggested the ability to embed audio and video in slides.

It seems like it would be great if we could do this, while keeping those element's playback synchronized with the presentation overall. We could hide/disable the controls on the individual media elements, and just let them be controlled through the main controls (playback as well as muting).

There doesn't seem to be a built-in way to synchronize multiple Players, but it probably won't be too horrible.

Attaching sub-slides/animations to a per-slide synchronized BasePlayer might be a clean way to integrate that, too.

banksJeremy avatar Jun 13 '12 17:06 banksJeremy

Something like...

function sync( master, slave, offset ) {
  slave.controls(false);
  slave.currentTime( master.currentTime() - offset );

  if ( master.paused() ) {
    slave.pause();
  } else {
    slave.play();
  }

  master.on( "seeking", function() { slave.pause(); } );
  master.on( "seeked", function() {
    slave.currentTime( master.currentTime() - offset );
    // or the new time is outside of slave's time, pause it
  });

  // playing, pause, volumechange
}

And then, for each slide:

if ( slide.media ) {
  sync( popcorn, slide.media, slide.start );
}

edit: actually, trying to make something entirely general may be unwise. Don't register handlers for every slide, just have one set of handlers and use deck.change to stay aware of what synced media is active.

banksJeremy avatar Jun 13 '12 18:06 banksJeremy