Index: Source/devtools/front_end/elements/AnimationTimeline.js |
diff --git a/Source/devtools/front_end/elements/AnimationTimeline.js b/Source/devtools/front_end/elements/AnimationTimeline.js |
index b8c496a74ba361ade64c588bb80aea30271c2c08..2abf1d1d86b595d755f1a3f318a6344ae7a07ac0 100644 |
--- a/Source/devtools/front_end/elements/AnimationTimeline.js |
+++ b/Source/devtools/front_end/elements/AnimationTimeline.js |
@@ -32,6 +32,7 @@ WebInspector.AnimationTimeline = function() |
this._animationsMap = new Map(); |
WebInspector.targetManager.addModelListener(WebInspector.ResourceTreeModel, WebInspector.ResourceTreeModel.EventTypes.MainFrameNavigated, this._mainFrameNavigated, this); |
WebInspector.targetManager.addModelListener(WebInspector.DOMModel, WebInspector.DOMModel.Events.NodeRemoved, this._nodeRemoved, this); |
+ WebInspector.targetManager.addModelListener(WebInspector.ResourceTreeModel, WebInspector.ResourceTreeModel.EventTypes.FrameAdded, this._frameAdded, this); |
} |
WebInspector.AnimationTimeline.prototype = { |
@@ -46,7 +47,7 @@ WebInspector.AnimationTimeline.prototype = { |
this._animationsPlaybackRate = WebInspector.AnimationsSidebarPane.GlobalPlaybackRates[event.target.value]; |
var target = WebInspector.targetManager.mainTarget(); |
if (target) |
- target.animationAgent().setPlaybackRate(this._animationsPlaybackRate); |
+ target.animationModel.setPlaybackRate(this._animationsPlaybackRate, this._startTimesUpdated.bind(this)); |
this._playbackLabel.textContent = this._animationsPlaybackRate + "x"; |
WebInspector.userMetrics.AnimationsPlaybackRateChanged.record(); |
if (this._scrubberPlayer) |
@@ -83,6 +84,22 @@ WebInspector.AnimationTimeline.prototype = { |
return container; |
}, |
+ /** |
+ * @param {?Array.<!AnimationAgent.AnimationStartTime>} startTimes |
+ */ |
+ _startTimesUpdated: function(startTimes) |
+ { |
+ if (!startTimes || !startTimes.length) |
pfeldman
2015/04/02 14:42:38
Why is it nullable?
samli
2015/04/02 20:13:19
In the case of protocol error it's called with nul
|
+ return; |
+ |
+ // Update timeline start time from new monotonic time values |
+ delete this._startTime; |
+ for (var player of startTimes) { |
+ if (!this._startTime || player.startTime < this._startTime) |
+ this._startTime = player.startTime; |
pfeldman
2015/04/02 14:42:38
I don't understand how multiple players within mul
samli
2015/04/02 20:13:19
All animation players have times calculated based
|
+ } |
+ }, |
+ |
_updateAnimationsPlaybackRate: function() |
{ |
/** |
@@ -106,9 +123,9 @@ WebInspector.AnimationTimeline.prototype = { |
{ |
if (this.startTime() === undefined) |
return; |
- var targets = WebInspector.targetManager.targets(); |
- for (var target of targets) |
- target.animationAgent().setCurrentTime(/** @type {number} */(this.startTime())); |
+ var target = WebInspector.targetManager.mainTarget(); |
+ if (target) |
+ target.animationModel.setCurrentTime(/** @type {number} */(this.startTime()), this._startTimesUpdated.bind(this)); |
this._animateTime(0); |
}, |
@@ -171,6 +188,16 @@ WebInspector.AnimationTimeline.prototype = { |
}, |
/** |
+ * @param {!WebInspector.Event} event |
+ */ |
+ _frameAdded: function(event) |
+ { |
+ var target = WebInspector.targetManager.mainTarget(); |
+ if (target && this._animationsPlaybackRate) |
+ target.animationModel.setPlaybackRate(this._animationsPlaybackRate, this._startTimesUpdated.bind(this)); |
+ }, |
+ |
+ /** |
* @param {!WebInspector.AnimationModel.AnimationPlayer} animation |
* @param {boolean} resetTimeline |
*/ |
@@ -363,10 +390,14 @@ WebInspector.AnimationTimeline.prototype = { |
this._timelineScrubber.classList.remove("animation-timeline-end"); |
this._scrubberPlayer.pause(); |
this._originalMousePosition = new WebInspector.Geometry.Point(event.x, event.y); |
+ this._lastCurrentTime = this._scrubberPlayer.currentTime; |
var target = WebInspector.targetManager.mainTarget(); |
- if (target) |
- target.animationAgent().setPlaybackRate(0); |
+ if (target) { |
+ target.animationModel.setCurrentTime(/** @type {number} */(this.startTime()), this._startTimesUpdated.bind(this)); |
+ target.animationModel.setPlaybackRate(0, this._startTimesUpdated.bind(this)); |
+ target.animationAgent().seekTimeline(this._scrubberPlayer.currentTime); |
+ } |
return true; |
}, |
@@ -379,9 +410,10 @@ WebInspector.AnimationTimeline.prototype = { |
this._scrubberPlayer.currentTime = Math.min(this._originalScrubberTime + delta / this.pixelMsRatio(), this.duration() - this._scrubberRadius / this.pixelMsRatio()); |
var currentTime = Math.max(0, Math.round(this._scrubberPlayer.currentTime)); |
this._timelineScrubberHead.textContent = WebInspector.UIString(Number.millisToString(currentTime)); |
- var targets = WebInspector.targetManager.targets(); |
- for (var target of targets) |
- target.animationAgent().setCurrentTime(/** @type {number} */(this.startTime() + currentTime)); |
+ var target = WebInspector.targetManager.mainTarget(); |
+ if (target) |
+ target.animationAgent().seekTimeline(this._scrubberPlayer.currentTime - this._lastCurrentTime); |
+ this._lastCurrentTime = this._scrubberPlayer.currentTime; |
}, |
/** |
@@ -393,8 +425,10 @@ WebInspector.AnimationTimeline.prototype = { |
this._scrubberPlayer.play(); |
this._timelineScrubberHead.window().requestAnimationFrame(this._updateScrubber.bind(this)); |
var target = WebInspector.targetManager.mainTarget(); |
- if (target) |
- target.animationAgent().setPlaybackRate(this._animationsPlaybackRate); |
+ if (target) { |
+ target.animationAgent().seekTimeline(this._lastCurrentTime - this._scrubberPlayer.currentTime); |
+ target.animationModel.setPlaybackRate(this._animationsPlaybackRate, this._startTimesUpdated.bind(this)); |
+ } |
}, |
__proto__: WebInspector.VBox.prototype |