Home HelloWorld! Doc API Examples GitHub

Example MediaSync (multi-device)

Synchronization and control of two video elements using timing object. Both videos produce audio independently. Listening to the audio is likely the best way to detect synchronization errors.

Demo Tips

  • open this page on multiple devices (or at least multiple browser tabs) (simultaneously) to verify multi-device timing.
  • the timing provider is shared globally, so others might be playing with demo too…
  • try reloading the demo on one device/tab while the demo is running on others.

Demo

Player 1

Player 2

HTML

<script text="javascript" src="https://mcorp.no/lib/mediasync.js"></script>

JavaScript

// timing object
var to = new TIMINGSRC.TimingObject({provider:timingProvider});

// set up video sync
var sync1 = MCorp.mediaSync(document.getElementById('player1'), to);

// set up video sync
var sync2 = MCorp.mediaSync(document.getElementById('player2'), to);