@visactor/vrender-animate
Version:
This module provides a graph-based animation system for VRender.
467 lines (447 loc) • 27.7 kB
JavaScript
import { FadeIn } from "./fade";
import { interpolateColor } from "@visactor/vrender-core/interpolate";
import { ACustomAnimate } from "./custom-animate";
import { AnimateExecutor } from "../executor/animate-executor";
import { applyAnimationFrameAttributes, applyAnimationTransientAttributes, applyAppearStartAttributes } from "./transient";
export class StoryFadeIn extends FadeIn {}
function buildInterpolatedAttrs(keys, from, to, ratio) {
const attrs = {};
return keys.forEach((key => {
attrs[key] = from[key] + (to[key] - from[key]) * ratio;
})), attrs;
}
function applyStoryFrame(target, attrs) {
applyAnimationFrameAttributes(target, attrs), target.addUpdatePositionTag(), target.addUpdateShapeAndBoundsTag();
}
export class SlideIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onBind() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
super.onBind();
const attrs = this.target.getFinalAttribute(), direction = (null === (_a = this.params) || void 0 === _a ? void 0 : _a.direction) || "right", distance = (null === (_b = this.params) || void 0 === _b ? void 0 : _b.distance) || 50, fromOpacity = null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromOpacity) && void 0 !== _d ? _d : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity
}, to = {
opacity: 1,
baseOpacity: 1
};
"top" === direction ? (from.y = (null !== (_e = attrs.y) && void 0 !== _e ? _e : 0) - distance,
to.y = null !== (_f = attrs.y) && void 0 !== _f ? _f : 0, this.propKeys = [ "opacity", "baseOpacity", "y" ]) : "bottom" === direction ? (from.y = (null !== (_g = attrs.y) && void 0 !== _g ? _g : 0) + distance,
to.y = null !== (_h = attrs.y) && void 0 !== _h ? _h : 0, this.propKeys = [ "opacity", "baseOpacity", "y" ]) : "left" === direction ? (from.x = (null !== (_j = attrs.x) && void 0 !== _j ? _j : 0) - distance,
to.x = null !== (_k = attrs.x) && void 0 !== _k ? _k : 0, this.propKeys = [ "opacity", "baseOpacity", "x" ]) : (from.x = (null !== (_l = attrs.x) && void 0 !== _l ? _l : 0) + distance,
to.x = null !== (_m = attrs.x) && void 0 !== _m ? _m : 0, this.propKeys = [ "opacity", "baseOpacity", "x" ]),
this.from = from, this.to = to, this.props = to, applyAppearStartAttributes(this.target, from);
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class GrowIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onBind() {
var _a, _b, _c, _d, _e, _f, _g;
super.onBind();
const attrs = this.target.getFinalAttribute(), fromScale = null !== (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromScale) && void 0 !== _b ? _b : 0, direction = (null === (_c = this.params) || void 0 === _c ? void 0 : _c.direction) || "xy", fromOpacity = null !== (_e = null === (_d = this.params) || void 0 === _d ? void 0 : _d.fromOpacity) && void 0 !== _e ? _e : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity
}, to = {
opacity: 1,
baseOpacity: 1
};
this.propKeys = [ "opacity", "baseOpacity" ], "x" !== direction && "xy" !== direction || (from.scaleX = fromScale,
to.scaleX = null !== (_f = attrs.scaleX) && void 0 !== _f ? _f : 1, this.propKeys.push("scaleX")),
"y" !== direction && "xy" !== direction || (from.scaleY = fromScale, to.scaleY = null !== (_g = attrs.scaleY) && void 0 !== _g ? _g : 1,
this.propKeys.push("scaleY")), this.from = from, this.to = to, this.props = to,
applyAppearStartAttributes(this.target, from);
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class SpinIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onBind() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
super.onBind();
const attrs = this.target.getFinalAttribute(), fromAngle = null !== (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromAngle) && void 0 !== _b ? _b : 2 * Math.PI, fromScale = null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromScale) && void 0 !== _d ? _d : 0, fromOpacity = null !== (_f = null === (_e = this.params) || void 0 === _e ? void 0 : _e.fromOpacity) && void 0 !== _f ? _f : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity,
angle: fromAngle,
scaleX: fromScale,
scaleY: fromScale
}, to = {
opacity: 1,
baseOpacity: 1,
angle: null !== (_g = attrs.angle) && void 0 !== _g ? _g : 0,
scaleX: null !== (_h = attrs.scaleX) && void 0 !== _h ? _h : 1,
scaleY: null !== (_j = attrs.scaleY) && void 0 !== _j ? _j : 1
};
this.propKeys = [ "opacity", "baseOpacity", "angle", "scaleX", "scaleY" ], this.from = from,
this.to = to, this.props = to, applyAppearStartAttributes(this.target, from);
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class StrokeIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params), this.perimeter = 0, this.originalAttributes = {};
}
onBind() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
if (super.onBind(), this.originalAttributes = Object.assign({}, this.target.getAttributes()),
"rect" === this.target.type) {
const attr = this.target.attribute, width = null !== (_a = attr.width) && void 0 !== _a ? _a : 100, height = null !== (_b = attr.height) && void 0 !== _b ? _b : 100;
this.perimeter = 2 * (width + height);
} else if ("circle" === this.target.type) {
const radius = null !== (_c = this.target.attribute.radius) && void 0 !== _c ? _c : 50;
this.perimeter = 2 * Math.PI * radius;
} else if ("ellipse" === this.target.type) {
const attr = this.target.attribute, radiusX = null !== (_d = attr.radiusX) && void 0 !== _d ? _d : 50, radiusY = null !== (_e = attr.radiusY) && void 0 !== _e ? _e : 50;
this.perimeter = 2 * Math.PI * Math.sqrt((radiusX * radiusX + radiusY * radiusY) / 2);
} else this.perimeter = 1e3;
const lineWidth = null !== (_g = null === (_f = this.params) || void 0 === _f ? void 0 : _f.lineWidth) && void 0 !== _g ? _g : 2, strokeColor = null !== (_j = null === (_h = this.params) || void 0 === _h ? void 0 : _h.strokeColor) && void 0 !== _j ? _j : "black", fromOpacity = null !== (_l = null === (_k = this.params) || void 0 === _k ? void 0 : _k.fromOpacity) && void 0 !== _l ? _l : 1, dashLength = null !== (_o = null === (_m = this.params) || void 0 === _m ? void 0 : _m.dashLength) && void 0 !== _o ? _o : this.perimeter, showFill = null !== (_q = null === (_p = this.params) || void 0 === _p ? void 0 : _p.showFill) && void 0 !== _q && _q, fillOpacity = null !== (_s = null === (_r = this.params) || void 0 === _r ? void 0 : _r.fillOpacity) && void 0 !== _s ? _s : 0;
this.from = {
lineDash: [ dashLength, dashLength ],
lineDashOffset: dashLength,
lineWidth: lineWidth,
stroke: strokeColor,
strokeOpacity: fromOpacity
}, this.to = {
lineDash: [ dashLength, dashLength ],
lineDashOffset: 0,
lineWidth: lineWidth,
stroke: strokeColor,
strokeOpacity: fromOpacity
}, showFill ? (this.from.fillOpacity = fillOpacity, this.to.fillOpacity = null !== (_t = this.originalAttributes.fillOpacity) && void 0 !== _t ? _t : 1) : (this.from.fillOpacity = 0,
this.to.fillOpacity = 0), this.propKeys = [ "lineDash", "lineDashOffset", "lineWidth", "stroke", "strokeOpacity", "fillOpacity" ],
this.props = this.to, applyAppearStartAttributes(this.target, this.from);
}
onUpdate(end, ratio, out) {
var _a;
const attrs = {
lineDashOffset: this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio
};
(null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attrs.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio),
applyAnimationTransientAttributes(this.target, attrs);
}
onEnd() {
var _a;
if (super.onEnd(), !(null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill)) {
const originalAttrs = Object.assign({}, this.originalAttributes);
originalAttrs.fillOpacity = 0, this.target.setAttributes(originalAttrs);
}
}
}
export class StrokeOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params), this.perimeter = 0, this.originalAttributes = {};
}
onFirstRun() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
if (this.originalAttributes = Object.assign({}, this.target.getAttributes()), "rect" === this.target.type) {
const attr = this.target.attribute, width = null !== (_a = attr.width) && void 0 !== _a ? _a : 100, height = null !== (_b = attr.height) && void 0 !== _b ? _b : 100;
this.perimeter = 2 * (width + height);
} else if ("circle" === this.target.type) {
const radius = null !== (_c = this.target.attribute.radius) && void 0 !== _c ? _c : 50;
this.perimeter = 2 * Math.PI * radius;
} else if ("ellipse" === this.target.type) {
const attr = this.target.attribute, radiusX = null !== (_d = attr.radiusX) && void 0 !== _d ? _d : 50, radiusY = null !== (_e = attr.radiusY) && void 0 !== _e ? _e : 50;
this.perimeter = 2 * Math.PI * Math.sqrt((radiusX * radiusX + radiusY * radiusY) / 2);
} else this.perimeter = 1e3;
const lineWidth = null !== (_g = null === (_f = this.params) || void 0 === _f ? void 0 : _f.lineWidth) && void 0 !== _g ? _g : 2, strokeColor = null !== (_j = null === (_h = this.params) || void 0 === _h ? void 0 : _h.strokeColor) && void 0 !== _j ? _j : "black", fromOpacity = null !== (_l = null === (_k = this.params) || void 0 === _k ? void 0 : _k.fromOpacity) && void 0 !== _l ? _l : 1, dashLength = null !== (_o = null === (_m = this.params) || void 0 === _m ? void 0 : _m.dashLength) && void 0 !== _o ? _o : this.perimeter, showFill = null !== (_q = null === (_p = this.params) || void 0 === _p ? void 0 : _p.showFill) && void 0 !== _q && _q;
this.from = {
lineDash: [ dashLength, dashLength ],
lineDashOffset: 0,
lineWidth: lineWidth,
stroke: strokeColor,
strokeOpacity: fromOpacity
}, this.to = {
lineDash: [ dashLength, dashLength ],
lineDashOffset: -dashLength,
lineWidth: lineWidth,
stroke: strokeColor,
strokeOpacity: fromOpacity
}, showFill ? (this.from.fillOpacity = null !== (_r = this.originalAttributes.fillOpacity) && void 0 !== _r ? _r : 1,
this.to.fillOpacity = 0) : (this.from.fillOpacity = 0, this.to.fillOpacity = 0),
this.propKeys = [ "lineDash", "lineDashOffset", "lineWidth", "stroke", "strokeOpacity", "fillOpacity" ],
this.props = this.to, applyAppearStartAttributes(this.target, this.from);
}
onUpdate(end, ratio, out) {
var _a;
const attrs = {
lineDashOffset: this.from.lineDashOffset + (this.to.lineDashOffset - this.from.lineDashOffset) * ratio
};
(null === (_a = this.params) || void 0 === _a ? void 0 : _a.showFill) && (attrs.fillOpacity = this.from.fillOpacity + (this.to.fillOpacity - this.from.fillOpacity) * ratio),
applyAnimationTransientAttributes(this.target, attrs);
}
}
export class MoveScaleIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
var _a;
super(from, to, duration, easing, params);
const slideRatio = null !== (_a = null == params ? void 0 : params.slideRatio) && void 0 !== _a ? _a : .5;
this.slideInDuration = duration * slideRatio, this.growInDuration = duration * (1 - slideRatio);
}
onBind() {
var _a, _b, _c, _d, _e, _f;
super.onBind();
const executor = new AnimateExecutor(this.target);
executor.execute({
type: "custom",
custom: SlideIn,
customParameters: {
direction: (null === (_a = this.params) || void 0 === _a ? void 0 : _a.slideDirection) || "right",
distance: (null === (_b = this.params) || void 0 === _b ? void 0 : _b.slideDistance) || 50,
fromOpacity: null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromOpacity) && void 0 !== _d ? _d : 0
},
duration: this.slideInDuration,
easing: this.easing
}), executor.execute({
type: "custom",
custom: GrowIn,
customParameters: {
fromScale: (null === (_e = this.params) || void 0 === _e ? void 0 : _e.fromScale) || .5,
direction: (null === (_f = this.params) || void 0 === _f ? void 0 : _f.scaleDirection) || "xy",
fromOpacity: 1
},
duration: this.growInDuration,
easing: this.easing,
delay: this.slideInDuration
});
}
onUpdate(end, ratio, out) {}
}
export class MoveRotateIn extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
var _a;
super(from, to, duration, easing, params);
const slideRatio = null !== (_a = null == params ? void 0 : params.slideRatio) && void 0 !== _a ? _a : .5;
this.slideInDuration = duration * slideRatio, this.spinInDuration = duration * (1 - slideRatio);
}
onBind() {
var _a, _b, _c, _d, _e, _f;
super.onBind();
const executor = new AnimateExecutor(this.target);
executor.execute({
type: "custom",
custom: SlideIn,
customParameters: {
direction: (null === (_a = this.params) || void 0 === _a ? void 0 : _a.slideDirection) || "right",
distance: (null === (_b = this.params) || void 0 === _b ? void 0 : _b.slideDistance) || 50,
fromOpacity: null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromOpacity) && void 0 !== _d ? _d : 0
},
duration: this.slideInDuration,
easing: this.easing
}), executor.execute({
type: "custom",
custom: SpinIn,
customParameters: {
fromAngle: (null === (_e = this.params) || void 0 === _e ? void 0 : _e.fromAngle) || Math.PI,
fromScale: (null === (_f = this.params) || void 0 === _f ? void 0 : _f.fromScale) || .5,
fromOpacity: 1
},
duration: this.spinInDuration,
easing: this.easing,
delay: this.slideInDuration
});
}
onUpdate(end, ratio, out) {}
}
export class SlideOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onFirstRun() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
const attrs = this.target.getAttributes(), direction = (null === (_a = this.params) || void 0 === _a ? void 0 : _a.direction) || "right", distance = (null === (_b = this.params) || void 0 === _b ? void 0 : _b.distance) || 50, fromOpacity = null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromOpacity) && void 0 !== _d ? _d : 1, toOpacity = null !== (_f = null === (_e = this.params) || void 0 === _e ? void 0 : _e.toOpacity) && void 0 !== _f ? _f : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity
}, to = {
opacity: toOpacity,
baseOpacity: toOpacity
};
"top" === direction ? (from.y = null !== (_g = attrs.y) && void 0 !== _g ? _g : 0,
to.y = (null !== (_h = attrs.y) && void 0 !== _h ? _h : 0) - distance, this.propKeys = [ "opacity", "baseOpacity", "y" ]) : "bottom" === direction ? (from.y = null !== (_j = attrs.y) && void 0 !== _j ? _j : 0,
to.y = (null !== (_k = attrs.y) && void 0 !== _k ? _k : 0) + distance, this.propKeys = [ "opacity", "baseOpacity", "y" ]) : "left" === direction ? (from.x = null !== (_l = attrs.x) && void 0 !== _l ? _l : 0,
to.x = (null !== (_m = attrs.x) && void 0 !== _m ? _m : 0) - distance, this.propKeys = [ "opacity", "baseOpacity", "x" ]) : (from.x = null !== (_o = attrs.x) && void 0 !== _o ? _o : 0,
to.x = (null !== (_p = attrs.x) && void 0 !== _p ? _p : 0) + distance, this.propKeys = [ "opacity", "baseOpacity", "x" ]),
this.from = from, this.to = to, this.props = to;
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class GrowOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onFirstRun() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
const attrs = this.target.getAttributes(), toScale = null !== (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromScale) && void 0 !== _b ? _b : 0, direction = (null === (_c = this.params) || void 0 === _c ? void 0 : _c.direction) || "xy", fromOpacity = null !== (_e = null === (_d = this.params) || void 0 === _d ? void 0 : _d.fromOpacity) && void 0 !== _e ? _e : 1, toOpacity = null !== (_g = null === (_f = this.params) || void 0 === _f ? void 0 : _f.toOpacity) && void 0 !== _g ? _g : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity
}, to = {
opacity: toOpacity,
baseOpacity: toOpacity
};
this.propKeys = [ "opacity", "baseOpacity" ], "x" !== direction && "xy" !== direction || (from.scaleX = null !== (_h = attrs.scaleX) && void 0 !== _h ? _h : 1,
to.scaleX = toScale, this.propKeys.push("scaleX")), "y" !== direction && "xy" !== direction || (from.scaleY = null !== (_j = attrs.scaleY) && void 0 !== _j ? _j : 1,
to.scaleY = toScale, this.propKeys.push("scaleY")), this.from = from, this.to = to,
this.props = to;
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class SpinOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params);
}
onFirstRun() {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
const attrs = this.target.getAttributes(), toAngle = null !== (_b = null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromAngle) && void 0 !== _b ? _b : 2 * Math.PI, toScale = null !== (_d = null === (_c = this.params) || void 0 === _c ? void 0 : _c.fromScale) && void 0 !== _d ? _d : 0, fromOpacity = null !== (_f = null === (_e = this.params) || void 0 === _e ? void 0 : _e.fromOpacity) && void 0 !== _f ? _f : 1, toOpacity = null !== (_h = null === (_g = this.params) || void 0 === _g ? void 0 : _g.toOpacity) && void 0 !== _h ? _h : 0, from = {
opacity: fromOpacity,
baseOpacity: fromOpacity,
angle: null !== (_j = attrs.angle) && void 0 !== _j ? _j : 0,
scaleX: null !== (_k = attrs.scaleX) && void 0 !== _k ? _k : 1,
scaleY: null !== (_l = attrs.scaleY) && void 0 !== _l ? _l : 1
}, to = {
opacity: toOpacity,
baseOpacity: toOpacity,
angle: toAngle,
scaleX: toScale,
scaleY: toScale
};
this.propKeys = [ "opacity", "baseOpacity", "angle", "scaleX", "scaleY" ], this.from = from,
this.to = to, this.props = to;
}
onUpdate(end, ratio, out) {
applyStoryFrame(this.target, buildInterpolatedAttrs(this.propKeys, this.from, this.to, ratio));
}
}
export class MoveScaleOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
var _a;
super(from, to, duration, easing, params);
const slideRatio = null !== (_a = null == params ? void 0 : params.slideRatio) && void 0 !== _a ? _a : .5;
this.growOutDuration = duration * (1 - slideRatio), this.slideOutDuration = duration * slideRatio;
}
onFirstRun() {
var _a, _b, _c, _d;
const executor = new AnimateExecutor(this.target);
executor.execute({
type: "custom",
custom: GrowOut,
customParameters: {
fromScale: (null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromScale) || .5,
direction: (null === (_b = this.params) || void 0 === _b ? void 0 : _b.scaleDirection) || "xy",
fromOpacity: 1,
toOpacity: 1
},
duration: this.growOutDuration,
easing: this.easing
}), executor.execute({
type: "custom",
custom: SlideOut,
customParameters: {
direction: (null === (_c = this.params) || void 0 === _c ? void 0 : _c.slideDirection) || "right",
distance: (null === (_d = this.params) || void 0 === _d ? void 0 : _d.slideDistance) || 50,
fromOpacity: 1
},
duration: this.slideOutDuration,
easing: this.easing,
delay: this.growOutDuration
});
}
onUpdate(end, ratio, out) {}
}
export class MoveRotateOut extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
var _a;
super(from, to, duration, easing, params);
const slideRatio = null !== (_a = null == params ? void 0 : params.slideRatio) && void 0 !== _a ? _a : .5;
this.spinOutDuration = duration * (1 - slideRatio), this.slideOutDuration = duration * slideRatio;
}
onFirstRun() {
var _a, _b, _c, _d;
const executor = new AnimateExecutor(this.target);
executor.execute({
type: "custom",
custom: SpinOut,
customParameters: {
fromAngle: (null === (_a = this.params) || void 0 === _a ? void 0 : _a.fromAngle) || Math.PI,
fromScale: (null === (_b = this.params) || void 0 === _b ? void 0 : _b.fromScale) || .5,
fromOpacity: 1,
toOpacity: 1
},
duration: this.spinOutDuration,
easing: this.easing
}), executor.execute({
type: "custom",
custom: SlideOut,
customParameters: {
direction: (null === (_c = this.params) || void 0 === _c ? void 0 : _c.slideDirection) || "right",
distance: (null === (_d = this.params) || void 0 === _d ? void 0 : _d.slideDistance) || 50,
fromOpacity: 1
},
duration: this.slideOutDuration,
easing: this.easing,
delay: this.spinOutDuration
});
}
onUpdate(end, ratio, out) {}
}
export class PulseAnimate extends ACustomAnimate {
constructor(from, to, duration, easing, params) {
super(from, to, duration, easing, params), this.originalAttributes = {}, this.pulseCount = 3,
this.pulseOpacity = .3, this.pulseScale = 1.05, this.pulseColor = null, this.pulseColorIntensity = .2,
this.strokeOnly = !1, this.fillOnly = !1, this.useScale = !0, this.useOpacity = !0,
this.useStroke = !0, this.useFill = !0, this.useColor = !1, this.originalFill = null,
this.originalStroke = null, void 0 !== (null == params ? void 0 : params.pulseCount) && (this.pulseCount = params.pulseCount),
void 0 !== (null == params ? void 0 : params.pulseScale) && (this.pulseScale = params.pulseScale),
void 0 !== (null == params ? void 0 : params.pulseColor) && (this.pulseColor = params.pulseColor),
void 0 !== (null == params ? void 0 : params.pulseColorIntensity) && (this.pulseColorIntensity = params.pulseColorIntensity),
void 0 !== (null == params ? void 0 : params.strokeOnly) && (this.strokeOnly = params.strokeOnly),
void 0 !== (null == params ? void 0 : params.fillOnly) && (this.fillOnly = params.fillOnly),
void 0 !== (null == params ? void 0 : params.useScale) && (this.useScale = params.useScale),
void 0 !== (null == params ? void 0 : params.useOpacity) && (this.useOpacity = params.useOpacity),
void 0 !== (null == params ? void 0 : params.useStroke) && (this.useStroke = params.useStroke),
void 0 !== (null == params ? void 0 : params.useFill) && (this.useFill = params.useFill),
void 0 !== (null == params ? void 0 : params.useColor) && (this.useColor = params.useColor);
}
onBind() {
super.onBind(), this.originalAttributes = Object.assign({}, this.target.getAttributes()),
this.useColor && (this.originalFill = this.originalAttributes.fill || null, this.originalStroke = this.originalAttributes.stroke || null,
this.pulseColor || (this.fillOnly && this.originalFill ? this.pulseColor = this.originalFill : this.strokeOnly && this.originalStroke ? this.pulseColor = this.originalStroke : this.originalFill ? this.pulseColor = this.originalFill : this.originalStroke ? this.pulseColor = this.originalStroke : this.pulseColor = "#FFFFFF"));
}
onUpdate(end, ratio, out) {
const angle = ratio * Math.PI * this.pulseCount, pulseValue = Math.abs(Math.sin(angle)), attrs = {};
if (this.useOpacity) {
const opacity = 1 + (this.pulseOpacity - 1) * pulseValue;
this.useStroke && (attrs.strokeOpacity = (this.originalAttributes.strokeOpacity || 1) * opacity),
this.useFill && (attrs.fillOpacity = (this.originalAttributes.fillOpacity || 1) * opacity);
}
if (this.useScale) {
const scale = 1 + (this.pulseScale - 1) * pulseValue;
attrs.scaleX = (this.originalAttributes.scaleX || 1) * scale, attrs.scaleY = (this.originalAttributes.scaleY || 1) * scale;
}
this.useColor && this.pulseColor && this.applyColorPulse(attrs, pulseValue), applyAnimationFrameAttributes(this.target, attrs),
this.target.addUpdateShapeAndBoundsTag(), this.target.addUpdatePositionTag();
}
applyColorPulse(attrs, pulseValue) {
const colorRatio = this.pulseColorIntensity * pulseValue;
this.useFill && this.originalFill && this.pulseColor && (attrs.fill = interpolateColor(this.originalFill, this.pulseColor, colorRatio, !0)),
this.useStroke && this.originalStroke && this.pulseColor && (attrs.stroke = interpolateColor(this.originalStroke, this.pulseColor, colorRatio, !0));
}
onEnd() {
super.onEnd(), this.target.setAttributes(this.originalAttributes);
}
}
//# sourceMappingURL=story.js.map