Title: [184722] trunk/Source/WebCore
Revision
184722
Author
roger_f...@apple.com
Date
2015-05-21 10:52:38 -0700 (Thu, 21 May 2015)

Log Message

Media Controls stop updating after hovering for a few seconds.
https://bugs.webkit.org/show_bug.cgi?id=144770.
<rdar://problem/19823121>

Reviewed by Jer Noble.

* Modules/mediacontrols/mediaControlsApple.js:
(Controller.prototype.createBase):
We should never hide controls immediately as a result of mousing out of the controls.
It should only happen when the mouse leaves the video entirely.
(Controller.prototype.updateTimelineMetricsIfNeeded):
Don’t update if controls are hidden, timeline dimensions will be 0.
(Controller.prototype.handlePanelTransitionEnd): 
Instead of adjusting visibility via adding and removing classes,
remove controls entirely from the tree.
(Controller.prototype.showControls):
Add controls back into the tree when showing controls.
(Controller.prototype.updateForShowingControls):
Helper method for showControls.
(Controller.prototype.controlsAreHidden):
Controls also hidden if removed from tree.

Remove forceUpdate logic, no longer necessary.
(Controller.prototype.handleDurationChange): 
(Controller.prototype.updateProgress):
(Controller.prototype.updateTime):

Override methods to use add and remove panelContainer for iOS.
* Modules/mediacontrols/mediaControlsiOS.js:
(ControllerIOS.prototype.handlePanelTransitionEnd):
(ControllerIOS.prototype.showControls):
(ControllerIOS.prototype.controlsAreHidden):

Modified Paths

Diff

Modified: trunk/Source/WebCore/ChangeLog (184721 => 184722)


--- trunk/Source/WebCore/ChangeLog	2015-05-21 17:45:48 UTC (rev 184721)
+++ trunk/Source/WebCore/ChangeLog	2015-05-21 17:52:38 UTC (rev 184722)
@@ -1,3 +1,38 @@
+2015-05-21  Roger Fong  <roger_f...@apple.com>
+
+        Media Controls stop updating after hovering for a few seconds.
+        https://bugs.webkit.org/show_bug.cgi?id=144770.
+        <rdar://problem/19823121>
+
+        Reviewed by Jer Noble.
+
+        * Modules/mediacontrols/mediaControlsApple.js:
+        (Controller.prototype.createBase):
+        We should never hide controls immediately as a result of mousing out of the controls.
+        It should only happen when the mouse leaves the video entirely.
+        (Controller.prototype.updateTimelineMetricsIfNeeded):
+        Don’t update if controls are hidden, timeline dimensions will be 0.
+        (Controller.prototype.handlePanelTransitionEnd): 
+        Instead of adjusting visibility via adding and removing classes,
+        remove controls entirely from the tree.
+        (Controller.prototype.showControls):
+        Add controls back into the tree when showing controls.
+        (Controller.prototype.updateForShowingControls):
+        Helper method for showControls.
+        (Controller.prototype.controlsAreHidden):
+        Controls also hidden if removed from tree.
+
+        Remove forceUpdate logic, no longer necessary.
+        (Controller.prototype.handleDurationChange): 
+        (Controller.prototype.updateProgress):
+        (Controller.prototype.updateTime):
+
+        Override methods to use add and remove panelContainer for iOS.
+        * Modules/mediacontrols/mediaControlsiOS.js:
+        (ControllerIOS.prototype.handlePanelTransitionEnd):
+        (ControllerIOS.prototype.showControls):
+        (ControllerIOS.prototype.controlsAreHidden):
+
 2015-05-21  Chris Dumez  <cdu...@apple.com>
 
         Regression(r179293): We no longer call destroyDecodedData() on CachedResources on memory pressure

Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js (184721 => 184722)


--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js	2015-05-21 17:45:48 UTC (rev 184721)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js	2015-05-21 17:52:38 UTC (rev 184722)
@@ -268,7 +268,7 @@
         var base = this.base = document.createElement('div');
         base.setAttribute('pseudo', '-webkit-media-controls');
         this.listenFor(base, 'mousemove', this.handleWrapperMouseMove);
-        this.listenFor(base, 'mouseout', this.handleWrapperMouseOut);
+        this.listenFor(this.video, 'mouseout', this.handleWrapperMouseOut);
         if (this.host.textTrackContainer)
             base.appendChild(this.host.textTrackContainer);
     },
@@ -291,9 +291,14 @@
         this.timelineMetricsNeedsUpdate = true;
     },
 
+    scheduleUpdateLayoutForDisplayedWidth: function()
+    {
+        setTimeout(this.updateLayoutForDisplayedWidth.bind(this), 0);
+    },
+
     updateTimelineMetricsIfNeeded: function()
     {
-        if (this.timelineMetricsNeedsUpdate) {
+        if (this.timelineMetricsNeedsUpdate && !this.controlsAreHidden()) {
             this.timelineLeft = this.controls.timeline.offsetLeft;
             this.timelineWidth = this.controls.timeline.offsetWidth;
             this.timelineHeight = this.controls.timeline.offsetHeight;
@@ -684,8 +689,8 @@
     handleDurationChange: function(event)
     {
         this.updateDuration();
-        this.updateTime(true);
-        this.updateProgress(true);
+        this.updateTime();
+        this.updateProgress();
     },
 
     handlePlay: function(event)
@@ -818,14 +823,9 @@
     handlePanelTransitionEnd: function(event)
     {
         var opacity = window.getComputedStyle(this.controls.panel).opacity;
-        if (parseInt(opacity) > 0) {
-            this.controls.panel.classList.remove(this.ClassNames.hidden);
-            if (this.controls.panelBackground)
-                this.controls.panelBackground.classList.remove(this.ClassNames.hidden);
-        } else if (!this.controlsAlwaysVisible()) {
-            this.controls.panel.classList.add(this.ClassNames.hidden);
-            if (this.controls.panelBackground)
-                this.controls.panelBackground.classList.add(this.ClassNames.hidden);
+        if (!parseInt(opacity) && !this.controlsAlwaysVisible()) {
+            this.base.removeChild(this.controls.inlinePlaybackPlaceholder);
+            this.base.removeChild(this.controls.panel);
         }
     },
 
@@ -1149,11 +1149,8 @@
         return gradient;
     },
 
-    updateProgress: function(forceUpdate)
+    updateProgress: function()
     {
-        if (!forceUpdate && this.controlsAreHidden())
-            return;
-
         this.updateTimelineMetricsIfNeeded();
         this.drawTimelineBackground();
     },
@@ -1360,27 +1357,35 @@
         }
     },
 
-    showControls: function()
+    updateForShowingControls: function()
     {
-        this.updateShouldListenForPlaybackTargetAvailabilityEvent();
-        if (this.showInlinePlaybackPlaceholderOnly())
-            return;
-
         this.updateLayoutForDisplayedWidth();
         this.setNeedsTimelineMetricsUpdate();
-        this.updateTime(true);
-        this.updateProgress(true);
+        this.updateTime();
+        this.updateProgress();
         this.drawVolumeBackground();
         this.drawTimelineBackground();
         this.controls.panel.classList.add(this.ClassNames.show);
         this.controls.panel.classList.remove(this.ClassNames.hidden);
-
         if (this.controls.panelBackground) {
             this.controls.panelBackground.classList.add(this.ClassNames.show);
             this.controls.panelBackground.classList.remove(this.ClassNames.hidden);
         }
     },
 
+    showControls: function()
+    {
+        this.updateShouldListenForPlaybackTargetAvailabilityEvent();
+        if (this.showInlinePlaybackPlaceholderOnly())
+            return;
+
+        this.updateForShowingControls();
+        if (this.shouldHaveControls() && !this.controls.panel.parentElement) {
+            this.base.appendChild(this.controls.inlinePlaybackPlaceholder);
+            this.base.appendChild(this.controls.panel);
+        }
+    },
+
     hideControls: function()
     {
         if (this.controlsAlwaysVisible())
@@ -1456,7 +1461,7 @@
 
     controlsAreHidden: function()
     {
-        return !this.controlsAlwaysVisible() && !this.controls.panel.classList.contains(this.ClassNames.show);
+        return !this.controlsAlwaysVisible() && !this.controls.panel.classList.contains(this.ClassNames.show) && !this.controls.panel.parentElement;
     },
 
     removeControls: function()
@@ -1473,11 +1478,8 @@
         this.setNeedsTimelineMetricsUpdate();
     },
 
-    updateTime: function(forceUpdate)
+    updateTime: function()
     {
-        if (!forceUpdate && this.controlsAreHidden())
-            return;
-
         var currentTime = this.video.currentTime;
         var timeRemaining = currentTime - this.video.duration;
         this.controls.currentTime.innerText = this.formatTime(currentTime);

Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js (184721 => 184722)


--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js	2015-05-21 17:45:48 UTC (rev 184721)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js	2015-05-21 17:52:38 UTC (rev 184722)
@@ -190,6 +190,12 @@
         // Explicitly do nothing to override base-class behavior.
     },
 
+    controlsAreHidden: function()
+    {
+        // Controls are only ever actually hidden when they are removed from the tree
+        return !this.controls.panelContainer.parentElement;
+    },
+
     addControls: function() {
         this.base.appendChild(this.controls.inlinePlaybackPlaceholder);
         this.base.appendChild(this.controls.panelContainer);
@@ -368,6 +374,15 @@
         this.updateShouldListenForPlaybackTargetAvailabilityEvent();
     },
 
+    handlePanelTransitionEnd: function(event)
+    {
+        var opacity = window.getComputedStyle(this.controls.panel).opacity;
+        if (!parseInt(opacity) && !this.controlsAlwaysVisible()) {
+            this.base.removeChild(this.controls.inlinePlaybackPlaceholder);
+            this.base.removeChild(this.controls.panelContainer);
+        }
+    },
+
     presentationMode: function() {
         if ('webkitPresentationMode' in this.video)
             return this.video.webkitPresentationMode;
@@ -523,6 +538,19 @@
             this.showControls();
     },
 
+    showControls: function()
+    {
+        this.updateShouldListenForPlaybackTargetAvailabilityEvent();
+        if (this.showInlinePlaybackPlaceholderOnly())
+            return;
+        
+        this.updateForShowingControls();
+        if (this.shouldHaveControls() && !this.controls.panelContainer.parentElement) {
+            this.base.appendChild(this.controls.inlinePlaybackPlaceholder);
+            this.base.appendChild(this.controls.panelContainer);
+        }
+    },
+
     setShouldListenForPlaybackTargetAvailabilityEvent: function(shouldListen)
     {
         if (shouldListen && (this.shouldHaveStartPlaybackButton() || this.video.error))
_______________________________________________
webkit-changes mailing list
webkit-changes@lists.webkit.org
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to