mozilla
/
pjs
зеркало из https://github.com/mozilla/pjs.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Merge backout of changeset dddef115ddd2 (bug 475317)

This commit is contained in:
Justin Dolske 2009-04-13 01:29:24 -07:00
Родитель 1c6170c860 d8b9e5ba73
Коммит 2f7a839692
8 изменённых файлов: 21 добавлений и 164 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

2
toolkit/content/widgets/videocontrols.css
Просмотреть файл

@ -1,6 +1,6 @@
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
.scrubber, .volumeControl {
.scrubber {
-moz-binding: url("chrome://global/content/bindings/videocontrols.xml#suppressChangeEvent");
}

107
toolkit/content/widgets/videocontrols.xml
Просмотреть файл

@ -76,13 +76,9 @@
<implementation>
<field name="thumb">null</field>
<field name="type">null</field>
<field name="Utils">null</field>
<constructor>
<![CDATA[
this.thumb = document.getAnonymousElementByAttribute(this, "class", "scale-thumb");
this.type = this.getAttribute("class");
this.Utils = document.getBindingParent(this.parentNode).Utils;
]]>
</constructor>
@ -98,8 +94,7 @@
switch (which) {
case "curpos":
// Update the time shown in the thumb.
if (this.type == "scrubber")
this.thumb.setTime(newValue);
this.thumb.setTime(newValue);
// The value of userChanged is true when changing the position with the mouse,
// but not when pressing an arrow key. However, the base binding sets
@ -107,11 +102,7 @@
if (!userChanged && !this._userChanged)
return;
this.setAttribute("value", newValue);
if (this.type == "scrubber")
this.Utils.seekToPosition(newValue);
else if (this.type == "volumeControl")
this.Utils.setVolume(newValue / 100);
document.getBindingParent(this.parentNode).Utils.seekToPosition();
break;
case "minpos":
@ -155,10 +146,6 @@
<label class="durationLabel"/>
</vbox>
<button class="muteButton" oncommand="document.getBindingParent(this).Utils.toggleMute();"/>
<stack class="volumeStack" hidden="true">
<box class="volumeBackgroundBar"/>
<scale class="volumeControl" orient="vertical" dir="reverse" movetoclick="true"/>
</stack>
</hbox>
</vbox>
</stack>
@ -223,8 +210,6 @@
videocontrols : null,
playButton : null,
muteButton : null,
volumeStack : null,
volumeControl : null,
durationLabel : null,
scrubberThumb : null,
scrubber : null,
@ -265,21 +250,6 @@
RUNTIME_STEP : 20
},
// volumeFader holds the fade state for the volume <scale>.
volumeFader : {
name : "volume",
element : null,
maxSlide : null, // height when extended, set in init()
runtime : 0,
fadingIn : false,
isVisible : false,
timer : null,
delayTimer : null,
START_DELAY : 0,
RUNTIME_MAX : 200,
RUNTIME_STEP : 15
},
firstFrameShown : false,
lastTimeUpdate : 0,
maxCurrentTimeSeen : 0,
@ -298,9 +268,6 @@
this.playButton.setAttribute("paused", this.video.paused);
this.muteButton.setAttribute("muted", this.video.muted);
var volume = this.video.muted ? 0 : Math.round(this.video.volume * 100);
this.volumeControl.value = volume;
var duration = Math.round(this.video.duration * 1000); // in ms
var currentTime = Math.round(this.video.currentTime * 1000); // in ms
this.log("Initial playback position is at " + currentTime + " of " + duration);
@ -375,9 +342,7 @@
this.playButton.setAttribute("paused", true);
break;
case "volumechange":
var volume = this.video.muted ? 0 : Math.round(this.video.volume * 100);
this.muteButton.setAttribute("muted", this.video.muted);
this.volumeControl.value = volume;
break;
case "loadedmetadata":
// If a <video> doesn't have any video data, treat it as <audio>
@ -500,18 +465,13 @@
this.scrubber.pageIncrement = Math.round(duration / 10);
},
seekToPosition : function(newPosition) {
seekToPosition : function() {
var newPosition = this.scrubber.getAttribute("value");
newPosition /= 1000; // convert from ms
this.log("+++ seeking to " + newPosition);
this.video.currentTime = newPosition;
},
setVolume : function(newVolume) {
this.log("*** setting volume to " + newVolume);
this.video.volume = newVolume;
this.video.muted = false;
},
showPosition : function(currentTime, duration) {
// If the duration is unknown (because the server didn't provide
// it, or the video is a stream), then we want to fudge the duration
@ -532,15 +492,6 @@
this.progressBar.value = Math.round(percent * 10000);
},
onVolumeMouseInOut : function (event) {
// 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.volumeFader, isMouseOver);
},
onMouseInOut : function (event) {
// If the controls are static, don't change anything.
if (!this.dynamicControls)
@ -551,7 +502,8 @@
// size as the *content area* of the video element,
// but this is not the same as the video element's
// border area if the video has border or padding.
if (this.isEventWithin(event, this.videocontrols))
if (this.isControlsOrDescendant(event.target) &&
this.isControlsOrDescendant(event.relatedTarget))
return;
var isMouseOver = (event.type == "mouseover");
@ -644,21 +596,12 @@
else
opacity = Math.pow(1 - pos, 0.5);
fader.isVisible = (opacity ? true : false);
//self.log("Fading " + fader.name + " to opacity " + opacity);
fader.element.style.opacity = opacity;
// Hide the element to ignore mouse clicks and reduce throbber CPU usage.
fader.element.setAttribute("hidden", !fader.isVisible);
// If this fader also has a slide effect, change the CSS margin-top too.
if (fader.maxSlide) {
var marginTop;
if (fader.fadingIn)
marginTop = Math.round(fader.maxSlide * Math.pow(pos, 0.5));
else
marginTop = Math.round(fader.maxSlide * Math.pow(1 - pos, 0.5));
fader.element.style.marginTop = marginTop;
}
// Is the animation done?
if (pos == 1) {
clearInterval(fader.timer);
@ -686,16 +629,13 @@
// controlling volume.
},
isEventWithin : function (event, parent1, parent2) {
function isDescendant (node) {
while (node) {
if (node == parent1 || node == parent2)
return true;
node = node.parentNode;
}
return false;
isControlsOrDescendant : function (node) {
while (node) {
if (node == this.videocontrols)
return true;
node = node.parentNode;
}
return isDescendant(event.target) && isDescendant(event.relatedTarget);
return false;
},
log : function (msg) {
@ -713,15 +653,11 @@
this.Utils.videocontrols = this;
this.Utils.isAudioOnly = (video instanceof HTMLAudioElement);
this.Utils.controlFader.element = document.getAnonymousElementByAttribute(this, "class", "controlBar");
this.Utils.statusFader.element = document.getAnonymousElementByAttribute(this, "class", "statusOverlay");
this.Utils.volumeFader.element = document.getAnonymousElementByAttribute(this, "class", "volumeStack");
this.Utils.controlFader.element = document.getAnonymousElementByAttribute(this, "class", "controlBar");
this.Utils.statusFader.element = document.getAnonymousElementByAttribute(this, "class", "statusOverlay");
this.Utils.statusIcon = document.getAnonymousElementByAttribute(this, "class", "statusIcon");
this.Utils.playButton = document.getAnonymousElementByAttribute(this, "class", "playButton");
this.Utils.muteButton = document.getAnonymousElementByAttribute(this, "class", "muteButton");
this.Utils.volumeControl = document.getAnonymousElementByAttribute(this, "class", "volumeControl");
this.Utils.volumeStack = document.getAnonymousElementByAttribute(this, "class", "volumeStack");
this.Utils.progressBar = document.getAnonymousElementByAttribute(this, "class", "progressBar");
this.Utils.bufferBar = document.getAnonymousElementByAttribute(this, "class", "bufferBar");
this.Utils.scrubber = document.getAnonymousElementByAttribute(this, "class", "scrubber");
@ -751,17 +687,6 @@
for each (var event in this.Utils.videoEvents)
video.addEventListener(event, this.Utils, false);
// Determine the height of the volumeFader when extended (which is controlled by CSS).
// Its .clientHeight seems to be 0 here, so use the theme's initial value. (eg "-70px")
this.Utils.volumeFader.maxSlide = parseInt(window.getComputedStyle(this.Utils.volumeStack, null)
.getPropertyValue("margin-top"));
var self = this;
function volumeBouncer(event) { self.Utils.onVolumeMouseInOut(event); }
this.Utils.muteButton.addEventListener("mouseover", volumeBouncer, false);
this.Utils.muteButton.addEventListener("mouseout", volumeBouncer, false);
this.Utils.volumeStack.addEventListener("mouseover", volumeBouncer, false);
this.Utils.volumeStack.addEventListener("mouseout", volumeBouncer, false);
this.Utils.log("--- videocontrols initialized ---");
]]>
</body>

1
toolkit/themes/pinstripe/global/jar.mn
Просмотреть файл

@ -182,7 +182,6 @@ classic.jar:
+ skin/classic/global/media/scrubberThumbWide.png (media/scrubberThumbWide.png)
+ skin/classic/global/media/error.png (media/error.png)
+ skin/classic/global/media/throbber.png (media/throbber.png)
+ skin/classic/global/media/volumeThumb.png (media/volumeThumb.png)
+ skin/classic/global/menu/menu-arrow-dis.gif (menu/menu-arrow-dis.gif)
+ skin/classic/global/menu/menu-arrow-hov.gif (menu/menu-arrow-hov.gif)
+ skin/classic/global/menu/menu-arrow.gif (menu/menu-arrow.gif)

36
toolkit/themes/pinstripe/global/media/videocontrols.css
Просмотреть файл

@ -33,38 +33,6 @@
background: url(chrome://global/skin/media/unmuteButton.png) no-repeat center;
}
.volumeStack {
width: 28px;
height: 70px;
background-color: rgba(35,31,32,0.74);
/* use negative margin to place stack over the mute button to its left. */
margin: -70px 3px 28px -31px;
overflow: hidden; /* crop it when sliding down, don't grow the control bar */
position: relative; /* Trick to work around negative margin interfering with dragging the thumb. */
padding-top: 6px;
}
.volumeControl {
min-height: 64px;
}
/* .scale-thumb is an element inside the <scale> implementation. */
.volumeControl .scale-thumb {
/* Override the default thumb appearance with a custom image. */
-moz-appearance: none;
background: url(chrome://global/skin/media/volumeThumb.png) no-repeat center;
border: none;
min-width: 16px;
min-height: 11px;
}
.volumeBackgroundBar {
/* margin left/right: make bar 8px wide (control width = 28, minus 2 * 10 margin) */
margin: 0px 10px 0px 10px;
background-color: rgba(255,255,255,0.5);
-moz-border-radius: 4px 4px;
}
.durationBox {
-moz-box-pack: center;
}
@ -110,7 +78,7 @@
}
/* .scale-slider is an element inside the <scale> implementation. */
.scrubber .scale-slider, .volumeControl .scale-slider {
.scale-slider {
/* Hide the default horizontal bar. */
-moz-appearance: none;
background: none;
@ -118,7 +86,7 @@
}
/* .scale-thumb is an element inside the <scale> implementation. */
.scrubber .scale-thumb {
.scale-thumb {
/* Override the default thumb appearance with a custom image. */
-moz-appearance: none;
background: transparent;

Двоичные данные
toolkit/themes/pinstripe/global/media/volumeThumb.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом"

До

Ширина:  |  Высота:  |  Размер: 167 B

2
toolkit/themes/winstripe/global/jar.mn
Просмотреть файл

@ -153,7 +153,6 @@ classic.jar:
skin/classic/global/media/scrubberThumb.png (media/scrubberThumb.png)
skin/classic/global/media/scrubberThumbWide.png (media/scrubberThumbWide.png)
skin/classic/global/media/throbber.png (media/throbber.png)
skin/classic/global/media/volumeThumb.png (media/volumeThumb.png)
skin/classic/global/media/error.png (media/error.png)
skin/classic/global/radio/radio-check.gif (radio/radio-check.gif)
skin/classic/global/radio/radio-check-dis.gif (radio/radio-check-dis.gif)
@ -328,7 +327,6 @@ classic.jar:
skin/classic/aero/global/media/scrubberThumb.png (media/scrubberThumb.png)
skin/classic/aero/global/media/scrubberThumbWide.png (media/scrubberThumbWide.png)
skin/classic/aero/global/media/throbber.png (media/throbber.png)
skin/classic/aero/global/media/volumeThumb.png (media/volumeThumb.png)
skin/classic/aero/global/media/error.png (media/error.png)
skin/classic/aero/global/radio/radio-check.gif (radio/radio-check.gif)
skin/classic/aero/global/radio/radio-check-dis.gif (radio/radio-check-dis.gif)

37
toolkit/themes/winstripe/global/media/videocontrols.css
Просмотреть файл

@ -35,39 +35,6 @@
background: url(chrome://global/skin/media/unmuteButton.png) no-repeat center;
}
.volumeStack {
width: 28px;
height: 70px;
background-color: rgba(35,31,32,0.74);
/* use negative margin to place stack over the mute button to its left. */
margin: -70px 3px 28px -31px;
overflow: hidden; /* crop it when sliding down, don't grow the control bar */
position: relative; /* Trick to work around negative margin interfering with dragging the thumb. */
padding-top: 6px;
}
.volumeControl {
min-height: 64px;
}
/* .scale-thumb is an element inside the <scale> implementation. */
.volumeControl .scale-thumb {
/* Override the default thumb appearance with a custom image. */
-moz-appearance: none;
background: url(chrome://global/skin/media/volumeThumb.png) no-repeat center;
border: none;
min-width: 16px;
min-height: 11px;
}
.volumeBackgroundBar {
/* margin left/right: make bar 8px wide (control width = 28, minus 2 * 10 margin) */
margin: 0px 10px 0px 10px;
background-color: rgba(255,255,255,0.5);
-moz-border-radius: 4px 4px;
}
.durationBox {
-moz-box-pack: center;
}
@ -118,7 +85,7 @@
}
/* .scale-slider is an element inside the <scale> implementation. */
.scrubber .scale-slider, .volumeControl .scale-slider {
.scale-slider {
/* Hide the default horizontal bar. */
-moz-appearance: none;
background: none;
@ -126,7 +93,7 @@
}
/* .scale-thumb is an element inside the <scale> implementation. */
.scrubber .scale-thumb {
.scale-thumb {
/* Override the default thumb appearance with a custom image. */
-moz-appearance: none;
background: transparent;

Двоичные данные
toolkit/themes/winstripe/global/media/volumeThumb.png
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом"

До

Ширина:  |  Высота:  |  Размер: 167 B