Title: [211723] trunk
Revision
211723
Author
commit-qu...@webkit.org
Date
2017-02-06 08:16:53 -0800 (Mon, 06 Feb 2017)

Log Message

[Modern Media Controls] Bring fullscreen controls up to spec
https://bugs.webkit.org/show_bug.cgi?id=167875
<rdar://problem/29611222>

Patch by Antoine Quint <grao...@apple.com> on 2017-02-06
Reviewed by Eric Carlson.

Source/WebCore:

We update the fullscreen PiP icon to have the correct size and add two new buttons
around the volume slider, "volume-down" to bring the volume to 0 and "volume-up"
to bring the volume to 1.

To accomodate the new volume buttons, we move the volume slider inside an additional
ButtonsContainer object, along with the two new buttons.

Tests: media/modern-media-controls/volume-down-support/volume-down-support.html
       media/modern-media-controls/volume-up-support/volume-up-support.html

* Modules/modern-media-controls/controls/icon-service.js:
* Modules/modern-media-controls/controls/macos-fullscreen-media-controls.css:
(.media-controls.mac.fullscreen button.volume-down):
(.media-controls.mac.fullscreen button.volume-up):
* Modules/modern-media-controls/controls/macos-fullscreen-media-controls.js:
* Modules/modern-media-controls/controls/volume-down-button.js: Added.
(VolumeDownButton):
* Modules/modern-media-controls/controls/volume-slider.js:
(VolumeSlider):
* Modules/modern-media-controls/controls/volume-up-button.js: Added.
(VolumeUpButton):
* Modules/modern-media-controls/images/macOS/pip-in-fullscr...@1x.png:
* Modules/modern-media-controls/images/macOS/pip-in-fullscr...@2x.png:
* Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png: Added.
* Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png: Added.
* Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png: Added.
* Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png: Added.
* Modules/modern-media-controls/js-files:
* Modules/modern-media-controls/media/media-controller.js:
(MediaController.prototype._updateControlsIfNeeded):
* Modules/modern-media-controls/media/volume-down-support.js: Added.
(VolumeDownSupport.prototype.get control):
(VolumeDownSupport.prototype.buttonWasPressed):
(VolumeDownSupport):
* Modules/modern-media-controls/media/volume-up-support.js: Added.
(VolumeUpSupport.prototype.get control):
(VolumeUpSupport.prototype.buttonWasPressed):
(VolumeUpSupport):
* WebCore.xcodeproj/project.pbxproj:

LayoutTests:

Rebaseline some existing tests due to the addition of the volume-down and volume-up
buttons as well as the width change of the PiP icon and add a couple of new tests to
check the behavior of the volume-down and volume-up buttons.

* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles-expected.txt:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles.html:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles-expected.txt:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles.html:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor-expected.txt:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor.html:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-drag.html:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles-expected.txt:
* media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles.html:
* media/modern-media-controls/media-controller/media-controller-fullscreen-ltr.html:
* media/modern-media-controls/volume-down-support/volume-down-support-expected.txt: Added.
* media/modern-media-controls/volume-down-support/volume-down-support.html: Added.
* media/modern-media-controls/volume-up-support/volume-up-support-expected.txt: Added.
* media/modern-media-controls/volume-up-support/volume-up-support.html: Added.
* platform/ios-simulator/TestExpectations:

Modified Paths

Added Paths

Diff

Modified: trunk/LayoutTests/ChangeLog (211722 => 211723)


--- trunk/LayoutTests/ChangeLog	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/ChangeLog	2017-02-06 16:16:53 UTC (rev 211723)
@@ -1,5 +1,33 @@
 2017-02-06  Antoine Quint  <grao...@apple.com>
 
+        [Modern Media Controls] Bring fullscreen controls up to spec
+        https://bugs.webkit.org/show_bug.cgi?id=167875
+        <rdar://problem/29611222>
+
+        Reviewed by Eric Carlson.
+
+        Rebaseline some existing tests due to the addition of the volume-down and volume-up
+        buttons as well as the width change of the PiP icon and add a couple of new tests to
+        check the behavior of the volume-down and volume-up buttons.
+
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles-expected.txt:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles.html:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles-expected.txt:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles.html:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor-expected.txt:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor.html:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-drag.html:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles-expected.txt:
+        * media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles.html:
+        * media/modern-media-controls/media-controller/media-controller-fullscreen-ltr.html:
+        * media/modern-media-controls/volume-down-support/volume-down-support-expected.txt: Added.
+        * media/modern-media-controls/volume-down-support/volume-down-support.html: Added.
+        * media/modern-media-controls/volume-up-support/volume-up-support-expected.txt: Added.
+        * media/modern-media-controls/volume-up-support/volume-up-support.html: Added.
+        * platform/ios-simulator/TestExpectations:
+
+2017-02-06  Antoine Quint  <grao...@apple.com>
+
         [Modern Media Controls] Improve handling of <video> with only audio tracks
         https://bugs.webkit.org/show_bug.cgi?id=167836
         <rdar://problem/30255812>

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles-expected.txt (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles-expected.txt	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -8,9 +8,9 @@
 PASS centerContainerBounds.width is 178
 PASS centerContainerBounds.height is 44
 
-PASS rightContainerBounds.left is within 0.5 of 493
+PASS rightContainerBounds.left is within 0.5 of 496
 PASS rightContainerBounds.top is 500
-PASS rightContainerBounds.width is within 0.5 of 141
+PASS rightContainerBounds.width is within 0.5 of 138
 PASS rightContainerBounds.height is 44
 
 PASS successfullyParsed is true

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-containers-styles.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -44,9 +44,9 @@
 
         debug("");
         rightContainerBounds = rightContainer.element.getBoundingClientRect();
-        shouldBeCloseTo("rightContainerBounds.left", 493, 0.5);
+        shouldBeCloseTo("rightContainerBounds.left", 496, 0.5);
         shouldBe("rightContainerBounds.top", "500");
-        shouldBeCloseTo("rightContainerBounds.width", 141, 0.5);
+        shouldBeCloseTo("rightContainerBounds.width", 138, 0.5);
         shouldBe("rightContainerBounds.height", "44");
 
         debug("");

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles-expected.txt (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles-expected.txt	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -29,12 +29,12 @@
 PASS style.height is "44px"
 
 TracksButton
-PASS style.left is "82px"
+PASS style.left is "79px"
 PASS style.webkitMaskPositionY is "15px"
 PASS style.height is "44px"
 
 FullscreenButton
-PASS style.left is "114px"
+PASS style.left is "111px"
 PASS style.webkitMaskPositionY is "13px"
 PASS style.height is "44px"
 

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-buttons-styles.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -16,8 +16,8 @@
     [mediaControls.forwardButton, 127, 16],
     [mediaControls.airplayButton, 12, 13],
     [mediaControls.pipButton, 44, 13],
-    [mediaControls.tracksButton, 82, 15],
-    [mediaControls.fullscreenButton, 114, 13]
+    [mediaControls.tracksButton, 79, 15],
+    [mediaControls.fullscreenButton, 111, 13]
 ];
 
 let style;

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor-expected.txt (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor-expected.txt	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -9,11 +9,18 @@
 
 Controls bar
 PASS mediaControls.controlsBar.children.length is 4
-PASS mediaControls.controlsBar.children[0] is mediaControls.volumeSlider
+PASS mediaControls.controlsBar.children[0] instanceof ButtonsContainer is true
 PASS mediaControls.controlsBar.children[1] instanceof ButtonsContainer is true
 PASS mediaControls.controlsBar.children[2] instanceof ButtonsContainer is true
 PASS mediaControls.controlsBar.children[3] is mediaControls.timeControl
 
+Left container
+PASS mediaControls.controlsBar.children[0].buttons is [mediaControls.volumeDownButton, mediaControls.volumeSlider, mediaControls.volumeUpButton]
+PASS mediaControls.controlsBar.children[0].element.className is "buttons-container left"
+PASS mediaControls.controlsBar.children[0].leftMargin is 12
+PASS mediaControls.controlsBar.children[0].rightMargin is 0
+PASS mediaControls.controlsBar.children[0].buttonMargin is 6
+
 Center container
 PASS mediaControls.controlsBar.children[1].buttons is [mediaControls.rewindButton, mediaControls.playPauseButton, mediaControls.forwardButton]
 PASS mediaControls.controlsBar.children[1].element.className is "buttons-container center"

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-constructor.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -14,12 +14,20 @@
 debug("");
 debug("Controls bar");
 shouldBe("mediaControls.controlsBar.children.length", "4");
-shouldBe("mediaControls.controlsBar.children[0]", "mediaControls.volumeSlider");
+shouldBeTrue("mediaControls.controlsBar.children[0] instanceof ButtonsContainer");
 shouldBeTrue("mediaControls.controlsBar.children[1] instanceof ButtonsContainer");
 shouldBeTrue("mediaControls.controlsBar.children[2] instanceof ButtonsContainer");
 shouldBe("mediaControls.controlsBar.children[3]", "mediaControls.timeControl");
 
 debug("");
+debug("Left container");
+shouldBe("mediaControls.controlsBar.children[0].buttons", "[mediaControls.volumeDownButton, mediaControls.volumeSlider, mediaControls.volumeUpButton]");
+shouldBeEqualToString("mediaControls.controlsBar.children[0].element.className", "buttons-container left");
+shouldBe("mediaControls.controlsBar.children[0].leftMargin", "12");
+shouldBe("mediaControls.controlsBar.children[0].rightMargin", "0");
+shouldBe("mediaControls.controlsBar.children[0].buttonMargin", "6");
+
+debug("");
 debug("Center container");
 shouldBe("mediaControls.controlsBar.children[1].buttons", "[mediaControls.rewindButton, mediaControls.playPauseButton, mediaControls.forwardButton]");
 shouldBeEqualToString("mediaControls.controlsBar.children[1].element.className", "buttons-container center");

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-drag.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-drag.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-drag.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -21,9 +21,9 @@
         mediaControls = shadowRoot.lastChild;
         window.requestAnimationFrame(() => {
             const bounds = mediaControls.querySelector(".controls-bar").getBoundingClientRect();
-            eventSender.mouseMoveTo(bounds.left + 10, bounds.top + 10);
+            eventSender.mouseMoveTo(bounds.left + 118, bounds.top + 10);
             eventSender.mouseDown();
-            eventSender.mouseMoveTo(bounds.left - 40, bounds.top - 90);
+            eventSender.mouseMoveTo(bounds.left + 68, bounds.top - 90);
             eventSender.mouseUp();
 
             window.requestAnimationFrame(() => {

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles-expected.txt (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles-expected.txt	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -3,7 +3,7 @@
 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
 
 
-PASS window.getComputedStyle(mediaControls.volumeSlider.element).left is "31px"
+PASS window.getComputedStyle(mediaControls.volumeSlider.element).left is "30px"
 PASS window.getComputedStyle(mediaControls.volumeSlider.element).top is "23px"
 
 PASS successfullyParsed is true

Modified: trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/macos-fullscreen-media-controls/macos-fullscreen-media-controls-volume-styles.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -9,12 +9,14 @@
 window.jsTestIsAsync = true;
 
 const mediaControls = new MacOSFullscreenMediaControls;
+document.body.appendChild(mediaControls.element);
 
 scheduler.frameDidFire = function()
 {
-    document.body.appendChild(mediaControls.element);
+    if (!document.body.contains(mediaControls.volumeSlider.element))
+        return;
 
-    shouldBeEqualToString("window.getComputedStyle(mediaControls.volumeSlider.element).left", "31px");
+    shouldBeEqualToString("window.getComputedStyle(mediaControls.volumeSlider.element).left", "30px");
     shouldBeEqualToString("window.getComputedStyle(mediaControls.volumeSlider.element).top", "23px");
 
     mediaControls.element.remove();

Modified: trunk/LayoutTests/media/modern-media-controls/media-controller/media-controller-fullscreen-ltr.html (211722 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/media-controller/media-controller-fullscreen-ltr.html	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/media/modern-media-controls/media-controller/media-controller-fullscreen-ltr.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -17,30 +17,32 @@
 media.addEventListener("webkitfullscreenchange", function() {
     if (media.webkitDisplayingFullscreen) {
         window.requestAnimationFrame(() => {
-            debug("Media entered fullscreen");
+            window.requestAnimationFrame(() => {
+                debug("Media entered fullscreen");
 
-            mediaControlsElement = shadowRoot.lastElementChild.lastElementChild;
-            volumeSliderElement = mediaControlsElement.querySelector(".volume.slider");
-        
-            shouldBeTrue("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
-            shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "none");
+                mediaControlsElement = shadowRoot.lastElementChild.lastElementChild;
+                volumeSliderElement = mediaControlsElement.querySelector(".volume.slider");
 
-            debug("");
-            debug("Setting layout direction to RTL");
-            window.internals.setUserInterfaceLayoutDirection("RTL");
-            shouldBeFalse("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
-            shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "matrix(-1, 0, 0, 1, 0, 0)");
+                shouldBeTrue("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
+                shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "none");
 
-            debug("");
-            debug("Setting layout direction back to LTR");
-            window.internals.setUserInterfaceLayoutDirection("LTR");
-            shouldBeTrue("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
-            shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "none");
+                debug("");
+                debug("Setting layout direction to RTL");
+                window.internals.setUserInterfaceLayoutDirection("RTL");
+                shouldBeFalse("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
+                shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "matrix(-1, 0, 0, 1, 0, 0)");
 
-            debug("");
-            media.remove();
-            button.remove();
-            finishJSTest();
+                debug("");
+                debug("Setting layout direction back to LTR");
+                window.internals.setUserInterfaceLayoutDirection("LTR");
+                shouldBeTrue("mediaControlsElement.classList.contains('uses-ltr-user-interface-layout-direction')");
+                shouldBeEqualToString("document.defaultView.getComputedStyle(volumeSliderElement).transform", "none");
+
+                debug("");
+                media.remove();
+                button.remove();
+                finishJSTest();
+            });
         });
     }
 });

Added: trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support-expected.txt (0 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,14 @@
+Testing clicking on the volume down button correctly sets the volume to 0.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS media.volume is 1
+
+Pressing on the volume down button
+PASS media.volume is 0
+
+PASS successfullyParsed is true
+
+TEST COMPLETE
+

Added: trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support.html (0 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support.html	                        (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/volume-down-support/volume-down-support.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<script src=""
+<script src="" type="text/_javascript_"></script>
+<body>
+<video src="" style="width: 320px; height: 240px;" controls></video>
+<div id="shadow"></div>
+<script type="text/_javascript_">
+
+window.jsTestIsAsync = true;
+
+description("Testing clicking on the volume down button correctly sets the volume to 0.");
+
+const media = document.querySelector("video");
+const button = document.body.appendChild(document.createElement("button"));
+
+media.addEventListener("webkitfullscreenchange", function() {
+    if (media.webkitDisplayingFullscreen) {
+        window.requestAnimationFrame(() => {
+            window.requestAnimationFrame(() => {
+                shouldBe("media.volume", "1");
+
+                media.addEventListener("volumechange", () => {
+                    shouldBe("media.volume", "0");
+                    debug("");
+                    media.remove();
+                    button.remove();
+                    finishJSTest();
+                });
+
+                debug("");
+                debug("Pressing on the volume down button");
+                pressOnElement(window.internals.shadowRoot(media).lastElementChild.lastElementChild.querySelector("button.volume-down"));
+            });
+        });
+    }
+});
+
+media.addEventListener("loadedmetadata", () => {
+    if (!("eventSender" in window)) {
+        debug("This test is designed to run in DRT");
+        return;
+    }
+
+    // Click a button so we may enter fullscreen.
+    button.addEventListener("click", event => {
+        try {
+            media.webkitEnterFullscreen();
+        } catch(e) {
+            debug("Toggling fullscreen failed");
+            finishJSTest();
+        }
+    });
+
+    pressOnElement(button);
+});
+
+</script>
+<script src=""
+</body>

Added: trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support-expected.txt (0 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support-expected.txt	                        (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support-expected.txt	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,14 @@
+Testing clicking on the volume up button correctly sets the volume to 1.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS media.volume is 0.5
+
+Pressing on the volume up button
+PASS media.volume is 1
+
+PASS successfullyParsed is true
+
+TEST COMPLETE
+

Added: trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support.html (0 => 211723)


--- trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support.html	                        (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/volume-up-support/volume-up-support.html	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<script src=""
+<script src="" type="text/_javascript_"></script>
+<body>
+<video src="" style="width: 320px; height: 240px;" controls></video>
+<div id="shadow"></div>
+<script type="text/_javascript_">
+
+window.jsTestIsAsync = true;
+
+description("Testing clicking on the volume up button correctly sets the volume to 1.");
+
+const media = document.querySelector("video");
+const button = document.body.appendChild(document.createElement("button"));
+
+media.volume = 0.5;
+
+media.addEventListener("webkitfullscreenchange", function() {
+    if (media.webkitDisplayingFullscreen) {
+        window.requestAnimationFrame(() => {
+            window.requestAnimationFrame(() => {
+                shouldBe("media.volume", "0.5");
+
+                media.addEventListener("volumechange", () => {
+                    shouldBe("media.volume", "1");
+                    debug("");
+                    media.remove();
+                    button.remove();
+                    finishJSTest();
+                });
+
+                debug("");
+                debug("Pressing on the volume up button");
+                pressOnElement(window.internals.shadowRoot(media).lastElementChild.lastElementChild.querySelector("button.volume-up"));
+            });
+        });
+    }
+});
+
+media.addEventListener("loadedmetadata", () => {
+    if (!("eventSender" in window)) {
+        debug("This test is designed to run in DRT");
+        return;
+    }
+
+    // Click a button so we may enter fullscreen.
+    button.addEventListener("click", event => {
+        try {
+            media.webkitEnterFullscreen();
+        } catch(e) {
+            debug("Toggling fullscreen failed");
+            finishJSTest();
+        }
+    });
+
+    pressOnElement(button);
+});
+
+</script>
+<script src=""
+</body>

Modified: trunk/LayoutTests/platform/ios-simulator/TestExpectations (211722 => 211723)


--- trunk/LayoutTests/platform/ios-simulator/TestExpectations	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/LayoutTests/platform/ios-simulator/TestExpectations	2017-02-06 16:16:53 UTC (rev 211723)
@@ -2796,6 +2796,8 @@
 media/modern-media-controls/seek-backward-support [ Skip ]
 media/modern-media-controls/seek-forward-support [ Skip ]
 media/modern-media-controls/start-support/start-support-fullscreen.html [ Skip ]
+media/modern-media-controls/volume-down-support [ Skip ]
+media/modern-media-controls/volume-up-support [ Skip ]
 
 # These tests are mouse-specific
 media/modern-media-controls/media-controller/media-controller-auto-hide-mouse-leave-after-play.html [ Skip ]

Modified: trunk/Source/WebCore/ChangeLog (211722 => 211723)


--- trunk/Source/WebCore/ChangeLog	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/ChangeLog	2017-02-06 16:16:53 UTC (rev 211723)
@@ -1,5 +1,53 @@
 2017-02-06  Antoine Quint  <grao...@apple.com>
 
+        [Modern Media Controls] Bring fullscreen controls up to spec
+        https://bugs.webkit.org/show_bug.cgi?id=167875
+        <rdar://problem/29611222>
+
+        Reviewed by Eric Carlson.
+
+        We update the fullscreen PiP icon to have the correct size and add two new buttons
+        around the volume slider, "volume-down" to bring the volume to 0 and "volume-up"
+        to bring the volume to 1.
+
+        To accomodate the new volume buttons, we move the volume slider inside an additional
+        ButtonsContainer object, along with the two new buttons.
+
+        Tests: media/modern-media-controls/volume-down-support/volume-down-support.html
+               media/modern-media-controls/volume-up-support/volume-up-support.html
+
+        * Modules/modern-media-controls/controls/icon-service.js:
+        * Modules/modern-media-controls/controls/macos-fullscreen-media-controls.css:
+        (.media-controls.mac.fullscreen button.volume-down):
+        (.media-controls.mac.fullscreen button.volume-up):
+        * Modules/modern-media-controls/controls/macos-fullscreen-media-controls.js:
+        * Modules/modern-media-controls/controls/volume-down-button.js: Added.
+        (VolumeDownButton):
+        * Modules/modern-media-controls/controls/volume-slider.js:
+        (VolumeSlider):
+        * Modules/modern-media-controls/controls/volume-up-button.js: Added.
+        (VolumeUpButton):
+        * Modules/modern-media-controls/images/macOS/pip-in-fullscr...@1x.png:
+        * Modules/modern-media-controls/images/macOS/pip-in-fullscr...@2x.png:
+        * Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png: Added.
+        * Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png: Added.
+        * Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png: Added.
+        * Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png: Added.
+        * Modules/modern-media-controls/js-files:
+        * Modules/modern-media-controls/media/media-controller.js:
+        (MediaController.prototype._updateControlsIfNeeded):
+        * Modules/modern-media-controls/media/volume-down-support.js: Added.
+        (VolumeDownSupport.prototype.get control):
+        (VolumeDownSupport.prototype.buttonWasPressed):
+        (VolumeDownSupport):
+        * Modules/modern-media-controls/media/volume-up-support.js: Added.
+        (VolumeUpSupport.prototype.get control):
+        (VolumeUpSupport.prototype.buttonWasPressed):
+        (VolumeUpSupport):
+        * WebCore.xcodeproj/project.pbxproj:
+
+2017-02-06  Antoine Quint  <grao...@apple.com>
+
         [Modern Media Controls] Improve handling of <video> with only audio tracks
         https://bugs.webkit.org/show_bug.cgi?id=167836
         <rdar://problem/30255812>

Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/icon-service.js (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/icon-service.js	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/icon-service.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -41,10 +41,12 @@
     Start           : "start",
     Tracks          : "media-selection",
     Volume          : "volume",
-    VolumeMuted     : "volume-mute"
+    VolumeDown      : "volume-down",
+    VolumeMuted     : "volume-mute",
+    VolumeUp        : "volume-up"
 };
 
-const IconsWithFullscreenVariants = [Icons.Airplay, Icons.Tracks, Icons.Pause, Icons.EnterPiP, Icons.Play];
+const IconsWithFullscreenVariants = [Icons.Airplay, Icons.Tracks, Icons.Pause, Icons.EnterPiP, Icons.Play, Icons.VolumeDown, Icons.VolumeUp];
 const IconsWithCompactVariants = [Icons.Play, Icons.Pause, Icons.SkipBack, Icons.Volume, Icons.VolumeMuted, Icons.EnterFullscreen];
 
 const iconService = new class IconService {

Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.css (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.css	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.css	2017-02-06 16:16:53 UTC (rev 211723)
@@ -57,6 +57,14 @@
     transform: scaleX(-1);
 }
 
+.media-controls.mac.fullscreen button.volume-down {
+    -webkit-mask-position-y: 18px;
+}
+
+.media-controls.mac.fullscreen button.volume-up {
+    -webkit-mask-position-y: 18px;
+}
+
 /* Button containers */
 
 .media-controls.mac.fullscreen .buttons-container {

Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.js (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.js	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/macos-fullscreen-media-controls.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -40,6 +40,8 @@
         this.element.classList.add("fullscreen");
 
         // Set up fullscreen-specific buttons.
+        this.volumeDownButton = new VolumeDownButton(this);
+        this.volumeUpButton = new VolumeUpButton(this);
         this.rewindButton = new RewindButton(this);
         this.forwardButton = new ForwardButton(this);
         this.fullscreenButton.isFullscreen = true;
@@ -46,6 +48,14 @@
 
         this.volumeSlider.width = 60;
 
+        this._leftContainer = new ButtonsContainer({
+            buttons: [this.volumeDownButton, this.volumeSlider, this.volumeUpButton],
+            cssClassName: "left",
+            leftMargin: 12,
+            rightMargin: 0,
+            buttonMargin: 6
+        });
+
         this._centerContainer = new ButtonsContainer({
             buttons: [this.rewindButton, this.playPauseButton, this.forwardButton],
             cssClassName: "center",
@@ -61,7 +71,7 @@
             rightMargin: 12
         });
 
-        this.controlsBar.children = [this.volumeSlider, this._centerContainer, this._rightContainer, this.timeControl];
+        this.controlsBar.children = [this._leftContainer, this._centerContainer, this._rightContainer, this.timeControl];
 
         this.element.addEventListener("mousedown", this);
     }

Copied: trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-down-button.js (from rev 211722, trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js) (0 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-down-button.js	                        (rev 0)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-down-button.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,38 @@
+/*
+ * Copyright (C) 2017 Apple Inc. All Rights Reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+class VolumeDownButton extends IconButton
+{
+
+    constructor(layoutDelegate)
+    {
+        super({
+            cssClassName: "volume-down",
+            iconName: Icons.VolumeDown,
+            layoutDelegate
+        });
+    }
+
+}

Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -29,6 +29,7 @@
     constructor()
     {
         super("volume");
+        this.enabled = true;
     }
 
 }

Copied: trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-up-button.js (from rev 211722, trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js) (0 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-up-button.js	                        (rev 0)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-up-button.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,38 @@
+/*
+ * Copyright (C) 2017 Apple Inc. All Rights Reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+class VolumeUpButton extends IconButton
+{
+
+    constructor(layoutDelegate)
+    {
+        super({
+            cssClassName: "volume-up",
+            iconName: Icons.VolumeUp,
+            layoutDelegate
+        });
+    }
+
+}

Modified: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/pip-in-fullscr...@1x.png


(Binary files differ)

Modified: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/pip-in-fullscr...@2x.png


(Binary files differ)

Added: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png


(Binary files differ)
Index: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png =================================================================== --- trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png 2017-02-06 13:48:10 UTC (rev 211722) +++ trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png 2017-02-06 16:16:53 UTC (rev 211723) Property changes on: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@1x.png ___________________________________________________________________

Added: svn:mime-type

+image/png \ No newline at end of property

Added: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png


(Binary files differ)
Index: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png =================================================================== --- trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png 2017-02-06 13:48:10 UTC (rev 211722) +++ trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png 2017-02-06 16:16:53 UTC (rev 211723) Property changes on: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-down-fullscr...@2x.png ___________________________________________________________________

Added: svn:mime-type

+image/png \ No newline at end of property

Added: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png


(Binary files differ)
Index: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png =================================================================== --- trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png 2017-02-06 13:48:10 UTC (rev 211722) +++ trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png 2017-02-06 16:16:53 UTC (rev 211723) Property changes on: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@1x.png ___________________________________________________________________

Added: svn:mime-type

+image/png \ No newline at end of property

Added: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png


(Binary files differ)
Index: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png =================================================================== --- trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png 2017-02-06 13:48:10 UTC (rev 211722) +++ trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png 2017-02-06 16:16:53 UTC (rev 211723) Property changes on: trunk/Source/WebCore/Modules/modern-media-controls/images/macOS/volume-up-fullscr...@2x.png ___________________________________________________________________

Added: svn:mime-type

+image/png \ No newline at end of property

Modified: trunk/Source/WebCore/Modules/modern-media-controls/js-files (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/js-files	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/js-files	2017-02-06 16:16:53 UTC (rev 211723)
@@ -23,6 +23,8 @@
 controls/seek-button.js
 controls/rewind-button.js
 controls/forward-button.js
+controls/volume-down-button.js
+controls/volume-up-button.js
 controls/buttons-container.js
 controls/status-label.js
 controls/controls-bar.js
@@ -55,6 +57,8 @@
 media/start-support.js
 media/status-support.js
 media/tracks-support.js
+media/volume-down-support.js
 media/volume-support.js
+media/volume-up-support.js
 media/media-controller.js
 main.js

Modified: trunk/Source/WebCore/Modules/modern-media-controls/media/media-controller.js (211722 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/media/media-controller.js	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/Modules/modern-media-controls/media/media-controller.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -133,7 +133,7 @@
 
         this._updateControlsSize();
 
-        this._supportingObjects = [AirplaySupport, ControlsVisibilitySupport, ElapsedTimeSupport, FullscreenSupport, MuteSupport, PiPSupport, PlacardSupport, PlaybackSupport, RemainingTimeSupport, ScrubbingSupport, SeekBackwardSupport, SeekForwardSupport, SkipBackSupport, StartSupport, StatusSupport, TracksSupport, VolumeSupport].map(SupportClass => {
+        this._supportingObjects = [AirplaySupport, ControlsVisibilitySupport, ElapsedTimeSupport, FullscreenSupport, MuteSupport, PiPSupport, PlacardSupport, PlaybackSupport, RemainingTimeSupport, ScrubbingSupport, SeekBackwardSupport, SeekForwardSupport, SkipBackSupport, StartSupport, StatusSupport, TracksSupport, VolumeSupport, VolumeDownSupport, VolumeUpSupport].map(SupportClass => {
             return new SupportClass(this);
         }, this);
     }

Copied: trunk/Source/WebCore/Modules/modern-media-controls/media/volume-down-support.js (from rev 211722, trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js) (0 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/media/volume-down-support.js	                        (rev 0)
+++ trunk/Source/WebCore/Modules/modern-media-controls/media/volume-down-support.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,41 @@
+/*
+ * Copyright (C) 2017 Apple Inc. All Rights Reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+class VolumeDownSupport extends MediaControllerSupport
+{
+
+    // Protected
+
+    get control()
+    {
+        return this.mediaController.controls.volumeDownButton;
+    }
+
+    buttonWasPressed(control)
+    {
+        this.mediaController.media.volume = 0;
+    }
+
+}

Copied: trunk/Source/WebCore/Modules/modern-media-controls/media/volume-up-support.js (from rev 211722, trunk/Source/WebCore/Modules/modern-media-controls/controls/volume-slider.js) (0 => 211723)


--- trunk/Source/WebCore/Modules/modern-media-controls/media/volume-up-support.js	                        (rev 0)
+++ trunk/Source/WebCore/Modules/modern-media-controls/media/volume-up-support.js	2017-02-06 16:16:53 UTC (rev 211723)
@@ -0,0 +1,41 @@
+/*
+ * Copyright (C) 2017 Apple Inc. All Rights Reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions
+ * are met:
+ * 1. Redistributions of source code must retain the above copyright
+ *    notice, this list of conditions and the following disclaimer.
+ * 2. Redistributions in binary form must reproduce the above copyright
+ *    notice, this list of conditions and the following disclaimer in the
+ *    documentation and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+ * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
+ * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
+ * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
+ * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+ * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+class VolumeUpSupport extends MediaControllerSupport
+{
+
+    // Protected
+
+    get control()
+    {
+        return this.mediaController.controls.volumeUpButton;
+    }
+
+    buttonWasPressed(control)
+    {
+        this.mediaController.media.volume = 1;
+    }
+
+}

Modified: trunk/Source/WebCore/WebCore.xcodeproj/project.pbxproj (211722 => 211723)


--- trunk/Source/WebCore/WebCore.xcodeproj/project.pbxproj	2017-02-06 13:48:10 UTC (rev 211722)
+++ trunk/Source/WebCore/WebCore.xcodeproj/project.pbxproj	2017-02-06 16:16:53 UTC (rev 211723)
@@ -10110,6 +10110,14 @@
 		715379FF146BD9D6008BD615 /* SVGPathData.h */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.h; path = SVGPathData.h; sourceTree = "<group>"; };
 		7157E3D11DC1EE4B0094550E /* scrubbing-support.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "scrubbing-support.js"; sourceTree = "<group>"; };
 		7157F061150B6564006EAABD /* SVGAnimatedTransformList.cpp */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.cpp.cpp; path = SVGAnimatedTransformList.cpp; sourceTree = "<group>"; };
+		716C8DF11E48B269005BD0DA /* volume-down-support.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "volume-down-support.js"; sourceTree = "<group>"; };
+		716C8DF21E48B269005BD0DA /* volume-up-support.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "volume-up-support.js"; sourceTree = "<group>"; };
+		716C8DF31E48B284005BD0DA /* volume-down-button.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "volume-down-button.js"; sourceTree = "<group>"; };
+		716C8DF41E48B284005BD0DA /* volume-up-button.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "volume-up-button.js"; sourceTree = "<group>"; };
+		716C8DF51E48B2B5005BD0DA /* volume-down-fullscr...@1x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "volume-down-fullscr...@1x.png"; sourceTree = "<group>"; };
+		716C8DF61E48B2B5005BD0DA /* volume-down-fullscr...@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "volume-down-fullscr...@2x.png"; sourceTree = "<group>"; };
+		716C8DF71E48B2B5005BD0DA /* volume-up-fullscr...@1x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "volume-up-fullscr...@1x.png"; sourceTree = "<group>"; };
+		716C8DF81E48B2B5005BD0DA /* volume-up-fullscr...@2x.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "volume-up-fullscr...@2x.png"; sourceTree = "<group>"; };
 		716FA0D81DB26591007323CC /* airplay-button.css */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.css; path = "airplay-button.css"; sourceTree = "<group>"; };
 		716FA0D91DB26591007323CC /* airplay-button.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "airplay-button.js"; sourceTree = "<group>"; };
 		716FA0DA1DB26591007323CC /* airplay-placard.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode._javascript_; path = "airplay-placard.js"; sourceTree = "<group>"; };
@@ -18394,8 +18402,10 @@
 				716FA0FE1DB26591007323CC /* tracks-button.js */,
 				7146DF8B1DEFC2ED0046F98B /* tracks-panel.css */,
 				7146DF8C1DEFC2ED0046F98B /* tracks-panel.js */,
+				716C8DF31E48B284005BD0DA /* volume-down-button.js */,
 				716FA0FF1DB26591007323CC /* volume-slider.css */,
 				716FA1001DB26591007323CC /* volume-slider.js */,
+				716C8DF41E48B284005BD0DA /* volume-up-button.js */,
 			);
 			name = controls;
 			path = "Modules/modern-media-controls/controls";
@@ -18423,7 +18433,9 @@
 				7177E2481DB80D2F00919A0B /* start-support.js */,
 				71B0460A1DD3C2EE00EE19CF /* status-support.js */,
 				71F936F71DD4F99B00922CC7 /* tracks-support.js */,
+				716C8DF11E48B269005BD0DA /* volume-down-support.js */,
 				717F90571DC40ED60006F520 /* volume-support.js */,
+				716C8DF21E48B269005BD0DA /* volume-up-support.js */,
 			);
 			path = media;
 			sourceTree = "<group>";
@@ -18541,8 +18553,12 @@
 				71D6AABD1DA4EAF700B23969 /* st...@2x.png */,
 				717F61991E43D66500F37024 /* volume-comp...@1x.png */,
 				717F619A1E43D66500F37024 /* volume-comp...@2x.png */,
+				716C8DF51E48B2B5005BD0DA /* volume-down-fullscr...@1x.png */,
+				716C8DF61E48B2B5005BD0DA /* volume-down-fullscr...@2x.png */,
 				71D6AABE1DA4EAF700B23969 /* volume-m...@1x.png */,
 				71D6AABF1DA4EAF700B23969 /* volume-m...@2x.png */,
+				716C8DF71E48B2B5005BD0DA /* volume-up-fullscr...@1x.png */,
+				716C8DF81E48B2B5005BD0DA /* volume-up-fullscr...@2x.png */,
 				71D6AAC01DA4EAF700B23969 /* vol...@1x.png */,
 				71D6AAC11DA4EAF700B23969 /* vol...@2x.png */,
 			);
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to