зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1120343 - 1 - Allow setting animations' currentTime by clicking/dragging the timeline; r=miker
--HG-- extra : rebase_source : 9ec165736d6119edeabba893bb93985db489ea28 extra : histedit_source : 6926f2c047f1a32e82175ea8ffc450cef6614a90
This commit is contained in:
Родитель
b1b0b8cf14
Коммит
39c2369e5c
|
@ -99,8 +99,11 @@ let AnimationsController = {
|
|||
|
||||
let target = gToolbox.target;
|
||||
this.animationsFront = new AnimationsFront(target.client, target.form);
|
||||
// Not all server versions provide a way to pause all animations at once.
|
||||
|
||||
// Expose actor capabilities.
|
||||
this.hasToggleAll = yield target.actorHasMethod("animations", "toggleAll");
|
||||
this.hasSetCurrentTime = yield target.actorHasMethod("animationplayer",
|
||||
"setCurrentTime");
|
||||
|
||||
this.onPanelVisibilityChange = this.onPanelVisibilityChange.bind(this);
|
||||
this.onNewNodeFront = this.onNewNodeFront.bind(this);
|
||||
|
|
|
@ -184,6 +184,7 @@ function PlayerWidget(player, containerEl) {
|
|||
|
||||
this.onStateChanged = this.onStateChanged.bind(this);
|
||||
this.onPlayPauseBtnClick = this.onPlayPauseBtnClick.bind(this);
|
||||
this.onCurrentTimeChanged = this.onCurrentTimeChanged.bind(this);
|
||||
|
||||
this.metaDataComponent = new PlayerMetaDataHeader();
|
||||
}
|
||||
|
@ -217,11 +218,17 @@ PlayerWidget.prototype = {
|
|||
startListeners: function() {
|
||||
this.player.on(this.player.AUTO_REFRESH_EVENT, this.onStateChanged);
|
||||
this.playPauseBtnEl.addEventListener("click", this.onPlayPauseBtnClick);
|
||||
if (AnimationsController.hasSetCurrentTime) {
|
||||
this.currentTimeEl.addEventListener("input", this.onCurrentTimeChanged);
|
||||
}
|
||||
},
|
||||
|
||||
stopListeners: function() {
|
||||
this.player.off(this.player.AUTO_REFRESH_EVENT, this.onStateChanged);
|
||||
this.playPauseBtnEl.removeEventListener("click", this.onPlayPauseBtnClick);
|
||||
if (AnimationsController.hasSetCurrentTime) {
|
||||
this.currentTimeEl.removeEventListener("input", this.onCurrentTimeChanged);
|
||||
}
|
||||
},
|
||||
|
||||
createMarkup: function() {
|
||||
|
@ -288,12 +295,14 @@ PlayerWidget.prototype = {
|
|||
"min": "0",
|
||||
"max": max,
|
||||
"step": "10",
|
||||
"value": "0",
|
||||
// The currentTime isn't settable yet, so disable the timeline slider
|
||||
"disabled": "true"
|
||||
"value": "0"
|
||||
}
|
||||
});
|
||||
|
||||
if (!AnimationsController.hasSetCurrentTime) {
|
||||
this.currentTimeEl.setAttribute("disabled", "true");
|
||||
}
|
||||
|
||||
// Time display
|
||||
this.timeDisplayEl = createNode({
|
||||
parent: timelineEl,
|
||||
|
@ -323,6 +332,14 @@ PlayerWidget.prototype = {
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Executed when the current-time range input is changed.
|
||||
*/
|
||||
onCurrentTimeChanged: function(e) {
|
||||
let time = e.target.value;
|
||||
this.setCurrentTime(parseFloat(time), true);
|
||||
},
|
||||
|
||||
/**
|
||||
* Whenever a player state update is received.
|
||||
*/
|
||||
|
@ -347,6 +364,29 @@ PlayerWidget.prototype = {
|
|||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Set the current time of the animation.
|
||||
* @param {Number} time.
|
||||
* @param {Boolean} shouldPause Should the player be paused too.
|
||||
* @return {Promise} Resolves when the current time has been set.
|
||||
*/
|
||||
setCurrentTime: Task.async(function*(time, shouldPause) {
|
||||
if (!AnimationsController.hasSetCurrentTime) {
|
||||
throw new Error("This server version doesn't support setting animations' currentTime");
|
||||
}
|
||||
|
||||
this.stopTimelineAnimation();
|
||||
if (shouldPause) {
|
||||
yield this.pause();
|
||||
}
|
||||
|
||||
if (this.player.state.delay) {
|
||||
time += this.player.state.delay;
|
||||
}
|
||||
|
||||
yield this.player.setCurrentTime(time);
|
||||
}),
|
||||
|
||||
/**
|
||||
* Pause the animation player via this widget.
|
||||
* @return {Promise} Resolves when the player is paused, the button is
|
||||
|
|
Загрузка…
Ссылка в новой задаче