Bug 716171 - mouseout should hide controls immediately, not after a delay. r=dolske
authorJared Wein <jwein@mozilla.com>
Wed, 11 Apr 2012 19:23:56 -0700
changeset 91495 51f25cd0e1b40e47384447936f74f78777e564ec
parent 91494 e72c21511787eed9b1523d832012a21b72bd58e2
child 91496 68416d38fdd066df8bbf7aa7cfb30db390be1400
push id1
push userroot
push dateMon, 20 Oct 2014 17:29:22 +0000
reviewersdolske
bugs716171
milestone14.0a1
Bug 716171 - mouseout should hide controls immediately, not after a delay. r=dolske
toolkit/content/widgets/videocontrols.xml
--- a/toolkit/content/widgets/videocontrols.xml
+++ b/toolkit/content/widgets/videocontrols.xml
@@ -806,40 +806,60 @@
                     // Ignore events caused by transitions between mute button and volumeStack,
                     // or between nodes inside these two elements.
                     if (this.isEventWithin(event, this.muteButton, this.volumeStack))
                         return;
                     var isMouseOver = (event.type == "mouseover");
                     this.startFade(this.volumeStack, isMouseOver);
                 },
 
+                _controlsHiddenByTimeout : false,
+                _showControlsTimeout : 0,
+                SHOW_CONTROLS_TIMEOUT_MS: 500,
+                _showControlsFn : function () {
+                    if (Utils.video.mozMatchesSelector("video:hover")) {
+                        Utils.startFadeIn(Utils.controlBar, false);
+                        Utils._showControlsTimeout = 0;
+                        Utils._controlsHiddenByTimeout = false;
+                    }
+                },
+
                 _hideControlsTimeout : 0,
                 _hideControlsFn : function () {
-                    if (!Utils.scrubber.isDragging)
+                    if (!Utils.scrubber.isDragging) {
                         Utils.startFade(Utils.controlBar, false);
+                        Utils._hideControlsTimeout = 0;
+                        Utils._controlsHiddenByTimeout = true;
+                    }
                 },
                 HIDE_CONTROLS_TIMEOUT_MS : 2000,
                 onMouseMove : function (event) {
                     // If the controls are static, don't change anything.
                     if (!this.dynamicControls)
                         return;
 
                     clearTimeout(this._hideControlsTimeout);
 
                     // Suppress fading out the controls until the video has rendered
                     // its first frame. But since autoplay videos start off with no
                     // controls, let them fade-out so the controls don't get stuck on.
                     if (!this.firstFrameShown &&
                         !(this.video.autoplay && this.video.mozAutoplayEnabled))
                         return;
 
-                    this.startFade(this.controlBar, true);
+                    if (this._controlsHiddenByTimeout)
+                        this._showControlsTimeout = setTimeout(this._showControlsFn, this.SHOW_CONTROLS_TIMEOUT_MS);
+                    else
+                        this.startFade(this.controlBar, true);
+
                     // Hide the controls if the mouse cursor is left on top of the video
                     // but above the control bar and if the click-to-play overlay is hidden.
-                    if (event.clientY < this.controlBar.getBoundingClientRect().top && this.clickToPlay.hidden) {
+                    if ((this._controlsHiddenByTimeout ||
+                         event.clientY < this.controlBar.getBoundingClientRect().top) &&
+                        this.clickToPlay.hidden) {
                         this._hideControlsTimeout = setTimeout(this._hideControlsFn, this.HIDE_CONTROLS_TIMEOUT_MS);
                     }
                 },
 
                 onMouseInOut : function (event) {
                     // If the controls are static, don't change anything.
                     if (!this.dynamicControls)
                         return;
@@ -860,39 +880,37 @@
                     // its first frame. But since autoplay videos start off with no
                     // controls, let them fade-out so the controls don't get stuck on.
                     if (!this.firstFrameShown && !isMouseOver &&
                         !(this.video.autoplay && this.video.mozAutoplayEnabled))
                         return;
 
                     if (!isMouseOver) {
                         this.adjustControlSize();
-                        
+
                         // Keep the controls visible if the click-to-play is visible.
                         if (!this.clickToPlay.hidden)
                             return;
 
-                        // Setting a timer here to handle the case where the mouse leaves
-                        // the video from hovering over the controls.
-                        this._hideControlsTimeout = setTimeout(this._hideControlsFn, this.HIDE_CONTROLS_TIMEOUT_MS);
+                        this.startFadeOut(this.controlBar, false);
+                        clearTimeout(this._showControlsTimeout);
+                        Utils._controlsHiddenByTimeout = false;
                     }
                 },
 
                 startFadeIn : function (element, immediate) {
                     this.startFade(element, true, immediate);
                 },
 
                 startFadeOut : function (element, immediate) {
                     this.startFade(element, false, immediate);
                 },
 
                 startFade : function (element, fadeIn, immediate) {
                     if (element.className == "controlBar" && fadeIn) {
-                        clearTimeout(this._hideControlsTimeout);
-
                         // Bug 493523, the scrubber doesn't call valueChanged while hidden,
                         // so our dependent state (eg, timestamp in the thumb) will be stale.
                         // As a workaround, update it manually when it first becomes unhidden.
                         if (element.hidden)
                             this.scrubber.valueChanged("curpos", this.video.currentTime * 1000, false);
                     }
 
                     if (immediate)