<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[185969] trunk/Source/WebCore</title>
</head>
<body>

<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt;  }
#msg dl a { font-weight: bold}
#msg dl a:link    { color:#fc3; }
#msg dl a:active  { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff  {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/185969">185969</a></dd>
<dt>Author</dt> <dd>dino@apple.com</dd>
<dt>Date</dt> <dd>2015-06-25 16:13:21 -0700 (Thu, 25 Jun 2015)</dd>
</dl>

<h3>Log Message</h3>
<pre>Inline media controls disappear when returning a video to inline
https://bugs.webkit.org/show_bug.cgi?id=146328
&lt;rdar://problem/21142862&gt;

Reviewed by Tim Horton.

We were getting into a state where the controls were being
hidden via a timer while we were in fullscreen or on
another tab. Meanwhile, we could exit from such
a condition to a point where the controls were
not visible, but not completely removed from the DOM, confusing
the logic that decided whether to show them on tap.

* Modules/mediacontrols/mediaControlsApple.js:
(Controller.prototype.hideControls): If we are in the act of hiding
controls, we can clear any existing timers that are going to try
to hide them again.
(Controller.prototype.resetHideControlsTimer): Make sure we null
out the hideTimer object, since we look at its value often to
decide whether or not a timer exists.
* Modules/mediacontrols/mediaControlsiOS.js:
(ControllerIOS.prototype.handlePlayButtonTouchEnd): If the user
taps play, then we should call showControls, which resets the hide
timers amongst other things. We need to do this due to the next change,
so that a timer started before we pressed play doesn't cause the
controls to instantly disappear as soon as we start playing.
(ControllerIOS.prototype.handleWrapperTouchStart): We can get into
the state where controls are invisible but still in the tree. Since the
controlsAreHidden() logic only looks for the latter, we need to also
look for invisible when the user taps for the controls. Yes, this
naming doesn't make much sense :(</pre>

<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCoreModulesmediacontrolsmediaControlsApplejs">trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js</a></li>
<li><a href="#trunkSourceWebCoreModulesmediacontrolsmediaControlsiOSjs">trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js</a></li>
</ul>

</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (185968 => 185969)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog        2015-06-25 23:09:51 UTC (rev 185968)
+++ trunk/Source/WebCore/ChangeLog        2015-06-25 23:13:21 UTC (rev 185969)
</span><span class="lines">@@ -1,3 +1,37 @@
</span><ins>+2015-06-25  Dean Jackson  &lt;dino@apple.com&gt;
+
+        Inline media controls disappear when returning a video to inline
+        https://bugs.webkit.org/show_bug.cgi?id=146328
+        &lt;rdar://problem/21142862&gt;
+
+        Reviewed by Tim Horton.
+
+        We were getting into a state where the controls were being
+        hidden via a timer while we were in fullscreen or on
+        another tab. Meanwhile, we could exit from such
+        a condition to a point where the controls were
+        not visible, but not completely removed from the DOM, confusing
+        the logic that decided whether to show them on tap.
+
+        * Modules/mediacontrols/mediaControlsApple.js:
+        (Controller.prototype.hideControls): If we are in the act of hiding
+        controls, we can clear any existing timers that are going to try
+        to hide them again.
+        (Controller.prototype.resetHideControlsTimer): Make sure we null
+        out the hideTimer object, since we look at its value often to
+        decide whether or not a timer exists.
+        * Modules/mediacontrols/mediaControlsiOS.js:
+        (ControllerIOS.prototype.handlePlayButtonTouchEnd): If the user
+        taps play, then we should call showControls, which resets the hide
+        timers amongst other things. We need to do this due to the next change,
+        so that a timer started before we pressed play doesn't cause the
+        controls to instantly disappear as soon as we start playing.
+        (ControllerIOS.prototype.handleWrapperTouchStart): We can get into
+        the state where controls are invisible but still in the tree. Since the
+        controlsAreHidden() logic only looks for the latter, we need to also
+        look for invisible when the user taps for the controls. Yes, this
+        naming doesn't make much sense :(
+
</ins><span class="cx"> 2015-06-25  Joseph Pecoraro  &lt;pecoraro@apple.com&gt;
</span><span class="cx"> 
</span><span class="cx">         [Mac] Web Inspector: Window dragging on toolbar should behave more like native window dragging
</span></span></pre></div>
<a id="trunkSourceWebCoreModulesmediacontrolsmediaControlsApplejs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js (185968 => 185969)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js        2015-06-25 23:09:51 UTC (rev 185968)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsApple.js        2015-06-25 23:13:21 UTC (rev 185969)
</span><span class="lines">@@ -1404,6 +1404,7 @@
</span><span class="cx">         if (this.controlsAlwaysVisible())
</span><span class="cx">             return;
</span><span class="cx"> 
</span><ins>+        this.clearHideControlsTimer();
</ins><span class="cx">         this.updateShouldListenForPlaybackTargetAvailabilityEvent();
</span><span class="cx">         this.controls.panel.classList.remove(this.ClassNames.show);
</span><span class="cx">         if (this.controls.panelBackground)
</span><span class="lines">@@ -1878,8 +1879,10 @@
</span><span class="cx"> 
</span><span class="cx">     resetHideControlsTimer: function()
</span><span class="cx">     {
</span><del>-        if (this.hideTimer)
</del><ins>+        if (this.hideTimer) {
</ins><span class="cx">             clearTimeout(this.hideTimer);
</span><ins>+            this.hideTimer = null;
+        }
</ins><span class="cx"> 
</span><span class="cx">         if (this.isPlaying)
</span><span class="cx">             this.hideTimer = setTimeout(this.hideControls.bind(this), this.HideControlsDelay);
</span></span></pre></div>
<a id="trunkSourceWebCoreModulesmediacontrolsmediaControlsiOSjs"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js (185968 => 185969)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js        2015-06-25 23:09:51 UTC (rev 185968)
+++ trunk/Source/WebCore/Modules/mediacontrols/mediaControlsiOS.js        2015-06-25 23:13:21 UTC (rev 185969)
</span><span class="lines">@@ -287,9 +287,10 @@
</span><span class="cx">     handlePlayButtonTouchEnd: function(event) {
</span><span class="cx">         this.controls.playButton.classList.remove('active');
</span><span class="cx"> 
</span><del>-        if (this.canPlay())
</del><ins>+        if (this.canPlay()) {
</ins><span class="cx">             this.video.play();
</span><del>-        else
</del><ins>+            this.showControls();
+        } else
</ins><span class="cx">             this.video.pause();
</span><span class="cx"> 
</span><span class="cx">         return true;
</span><span class="lines">@@ -346,11 +347,9 @@
</span><span class="cx"> 
</span><span class="cx">         this.mostRecentNumberOfTargettedTouches = event.targetTouches.length;
</span><span class="cx"> 
</span><del>-        if (this.controlsAreHidden()) {
</del><ins>+        if (this.controlsAreHidden() || !this.controls.panel.classList.contains(this.ClassNames.show)) {
</ins><span class="cx">             this.showControls();
</span><del>-            if (this.hideTimer)
-                clearTimeout(this.hideTimer);
-            this.hideTimer = setTimeout(this.hideControls.bind(this), this.HideControlsDelay);
</del><ins>+            this.resetHideControlsTimer();
</ins><span class="cx">         } else if (!this.canPlay())
</span><span class="cx">             this.hideControls();
</span><span class="cx">     },
</span></span></pre>
</div>
</div>

</body>
</html>