@visactor/vrender-core 0.22.13 → 0.22.15-alpha.1

package/cjs/graphic/graphic.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
     value: !0
 }), exports.Graphic = exports.NOWORK_ANIMATE_ATTR = exports.GRAPHIC_UPDATE_TAG_KEY = exports.PURE_STYLE_KEY = void 0;
 
-const vutils_1 = require("@visactor/vutils"), vutils_2 = require("@visactor/vutils"), node_tree_1 = require("./node-tree"), event_1 = require("../event"), config_1 = require("./config"), application_1 = require("../application"), animate_1 = require("../animate"), interpolate_1 = require("../color-string/interpolate"), custom_path2d_1 = require("../common/custom-path2d"), loader_1 = require("../resource-loader/loader"), enums_1 = require("../common/enums"), bounds_context_1 = require("../common/bounds-context"), render_command_list_1 = require("../common/render-command-list"), utils_1 = require("../common/utils"), builtin_symbol_1 = require("./builtin-symbol"), xml_1 = require("../common/xml"), constants_1 = require("./constants"), _tempBounds = new vutils_2.AABBBounds, tempMatrix = new vutils_2.Matrix, tempBounds = new vutils_2.AABBBounds;
+const vutils_1 = require("@visactor/vutils"), vutils_2 = require("@visactor/vutils"), node_tree_1 = require("./node-tree"), event_1 = require("../event"), config_1 = require("./config"), application_1 = require("../application"), custom_path2d_1 = require("../common/custom-path2d"), loader_1 = require("../resource-loader/loader"), enums_1 = require("../common/enums"), bounds_context_1 = require("../common/bounds-context"), render_command_list_1 = require("../common/render-command-list"), utils_1 = require("../common/utils"), builtin_symbol_1 = require("./builtin-symbol"), xml_1 = require("../common/xml"), constants_1 = require("./constants"), config_2 = require("../animate/config"), canvas_1 = require("../canvas"), _tempBounds = new vutils_2.AABBBounds, tempMatrix = new vutils_2.Matrix, tempBounds = new vutils_2.AABBBounds;
 
 exports.PURE_STYLE_KEY = [ "stroke", "opacity", "strokeOpacity", "lineDash", "lineDashOffset", "lineCap", "lineJoin", "miterLimit", "fill", "fillOpacity" ], 
 exports.GRAPHIC_UPDATE_TAG_KEY = [ "lineWidth", "scaleX", "scaleY", "angle", "anchor", "visible" ];
@@ -71,6 +71,13 @@ class Graphic extends node_tree_1.Node {
         this.attribute = params, this.valid = this.isValid(), this.updateAABBBoundsStamp = 0, 
         params.background ? this.loadImage(null !== (_a = params.background.background) && void 0 !== _a ? _a : params.background, !0) : params.shadowGraphic && this.setShadowGraphic(params.shadowGraphic);
     }
+    getGraphicService() {
+        var _a, _b;
+        return null !== (_b = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.graphicService) && void 0 !== _b ? _b : application_1.application.graphicService;
+    }
+    getAttributes() {
+        return this.attribute;
+    }
     setMode(mode) {
         "3d" === mode ? this.set3dMode() : this.set2dMode();
     }
@@ -96,9 +103,9 @@ class Graphic extends node_tree_1.Node {
         const full = "imprecise" === this.attribute.boundsMode;
         if (!this.shouldUpdateAABBBounds()) return this._AABBBounds;
         if (!this.valid) return this._AABBBounds.clear(), this._AABBBounds;
-        application_1.application.graphicService.beforeUpdateAABBBounds(this, this.stage, !0, this._AABBBounds);
+        this.getGraphicService().beforeUpdateAABBBounds(this, this.stage, !0, this._AABBBounds);
         const bounds = this.doUpdateAABBBounds(full);
-        return application_1.application.graphicService.afterUpdateAABBBounds(this, this.stage, this._AABBBounds, this, !0), 
+        return this.getGraphicService().afterUpdateAABBBounds(this, this.stage, this._AABBBounds, this, !0), 
         "empty" === this.attribute.boundsMode && bounds.clear(), bounds;
     }
     tryUpdateOBBBounds() {
@@ -198,7 +205,7 @@ class Graphic extends node_tree_1.Node {
         clearTag && this.clearUpdateLocalPositionTag()), this._transMatrix;
     }
     shouldUpdateAABBBounds() {
-        return this.shadowRoot ? (!!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS) || this.shadowRoot.shouldUpdateAABBBounds()) && application_1.application.graphicService.validCheck(this.attribute, this.getGraphicTheme(), this._AABBBounds, this) : !!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS) && application_1.application.graphicService.validCheck(this.attribute, this.getGraphicTheme(), this._AABBBounds, this);
+        return this.shadowRoot ? (!!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS) || this.shadowRoot.shouldUpdateAABBBounds()) && this.getGraphicService().validCheck(this.attribute, this.getGraphicTheme(), this._AABBBounds, this) : !!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS) && this.getGraphicService().validCheck(this.attribute, this.getGraphicTheme(), this._AABBBounds, this);
     }
     shouldSelfChangeUpdateAABBBounds() {
         return this.shadowRoot ? !!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS) || this.shadowRoot.shouldUpdateAABBBounds() : !!(this._updateTag & enums_1.UpdateTag.UPDATE_BOUNDS);
@@ -235,6 +242,13 @@ class Graphic extends node_tree_1.Node {
     setWidthHeightWithoutTransform(aabbBounds) {
         this.widthWithoutTransform = aabbBounds.x2 - aabbBounds.x1, this.heightWithoutTransform = aabbBounds.y2 - aabbBounds.y1;
     }
+    setAttributesAndPreventAnimate(params, forceUpdateTag = !1, context) {
+        this.setAttributes(params, forceUpdateTag, context), this.animates && this.animates.forEach((animate => {
+            Object.keys(params).forEach((key => {
+                animate.preventAttr(key);
+            }));
+        }));
+    }
     setAttributes(params, forceUpdateTag = !1, context) {
         (params = this.onBeforeAttributeUpdate && this.onBeforeAttributeUpdate(params, this.attribute, null, context) || params).background ? this.loadImage(params.background, !0) : params.shadowGraphic && this.setShadowGraphic(params.shadowGraphic), 
         this._setAttributes(params, forceUpdateTag, context);
@@ -375,22 +389,8 @@ class Graphic extends node_tree_1.Node {
     skewTo(b, c) {
         return this;
     }
-    animate(params) {
-        var _a;
-        this.animates || (this.animates = new Map);
-        const animate = new animate_1.Animate(null == params ? void 0 : params.id, null !== (_a = null == params ? void 0 : params.timeline) && void 0 !== _a ? _a : this.stage && this.stage.getTimeline(), null == params ? void 0 : params.slience);
-        if (animate.bind(this), params) {
-            const {onStart: onStart, onFrame: onFrame, onEnd: onEnd, onRemove: onRemove} = params;
-            null != onStart && animate.onStart(onStart), null != onFrame && animate.onFrame(onFrame), 
-            null != onEnd && animate.onEnd(onEnd), null != onRemove && animate.onRemove(onRemove), 
-            animate.interpolateFunc = params.interpolate;
-        }
-        return this.animates.set(animate.id, animate), animate.onRemove((() => {
-            animate.stop(), this.animates.delete(animate.id);
-        })), animate;
-    }
     onAttributeUpdate(context) {
-        context && context.skipUpdateCallback || (application_1.application.graphicService.onAttributeUpdate(this), 
+        context && context.skipUpdateCallback || (this.getGraphicService().onAttributeUpdate(this), 
         this._emitCustomEvent("afterAttributeUpdate", context));
     }
     update(d) {
@@ -405,21 +405,29 @@ class Graphic extends node_tree_1.Node {
         return null === (_a = this.states) || void 0 === _a ? void 0 : _a[stateName];
     }
     applyStateAttrs(attrs, stateNames, hasAnimation, isClear) {
-        var _a, _b, _c, _d;
+        var _a, _b;
         if (hasAnimation) {
             const keys = Object.keys(attrs), noWorkAttrs = this.getNoWorkAnimateAttr(), animateAttrs = {};
             let noAnimateAttrs;
             keys.forEach((key => {
                 noWorkAttrs[key] ? (noAnimateAttrs || (noAnimateAttrs = {}), noAnimateAttrs[key] = attrs[key]) : animateAttrs[key] = isClear && void 0 === attrs[key] ? this.getDefaultAttribute(key) : attrs[key];
             }));
-            const animate = this.animate({
-                slience: !0
-            });
-            animate.stateNames = stateNames, animate.to(animateAttrs, null !== (_b = null === (_a = this.stateAnimateConfig) || void 0 === _a ? void 0 : _a.duration) && void 0 !== _b ? _b : animate_1.DefaultStateAnimateConfig.duration, null !== (_d = null === (_c = this.stateAnimateConfig) || void 0 === _c ? void 0 : _c.easing) && void 0 !== _d ? _d : animate_1.DefaultStateAnimateConfig.easing), 
-            noAnimateAttrs && this.setAttributes(noAnimateAttrs, !1, {
+            const stateAnimateConfig = null !== (_b = null !== (_a = this.context && this.context.stateAnimateConfig) && void 0 !== _a ? _a : this.stateAnimateConfig) && void 0 !== _b ? _b : config_2.DefaultStateAnimateConfig;
+            this.applyAnimationState([ "state" ], [ {
+                name: "state",
+                animation: {
+                    type: "state",
+                    to: animateAttrs,
+                    duration: stateAnimateConfig.duration,
+                    easing: stateAnimateConfig.easing
+                }
+            } ]), noAnimateAttrs && this.setAttributesAndPreventAnimate(noAnimateAttrs, !1, {
                 type: enums_1.AttributeUpdateType.STATE
             });
-        } else this.stopStateAnimates(), this.setAttributes(attrs, !1, {
+        } else this.stopStateAnimates(), this.setAttributesAndPreventAnimate(attrs, !1, {
+            type: enums_1.AttributeUpdateType.STATE
+        });
+        this._emitCustomEvent("afterStateUpdate", {
             type: enums_1.AttributeUpdateType.STATE
         });
     }
@@ -439,13 +447,9 @@ class Graphic extends node_tree_1.Node {
         }));
     }
     getNormalAttribute(key) {
-        let value = this.attribute[key];
-        return this.animates && this.animates.forEach((animate => {
-            if (animate.stateNames) {
-                const endProps = animate.getEndProps();
-                (0, vutils_2.has)(endProps, key) && (value = endProps[key]);
-            }
-        })), value;
+        var _a, _b;
+        const value = this.attribute[key];
+        return this.animates ? null === (_a = this.finalAttribute) || void 0 === _a ? void 0 : _a[key] : null != value ? value : null === (_b = this.finalAttribute) || void 0 === _b ? void 0 : _b[key];
     }
     clearStates(hasAnimation) {
         this.hasState() && this.normalAttrs ? (this.currentStates = [], this.applyStateAttrs(this.normalAttrs, this.currentStates, hasAnimation, !0)) : this.currentStates = [], 
@@ -569,10 +573,10 @@ class Graphic extends node_tree_1.Node {
             this.animates && this.animates.size) {
                 const timeline = stage.getTimeline();
                 this.animates.forEach((a => {
-                    a.timeline === animate_1.defaultTimeline && a.setTimeline(timeline);
+                    a.timeline.isGlobal && (a.setTimeline(timeline), timeline.addAnimate(a));
                 }));
             }
-            this._onSetStage && this._onSetStage(this, stage, layer), application_1.application.graphicService.onSetStage(this, stage);
+            this._onSetStage && this._onSetStage(this, stage, layer), this.getGraphicService().onSetStage(this, stage);
         }
     }
     setStageToShadowRoot(stage, layer) {
@@ -584,76 +588,6 @@ class Graphic extends node_tree_1.Node {
             type: enums_1.AttributeUpdateType.ANIMATE_END
         });
     }
-    onStep(subAnimate, animate, step, ratio, end) {
-        const nextAttributes = {};
-        if (step.customAnimate) step.customAnimate.update(end, ratio, nextAttributes); else {
-            const nextProps = step.props, nextParsedProps = step.parsedProps, propKeys = step.propKeys;
-            this.stepInterpolate(subAnimate, animate, nextAttributes, step, ratio, end, nextProps, void 0, nextParsedProps, propKeys);
-        }
-        this.setAttributes(nextAttributes, !1, {
-            type: enums_1.AttributeUpdateType.ANIMATE_UPDATE,
-            animationState: {
-                ratio: ratio,
-                end: end,
-                step: step,
-                isFirstFrameOfStep: subAnimate.getLastStep() !== step
-            }
-        }), this.stage && this.stage.renderNextFrame();
-    }
-    stepInterpolate(subAnimate, animate, nextAttributes, step, ratio, end, nextProps, lastProps, nextParsedProps, propKeys) {
-        propKeys || (propKeys = Object.keys(nextProps), step.propKeys = propKeys), end ? step.propKeys.forEach((key => {
-            animate.validAttr(key) && (nextAttributes[key] = nextProps[key]);
-        })) : propKeys.forEach((key => {
-            var _a;
-            if (!animate.validAttr(key)) return;
-            const nextStepVal = nextProps[key], lastStepVal = null !== (_a = lastProps && lastProps[key]) && void 0 !== _a ? _a : subAnimate.getLastPropByName(key, step);
-            if (null == nextStepVal || null == lastStepVal || nextStepVal === lastStepVal) return void (nextAttributes[key] = nextStepVal);
-            let match;
-            match = animate.interpolateFunc && animate.interpolateFunc(key, ratio, lastStepVal, nextStepVal, nextAttributes), 
-            match || (match = animate.customInterpolate(key, ratio, lastStepVal, nextStepVal, this, nextAttributes), 
-            match || this.defaultInterpolate(nextStepVal, lastStepVal, key, nextAttributes, nextParsedProps, ratio) || this._interpolate(key, ratio, lastStepVal, nextStepVal, nextAttributes));
-        })), step.parsedProps = nextParsedProps;
-    }
-    defaultInterpolate(nextStepVal, lastStepVal, key, nextAttributes, nextParsedProps, ratio) {
-        if (Number.isFinite(nextStepVal) && Number.isFinite(lastStepVal)) return nextAttributes[key] = lastStepVal + (nextStepVal - lastStepVal) * ratio, 
-        !0;
-        if ("fill" === key) {
-            nextParsedProps || (nextParsedProps = {});
-            const fillColorArray = nextParsedProps.fillColorArray, color = (0, interpolate_1.interpolateColor)(lastStepVal, null != fillColorArray ? fillColorArray : nextStepVal, ratio, !1, ((fArray, tArray) => {
-                nextParsedProps.fillColorArray = tArray;
-            }));
-            return color && (nextAttributes[key] = color), !0;
-        }
-        if ("stroke" === key) {
-            nextParsedProps || (nextParsedProps = {});
-            const strokeColorArray = nextParsedProps.strokeColorArray, color = (0, interpolate_1.interpolateColor)(lastStepVal, null != strokeColorArray ? strokeColorArray : nextStepVal, ratio, !1, ((fArray, tArray) => {
-                nextParsedProps.strokeColorArray = tArray;
-            }));
-            return color && (nextAttributes[key] = color), !0;
-        }
-        if ("shadowColor" === key) {
-            nextParsedProps || (nextParsedProps = {});
-            const shadowColorArray = nextParsedProps.shadowColorArray, color = (0, interpolate_1.interpolateColor)(lastStepVal, null != shadowColorArray ? shadowColorArray : nextStepVal, ratio, !0, ((fArray, tArray) => {
-                nextParsedProps.shadowColorArray = tArray;
-            }));
-            return color && (nextAttributes[key] = color), !0;
-        }
-        if (Array.isArray(nextStepVal) && nextStepVal.length === lastStepVal.length) {
-            const nextList = [];
-            let valid = !0;
-            for (let i = 0; i < nextStepVal.length; i++) {
-                const v = lastStepVal[i], val = v + (nextStepVal[i] - v) * ratio;
-                if (!Number.isFinite(val)) {
-                    valid = !1;
-                    break;
-                }
-                nextList.push(val);
-            }
-            valid && (nextAttributes[key] = nextList);
-        }
-        return !1;
-    }
-    _interpolate(key, ratio, lastStepVal, nextStepVal, nextAttributes) {}
     getDefaultAttribute(name) {
         return this.getGraphicTheme()[name];
     }
@@ -736,6 +670,15 @@ class Graphic extends node_tree_1.Node {
             this.dispatchEvent(changeEvent);
         }
     }
+    toCustomPath() {
+        var _a, _b, _c;
+        const renderer = null === (_c = null === (_b = (null === (_a = this.stage) || void 0 === _a ? void 0 : _a.renderService) || application_1.application.renderService) || void 0 === _b ? void 0 : _b.drawContribution) || void 0 === _c ? void 0 : _c.getRenderContribution(this);
+        if (renderer) {
+            const context = new canvas_1.EmptyContext2d(null, 1);
+            return renderer.drawShape(this, context, 0, 0, {}, {}), context.path;
+        }
+        return null;
+    }
 }
 
 function backgroundNotImage(image) {