W3C home > Mailing lists > Public > public-webtiming@w3.org > June 2015

Sequencer prototype

From: Francois Daoust <fd@w3.org>
Date: Thu, 18 Jun 2015 14:03:43 +0200
Message-ID: <5582B39F.5060906@w3.org>
To: public-webtiming@w3.org
Hi,

Pursing my exploration of synchronization concepts and interfaces that 
could help Web developers who, like me, are not experts in 
synchronization issues, I implemented a first version of a "Sequencer" 
class to coordinate the playback of one or more media elements with a 
timing object.

Ingar, I don't know if my sequencer matches what you had in mind with 
the HTMLMediaSequencer. If not, I'll just rename to something along the 
lines of "TimingObjectController".

The source code is in the same Git repo as before, on GitHub:
https://github.com/tidoust/timingservice

The Sequencer class is defined in:
https://github.com/tidoust/timingservice/blob/master/src/Sequencer.js

 From a Web developer perspective, the code needed to use a sequencer 
associated with a timing object that is in turn associated with an 
online timing service through some "SocketTimingProvider" class would 
look like:

=====
// Create the timing object
// (SocketTimingProvider provided by the online timing service)
var timingProvider = new SocketTimingProvider('ws://...');
var timing = new TimingObject();
timing.srcObject = timingProvider;

// Create the sequencer that takes input from the timing object
var sequencer = new Sequencer(timing);

// Add video to the slaved media elements of a sequencer
var video = document.getElementById('myvideo');
sequencer.addMediaElement(video);

// Attach video controls to the sequencer
playButton.onclick = function () { sequencer.play(); };
pauseButton.onclick = function () { sequencer.pause(); };
=====

The interface exposed by the Sequencer is voluntarily close to that of a 
MediaController (play, pause, currentTime, playbackRate). If browsers 
start implementing something similar, it would probably make sense to 
replace the call to "addMediaElement" with a more familiar 
"video.controller = sequencer;" and perhaps attach the video controls to 
the sequencer automatically under the hoods.

It is "close to" but not exactly the same as the MediaController 
interface. In particular, the "readyState" attribute of the sequencer 
currently represents the state of the timing object, not that of the 
media elements. I'm not sure how to handle the whole part about 
buffering for the time being. This does not map well with the timing 
object approach.


Check the "How to use" section in the README of the Git repo to try out 
a concrete example in your browser. The result depends on the browser 
and platform you will be using. It is somewhat good with video, less so 
with audio.

This "so-so" outcome is due to the low-quality of this implementation 
(in other words, I do not doubt that one can do much better), but some 
of it is probably also due to the fact that controlling a video 
externally by adjusting its playback rate is inherently not very efficient.

Thanks,
Francois.

PS: I also improved the clock synchronization mechanism. The whole code 
should still be regarded as "rough", though ;)
Received on Thursday, 18 June 2015 12:04:48 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 19:25:14 UTC