| Index: third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js
|
| diff --git a/third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js b/third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js
|
| index fc62974ff81e70660b2dfa3fd25f582e0bf0b814..218e3d8d9fff141eb957ae726adba884b8263fa6 100644
|
| --- a/third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js
|
| +++ b/third_party/WebKit/Source/devtools/front_end/animation/AnimationModel.js
|
| @@ -2,15 +2,15 @@
|
| // Use of this source code is governed by a BSD-style license that can be
|
| // found in the LICENSE file.
|
|
|
| -
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKModel}
|
| - * @param {!WebInspector.Target} target
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel = function(target)
|
| -{
|
| - WebInspector.SDKModel.call(this, WebInspector.AnimationModel, target);
|
| +WebInspector.AnimationModel = class extends WebInspector.SDKModel {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + */
|
| + constructor(target) {
|
| + super(WebInspector.AnimationModel, target);
|
| this._agent = target.animationAgent();
|
| target.registerAnimationDispatcher(new WebInspector.AnimationDispatcher(this));
|
| /** @type {!Map.<string, !WebInspector.AnimationModel.Animation>} */
|
| @@ -20,930 +20,845 @@ WebInspector.AnimationModel = function(target)
|
| /** @type {!Array.<string>} */
|
| this._pendingAnimations = [];
|
| this._playbackRate = 1;
|
| - var resourceTreeModel = /** @type {!WebInspector.ResourceTreeModel} */ (WebInspector.ResourceTreeModel.fromTarget(target));
|
| + var resourceTreeModel =
|
| + /** @type {!WebInspector.ResourceTreeModel} */ (WebInspector.ResourceTreeModel.fromTarget(target));
|
| resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.Events.MainFrameNavigated, this._reset, this);
|
| this._screenshotCapture = new WebInspector.AnimationModel.ScreenshotCapture(target, this, resourceTreeModel);
|
| -};
|
| + }
|
|
|
| -/** @enum {symbol} */
|
| -WebInspector.AnimationModel.Events = {
|
| - AnimationGroupStarted: Symbol("AnimationGroupStarted"),
|
| - ModelReset: Symbol("ModelReset")
|
| -};
|
| -
|
| -WebInspector.AnimationModel.prototype = {
|
| - _reset: function()
|
| - {
|
| - this._animationsById.clear();
|
| - this._animationGroups.clear();
|
| - this._pendingAnimations = [];
|
| - this.dispatchEventToListeners(WebInspector.AnimationModel.Events.ModelReset);
|
| - },
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @return {?WebInspector.AnimationModel}
|
| + */
|
| + static fromTarget(target) {
|
| + if (!target.hasDOMCapability())
|
| + return null;
|
| + if (!target[WebInspector.AnimationModel._symbol])
|
| + target[WebInspector.AnimationModel._symbol] = new WebInspector.AnimationModel(target);
|
|
|
| - /**
|
| - * @param {string} id
|
| - */
|
| - animationCreated: function(id)
|
| - {
|
| - this._pendingAnimations.push(id);
|
| - },
|
| + return target[WebInspector.AnimationModel._symbol];
|
| + }
|
|
|
| - /**
|
| - * @param {string} id
|
| - */
|
| - _animationCanceled: function(id)
|
| - {
|
| - this._pendingAnimations.remove(id);
|
| - this._flushPendingAnimationsIfNeeded();
|
| - },
|
| + _reset() {
|
| + this._animationsById.clear();
|
| + this._animationGroups.clear();
|
| + this._pendingAnimations = [];
|
| + this.dispatchEventToListeners(WebInspector.AnimationModel.Events.ModelReset);
|
| + }
|
| +
|
| + /**
|
| + * @param {string} id
|
| + */
|
| + animationCreated(id) {
|
| + this._pendingAnimations.push(id);
|
| + }
|
| +
|
| + /**
|
| + * @param {string} id
|
| + */
|
| + _animationCanceled(id) {
|
| + this._pendingAnimations.remove(id);
|
| + this._flushPendingAnimationsIfNeeded();
|
| + }
|
| +
|
| + /**
|
| + * @param {!AnimationAgent.Animation} payload
|
| + */
|
| + animationStarted(payload) {
|
| + var animation = WebInspector.AnimationModel.Animation.parsePayload(this.target(), payload);
|
| +
|
| + // Ignore Web Animations custom effects & groups.
|
| + if (animation.type() === 'WebAnimation' && animation.source().keyframesRule().keyframes().length === 0) {
|
| + this._pendingAnimations.remove(animation.id());
|
| + } else {
|
| + this._animationsById.set(animation.id(), animation);
|
| + if (this._pendingAnimations.indexOf(animation.id()) === -1)
|
| + this._pendingAnimations.push(animation.id());
|
| + }
|
|
|
| - /**
|
| - * @param {!AnimationAgent.Animation} payload
|
| - */
|
| - animationStarted: function(payload)
|
| - {
|
| - var animation = WebInspector.AnimationModel.Animation.parsePayload(this.target(), payload);
|
| -
|
| - // Ignore Web Animations custom effects & groups.
|
| - if (animation.type() === "WebAnimation" && animation.source().keyframesRule().keyframes().length === 0) {
|
| - this._pendingAnimations.remove(animation.id());
|
| - } else {
|
| - this._animationsById.set(animation.id(), animation);
|
| - if (this._pendingAnimations.indexOf(animation.id()) === -1)
|
| - this._pendingAnimations.push(animation.id());
|
| - }
|
| -
|
| - this._flushPendingAnimationsIfNeeded();
|
| - },
|
| -
|
| - _flushPendingAnimationsIfNeeded: function()
|
| - {
|
| - for (var id of this._pendingAnimations) {
|
| - if (!this._animationsById.get(id))
|
| - return;
|
| - }
|
| -
|
| - while (this._pendingAnimations.length)
|
| - this._matchExistingGroups(this._createGroupFromPendingAnimations());
|
| - },
|
| + this._flushPendingAnimationsIfNeeded();
|
| + }
|
|
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.AnimationGroup} incomingGroup
|
| - * @return {boolean}
|
| - */
|
| - _matchExistingGroups: function(incomingGroup)
|
| - {
|
| - var matchedGroup = null;
|
| - for (var group of this._animationGroups.values()) {
|
| - if (group._matches(incomingGroup)) {
|
| - matchedGroup = group;
|
| - group._update(incomingGroup);
|
| - break;
|
| - }
|
| - }
|
| -
|
| - if (!matchedGroup) {
|
| - this._animationGroups.set(incomingGroup.id(), incomingGroup);
|
| - this._screenshotCapture.captureScreenshots(incomingGroup.finiteDuration(), incomingGroup._screenshots);
|
| - }
|
| - this.dispatchEventToListeners(WebInspector.AnimationModel.Events.AnimationGroupStarted, matchedGroup || incomingGroup);
|
| - return !!matchedGroup;
|
| - },
|
| + _flushPendingAnimationsIfNeeded() {
|
| + for (var id of this._pendingAnimations) {
|
| + if (!this._animationsById.get(id))
|
| + return;
|
| + }
|
|
|
| - /**
|
| - * @return {!WebInspector.AnimationModel.AnimationGroup}
|
| - */
|
| - _createGroupFromPendingAnimations: function()
|
| - {
|
| - console.assert(this._pendingAnimations.length);
|
| - var groupedAnimations = [this._animationsById.get(this._pendingAnimations.shift())];
|
| - var remainingAnimations = [];
|
| - for (var id of this._pendingAnimations) {
|
| - var anim = this._animationsById.get(id);
|
| - if (anim.startTime() === groupedAnimations[0].startTime())
|
| - groupedAnimations.push(anim);
|
| - else
|
| - remainingAnimations.push(id);
|
| - }
|
| - this._pendingAnimations = remainingAnimations;
|
| - return new WebInspector.AnimationModel.AnimationGroup(this, groupedAnimations[0].id(), groupedAnimations);
|
| - },
|
| + while (this._pendingAnimations.length)
|
| + this._matchExistingGroups(this._createGroupFromPendingAnimations());
|
| + }
|
| +
|
| + /**
|
| + * @param {!WebInspector.AnimationModel.AnimationGroup} incomingGroup
|
| + * @return {boolean}
|
| + */
|
| + _matchExistingGroups(incomingGroup) {
|
| + var matchedGroup = null;
|
| + for (var group of this._animationGroups.values()) {
|
| + if (group._matches(incomingGroup)) {
|
| + matchedGroup = group;
|
| + group._update(incomingGroup);
|
| + break;
|
| + }
|
| + }
|
|
|
| - /**
|
| - * @return {!Promise.<number>}
|
| - */
|
| - playbackRatePromise: function()
|
| - {
|
| - /**
|
| - * @param {?Protocol.Error} error
|
| - * @param {number} playbackRate
|
| - * @return {number}
|
| - * @this {!WebInspector.AnimationModel}
|
| - */
|
| - function callback(error, playbackRate)
|
| - {
|
| - if (error)
|
| - return 1;
|
| - this._playbackRate = playbackRate;
|
| - return playbackRate;
|
| - }
|
| -
|
| - return this._agent.getPlaybackRate(callback.bind(this)).catchException(1);
|
| - },
|
| + if (!matchedGroup) {
|
| + this._animationGroups.set(incomingGroup.id(), incomingGroup);
|
| + this._screenshotCapture.captureScreenshots(incomingGroup.finiteDuration(), incomingGroup._screenshots);
|
| + }
|
| + this.dispatchEventToListeners(
|
| + WebInspector.AnimationModel.Events.AnimationGroupStarted, matchedGroup || incomingGroup);
|
| + return !!matchedGroup;
|
| + }
|
| +
|
| + /**
|
| + * @return {!WebInspector.AnimationModel.AnimationGroup}
|
| + */
|
| + _createGroupFromPendingAnimations() {
|
| + console.assert(this._pendingAnimations.length);
|
| + var groupedAnimations = [this._animationsById.get(this._pendingAnimations.shift())];
|
| + var remainingAnimations = [];
|
| + for (var id of this._pendingAnimations) {
|
| + var anim = this._animationsById.get(id);
|
| + if (anim.startTime() === groupedAnimations[0].startTime())
|
| + groupedAnimations.push(anim);
|
| + else
|
| + remainingAnimations.push(id);
|
| + }
|
| + this._pendingAnimations = remainingAnimations;
|
| + return new WebInspector.AnimationModel.AnimationGroup(this, groupedAnimations[0].id(), groupedAnimations);
|
| + }
|
|
|
| + /**
|
| + * @return {!Promise.<number>}
|
| + */
|
| + playbackRatePromise() {
|
| /**
|
| + * @param {?Protocol.Error} error
|
| * @param {number} playbackRate
|
| + * @return {number}
|
| + * @this {!WebInspector.AnimationModel}
|
| */
|
| - setPlaybackRate: function(playbackRate)
|
| - {
|
| - this._playbackRate = playbackRate;
|
| - this._agent.setPlaybackRate(playbackRate);
|
| - },
|
| -
|
| - /**
|
| - * @param {!Array.<string>} animations
|
| - */
|
| - _releaseAnimations: function(animations)
|
| - {
|
| - this.target().animationAgent().releaseAnimations(animations);
|
| - },
|
| -
|
| - /**
|
| - * @override
|
| - * @return {!Promise}
|
| - */
|
| - suspendModel: function()
|
| - {
|
| - this._reset();
|
| - return this._agent.disable();
|
| - },
|
| + function callback(error, playbackRate) {
|
| + if (error)
|
| + return 1;
|
| + this._playbackRate = playbackRate;
|
| + return playbackRate;
|
| + }
|
|
|
| - /**
|
| - * @override
|
| - * @return {!Promise}
|
| - */
|
| - resumeModel: function()
|
| - {
|
| - if (!this._enabled)
|
| - return Promise.resolve();
|
| - return this._agent.enable();
|
| - },
|
| -
|
| - ensureEnabled: function()
|
| - {
|
| - if (this._enabled)
|
| - return;
|
| - this._agent.enable();
|
| - this._enabled = true;
|
| - },
|
| -
|
| - __proto__: WebInspector.SDKModel.prototype
|
| + return this._agent.getPlaybackRate(callback.bind(this)).catchException(1);
|
| + }
|
| +
|
| + /**
|
| + * @param {number} playbackRate
|
| + */
|
| + setPlaybackRate(playbackRate) {
|
| + this._playbackRate = playbackRate;
|
| + this._agent.setPlaybackRate(playbackRate);
|
| + }
|
| +
|
| + /**
|
| + * @param {!Array.<string>} animations
|
| + */
|
| + _releaseAnimations(animations) {
|
| + this.target().animationAgent().releaseAnimations(animations);
|
| + }
|
| +
|
| + /**
|
| + * @override
|
| + * @return {!Promise}
|
| + */
|
| + suspendModel() {
|
| + this._reset();
|
| + return this._agent.disable();
|
| + }
|
| +
|
| + /**
|
| + * @override
|
| + * @return {!Promise}
|
| + */
|
| + resumeModel() {
|
| + if (!this._enabled)
|
| + return Promise.resolve();
|
| + return this._agent.enable();
|
| + }
|
| +
|
| + ensureEnabled() {
|
| + if (this._enabled)
|
| + return;
|
| + this._agent.enable();
|
| + this._enabled = true;
|
| + }
|
| };
|
|
|
| -WebInspector.AnimationModel._symbol = Symbol("AnimationModel");
|
| +/** @enum {symbol} */
|
| +WebInspector.AnimationModel.Events = {
|
| + AnimationGroupStarted: Symbol('AnimationGroupStarted'),
|
| + ModelReset: Symbol('ModelReset')
|
| +};
|
|
|
| -/**
|
| - * @param {!WebInspector.Target} target
|
| - * @return {?WebInspector.AnimationModel}
|
| - */
|
| -WebInspector.AnimationModel.fromTarget = function(target)
|
| -{
|
| - if (!target.hasDOMCapability())
|
| - return null;
|
| - if (!target[WebInspector.AnimationModel._symbol])
|
| - target[WebInspector.AnimationModel._symbol] = new WebInspector.AnimationModel(target);
|
| +WebInspector.AnimationModel._symbol = Symbol('AnimationModel');
|
|
|
| - return target[WebInspector.AnimationModel._symbol];
|
| -};
|
|
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKObject}
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!AnimationAgent.Animation} payload
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.Animation = function(target, payload)
|
| -{
|
| - WebInspector.SDKObject.call(this, target);
|
| +WebInspector.AnimationModel.Animation = class extends WebInspector.SDKObject {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!AnimationAgent.Animation} payload
|
| + */
|
| + constructor(target, payload) {
|
| + super(target);
|
| this._payload = payload;
|
| this._source = new WebInspector.AnimationModel.AnimationEffect(this.target(), this._payload.source);
|
| -};
|
| -
|
| -/**
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!AnimationAgent.Animation} payload
|
| - * @return {!WebInspector.AnimationModel.Animation}
|
| - */
|
| -WebInspector.AnimationModel.Animation.parsePayload = function(target, payload)
|
| -{
|
| + }
|
| +
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!AnimationAgent.Animation} payload
|
| + * @return {!WebInspector.AnimationModel.Animation}
|
| + */
|
| + static parsePayload(target, payload) {
|
| return new WebInspector.AnimationModel.Animation(target, payload);
|
| -};
|
| -
|
| -/** @enum {string} */
|
| -WebInspector.AnimationModel.Animation.Type = {
|
| - CSSTransition: "CSSTransition",
|
| - CSSAnimation: "CSSAnimation",
|
| - WebAnimation: "WebAnimation"
|
| -};
|
| -
|
| -WebInspector.AnimationModel.Animation.prototype = {
|
| - /**
|
| - * @return {!AnimationAgent.Animation}
|
| - */
|
| - payload: function()
|
| - {
|
| - return this._payload;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - id: function()
|
| - {
|
| - return this._payload.id;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - name: function()
|
| - {
|
| - return this._payload.name;
|
| - },
|
| -
|
| - /**
|
| - * @return {boolean}
|
| - */
|
| - paused: function()
|
| - {
|
| - return this._payload.pausedState;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - playState: function()
|
| - {
|
| - return this._playState || this._payload.playState;
|
| - },
|
| -
|
| - /**
|
| - * @param {string} playState
|
| - */
|
| - setPlayState: function(playState)
|
| - {
|
| - this._playState = playState;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - playbackRate: function()
|
| - {
|
| - return this._payload.playbackRate;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - startTime: function()
|
| - {
|
| - return this._payload.startTime;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - endTime: function()
|
| - {
|
| - if (!this.source().iterations)
|
| - return Infinity;
|
| - return this.startTime() + this.source().delay() + this.source().duration() * this.source().iterations() + this.source().endDelay();
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - _finiteDuration: function()
|
| - {
|
| - var iterations = Math.min(this.source().iterations(), 3);
|
| - return this.source().delay() + this.source().duration() * iterations;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - currentTime: function()
|
| - {
|
| - return this._payload.currentTime;
|
| - },
|
| -
|
| - /**
|
| - * @return {!WebInspector.AnimationModel.AnimationEffect}
|
| - */
|
| - source: function()
|
| - {
|
| - return this._source;
|
| - },
|
| -
|
| - /**
|
| - * @return {!WebInspector.AnimationModel.Animation.Type}
|
| - */
|
| - type: function()
|
| - {
|
| - return /** @type {!WebInspector.AnimationModel.Animation.Type} */(this._payload.type);
|
| - },
|
| -
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.Animation} animation
|
| - * @return {boolean}
|
| - */
|
| - overlaps: function(animation)
|
| - {
|
| - // Infinite animations
|
| - if (!this.source().iterations() || !animation.source().iterations())
|
| - return true;
|
| -
|
| - var firstAnimation = this.startTime() < animation.startTime() ? this : animation;
|
| - var secondAnimation = firstAnimation === this ? animation : this;
|
| - return firstAnimation.endTime() >= secondAnimation.startTime();
|
| - },
|
| -
|
| - /**
|
| - * @param {number} duration
|
| - * @param {number} delay
|
| - */
|
| - setTiming: function(duration, delay)
|
| - {
|
| - this._source.node().then(this._updateNodeStyle.bind(this, duration, delay));
|
| - this._source._duration = duration;
|
| - this._source._delay = delay;
|
| - this.target().animationAgent().setTiming(this.id(), duration, delay);
|
| - },
|
| + }
|
| +
|
| + /**
|
| + * @return {!AnimationAgent.Animation}
|
| + */
|
| + payload() {
|
| + return this._payload;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + id() {
|
| + return this._payload.id;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + name() {
|
| + return this._payload.name;
|
| + }
|
| +
|
| + /**
|
| + * @return {boolean}
|
| + */
|
| + paused() {
|
| + return this._payload.pausedState;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + playState() {
|
| + return this._playState || this._payload.playState;
|
| + }
|
| +
|
| + /**
|
| + * @param {string} playState
|
| + */
|
| + setPlayState(playState) {
|
| + this._playState = playState;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + playbackRate() {
|
| + return this._payload.playbackRate;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + startTime() {
|
| + return this._payload.startTime;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + endTime() {
|
| + if (!this.source().iterations)
|
| + return Infinity;
|
| + return this.startTime() + this.source().delay() + this.source().duration() * this.source().iterations() +
|
| + this.source().endDelay();
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + _finiteDuration() {
|
| + var iterations = Math.min(this.source().iterations(), 3);
|
| + return this.source().delay() + this.source().duration() * iterations;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + currentTime() {
|
| + return this._payload.currentTime;
|
| + }
|
| +
|
| + /**
|
| + * @return {!WebInspector.AnimationModel.AnimationEffect}
|
| + */
|
| + source() {
|
| + return this._source;
|
| + }
|
| +
|
| + /**
|
| + * @return {!WebInspector.AnimationModel.Animation.Type}
|
| + */
|
| + type() {
|
| + return /** @type {!WebInspector.AnimationModel.Animation.Type} */ (this._payload.type);
|
| + }
|
| +
|
| + /**
|
| + * @param {!WebInspector.AnimationModel.Animation} animation
|
| + * @return {boolean}
|
| + */
|
| + overlaps(animation) {
|
| + // Infinite animations
|
| + if (!this.source().iterations() || !animation.source().iterations())
|
| + return true;
|
| +
|
| + var firstAnimation = this.startTime() < animation.startTime() ? this : animation;
|
| + var secondAnimation = firstAnimation === this ? animation : this;
|
| + return firstAnimation.endTime() >= secondAnimation.startTime();
|
| + }
|
| +
|
| + /**
|
| + * @param {number} duration
|
| + * @param {number} delay
|
| + */
|
| + setTiming(duration, delay) {
|
| + this._source.node().then(this._updateNodeStyle.bind(this, duration, delay));
|
| + this._source._duration = duration;
|
| + this._source._delay = delay;
|
| + this.target().animationAgent().setTiming(this.id(), duration, delay);
|
| + }
|
| +
|
| + /**
|
| + * @param {number} duration
|
| + * @param {number} delay
|
| + * @param {!WebInspector.DOMNode} node
|
| + */
|
| + _updateNodeStyle(duration, delay, node) {
|
| + var animationPrefix;
|
| + if (this.type() === WebInspector.AnimationModel.Animation.Type.CSSTransition)
|
| + animationPrefix = 'transition-';
|
| + else if (this.type() === WebInspector.AnimationModel.Animation.Type.CSSAnimation)
|
| + animationPrefix = 'animation-';
|
| + else
|
| + return;
|
| +
|
| + var cssModel = WebInspector.CSSModel.fromTarget(node.target());
|
| + if (!cssModel)
|
| + return;
|
| + cssModel.setEffectivePropertyValueForNode(node.id, animationPrefix + 'duration', duration + 'ms');
|
| + cssModel.setEffectivePropertyValueForNode(node.id, animationPrefix + 'delay', delay + 'ms');
|
| + }
|
| +
|
| + /**
|
| + * @return {!Promise.<?WebInspector.RemoteObject>}
|
| + */
|
| + remoteObjectPromise() {
|
| + /**
|
| + * @param {?Protocol.Error} error
|
| + * @param {!RuntimeAgent.RemoteObject} payload
|
| + * @return {?WebInspector.RemoteObject}
|
| + * @this {!WebInspector.AnimationModel.Animation}
|
| + */
|
| + function callback(error, payload) {
|
| + return !error ? this.target().runtimeModel.createRemoteObject(payload) : null;
|
| + }
|
|
|
| - /**
|
| - * @param {number} duration
|
| - * @param {number} delay
|
| - * @param {!WebInspector.DOMNode} node
|
| - */
|
| - _updateNodeStyle: function(duration, delay, node)
|
| - {
|
| - var animationPrefix;
|
| - if (this.type() === WebInspector.AnimationModel.Animation.Type.CSSTransition)
|
| - animationPrefix = "transition-";
|
| - else if (this.type() === WebInspector.AnimationModel.Animation.Type.CSSAnimation)
|
| - animationPrefix = "animation-";
|
| - else
|
| - return;
|
| -
|
| - var cssModel = WebInspector.CSSModel.fromTarget(node.target());
|
| - if (!cssModel)
|
| - return;
|
| - cssModel.setEffectivePropertyValueForNode(node.id, animationPrefix + "duration", duration + "ms");
|
| - cssModel.setEffectivePropertyValueForNode(node.id, animationPrefix + "delay", delay + "ms");
|
| - },
|
| + return this.target().animationAgent().resolveAnimation(this.id(), callback.bind(this));
|
| + }
|
|
|
| - /**
|
| - * @return {!Promise.<?WebInspector.RemoteObject>}
|
| - */
|
| - remoteObjectPromise: function()
|
| - {
|
| - /**
|
| - * @param {?Protocol.Error} error
|
| - * @param {!RuntimeAgent.RemoteObject} payload
|
| - * @return {?WebInspector.RemoteObject}
|
| - * @this {!WebInspector.AnimationModel.Animation}
|
| - */
|
| - function callback(error, payload)
|
| - {
|
| - return !error ? this.target().runtimeModel.createRemoteObject(payload) : null;
|
| - }
|
| -
|
| - return this.target().animationAgent().resolveAnimation(this.id(), callback.bind(this));
|
| - },
|
| + /**
|
| + * @return {string}
|
| + */
|
| + _cssId() {
|
| + return this._payload.cssId || '';
|
| + }
|
| +};
|
|
|
| - /**
|
| - * @return {string}
|
| - */
|
| - _cssId: function()
|
| - {
|
| - return this._payload.cssId || "";
|
| - },
|
|
|
| - __proto__: WebInspector.SDKObject.prototype
|
| +/** @enum {string} */
|
| +WebInspector.AnimationModel.Animation.Type = {
|
| + CSSTransition: 'CSSTransition',
|
| + CSSAnimation: 'CSSAnimation',
|
| + WebAnimation: 'WebAnimation'
|
| };
|
|
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKObject}
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!AnimationAgent.AnimationEffect} payload
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.AnimationEffect = function(target, payload)
|
| -{
|
| - WebInspector.SDKObject.call(this, target);
|
| +WebInspector.AnimationModel.AnimationEffect = class extends WebInspector.SDKObject {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!AnimationAgent.AnimationEffect} payload
|
| + */
|
| + constructor(target, payload) {
|
| + super(target);
|
| this._payload = payload;
|
| if (payload.keyframesRule)
|
| - this._keyframesRule = new WebInspector.AnimationModel.KeyframesRule(target, payload.keyframesRule);
|
| + this._keyframesRule = new WebInspector.AnimationModel.KeyframesRule(target, payload.keyframesRule);
|
| this._delay = this._payload.delay;
|
| this._duration = this._payload.duration;
|
| -};
|
| -
|
| -WebInspector.AnimationModel.AnimationEffect.prototype = {
|
| - /**
|
| - * @return {number}
|
| - */
|
| - delay: function()
|
| - {
|
| - return this._delay;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - endDelay: function()
|
| - {
|
| - return this._payload.endDelay;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - iterationStart: function()
|
| - {
|
| - return this._payload.iterationStart;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - iterations: function()
|
| - {
|
| - // Animations with zero duration, zero delays and infinite iterations can't be shown.
|
| - if (!this.delay() && !this.endDelay() && !this.duration())
|
| - return 0;
|
| - return this._payload.iterations || Infinity;
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - duration: function()
|
| - {
|
| - return this._duration;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - direction: function()
|
| - {
|
| - return this._payload.direction;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - fill: function()
|
| - {
|
| - return this._payload.fill;
|
| - },
|
| -
|
| - /**
|
| - * @return {!Promise.<!WebInspector.DOMNode>}
|
| - */
|
| - node: function()
|
| - {
|
| - if (!this._deferredNode)
|
| - this._deferredNode = new WebInspector.DeferredDOMNode(this.target(), this.backendNodeId());
|
| - return this._deferredNode.resolvePromise();
|
| - },
|
| -
|
| - /**
|
| - * @return {!WebInspector.DeferredDOMNode}
|
| - */
|
| - deferredNode: function()
|
| - {
|
| - return new WebInspector.DeferredDOMNode(this.target(), this.backendNodeId());
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - backendNodeId: function()
|
| - {
|
| - return this._payload.backendNodeId;
|
| - },
|
| -
|
| - /**
|
| - * @return {?WebInspector.AnimationModel.KeyframesRule}
|
| - */
|
| - keyframesRule: function()
|
| - {
|
| - return this._keyframesRule;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - easing: function()
|
| - {
|
| - return this._payload.easing;
|
| - },
|
| -
|
| - __proto__: WebInspector.SDKObject.prototype
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + delay() {
|
| + return this._delay;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + endDelay() {
|
| + return this._payload.endDelay;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + iterationStart() {
|
| + return this._payload.iterationStart;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + iterations() {
|
| + // Animations with zero duration, zero delays and infinite iterations can't be shown.
|
| + if (!this.delay() && !this.endDelay() && !this.duration())
|
| + return 0;
|
| + return this._payload.iterations || Infinity;
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + duration() {
|
| + return this._duration;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + direction() {
|
| + return this._payload.direction;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + fill() {
|
| + return this._payload.fill;
|
| + }
|
| +
|
| + /**
|
| + * @return {!Promise.<!WebInspector.DOMNode>}
|
| + */
|
| + node() {
|
| + if (!this._deferredNode)
|
| + this._deferredNode = new WebInspector.DeferredDOMNode(this.target(), this.backendNodeId());
|
| + return this._deferredNode.resolvePromise();
|
| + }
|
| +
|
| + /**
|
| + * @return {!WebInspector.DeferredDOMNode}
|
| + */
|
| + deferredNode() {
|
| + return new WebInspector.DeferredDOMNode(this.target(), this.backendNodeId());
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + backendNodeId() {
|
| + return this._payload.backendNodeId;
|
| + }
|
| +
|
| + /**
|
| + * @return {?WebInspector.AnimationModel.KeyframesRule}
|
| + */
|
| + keyframesRule() {
|
| + return this._keyframesRule;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + easing() {
|
| + return this._payload.easing;
|
| + }
|
| };
|
|
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKObject}
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!AnimationAgent.KeyframesRule} payload
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.KeyframesRule = function(target, payload)
|
| -{
|
| - WebInspector.SDKObject.call(this, target);
|
| +WebInspector.AnimationModel.KeyframesRule = class extends WebInspector.SDKObject {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!AnimationAgent.KeyframesRule} payload
|
| + */
|
| + constructor(target, payload) {
|
| + super(target);
|
| this._payload = payload;
|
| this._keyframes = this._payload.keyframes.map(function(keyframeStyle) {
|
| - return new WebInspector.AnimationModel.KeyframeStyle(target, keyframeStyle);
|
| + return new WebInspector.AnimationModel.KeyframeStyle(target, keyframeStyle);
|
| });
|
| -};
|
| -
|
| -WebInspector.AnimationModel.KeyframesRule.prototype = {
|
| - /**
|
| - * @param {!Array.<!AnimationAgent.KeyframeStyle>} payload
|
| - */
|
| - _setKeyframesPayload: function(payload)
|
| - {
|
| - this._keyframes = payload.map(function(keyframeStyle) {
|
| - return new WebInspector.AnimationModel.KeyframeStyle(this._target, keyframeStyle);
|
| - });
|
| - },
|
| -
|
| - /**
|
| - * @return {string|undefined}
|
| - */
|
| - name: function()
|
| - {
|
| - return this._payload.name;
|
| - },
|
| -
|
| - /**
|
| - * @return {!Array.<!WebInspector.AnimationModel.KeyframeStyle>}
|
| - */
|
| - keyframes: function()
|
| - {
|
| - return this._keyframes;
|
| - },
|
| -
|
| - __proto__: WebInspector.SDKObject.prototype
|
| + }
|
| +
|
| + /**
|
| + * @param {!Array.<!AnimationAgent.KeyframeStyle>} payload
|
| + */
|
| + _setKeyframesPayload(payload) {
|
| + this._keyframes = payload.map(function(keyframeStyle) {
|
| + return new WebInspector.AnimationModel.KeyframeStyle(this._target, keyframeStyle);
|
| + });
|
| + }
|
| +
|
| + /**
|
| + * @return {string|undefined}
|
| + */
|
| + name() {
|
| + return this._payload.name;
|
| + }
|
| +
|
| + /**
|
| + * @return {!Array.<!WebInspector.AnimationModel.KeyframeStyle>}
|
| + */
|
| + keyframes() {
|
| + return this._keyframes;
|
| + }
|
| };
|
|
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKObject}
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!AnimationAgent.KeyframeStyle} payload
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.KeyframeStyle = function(target, payload)
|
| -{
|
| - WebInspector.SDKObject.call(this, target);
|
| +WebInspector.AnimationModel.KeyframeStyle = class extends WebInspector.SDKObject {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!AnimationAgent.KeyframeStyle} payload
|
| + */
|
| + constructor(target, payload) {
|
| + super(target);
|
| this._payload = payload;
|
| this._offset = this._payload.offset;
|
| -};
|
| -
|
| -WebInspector.AnimationModel.KeyframeStyle.prototype = {
|
| - /**
|
| - * @return {string}
|
| - */
|
| - offset: function()
|
| - {
|
| - return this._offset;
|
| - },
|
| -
|
| - /**
|
| - * @param {number} offset
|
| - */
|
| - setOffset: function(offset)
|
| - {
|
| - this._offset = offset * 100 + "%";
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - offsetAsNumber: function()
|
| - {
|
| - return parseFloat(this._offset) / 100;
|
| - },
|
| -
|
| - /**
|
| - * @return {string}
|
| - */
|
| - easing: function()
|
| - {
|
| - return this._payload.easing;
|
| - },
|
| -
|
| - __proto__: WebInspector.SDKObject.prototype
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + offset() {
|
| + return this._offset;
|
| + }
|
| +
|
| + /**
|
| + * @param {number} offset
|
| + */
|
| + setOffset(offset) {
|
| + this._offset = offset * 100 + '%';
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + offsetAsNumber() {
|
| + return parseFloat(this._offset) / 100;
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + easing() {
|
| + return this._payload.easing;
|
| + }
|
| };
|
|
|
| /**
|
| - * @constructor
|
| - * @extends {WebInspector.SDKObject}
|
| - * @param {!WebInspector.AnimationModel} model
|
| - * @param {string} id
|
| - * @param {!Array.<!WebInspector.AnimationModel.Animation>} animations
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.AnimationGroup = function(model, id, animations)
|
| -{
|
| - WebInspector.SDKObject.call(this, model.target());
|
| +WebInspector.AnimationModel.AnimationGroup = class extends WebInspector.SDKObject {
|
| + /**
|
| + * @param {!WebInspector.AnimationModel} model
|
| + * @param {string} id
|
| + * @param {!Array.<!WebInspector.AnimationModel.Animation>} animations
|
| + */
|
| + constructor(model, id, animations) {
|
| + super(model.target());
|
| this._model = model;
|
| this._id = id;
|
| this._animations = animations;
|
| this._paused = false;
|
| this._screenshots = [];
|
| this._screenshotImages = [];
|
| -};
|
| -
|
| -WebInspector.AnimationModel.AnimationGroup.prototype = {
|
| + }
|
| +
|
| + /**
|
| + * @return {string}
|
| + */
|
| + id() {
|
| + return this._id;
|
| + }
|
| +
|
| + /**
|
| + * @return {!Array.<!WebInspector.AnimationModel.Animation>}
|
| + */
|
| + animations() {
|
| + return this._animations;
|
| + }
|
| +
|
| + release() {
|
| + this._model._animationGroups.remove(this.id());
|
| + this._model._releaseAnimations(this._animationIds());
|
| + }
|
| +
|
| + /**
|
| + * @return {!Array.<string>}
|
| + */
|
| + _animationIds() {
|
| /**
|
| + * @param {!WebInspector.AnimationModel.Animation} animation
|
| * @return {string}
|
| */
|
| - id: function()
|
| - {
|
| - return this._id;
|
| - },
|
| -
|
| - /**
|
| - * @return {!Array.<!WebInspector.AnimationModel.Animation>}
|
| - */
|
| - animations: function()
|
| - {
|
| - return this._animations;
|
| - },
|
| -
|
| - release: function()
|
| - {
|
| - this._model._animationGroups.remove(this.id());
|
| - this._model._releaseAnimations(this._animationIds());
|
| - },
|
| -
|
| - /**
|
| - * @return {!Array.<string>}
|
| - */
|
| - _animationIds: function()
|
| - {
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.Animation} animation
|
| - * @return {string}
|
| - */
|
| - function extractId(animation)
|
| - {
|
| - return animation.id();
|
| - }
|
| -
|
| - return this._animations.map(extractId);
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - startTime: function()
|
| - {
|
| - return this._animations[0].startTime();
|
| - },
|
| -
|
| - /**
|
| - * @return {number}
|
| - */
|
| - finiteDuration: function()
|
| - {
|
| - var maxDuration = 0;
|
| - for (var i = 0; i < this._animations.length; ++i)
|
| - maxDuration = Math.max(maxDuration, this._animations[i]._finiteDuration());
|
| - return maxDuration;
|
| - },
|
| + function extractId(animation) {
|
| + return animation.id();
|
| + }
|
|
|
| - /**
|
| + return this._animations.map(extractId);
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + startTime() {
|
| + return this._animations[0].startTime();
|
| + }
|
| +
|
| + /**
|
| + * @return {number}
|
| + */
|
| + finiteDuration() {
|
| + var maxDuration = 0;
|
| + for (var i = 0; i < this._animations.length; ++i)
|
| + maxDuration = Math.max(maxDuration, this._animations[i]._finiteDuration());
|
| + return maxDuration;
|
| + }
|
| +
|
| + /**
|
| + * @param {number} currentTime
|
| + */
|
| + seekTo(currentTime) {
|
| + this.target().animationAgent().seekAnimations(this._animationIds(), currentTime);
|
| + }
|
| +
|
| + /**
|
| + * @return {boolean}
|
| + */
|
| + paused() {
|
| + return this._paused;
|
| + }
|
| +
|
| + /**
|
| + * @param {boolean} paused
|
| + */
|
| + togglePause(paused) {
|
| + if (paused === this._paused)
|
| + return;
|
| + this._paused = paused;
|
| + this.target().animationAgent().setPaused(this._animationIds(), paused);
|
| + }
|
| +
|
| + /**
|
| + * @return {!Promise.<number>}
|
| + */
|
| + currentTimePromise() {
|
| + /**
|
| + * @param {?Protocol.Error} error
|
| * @param {number} currentTime
|
| + * @return {number}
|
| */
|
| - seekTo: function(currentTime)
|
| - {
|
| - this.target().animationAgent().seekAnimations(this._animationIds(), currentTime);
|
| - },
|
| -
|
| - /**
|
| - * @return {boolean}
|
| - */
|
| - paused: function()
|
| - {
|
| - return this._paused;
|
| - },
|
| -
|
| - /**
|
| - * @param {boolean} paused
|
| - */
|
| - togglePause: function(paused)
|
| - {
|
| - if (paused === this._paused)
|
| - return;
|
| - this._paused = paused;
|
| - this.target().animationAgent().setPaused(this._animationIds(), paused);
|
| - },
|
| -
|
| - /**
|
| - * @return {!Promise.<number>}
|
| - */
|
| - currentTimePromise: function()
|
| - {
|
| - /**
|
| - * @param {?Protocol.Error} error
|
| - * @param {number} currentTime
|
| - * @return {number}
|
| - */
|
| - function callback(error, currentTime)
|
| - {
|
| - return !error ? currentTime : 0;
|
| - }
|
| -
|
| - var longestAnim = null;
|
| - for (var anim of this._animations) {
|
| - if (!longestAnim || anim.endTime() > longestAnim.endTime())
|
| - longestAnim = anim;
|
| - }
|
| - return this.target().animationAgent().getCurrentTime(longestAnim.id(), callback).catchException(0);
|
| - },
|
| + function callback(error, currentTime) {
|
| + return !error ? currentTime : 0;
|
| + }
|
|
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.AnimationGroup} group
|
| - * @return {boolean}
|
| - */
|
| - _matches: function(group)
|
| - {
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.Animation} anim
|
| - * @return {string}
|
| - */
|
| - function extractId(anim)
|
| - {
|
| - if (anim.type() === WebInspector.AnimationModel.Animation.Type.WebAnimation)
|
| - return anim.type() + anim.id();
|
| - else
|
| - return anim._cssId();
|
| - }
|
| -
|
| - if (this._animations.length !== group._animations.length)
|
| - return false;
|
| - var left = this._animations.map(extractId).sort();
|
| - var right = group._animations.map(extractId).sort();
|
| - for (var i = 0; i < left.length; i++) {
|
| - if (left[i] !== right[i])
|
| - return false;
|
| - }
|
| - return true;
|
| - },
|
| + var longestAnim = null;
|
| + for (var anim of this._animations) {
|
| + if (!longestAnim || anim.endTime() > longestAnim.endTime())
|
| + longestAnim = anim;
|
| + }
|
| + return this.target().animationAgent().getCurrentTime(longestAnim.id(), callback).catchException(0);
|
| + }
|
|
|
| + /**
|
| + * @param {!WebInspector.AnimationModel.AnimationGroup} group
|
| + * @return {boolean}
|
| + */
|
| + _matches(group) {
|
| /**
|
| - * @param {!WebInspector.AnimationModel.AnimationGroup} group
|
| + * @param {!WebInspector.AnimationModel.Animation} anim
|
| + * @return {string}
|
| */
|
| - _update: function(group)
|
| - {
|
| - this._model._releaseAnimations(this._animationIds());
|
| - this._animations = group._animations;
|
| - },
|
| + function extractId(anim) {
|
| + if (anim.type() === WebInspector.AnimationModel.Animation.Type.WebAnimation)
|
| + return anim.type() + anim.id();
|
| + else
|
| + return anim._cssId();
|
| + }
|
|
|
| - /**
|
| - * @return {!Array.<!Image>}
|
| - */
|
| - screenshots: function()
|
| - {
|
| - for (var i = 0; i < this._screenshots.length; ++i) {
|
| - var image = new Image();
|
| - image.src = "data:image/jpeg;base64," + this._screenshots[i];
|
| - this._screenshotImages.push(image);
|
| - }
|
| - this._screenshots = [];
|
| - return this._screenshotImages;
|
| - },
|
| -
|
| - __proto__: WebInspector.SDKObject.prototype
|
| + if (this._animations.length !== group._animations.length)
|
| + return false;
|
| + var left = this._animations.map(extractId).sort();
|
| + var right = group._animations.map(extractId).sort();
|
| + for (var i = 0; i < left.length; i++) {
|
| + if (left[i] !== right[i])
|
| + return false;
|
| + }
|
| + return true;
|
| + }
|
| +
|
| + /**
|
| + * @param {!WebInspector.AnimationModel.AnimationGroup} group
|
| + */
|
| + _update(group) {
|
| + this._model._releaseAnimations(this._animationIds());
|
| + this._animations = group._animations;
|
| + }
|
| +
|
| + /**
|
| + * @return {!Array.<!Image>}
|
| + */
|
| + screenshots() {
|
| + for (var i = 0; i < this._screenshots.length; ++i) {
|
| + var image = new Image();
|
| + image.src = 'data:image/jpeg;base64,' + this._screenshots[i];
|
| + this._screenshotImages.push(image);
|
| + }
|
| + this._screenshots = [];
|
| + return this._screenshotImages;
|
| + }
|
| };
|
|
|
| -
|
| /**
|
| - * @constructor
|
| * @implements {AnimationAgent.Dispatcher}
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationDispatcher = function(animationModel)
|
| -{
|
| +WebInspector.AnimationDispatcher = class {
|
| + constructor(animationModel) {
|
| this._animationModel = animationModel;
|
| -};
|
| -
|
| -WebInspector.AnimationDispatcher.prototype = {
|
| - /**
|
| - * @override
|
| - * @param {string} id
|
| - */
|
| - animationCreated: function(id)
|
| - {
|
| - this._animationModel.animationCreated(id);
|
| - },
|
| -
|
| - /**
|
| - * @override
|
| - * @param {string} id
|
| - */
|
| - animationCanceled: function(id)
|
| - {
|
| - this._animationModel._animationCanceled(id);
|
| - },
|
| -
|
| - /**
|
| - * @override
|
| - * @param {!AnimationAgent.Animation} payload
|
| - */
|
| - animationStarted: function(payload)
|
| - {
|
| - this._animationModel.animationStarted(payload);
|
| - }
|
| + }
|
| +
|
| + /**
|
| + * @override
|
| + * @param {string} id
|
| + */
|
| + animationCreated(id) {
|
| + this._animationModel.animationCreated(id);
|
| + }
|
| +
|
| + /**
|
| + * @override
|
| + * @param {string} id
|
| + */
|
| + animationCanceled(id) {
|
| + this._animationModel._animationCanceled(id);
|
| + }
|
| +
|
| + /**
|
| + * @override
|
| + * @param {!AnimationAgent.Animation} payload
|
| + */
|
| + animationStarted(payload) {
|
| + this._animationModel.animationStarted(payload);
|
| + }
|
| };
|
|
|
| /**
|
| - * @constructor
|
| - * @param {!WebInspector.Target} target
|
| - * @param {!WebInspector.AnimationModel} model
|
| - * @param {!WebInspector.ResourceTreeModel} resourceTreeModel
|
| + * @unrestricted
|
| */
|
| -WebInspector.AnimationModel.ScreenshotCapture = function(target, model, resourceTreeModel)
|
| -{
|
| +WebInspector.AnimationModel.ScreenshotCapture = class {
|
| + /**
|
| + * @param {!WebInspector.Target} target
|
| + * @param {!WebInspector.AnimationModel} model
|
| + * @param {!WebInspector.ResourceTreeModel} resourceTreeModel
|
| + */
|
| + constructor(target, model, resourceTreeModel) {
|
| this._target = target;
|
| /** @type {!Array<!WebInspector.AnimationModel.ScreenshotCapture.Request>} */
|
| this._requests = [];
|
| - resourceTreeModel.addEventListener(WebInspector.ResourceTreeModel.Events.ScreencastFrame, this._screencastFrame, this);
|
| + resourceTreeModel.addEventListener(
|
| + WebInspector.ResourceTreeModel.Events.ScreencastFrame, this._screencastFrame, this);
|
| this._model = model;
|
| this._model.addEventListener(WebInspector.AnimationModel.Events.ModelReset, this._stopScreencast, this);
|
| -};
|
| -
|
| -/** @typedef {{ endTime: number, screenshots: !Array.<string>}} */
|
| -WebInspector.AnimationModel.ScreenshotCapture.Request;
|
| + }
|
| +
|
| + /**
|
| + * @param {number} duration
|
| + * @param {!Array<string>} screenshots
|
| + */
|
| + captureScreenshots(duration, screenshots) {
|
| + var screencastDuration = Math.min(duration / this._model._playbackRate, 3000);
|
| + var endTime = screencastDuration + window.performance.now();
|
| + this._requests.push({endTime: endTime, screenshots: screenshots});
|
| +
|
| + if (!this._endTime || endTime > this._endTime) {
|
| + clearTimeout(this._stopTimer);
|
| + this._stopTimer = setTimeout(this._stopScreencast.bind(this), screencastDuration);
|
| + this._endTime = endTime;
|
| + }
|
|
|
| -WebInspector.AnimationModel.ScreenshotCapture.prototype = {
|
| - /**
|
| - * @param {number} duration
|
| - * @param {!Array<string>} screenshots
|
| - */
|
| - captureScreenshots: function(duration, screenshots)
|
| - {
|
| - var screencastDuration = Math.min(duration / this._model._playbackRate, 3000);
|
| - var endTime = screencastDuration + window.performance.now();
|
| - this._requests.push({ endTime: endTime, screenshots: screenshots });
|
| -
|
| - if (!this._endTime || endTime > this._endTime) {
|
| - clearTimeout(this._stopTimer);
|
| - this._stopTimer = setTimeout(this._stopScreencast.bind(this), screencastDuration);
|
| - this._endTime = endTime;
|
| - }
|
| -
|
| - if (this._capturing)
|
| - return;
|
| - this._capturing = true;
|
| - this._target.pageAgent().startScreencast("jpeg", 80, undefined, 300, 2);
|
| - },
|
| + if (this._capturing)
|
| + return;
|
| + this._capturing = true;
|
| + this._target.pageAgent().startScreencast('jpeg', 80, undefined, 300, 2);
|
| + }
|
|
|
| + /**
|
| + * @param {!WebInspector.Event} event
|
| + */
|
| + _screencastFrame(event) {
|
| /**
|
| - * @param {!WebInspector.Event} event
|
| + * @param {!WebInspector.AnimationModel.ScreenshotCapture.Request} request
|
| + * @return {boolean}
|
| */
|
| - _screencastFrame: function(event)
|
| - {
|
| - /**
|
| - * @param {!WebInspector.AnimationModel.ScreenshotCapture.Request} request
|
| - * @return {boolean}
|
| - */
|
| - function isAnimating(request)
|
| - {
|
| - return request.endTime >= now;
|
| - }
|
| -
|
| - if (!this._capturing)
|
| - return;
|
| -
|
| - var base64Data = /** type {string} */(event.data["data"]);
|
| - var now = window.performance.now();
|
| - this._requests = this._requests.filter(isAnimating);
|
| - for (var request of this._requests)
|
| - request.screenshots.push(base64Data);
|
| - },
|
| -
|
| - _stopScreencast: function()
|
| - {
|
| - if (!this._capturing)
|
| - return;
|
| -
|
| - delete this._stopTimer;
|
| - delete this._endTime;
|
| - this._requests = [];
|
| - this._capturing = false;
|
| - this._target.pageAgent().stopScreencast();
|
| + function isAnimating(request) {
|
| + return request.endTime >= now;
|
| }
|
| +
|
| + if (!this._capturing)
|
| + return;
|
| +
|
| + var base64Data = /** type {string} */ (event.data['data']);
|
| + var now = window.performance.now();
|
| + this._requests = this._requests.filter(isAnimating);
|
| + for (var request of this._requests)
|
| + request.screenshots.push(base64Data);
|
| + }
|
| +
|
| + _stopScreencast() {
|
| + if (!this._capturing)
|
| + return;
|
| +
|
| + delete this._stopTimer;
|
| + delete this._endTime;
|
| + this._requests = [];
|
| + this._capturing = false;
|
| + this._target.pageAgent().stopScreencast();
|
| + }
|
| };
|
| +
|
| +/** @typedef {{ endTime: number, screenshots: !Array.<string>}} */
|
| +WebInspector.AnimationModel.ScreenshotCapture.Request;
|
|
|