- From: Steve Lacey <sjl@chromium.org>
- Date: Mon, 25 Apr 2011 09:19:25 -0700
As someone who's actively working on media controls, I'd love to see this. Also need some audio pseudo-classes (e.g. muted). Cheers! Steve On Sun, Apr 24, 2011 at 9:04 PM, Dimitri Glazkov <dglazkov at chromium.org>wrote: > Based on WebKit's current media controls, let's start with these > pseudo-classes: > > Play state: > - loading > - playing > - streaming > - error > > Capabilities: > - no-audio > - no-video > - has-closed-captioning > > So, to show a status message while the control is loading or streaming > and hide when it's done: > > video -webkit-media-controls-status-display { > display: none; > } > > > video:loading -webkit-media-controls-status-display, video:streaming > -webkit-media-controls-status-display { > display: initial; > ... > } > > Similarly, to hide volume controls when there's no audio: > > video:no-audio -webkit-media-controls-volume-slider-container { > display: none; > } > > Once I put these pseudo-classes in place for WebKit, a lot of the code > in > http://codesearch.google.com/codesearch/p#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/html/shadow/MediaControlRootElement.cpp&exact_package=chromium > will go away, being replaced with straight CSS. > > :DG< > > On Sun, Apr 24, 2011 at 8:31 PM, Silvia Pfeiffer > <silviapfeiffer1 at gmail.com> wrote: > > A markup and CSS example would make things clearer. How do you think > > it would look? > > Silvia. > > > > > > On Sun, Apr 24, 2011 at 9:40 AM, Dimitri Glazkov <dglazkov at chromium.org> > wrote: > >> On Sat, Apr 23, 2011 at 1:57 PM, Philip J?genstedt <philipj at opera.com> > wrote: > >>> On Sat, 23 Apr 2011 21:32:06 +0200, Dimitri Glazkov < > dglazkov at chromium.org> > >>> wrote: > >>> > >>>> On Sat, Apr 23, 2011 at 11:37 AM, Philip J?genstedt < > philipj at opera.com> > >>>> wrote: > >>>>> > >>>>> On Sat, 23 Apr 2011 17:02:56 +0200, Dimitri Glazkov > >>>>> <dglazkov at chromium.org> > >>>>> wrote: > >>>>> > >>>>>> On Sat, Apr 23, 2011 at 2:57 AM, Philip J?genstedt < > philipj at opera.com> > >>>>>> wrote: > >>>>>>> > >>>>>>> On Sat, 23 Apr 2011 05:25:20 +0200, Dimitri Glazkov > >>>>>>> <dglazkov at chromium.org> > >>>>>>> wrote: > >>>>>>> > >>>>>>>> I wonder if it makes sense to introduce a set of pseudo-classes on > the > >>>>>>>> video/audio elements, each reflecting a state of the media on the > >>>>>>>> controls (playing/paused/error/etc.)? Then, we could use just CSS > to > >>>>>>>> style media controls (whether native or custom), and not have to > >>>>>>>> listen to DOM events just to tweak their appearance. > >>>>>>> > >>>>>>> With a sufficiently large set of pseudo-classes it might be > possible to > >>>>>>> do > >>>>>>> *display* most of the interesting state, but how would you *change* > the > >>>>>>> state without using scripts? Play/pause, seek, volume, etc... > >>>>>> > >>>>>> This is not the goal of using pseudo-classes: they just provide you > >>>>>> with a uniform way to react to changes. > >>>>> > >>>>> In other words, one would still have to rely heavily on scripts to > >>>>> actually > >>>>> implement custom controls? > >>>> > >>>> Heavily is subjective. But yep :) > >>>> > >>>>> > >>>>> Also, how would one style a progress bar using pseudo-classes? How > about > >>>>> a > >>>>> displaying elapsed/remaining time on the form MM:SS? > >>>> > >>>> I am not in any way trying to invent a magical way to style media > >>>> controls entirely in CSS. Just trying to make the job of controls > >>>> developers easier and use CSS where it's well... useful? :) > >>> > >>> Very well, what specific set pseudo-classes do you think would be > useful? > >> > >> I can infer what would be useful from WebKit's media controls as a first > stab? > >> > >> :DG< > >> > >>> > >>> -- > >>> Philip J?genstedt > >>> Core Developer > >>> Opera Software > >>> > >> > > >
Received on Monday, 25 April 2011 09:19:25 UTC