зеркало из https://github.com/mozilla/pjs.git
Backout bug 461680 and bustage fixes due to still failing on Linux and possible leaks.
This commit is contained in:
Justin Dolske
Родитель
b3569dff2b
Коммит
36d1e098a5
|
|
@ -31,16 +31,14 @@ function runTest(event) {
|
|||
is(video.muted, false, "checking video mute state");
|
||||
|
||||
// Let the fadein happen
|
||||
video.addEventListener("mouseover", runTest, false);
|
||||
synthesizeMouse(video, 12, 228, { type : "mouseover" });
|
||||
setTimeout(runTest, 0, { type: "setTimeout" });
|
||||
break;
|
||||
|
||||
case 2:
|
||||
is(event.type, "mouseover", "checking event type");
|
||||
video.removeEventListener("mouseover", runTest, false);
|
||||
// Click the play button. Do this from a timeout, lest the test's
|
||||
// mouseover handler fire before the video control's handler.
|
||||
setTimeout("synthesizeMouse(video, 12, 228, { });", 0);
|
||||
is(event.type, "setTimeout", "checking event type");
|
||||
// Click the play button
|
||||
synthesizeMouse(video, 12, 228, { });
|
||||
break;
|
||||
|
||||
case 3:
|
||||
|
|
@ -81,7 +79,7 @@ function runTest(event) {
|
|||
break;
|
||||
|
||||
default:
|
||||
throw "unexpected test #" + testnum + " w/ event " + event.type;
|
||||
throw "unexpected test #" + testnum + " w/ event " + event.name;
|
||||
}
|
||||
|
||||
testnum++;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
<xbl:content xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
|
||||
<spacer flex="1"/>
|
||||
<hbox id="controlBar">
|
||||
<hbox id="controlsBackground">
|
||||
<image id="playButton"
|
||||
onclick="if (event.button == 0) this.parentNode.parentNode.Utils.togglePause();"/>
|
||||
<box id="controlsMiddle" flex="1"/>
|
||||
|
|
@ -77,17 +77,14 @@
|
|||
<![CDATA[ ({
|
||||
debug : false,
|
||||
video : null,
|
||||
controlBar : null,
|
||||
controls : null,
|
||||
playButton : null,
|
||||
muteButton : null,
|
||||
|
||||
FADE_TIME_MAX : 200, // ms
|
||||
FADE_TIME_STEP : 30, // ms
|
||||
|
||||
fadeTime : 0, // duration of active fade animation
|
||||
fadingIn: true, // are we fading in, or fading out?
|
||||
fadeTimer : null,
|
||||
controlsVisible : false,
|
||||
animationSteps : 8,
|
||||
animationStep : 0,
|
||||
animationDirection : 1,
|
||||
animationTimer : null,
|
||||
|
||||
handleEvent : function (aEvent) {
|
||||
this.log("Got " + aEvent.type + " media event");
|
||||
|
|
@ -107,68 +104,22 @@
|
|||
}
|
||||
},
|
||||
|
||||
onMouseInOut : function (event) {
|
||||
var isMouseOver = (event.type == "mouseover");
|
||||
fadeControls : function (self) {
|
||||
self.log("fadeControls @" + self.animationStep);
|
||||
self.animationStep += self.animationDirection;
|
||||
|
||||
// Ignore events caused by transitions between child nodes.
|
||||
if (this.isChildNode(event.target) &&
|
||||
this.isChildNode(event.relatedTarget))
|
||||
return;
|
||||
|
||||
// Don't show controls when they're disabled, but do allow a
|
||||
// mouseout to hide controls that were disabled after being shown.
|
||||
if (!this.video.controls && (isMouseOver || !this.controlsVisible))
|
||||
return;
|
||||
|
||||
this.log("Fading controls " + (isMouseOver ? "in" : "out"));
|
||||
|
||||
var directionChange = (isMouseOver != this.fadingIn);
|
||||
this.fadingIn = isMouseOver;
|
||||
|
||||
// When switching direction mid-fade, adjust fade time for current fade state.
|
||||
if (directionChange && this.fadeTime)
|
||||
this.fadeTime = this.FADE_TIME_MAX - this.fadeTime;
|
||||
|
||||
if (!this.fadeTimer)
|
||||
this.fadeTimer = setInterval(this.fadeControls, this.FADE_TIME_STEP, this);
|
||||
|
||||
// If we're fading in, immediately made the controls clickable.
|
||||
// Otherwise they might not activate until the first fadeTimer
|
||||
// fires, which is hard to test reliably.
|
||||
if (this.fadingIn)
|
||||
this.controlBar.style.visibility = "visible";
|
||||
},
|
||||
|
||||
fadeControls : function (self, lateness) {
|
||||
// Update elapsed time, and compute position as a percent
|
||||
// of total. Last frame could run over, so clamp to 1.
|
||||
self.fadeTime += self.FADE_TIME_STEP + lateness;
|
||||
var pos = self.fadeTime / self.FADE_TIME_MAX;
|
||||
if (pos > 1)
|
||||
pos = 1;
|
||||
|
||||
// Calculate the opacity for our position in the animation.
|
||||
var opacity;
|
||||
if (self.fadingIn)
|
||||
opacity = Math.pow(pos, 0.5);
|
||||
else
|
||||
opacity = Math.pow(1 - pos, 0.5);
|
||||
self.controlsVisible = (opacity ? true : false);
|
||||
|
||||
self.controlBar.style.opacity = opacity;
|
||||
|
||||
// Use .visibility to ignore mouse clicks when hidden.
|
||||
if (self.controlsVisible)
|
||||
self.controlBar.style.visibility = "visible";
|
||||
else
|
||||
self.controlBar.style.visibility = "hidden";
|
||||
|
||||
// Is the animation done?
|
||||
if (pos == 1) {
|
||||
clearInterval(self.fadeTimer);
|
||||
self.fadeTimer = null;
|
||||
self.fadeTime = 0;
|
||||
if (self.animationStep <= 0) {
|
||||
self.animationStep = 0;
|
||||
clearInterval(self.animationTimer);
|
||||
self.animationTimer = null;
|
||||
} else if (self.animationStep >= self.animationSteps) {
|
||||
self.animationStep = self.animationSteps;
|
||||
clearInterval(self.animationTimer);
|
||||
self.animationTimer = null;
|
||||
}
|
||||
|
||||
// XXX might be good to do logarithmic steps, maybe use timer error too (for smoothness)?
|
||||
self.controls.style.opacity = self.animationStep / self.animationSteps;
|
||||
},
|
||||
|
||||
togglePause : function () {
|
||||
|
|
@ -192,11 +143,11 @@
|
|||
|
||||
isChildNode : function (node) {
|
||||
while (node) {
|
||||
if (node == this.video)
|
||||
if (node == this.controls)
|
||||
break;
|
||||
node = node.parentNode;
|
||||
}
|
||||
return (node == this.video);
|
||||
return (node == this);
|
||||
},
|
||||
|
||||
log : function (msg) {
|
||||
|
|
@ -211,16 +162,15 @@
|
|||
<![CDATA[
|
||||
var video = this.parentNode;
|
||||
this.Utils.video = video;
|
||||
this.Utils.controls = this;
|
||||
|
||||
this.Utils.controlBar = document.getAnonymousElementByAttribute(this, "id", "controlBar");
|
||||
this.Utils.playButton = document.getAnonymousElementByAttribute(this, "id", "playButton");
|
||||
this.Utils.muteButton = document.getAnonymousElementByAttribute(this, "id", "muteButton");
|
||||
|
||||
// Set initial state of play/pause button.
|
||||
this.Utils.playButton.setAttribute("paused", video.paused);
|
||||
// Controls are initially faded out and hidden (to ignore mouse clicks)
|
||||
this.Utils.controlBar.style.opacity = 0;
|
||||
this.Utils.controlBar.style.visibility = "hidden";
|
||||
|
||||
this.style.opacity = 0;
|
||||
|
||||
// Use Utils.handleEvent() callback for all media events.
|
||||
video.addEventListener("play", this.Utils, false);
|
||||
|
|
@ -237,10 +187,33 @@
|
|||
|
||||
<handlers>
|
||||
<handler event="mouseover">
|
||||
this.Utils.onMouseInOut(event);
|
||||
<![CDATA[
|
||||
// Ignore events caused by transitions between child nodes.
|
||||
if (this.Utils.isChildNode(event.relatedTarget))
|
||||
return;
|
||||
|
||||
// Don't show controls unless they're enabled
|
||||
// XXX sucks that spec defaults to controls=false. :-(
|
||||
// XXX add support for dynamically hiding controls w/o waiting for mouseout?
|
||||
if (!this.Utils.video.controls)
|
||||
return;
|
||||
|
||||
this.Utils.animationDirection = 1;
|
||||
if (!this.Utils.animationTimer)
|
||||
this.Utils.animationTimer = setInterval(this.Utils.fadeControls, 50, this.Utils);
|
||||
]]>
|
||||
</handler>
|
||||
|
||||
<handler event="mouseout">
|
||||
this.Utils.onMouseInOut(event);
|
||||
<![CDATA[
|
||||
// Ignore events caused by transitions between child nodes.
|
||||
if (this.Utils.isChildNode(event.relatedTarget))
|
||||
return;
|
||||
|
||||
this.Utils.animationDirection = -1;
|
||||
if (!this.Utils.animationTimer)
|
||||
this.Utils.animationTimer = setInterval(this.Utils.fadeControls, 50, this.Utils);
|
||||
]]>
|
||||
</handler>
|
||||
</handlers>
|
||||
</binding>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
#controlBar {
|
||||
#controlsBackground {
|
||||
height: 24px;
|
||||
background-color: #656363;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
#controlBar {
|
||||
#controlsBackground {
|
||||
height: 24px;
|
||||
background-color: #656363;
|
||||
}
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче