Bug 163356 - [Modern Media Controls] TimeControl and TimeLabel
Summary: [Modern Media Controls] TimeControl and TimeLabel
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Media (show other bugs)
Version: Safari 10
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Antoine Quint
URL:
Keywords: InRadar
Depends on: 163328
Blocks: 163387
  Show dependency treegraph
 
Reported: 2016-10-12 13:50 PDT by Antoine Quint
Modified: 2016-10-13 11:47 PDT (History)
5 users (show)

See Also:


Attachments
Patch (18.19 KB, patch)
2016-10-12 13:57 PDT, Antoine Quint
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews101 for mac-yosemite (1.10 MB, application/zip)
2016-10-12 15:03 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews105 for mac-yosemite-wk2 (1.22 MB, application/zip)
2016-10-12 15:06 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews126 for ios-simulator-wk2 (9.24 MB, application/zip)
2016-10-12 15:18 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews112 for mac-yosemite (1.71 MB, application/zip)
2016-10-12 15:19 PDT, Build Bot
no flags Details
Patch (18.45 KB, patch)
2016-10-12 22:56 PDT, Antoine Quint
no flags Details | Formatted Diff | Diff
Patch for landing (18.43 KB, patch)
2016-10-13 11:11 PDT, Antoine Quint
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Antoine Quint 2016-10-12 13:50:25 PDT
Media controls need a way to let the user interact with the media's current time and see how it changes with labels. This task covers the creation of a TimeControl object that contains a Scrubber (see https://bugs.webkit.org/show_bug.cgi?id=163328) and two TimeLabel objects.
Comment 1 Radar WebKit Bug Importer 2016-10-12 13:51:01 PDT
<rdar://problem/28741376>
Comment 2 Antoine Quint 2016-10-12 13:57:54 PDT
Created attachment 291393 [details]
Patch
Comment 3 Antoine Quint 2016-10-12 14:00:56 PDT
It is expected that tests will fail until https://bugs.webkit.org/show_bug.cgi?id=163328 has landed.
Comment 4 Build Bot 2016-10-12 15:03:04 PDT
Comment on attachment 291393 [details]
Patch

Attachment 291393 [details] did not pass mac-ews (mac):
Output: http://webkit-queues.webkit.org/results/2272787

New failing tests:
media/modern-media-controls/time-label/time-label.html
media/modern-media-controls/time-control/time-control.html
Comment 5 Build Bot 2016-10-12 15:03:06 PDT
Created attachment 291402 [details]
Archive of layout-test-results from ews101 for mac-yosemite

The attached test failures were seen while running run-webkit-tests on the mac-ews.
Bot: ews101  Port: mac-yosemite  Platform: Mac OS X 10.10.5
Comment 6 Build Bot 2016-10-12 15:06:11 PDT
Comment on attachment 291393 [details]
Patch

Attachment 291393 [details] did not pass mac-wk2-ews (mac-wk2):
Output: http://webkit-queues.webkit.org/results/2272794

New failing tests:
media/modern-media-controls/time-label/time-label.html
media/modern-media-controls/time-control/time-control.html
Comment 7 Build Bot 2016-10-12 15:06:13 PDT
Created attachment 291403 [details]
Archive of layout-test-results from ews105 for mac-yosemite-wk2

The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews.
Bot: ews105  Port: mac-yosemite-wk2  Platform: Mac OS X 10.10.5
Comment 8 Build Bot 2016-10-12 15:18:41 PDT
Comment on attachment 291393 [details]
Patch

Attachment 291393 [details] did not pass ios-sim-ews (ios-simulator-wk2):
Output: http://webkit-queues.webkit.org/results/2272814

New failing tests:
media/modern-media-controls/time-label/time-label.html
media/modern-media-controls/time-control/time-control.html
Comment 9 Build Bot 2016-10-12 15:18:44 PDT
Created attachment 291405 [details]
Archive of layout-test-results from ews126 for ios-simulator-wk2

The attached test failures were seen while running run-webkit-tests on the ios-sim-ews.
Bot: ews126  Port: ios-simulator-wk2  Platform: Mac OS X 10.11.6
Comment 10 Build Bot 2016-10-12 15:19:45 PDT
Comment on attachment 291393 [details]
Patch

Attachment 291393 [details] did not pass mac-debug-ews (mac):
Output: http://webkit-queues.webkit.org/results/2272771

New failing tests:
media/modern-media-controls/time-label/time-label.html
media/modern-media-controls/time-control/time-control.html
Comment 11 Build Bot 2016-10-12 15:19:48 PDT
Created attachment 291407 [details]
Archive of layout-test-results from ews112 for mac-yosemite

The attached test failures were seen while running run-webkit-tests on the mac-debug-ews.
Bot: ews112  Port: mac-yosemite  Platform: Mac OS X 10.10.5
Comment 12 Antoine Quint 2016-10-12 22:56:38 PDT
Created attachment 291456 [details]
Patch
Comment 13 Dean Jackson 2016-10-13 11:06:40 PDT
Comment on attachment 291456 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=291456&action=review

> Source/WebCore/Modules/modern-media-controls/controls/time-control.js:30
> +const MinimumScrubberWidth = 168;
> +const ElapsedTimeLabelLeftMargin = -2;
> +const ElapsedTimeLabelWidth = 45;
> +const RemainingTimeLabelWidth = 49;
> +const RemainingTimeLabelLeftMargin = 5;

Where do all these come from?

> Source/WebCore/Modules/modern-media-controls/controls/time-label.css:32
> +    color: rgba(255, 255, 255, 0.572);

Why 0.572?

I think you should start taking these colors out to a variables.css file.

> Source/WebCore/Modules/modern-media-controls/controls/time-label.js:77
> +        return sign + timeStrings.map(x => String("00" + x).slice(-2)).join(":");

`00${x}`
Comment 14 Antoine Quint 2016-10-13 11:08:44 PDT
(In reply to comment #13)
> Comment on attachment 291456 [details]
> Patch
> 
> View in context:
> https://bugs.webkit.org/attachment.cgi?id=291456&action=review
> 
> > Source/WebCore/Modules/modern-media-controls/controls/time-control.js:30
> > +const MinimumScrubberWidth = 168;
> > +const ElapsedTimeLabelLeftMargin = -2;
> > +const ElapsedTimeLabelWidth = 45;
> > +const RemainingTimeLabelWidth = 49;
> > +const RemainingTimeLabelLeftMargin = 5;
> 
> Where do all these come from?

The specs I've been provided.

> > Source/WebCore/Modules/modern-media-controls/controls/time-label.css:32
> > +    color: rgba(255, 255, 255, 0.572);
> 
> Why 0.572?

This is coming from the specs I've been provided.

> I think you should start taking these colors out to a variables.css file.

Yes, I'll do that as a followup task across all source files.

> > Source/WebCore/Modules/modern-media-controls/controls/time-label.js:77
> > +        return sign + timeStrings.map(x => String("00" + x).slice(-2)).join(":");
> 
> `00${x}`

Nice. Will change as I land.
Comment 15 Antoine Quint 2016-10-13 11:11:16 PDT
Created attachment 291498 [details]
Patch for landing
Comment 16 WebKit Commit Bot 2016-10-13 11:47:48 PDT
Comment on attachment 291498 [details]
Patch for landing

Clearing flags on attachment: 291498

Committed r207295: <http://trac.webkit.org/changeset/207295>
Comment 17 WebKit Commit Bot 2016-10-13 11:47:52 PDT
All reviewed patches have been landed.  Closing bug.