Syncing Live Streaming Video

[TheApeMachine]

I have been trying to understand something, but I can't quite figure it out.
Basically, I understand the idea of syncing playback on multiple devices when it comes to streaming a prerecorded video, but how would I go about syncing a live stream across multiple devices?

I have an HLS live stream, and I don't quite seem to get how to get those in sync, and whether or not this is even possible.

[Snarkdoof]

It is perfectly possible to synchronize a live stream. You will need to have timestamps in the stream (epoch is better but it will work regardless) added by the encoder. You then need to set the timing object or motion to a valid time for the player. If you play too close to head, it will fail, and if you play outside the hls window, it will fail. Otherwise, it will work just like any other video.

[TheApeMachine]

But it seems like if I have one players start after the other player they use a timeline that is relative to whenever the first fragment was received, so how do I set the players to a valid time on both? I have a timestamp sent as ID3 already, in UTC format.

[Snarkdoof]

The encoder must add the timestamps to the video, not as id3. Check the options of your encoder, it will be much easier for you than working around it.

[TheApeMachine]

Is there any specific documentation I could look at to get more of a grasp on understanding what you are proposing, or even some sort of example? I am reading through all the documentation right now, but it's quite dense when you haven't done much of this before.

Thanks for your help by the way.

[Snarkdoof]

We don't have any particular docs for this no, but for ffmpeg and MPEG DASH, options like "-f dash -min_seg_duration 1000000 -use_template 1 -use_timeline 1" will add consistent timestamps to the video (starting on 0, but consistent for all players). Look at the documentation for your encoder and look for timeline and timestamp options. :)

[ingararntzen]

It's a basic requirement that media content must have a timeline in order to be syncable. The preservation of timeline through live streaming solutions (from injest to media player) is a topic in its own right, and as such perhaps outside the scope of the timingsrc documentation. I agree though, that it would be helpful with a few pointers in this direction. I'm planning to review the docs within the next month or so, so I'll see what I can do about this.

[TheApeMachine]

Ok, I am going to look into this. My guess is that is already happening, because I do see a lot of timestamps going on in the events I can inspect from hls.js and I will try to figure out how to connect this to the timing object. At the moment I actually do have two players in sync using one of those timestamps and using:

to.update({position: data.frag.start, velocity: 1.0});

to keep both players in sync, but that is on the same page though, and across multiple devices they will not share the same timing object.
My best guess is that I will have to use MCorp Media Sync to create a timing source that is updated from the encoder side?

[Snarkdoof]

You should synchronize the video element, not hls.js. hls.js will provide timestamps to the player. The shared motion should be set to a value where all the clients will have the data. If your setup has a latency of say 2-4 seconds for all clients, set it to at least 4 (for example epoc + 4 seconds if you use epoc). :)

[TheApeMachine]

And the video element is synced like this right?

var sync1 = MCorp.mediaSync(document.getElementById('player1'), to);

[ingararntzen]

Yes.

To summarize

• sync two videos by using the same timing object for both
• if you want sync across webpages you have to define a shared motion with motion corp and plug it into your timing object (thus making your timing object a global timing object)
• how to initialise/control the timing object is completely up to you.
  • you may have an online timing object which is always set to say epoch + 4. Shared motions are stateful, so you can just set it once manually, and then you are good. Local timing objects aren't stateful, so they have to be created on page load.
  • you may set it from the first player to get data (this might lead to complications as you need to avoid all players setting the timing object)
  • you may set it manually, tweeking it until it looks right. (tips: define another webpage just for timing object controls)

The first approach is probably the simplest.

[ingararntzen]

Eh, importantly - when you want to delay something that runs on a clock, you need to turn the clock back, not forward. So, the timing object should be set to epoch - 4, not epoch + 4 as erroneously stated above. Sorry about that.