[Modern Media Controls] Sliders: scrubber and volume
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 12 Oct 2016 21:50:03 +0000 (21:50 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Wed, 12 Oct 2016 21:50:03 +0000 (21:50 +0000)
commitac6d7fd38196d13e679595089d284d8f6fc96b7e
treeee724a00f5b166d324044930fd01683bf86078e6
parentb8414cb704a0f87247014937aea39054dac84900
[Modern Media Controls] Sliders: scrubber and volume
https://bugs.webkit.org/show_bug.cgi?id=163328
<rdar://problem/28733838>

Patch by Antoine Quint <graouts@apple.com> on 2016-10-12
Reviewed by Dean Jackson.

Source/WebCore:

We add a new Slider class that provides a custom slider backed by an
invisible <input type="range"> element and a fill underlay to provide
a custom color between the left edge of the slider and the slider thumb.
As the slider's value changes, a UI delegate receives messages to track
such changes.

Tests: media/modern-media-controls/scrubber/scrubber.html
       media/modern-media-controls/slider/slider-constructor.html
       media/modern-media-controls/slider/slider-fill.html
       media/modern-media-controls/slider/slider-styles.html
       media/modern-media-controls/volume-slider/volume-slider-value.html
       media/modern-media-controls/volume-slider/volume-slider.html

* Modules/modern-media-controls/controls/scrubber.css: Added.
(.scrubber.slider > input::-webkit-slider-thumb):
* Modules/modern-media-controls/controls/scrubber.js: Added.
(Scrubber):
* Modules/modern-media-controls/controls/slider.css: Added.
(.slider):
(.slider > input,):
(.slider > .fill):
(.slider > input):
(.slider > input::-webkit-slider-thumb):
* Modules/modern-media-controls/controls/slider.js: Added.
(Slider.prototype.get value):
(Slider.prototype.set value):
(Slider.prototype.get width):
(Slider.prototype.set width):
(Slider.prototype.handleEvent):
(Slider.prototype.commitProperty):
(Slider.prototype._handleInputEvent):
(Slider.prototype._handleChangeEvent):
(Slider.prototype._updateFill):
* Modules/modern-media-controls/controls/volume-slider.css: Added.
(.volume.slider > input::-webkit-slider-thumb):
* Modules/modern-media-controls/controls/volume-slider.js: Added.
(VolumeSlider):

LayoutTests:

Testing the properties of the new Slider class and its subclasses.

* media/modern-media-controls/resources/media-controls-utils.js: Added.
(rgba):
(shouldBeEqualToRGBAColor):
* media/modern-media-controls/scrubber/scrubber-expected.txt: Added.
* media/modern-media-controls/scrubber/scrubber.html: Added.
* media/modern-media-controls/slider/slider-constructor-expected.txt: Added.
* media/modern-media-controls/slider/slider-constructor.html: Added.
* media/modern-media-controls/slider/slider-fill-expected.txt: Added.
* media/modern-media-controls/slider/slider-fill.html: Added.
* media/modern-media-controls/slider/slider-styles-expected.txt: Added.
* media/modern-media-controls/slider/slider-styles.html: Added.
* media/modern-media-controls/volume-slider/volume-slider-expected.txt: Added.
* media/modern-media-controls/volume-slider/volume-slider-value-expected.txt: Added.
* media/modern-media-controls/volume-slider/volume-slider-value.html: Added.
* media/modern-media-controls/volume-slider/volume-slider.html: Added.
* platform/ios-simulator/TestExpectations:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@207245 268f45cc-cd09-0410-ab3c-d52691b4dbfc
22 files changed:
LayoutTests/ChangeLog
LayoutTests/media/modern-media-controls/resources/media-controls-utils.js [new file with mode: 0644]
LayoutTests/media/modern-media-controls/scrubber/scrubber-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/scrubber/scrubber.html [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-constructor-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-constructor.html [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-fill-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-fill.html [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-styles-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/slider/slider-styles.html [new file with mode: 0644]
LayoutTests/media/modern-media-controls/volume-slider/volume-slider-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/volume-slider/volume-slider-value-expected.txt [new file with mode: 0644]
LayoutTests/media/modern-media-controls/volume-slider/volume-slider-value.html [new file with mode: 0644]
LayoutTests/media/modern-media-controls/volume-slider/volume-slider.html [new file with mode: 0644]
LayoutTests/platform/ios-simulator/TestExpectations
Source/WebCore/ChangeLog
Source/WebCore/Modules/modern-media-controls/controls/scrubber.css [new file with mode: 0644]
Source/WebCore/Modules/modern-media-controls/controls/scrubber.js [new file with mode: 0644]
Source/WebCore/Modules/modern-media-controls/controls/slider.css [new file with mode: 0644]
Source/WebCore/Modules/modern-media-controls/controls/slider.js [new file with mode: 0644]
Source/WebCore/Modules/modern-media-controls/controls/volume-slider.css [new file with mode: 0644]
Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js [new file with mode: 0644]