W3C home > Mailing lists > Public > www-style@w3.org > August 2012

Re: a :time pseudo-class for media elements (and examples on how it would be useful and generic)

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Thu, 2 Aug 2012 12:34:07 -0700
Message-ID: <CAAWBYDCNaNz==e1b+9zDGSYLyiO+TAHHDHUyG5pVbf8KY1aYXA@mail.gmail.com>
To: Julien Dorra <juliendorra@juliendorra.com>
Cc: www-style@w3.org
Hi Julien!  I'm going to respond to your email without worrying about
all the other feedback, so apologies if I end up duplicating
something.  I'll also quickly head down some topics you've already
addressed in your emails just to make it easier to follow.

Your overall use-case - subtitling videos without using JS - is
addressed well by <track> and WebVTT.  The feature set for WebVTT was
developed by looking at lots of examples of actual subtitles in the
world, so it should be adequate for most things.  You're right that it
doesn't allow links or images, though.

If you do need the full power of HTML, as you say, you can do this
with existing animations.  For example, to do a timed slideshow, just
use some animatable property to hide everything, create an animation
that unhides them using that property, then set it on all the slides,
adjusting animation-delay and animation-duration to control when they
appear.  However, this only works well when the page is running
independently - doing it to something smaller in a page that should be
synced to a video is much more difficult.

We're actually starting to address this with our Web Animations work,
which defines a generic animation/timeline model that CSS (and SVG)
animations map onto, and which can be manipulated by Javascript.  One
of the primitives in this model is a sync container that keeps all of
its synced animations running at the same time, even if one is paused
or scrubbed.  The MediaController object from HTML (slaves multiple
videos/audios together) will map into this primitive, for example.

This should address your use-case.  You'd slave the video and the
animation-using subtitling elements together in a sync container (with
the video as the controller), and it'll Just Work.  If you pause or
scrub the video timeline, the html will adjust appropriately as well.
We probably need to make sure it's relatively easy to define nested
timelines so you can have multiple videos on the page without them
interfering with each other, but that's it.

Is there anything I missed?

Received on Thursday, 2 August 2012 19:34:55 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:19 UTC