Re: {minutes} Geneva F2F day 1 16/09/2014

Le 23/09/2014 03:42, Silvia Pfeiffer a écrit :
> On Tue, Sep 23, 2014 at 1:04 AM, Nigel Megitt <nigel.megitt@bbc.co.uk> wrote:
>>> 3.) CSS works by using ::cue and ::cue-region - the first for cues and
>>> the second for regions.
>>> These selectors work from a Web page (wherever CSS is specified there)
>>> and override default styling of WebVTT cues.
>> Is there a selector that can be used to distinguish cues within different
>> WebVTT resources referenced from the same HTML, so that it is possible to
>> style them differently?
>
> ::cue is a CSS pseudo-element, just like ::first-line or ::first-letter .
> It needs to have a CSS selector in front of it to apply.
>
> So, you should be able to apply it to different WebVTT files in
> different <track> elements.
Do you mean like that:

<html>
<head>
     <link rel="stylesheet" type="text/css" href="styles-en.css">
     <link rel="stylesheet" type="text/css" href="styles-fr.css">
</head>
<body>
<video width="640" height="480" controls>
   <source src="video.mp4" type="video/mp4" ></source>
   <track src="styles-en.vtt" kind="subtitles" srclang="en" 
label="English"></track>
   <track src="styles-fr.vtt" kind="subtitles" srclang="fr" 
label="French"></track>
</video>
</body>
</html>

With styles-en.vtt:
WEBVTT

00:00:00.000 --> 00:00:02.000
<c.style1>This text uses style1

00:00:02.000 --> 00:00:04.000
<c.style2>This text uses style2

and styles-fr.vtt
WEBVTT

00:00:00.000 --> 00:00:02.000
<c.style1>Ce texte utilise style1

00:00:02.000 --> 00:00:04.000
<c.style2>Ce texte utilise style2

and styles-en.css
track[srclang=en] ::cue(.style1) {
     color: red;
}

track[srclang=en] ::cue(.style2) {
     color: green;
}

and styles-fr.css
track[srclang=fr] ::cue(.style1) {
     color: pink;
}

track[srclang=fr] ::cue(.style2) {
     color: orange;
}

If yes, this is not very nice because the content of CSS has to depend 
on the HTML to style the WebVTT cues. It would be a lot better if:
a) there was a reference from the WebVTT to the CSS (e.g. a header: 
style: myfile.css)
b) or it was possible to inline CSS in the VTT (e.g. in the header or in 
the cue settings)
c) or to have scoped stylesheet (not sure that still exists) placed the 
<track> element.

Cyril

-- 
Cyril Concolato
Multimedia Group / Telecom ParisTech
http://concolato.wp.mines-telecom.fr/
@cconcolato

Received on Tuesday, 23 September 2014 08:34:50 UTC