зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1328060 - re-adjust controls when get metadata of video duration. r=jaws
MozReview-Commit-ID: AKY5Umg08P6 --HG-- extra : rebase_source : c853f769839e5b02a21902eda32b59f79433fa58
This commit is contained in:
Родитель
cf1234034b
Коммит
3ea8b4e339
|
@ -30,7 +30,7 @@ const playButtonWidth = 30;
|
|||
const playButtonHeight = 40;
|
||||
const muteButtonWidth = 30;
|
||||
const muteButtonHeight = 40;
|
||||
const positionAndDurationWidth = 85;
|
||||
const positionAndDurationWidth = 75;
|
||||
const fullscreenButtonWidth = 30;
|
||||
const fullscreenButtonHeight = 40;
|
||||
const volumeSliderWidth = 48;
|
||||
|
|
|
@ -59,7 +59,7 @@
|
|||
switch (which) {
|
||||
case "curpos":
|
||||
// Update the time shown in the thumb.
|
||||
this.positionValue = this.Utils.formatTime(newValue);
|
||||
this.positionValue = this.Utils.formatTime(newValue, this.Utils.showHours);
|
||||
this.Utils.positionLabel.setAttribute("value", this.positionValue);
|
||||
// Update the value bar to match the thumb position.
|
||||
let percent = newValue / this.max;
|
||||
|
@ -223,6 +223,7 @@
|
|||
"error", "suspend", "stalled",
|
||||
"mozinterruptbegin", "mozinterruptend" ],
|
||||
|
||||
showHours: false,
|
||||
firstFrameShown : false,
|
||||
timeUpdateCount : 0,
|
||||
maxCurrentTimeSeen : 0,
|
||||
|
@ -245,6 +246,13 @@
|
|||
this.video.style.removeProperty("width");
|
||||
}
|
||||
},
|
||||
|
||||
get isControlBarHidden() {
|
||||
return this.controlBar.hidden ||
|
||||
this.controlBar.hideByAdjustment ||
|
||||
this.controlBar.getAttribute("fadeout") === "true";
|
||||
},
|
||||
|
||||
suppressError : false,
|
||||
|
||||
setupStatusFader(immediate) {
|
||||
|
@ -384,6 +392,16 @@
|
|||
value: true,
|
||||
writable: true
|
||||
},
|
||||
resized: {
|
||||
value: false,
|
||||
writable: true
|
||||
},
|
||||
resizedHandler: {
|
||||
value: () => {
|
||||
control.minWidth = control.clientWidth;
|
||||
},
|
||||
writable: true
|
||||
},
|
||||
hideByAdjustment: {
|
||||
set: (v) => {
|
||||
if (v) {
|
||||
|
@ -410,7 +428,11 @@
|
|||
this.clickToPlay.minWidth = 48;
|
||||
|
||||
if (this.positionDurationBox) {
|
||||
this.positionDurationBox.minWidth -= this.durationSpan.minWidth;
|
||||
this.durationSpan.resized = true;
|
||||
this.positionDurationBox.resized = true;
|
||||
this.positionDurationBox.resizedHandler = () => {
|
||||
this.positionDurationBox.minWidth = this.positionDurationBox.clientWidth - this.durationSpan.clientWidth;
|
||||
};
|
||||
}
|
||||
|
||||
this.adjustControlSize();
|
||||
|
@ -526,7 +548,6 @@
|
|||
}
|
||||
break;
|
||||
case "loadedmetadata":
|
||||
this.adjustControlSize();
|
||||
// If a <video> doesn't have any video data, treat it as <audio>
|
||||
// and show the controls (they won't fade back out)
|
||||
if (this.video instanceof HTMLVideoElement &&
|
||||
|
@ -536,11 +557,16 @@
|
|||
this.startFadeIn(this.controlBar);
|
||||
this.setFullscreenButtonState();
|
||||
}
|
||||
this.showDuration(Math.round(this.video.duration * 1000));
|
||||
this.showPosition(Math.round(this.video.currentTime * 1000), Math.round(this.video.duration * 1000));
|
||||
if (this.positionDurationBox) {
|
||||
this.positionDurationBox.resized = true;
|
||||
this.durationSpan.resized = true;
|
||||
}
|
||||
if (!this.isAudioOnly && !this.video.mozHasAudio) {
|
||||
this.muteButton.setAttribute("noAudio", "true");
|
||||
this.muteButton.setAttribute("disabled", "true");
|
||||
}
|
||||
this.adjustControlSize();
|
||||
break;
|
||||
case "loadeddata":
|
||||
this.firstFrameShown = true;
|
||||
|
@ -735,7 +761,7 @@
|
|||
this.statusOverlay.setAttribute("error", error);
|
||||
},
|
||||
|
||||
formatTime(aTime) {
|
||||
formatTime(aTime, showHours = false) {
|
||||
// Format the duration as "h:mm:ss" or "m:ss"
|
||||
aTime = Math.round(aTime / 1000);
|
||||
let hours = Math.floor(aTime / 3600);
|
||||
|
@ -745,7 +771,7 @@
|
|||
if (secs < 10) {
|
||||
secs = "0" + secs;
|
||||
}
|
||||
if (hours) {
|
||||
if (hours || showHours) {
|
||||
if (mins < 10) {
|
||||
mins = "0" + mins;
|
||||
}
|
||||
|
@ -808,6 +834,7 @@
|
|||
this.scrubber.durationValue = timeString;
|
||||
|
||||
// If the duration is over an hour, thumb should show h:mm:ss instead of mm:ss
|
||||
this.showHours = (duration >= 3600000);
|
||||
|
||||
this.scrubber.max = duration;
|
||||
// XXX Can't set increment here, due to bug 473103. Also, doing so causes
|
||||
|
@ -884,7 +911,7 @@
|
|||
|
||||
this.log("time update @ " + currentTime + "ms of " + duration + "ms");
|
||||
|
||||
let positionTime = this.formatTime(currentTime);
|
||||
let positionTime = this.formatTime(currentTime, this.showHours);
|
||||
|
||||
this.scrubber.value = currentTime;
|
||||
if (this.videocontrols.isTouchControls) {
|
||||
|
@ -1494,6 +1521,7 @@
|
|||
onControlBarTransitioned() {
|
||||
this.textTrackList.setAttribute("hidden", "true");
|
||||
this.video.dispatchEvent(new CustomEvent("controlbarchange"));
|
||||
this.adjustControlSize();
|
||||
},
|
||||
|
||||
toggleClosedCaption() {
|
||||
|
@ -1611,6 +1639,11 @@
|
|||
let preventAppendControl = false;
|
||||
|
||||
for (let control of prioritizedControls) {
|
||||
if (!this.isControlBarHidden && control.resized && !control.hideByAdjustment) {
|
||||
control.resizedHandler();
|
||||
control.resized = false;
|
||||
}
|
||||
|
||||
if (!control.isWanted) {
|
||||
control.hideByAdjustment = true;
|
||||
continue;
|
||||
|
@ -1626,12 +1659,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
if (this.durationSpan.hideByAdjustment) {
|
||||
this.positionDurationBox.setAttribute("positionOnly", "true");
|
||||
} else {
|
||||
this.positionDurationBox.removeAttribute("positionOnly");
|
||||
}
|
||||
|
||||
if (videoHeight < this.controlBar.minHeight ||
|
||||
widthUsed === minControlBarPaddingWidth) {
|
||||
this.controlBar.setAttribute("size", "hidden");
|
||||
|
|
|
@ -340,21 +340,16 @@ audio > xul|videocontrols {
|
|||
}
|
||||
|
||||
.positionDurationBox {
|
||||
min-width: 9ch;
|
||||
text-align: center;
|
||||
padding-inline-start: 1px;
|
||||
padding-inline-end: 9px;
|
||||
white-space: nowrap;
|
||||
font: message-box;
|
||||
font-size: 13px;
|
||||
font-size-adjust: 0.6;
|
||||
font-size-adjust: 0.55;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.positionDurationBox[positionOnly] {
|
||||
min-width: 4ch;
|
||||
}
|
||||
|
||||
%ifdef XP_MACOSX
|
||||
.positionDurationBox {
|
||||
font-size-adjust: unset;
|
||||
|
|
Загрузка…
Ссылка в новой задаче