@gedit/editor-2d 0.1.114 → 0.2.0

package/lib/browser/model/editor2d-document.js

@@ -1,30 +1,4 @@
 "use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -37,168 +11,143 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 var __param = (this && this.__param) || function (paramIndex, decorator) {
     return function (target, key) { decorator(target, key, paramIndex); }
 };
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-var __values = (this && this.__values) || function(o) {
-    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
-    if (m) return m.call(o);
-    if (o && typeof o.length === "number") return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
-    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Editor2dDocument = void 0;
-var inversify_1 = require("inversify");
-var utils_1 = require("@gedit/utils");
-var editor2d_1 = require("./editor2d");
-var render_engine_1 = require("@gedit/render-engine");
-var render_engine_ide_1 = require("@gedit/render-engine-ide");
-var tree_1 = require("@gedit/tree");
-var browser_1 = require("@gedit/resource/lib/browser");
-var connection_1 = require("@gedit/connection");
-var workspace_2d_1 = require("@gedit/workspace-2d");
-var resource_1 = require("@gedit/resource");
-var app_config_1 = require("@gedit/app-config");
-var editor2d_iterator_1 = require("./editor2d-iterator");
-var utils_2 = require("./utils");
-var versionId = 0;
-var Editor2dDocument = /** @class */ (function (_super) {
-    __extends(Editor2dDocument, _super);
-    function Editor2dDocument(message, options, resourceProivder, resourceAutoSaveService, resourceService, engineService, appConfig) {
-        var _this = _super.call(this) || this;
-        _this.message = message;
-        _this.options = options;
-        _this.resourceProivder = resourceProivder;
-        _this.resourceAutoSaveService = resourceAutoSaveService;
-        _this.resourceService = resourceService;
-        _this.engineService = engineService;
-        _this.appConfig = appConfig;
-        _this.onContentChangedEmitter = new utils_1.Emitter();
-        _this.onSavedEmitter = new utils_1.Emitter();
-        _this.onContentChanged = _this.onContentChangedEmitter.event;
-        _this.onSaved = _this.onSavedEmitter.event;
-        _this.animationStarted = false;
-        _this.animationIds = []; // 当前正在录制的动画节点
-        _this._localVersion = 0;
-        _this._saveVersion = 0;
-        _this.errors = [];
-        _this.componentContents = {};
-        _this._snaplines = [];
-        _this.loading = true;
-        _this.fireContentChanged = function (nodes, type, noSave, noFiredChanged) {
+exports.Editor2dDocument = exports.Editor2dComponentProvider = exports.maskEnabledArray = exports.maskShowArray = void 0;
+const inversify_1 = require("inversify");
+const utils_1 = require("@gedit/utils");
+const editor2d_1 = require("./editor2d");
+const render_engine_1 = require("@gedit/render-engine");
+const render_engine_ide_1 = require("@gedit/render-engine-ide");
+const tree_1 = require("@gedit/tree");
+const browser_1 = require("@gedit/resource/lib/browser");
+const connection_1 = require("@gedit/connection");
+const workspace_2d_1 = require("@gedit/workspace-2d");
+const resource_1 = require("@gedit/resource");
+const app_config_1 = require("@gedit/app-config");
+const editor2d_iterator_1 = require("./editor2d-iterator");
+// import { getAnimationKeys, getChangeAnimationData } from './utils';
+exports.maskShowArray = [
+    render_engine_1.GameObjectBaseType.IMAGE,
+    render_engine_1.GameObjectBaseType.RECTANGLE,
+    render_engine_1.GameObjectBaseType.PATH,
+    render_engine_1.GameObjectBaseType.CIRCLE,
+    render_engine_1.GameObjectBaseType.POLYGON,
+    render_engine_1.GameObjectBaseType.TEXT,
+    render_engine_1.GameObjectBaseType.TRIANGLE,
+];
+exports.maskEnabledArray = [
+    render_engine_1.GameObjectBaseType.GROUP,
+    render_engine_1.GameObjectBaseType.PARTICLES,
+];
+let versionId = 0;
+exports.Editor2dComponentProvider = Symbol('Editor2dComponentProvider');
+let Editor2dDocument = class Editor2dDocument extends tree_1.TreeImpl {
+    constructor(message, options, resourceProvider, resourceAutoSaveService, resourceService, engineService, appConfig, componentProvider) {
+        super();
+        this.message = message;
+        this.options = options;
+        this.resourceProvider = resourceProvider;
+        this.resourceAutoSaveService = resourceAutoSaveService;
+        this.resourceService = resourceService;
+        this.engineService = engineService;
+        this.appConfig = appConfig;
+        this.componentProvider = componentProvider;
+        this.onContentChangedEmitter = new utils_1.Emitter();
+        this.onSavedEmitter = new utils_1.Emitter();
+        this.onContentChanged = this.onContentChangedEmitter.event;
+        this.onSaved = this.onSavedEmitter.event;
+        this.animationStarted = false;
+        this.animationIds = []; // 当前正在录制的动画节点
+        this._localVersion = 0;
+        this._saveVersion = 0;
+        this.errors = [];
+        // protected componentContents: { [key: string]: Editor2dNode } = {};
+        this._snaplines = [];
+        this.loading = true;
+        this.fireContentChanged = (nodes, type, noSave, noFiredChanged) => {
             // TODO 这里修改目前还是全量的，需要优化
-            var contents = nodes.map(function (n) { return ({ text: 'treeNode' }); });
-            _this._localVersion = ++versionId;
+            const contents = nodes.map(n => ({ text: 'treeNode' }));
+            this._localVersion = ++versionId;
             if (!noFiredChanged) {
-                _this.onContentChangedEmitter.fire({ document: _this, contentChanges: contents, nodes: nodes, type: type });
+                this.onContentChangedEmitter.fire({ document: this, contentChanges: contents, nodes, type });
             }
-            if (!_this.loading && !noSave) {
-                _this._saveVersion++;
-                if (_this._saveVersion === Number.MAX_VALUE) {
-                    _this._saveVersion = 0;
+            if (!this.loading && !noSave) {
+                this._saveVersion++;
+                if (this._saveVersion === Number.MAX_VALUE) {
+                    this._saveVersion = 0;
                 }
-                _this.onSavedEmitter.fire({ document: _this, contentChanges: contents, nodes: nodes, type: type });
+                this.onSavedEmitter.fire({ document: this, contentChanges: contents, nodes, type });
             }
         };
-        _this.refreshingNodes = new WeakMap();
-        _this.toDispose.push(_this.onContentChangedEmitter);
-        _this.toDispose.push(_this.onSavedEmitter);
+        this.refreshingNodes = new WeakMap();
+        this.toDispose.push(this.onContentChangedEmitter);
+        this.toDispose.push(this.onSavedEmitter);
         // this.toDispose.
         // this.toDispose.push(this.resourceAutoSaveService);
-        _this.toDispose.push(_this.resourceAutoSaveService.onSyncContent(function (content) { return _this.reloadContent(content || ''); }));
-        _this.toDispose.push(_this.onSaved(function (event) { return _this.resourceAutoSaveService.fireDidChangeContent(event); }));
+        this.toDispose.push(this.resourceAutoSaveService.onSyncContent(content => this.reloadContent(content || '')));
+        this.toDispose.push(this.onSaved(event => this.resourceAutoSaveService.fireDidChangeContent(event)));
+        // 组件数据加载
+        if (this.componentProvider) {
+            this.toDispose.push(this.componentProvider.onLoad(() => {
+                this.fireContentChanged([], 'update', true);
+            }));
+            // 组件数据更新
+            this.toDispose.push(this.componentProvider.onComponentChanged((0, utils_1.debounce)((compUri) => {
+                if (this.uri === compUri.toString()) {
+                    return;
+                }
+                if (this.hasIncludesComponent(compUri)) {
+                    this.fireContentChanged([], 'update', true);
+                }
+            }, 1000)));
+        }
         // TODO
         // this.toDispose.push(this.resourceService.onRefsChange(async () => {
         // await this.loadRefInfos();
         // }));
         // 同步数据
-        _this.resourceAutoSaveService.sync();
-        return _this;
-    }
-    Object.defineProperty(Editor2dDocument.prototype, "uri", {
-        get: function () {
-            return this.options.autoSaveService.resource.uri.toString();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Editor2dDocument.prototype, "engineName", {
-        get: function () {
-            return this.appConfig.engineName;
-        },
-        enumerable: false,
-        configurable: true
-    });
+        this.resourceAutoSaveService.sync();
+    }
+    get uri() {
+        return this.options.autoSaveService.resource.uri.toString();
+    }
+    get engineName() {
+        return this.appConfig.engineName;
+    }
+    hasIncludesComponent(compUri) {
+        var _a;
+        if (!this.root)
+            return false;
+        for (const node of new editor2d_iterator_1.Editor2dIterator(this.root)) {
+            if (node !== this.root
+                && node.displayType === render_engine_1.GameObjectBaseType.COMPONENT
+                && new utils_1.URI((_a = node.component) === null || _a === void 0 ? void 0 : _a.id).displayName === compUri.displayName) {
+                return true;
+            }
+        }
+        return false;
+    }
     /**
      * 切换资源, 只有模板编辑器需要用到
      */
-    Editor2dDocument.prototype.changeResource = function (uri) {
-        return __awaiter(this, void 0, void 0, function () {
-            var uriObj, resource;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        uriObj = new utils_1.URI(uri);
-                        return [4 /*yield*/, this.resourceProivder(uriObj)];
-                    case 1:
-                        resource = _a.sent();
-                        this.resourceAutoSaveService.changeResource(resource);
-                        this.resourceAutoSaveService.sync();
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    /**
-     * 获取依赖的组件的内容
-     * @param compPath
-     * @param parentNode
-     */
-    Editor2dDocument.prototype.getComponentContent = function (compPath, parentNode) {
-        var comp = this.componentContents[compPath];
-        if (comp && comp.children)
-            return comp.children.map(function (c) { return (__assign(__assign({}, c), { parent: parentNode })); });
-    };
-    Editor2dDocument.prototype.createDisplayNode = function (displayType, parent, position, index, data) {
-        var parentNode;
+    async changeResource(uri) {
+        const uriObj = new utils_1.URI(uri);
+        const resource = await this.resourceProvider(uriObj);
+        this.resourceAutoSaveService.changeResource(resource);
+        this.resourceAutoSaveService.sync();
+    }
+    // /**
+    //  * 获取依赖的组件的内容
+    //  * @param compPath
+    //  * @param parentNode
+    //  */
+    getComponentContent(compPath, parentNode) {
+        if (!this.componentProvider)
+            return undefined;
+        return this.componentProvider.getComponentContent(compPath, parentNode);
+    }
+    createDisplayNode(displayType, parent, position, index, data) {
+        let parentNode;
         if (!parent || editor2d_1.Editor2dNode.isRootNode(parent)) {
             parentNode = this.getNode(editor2d_1.Editor2dNode.ROOT_NODE_ID);
         }
@@ -206,10 +155,10 @@ var Editor2dDocument = /** @class */ (function (_super) {
             parentNode = editor2d_1.Editor2dNode.toContainerNode(parent);
         }
         // const lastChild = parentNode.children.slice().reverse().find(c => c.position !== undefined);
-        var attrs = this.engineService.getDisplayDefaultData(this.engineName, displayType);
+        const attrs = this.engineService.getDisplayDefaultData(this.engineName, displayType);
         if (attrs.position) {
             if (!position) {
-                var pos = 100 + Math.round(Math.random() * 100);
+                const pos = 100 + Math.round(Math.random() * 100);
                 position = (displayType !== render_engine_1.GameObjectBaseType.GROUP && displayType !== render_engine_1.GameObjectBaseType.COMPONENT) ? { x: pos, y: pos } : { x: 0, y: 0 };
             }
             attrs.position.x = position.x;
@@ -222,23 +171,23 @@ var Editor2dDocument = /** @class */ (function (_super) {
             //   // attrs.position.y = lastChild.position!.y + 20;
             // }
         }
-        var name = this.getUniqueName(parentNode.children || [], (data === null || data === void 0 ? void 0 : data.name) || this.engineService.getGameObjectIDERegister(this.engineName, displayType).decoration.name);
-        var node = editor2d_1.Editor2dNode.createNode(__assign(__assign(__assign({}, attrs), data), { name: name }), displayType, undefined, Object.keys(this.nodes));
+        const name = this.getUniqueName(parentNode.children || [], (data === null || data === void 0 ? void 0 : data.name) || this.engineService.getGameObjectIDERegister(this.engineName, displayType).decoration.name);
+        const node = editor2d_1.Editor2dNode.createNode(Object.assign(Object.assign(Object.assign({}, attrs), data), { name }), displayType, undefined, Object.keys(this.nodes));
         this.addChildren(node, parentNode, index === undefined ? 0 : index);
         return node;
-    };
-    Editor2dDocument.prototype.copyNode = function (targetNode) {
+    }
+    copyNode(targetNode) {
         if (!targetNode || editor2d_1.Editor2dNode.isRootNode(targetNode))
             return;
-        var parent = targetNode.parent;
+        const parent = targetNode.parent;
         if (!this.canbeAddAsChild(parent, targetNode.displayType))
             return;
-        var children = parent.children;
-        var index = children.findIndex(function (value) { return value.id === targetNode.id; });
+        const children = parent.children;
+        const index = children.findIndex(value => value.id === targetNode.id);
         return this.copyToParentNode(parent, targetNode, index + 1);
-    };
-    Editor2dDocument.prototype.copyToParentNode = function (parentNode, nodeData, index, position) {
-        var parent = undefined;
+    }
+    copyToParentNode(parentNode, nodeData, index, position) {
+        let parent = undefined;
         if (this.canbeAddAsChild(parentNode, nodeData.displayType)) {
             parent = parentNode;
         }
@@ -246,14 +195,14 @@ var Editor2dDocument = /** @class */ (function (_super) {
             parent = parentNode.parent;
         }
         if (parent) {
-            var newNode = editor2d_1.Editor2dNode.clone(nodeData, [], Object.keys(this.nodes));
+            const newNode = editor2d_1.Editor2dNode.clone(nodeData, [], Object.keys(this.nodes));
             if (newNode.position) {
                 newNode.position.x = position ? position.x : newNode.position.x + 20;
                 newNode.position.y = position ? position.y : newNode.position.y + 20;
             }
             if (index === undefined) {
                 if (parent === parentNode.parent) {
-                    index = parent.children.findIndex(function (value) { return value.id === parentNode.id; });
+                    index = parent.children.findIndex(value => value.id === parentNode.id);
                     if (index < 0) {
                         index = 0;
                     }
@@ -262,9 +211,9 @@ var Editor2dDocument = /** @class */ (function (_super) {
                     index = 0;
                 }
             }
-            var name_1 = this.getUniqueName((parent.children || []), nodeData.name);
-            Object.assign(newNode, { name: name_1 });
-            var children = parent.children;
+            const name = this.getUniqueName((parent.children || []), nodeData.name);
+            Object.assign(newNode, { name });
+            let children = parent.children;
             if (!children) {
                 children = parent.children = [];
                 parent.expanded = true;
@@ -276,11 +225,11 @@ var Editor2dDocument = /** @class */ (function (_super) {
             this.fireContentChanged([newNode], 'add');
             return newNode;
         }
-    };
-    Editor2dDocument.prototype.delNode = function (targetNode, silent) {
+    }
+    delNode(targetNode, silent) {
         if (!targetNode || editor2d_1.Editor2dNode.isRootNode(targetNode))
             return;
-        var parent = targetNode.parent;
+        const parent = targetNode.parent;
         this.removeNode(targetNode);
         tree_1.CompositeTreeNode.removeChild(parent, targetNode);
         if (!editor2d_1.Editor2dNode.isRootNode(parent) && parent.children.length === 0) {
@@ -290,25 +239,20 @@ var Editor2dDocument = /** @class */ (function (_super) {
         if (!silent) {
             this.fireContentChanged([targetNode], 'delete');
         }
-    };
-    Editor2dDocument.prototype.delNodes = function () {
-        var _this = this;
-        var targetNodes = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            targetNodes[_i] = arguments[_i];
-        }
-        targetNodes.forEach(function (node) { return _this.delNode(node, true); });
+    }
+    delNodes(...targetNodes) {
+        targetNodes.forEach(node => this.delNode(node, true));
         if (targetNodes.length > 0) {
             this.fireContentChanged(targetNodes, 'delete');
         }
-    };
-    Editor2dDocument.prototype.rename = function (targetNode, name) {
+    }
+    rename(targetNode, name) {
         if (!name || !targetNode || editor2d_1.Editor2dNode.isRootNode(targetNode))
             return;
-        this.updateNode(targetNode, { name: name });
-    };
-    Editor2dDocument.prototype.addChildren = function (node, parentNode, index) {
-        if (index === void 0) { index = 0; }
+        this.updateNode(targetNode, { name });
+    }
+    addChildren(node, parentNode, index = 0) {
+        this.clearMask(node);
         if (node.parent) {
             this.delNode(node, true);
         }
@@ -318,23 +262,21 @@ var Editor2dDocument = /** @class */ (function (_super) {
         parentNode.children.splice(index, 0, node);
         tree_1.CompositeTreeNode.setParent(node, index, parentNode);
         parentNode.expanded = true;
+        this.nextMaskToNode(node);
         this.refresh(parentNode);
         this.fireContentChanged([node], node.parent ? 'update' : 'add');
-    };
+    }
     /**
      * 打开节点
      */
-    Editor2dDocument.prototype.expandNode = function (node, expanded) {
-        if (expanded === void 0) { expanded = true; }
+    expandNode(node, expanded = true) {
         if (tree_1.CompositeTreeNode.is(node)) {
             node.expanded = expanded;
             this.refresh(node);
         }
-    };
-    Editor2dDocument.prototype.updateNode = function (node, data, forceUpdate, noSave, noFiredChanged) {
-        if (data === void 0) { data = {}; }
-        if (forceUpdate === void 0) { forceUpdate = false; }
-        var treeNode = typeof node === 'string' ? this.nodes[node] : this.nodes[node.id];
+    }
+    updateNode(node, data = {}, forceUpdate = false, noSave, noFiredChanged) {
+        const treeNode = typeof node === 'string' ? this.nodes[node] : this.nodes[node.id];
         if (!treeNode)
             return;
         // if (data.name) {
@@ -349,24 +291,27 @@ var Editor2dDocument = /** @class */ (function (_super) {
             console.error('无法覆盖同步节点数据: ', treeNode, data);
             return;
         }
-        var changed = forceUpdate ? true : utils_1.Compare.isDeepChanged(treeNode, data);
+        const changed = forceUpdate ? true : utils_1.Compare.isDeepChanged(treeNode, data);
         if (changed) {
             Object.assign(treeNode, data);
             treeNode.version = (treeNode.version || 0) + 1;
             // this.refresh(treeNode as Editor2dContainerNode);
             this.fireContentChanged([treeNode], 'update', noSave, noFiredChanged);
         }
-    };
+    }
     /**
      * 检测节点名字，保证唯一
      * @param siblings
-     * @param newName
+     * @param name
      * @protected
      */
-    Editor2dDocument.prototype.getUniqueName = function (siblings, name, i) {
-        if (i === void 0) { i = 0; }
-        var newName = i ? "".concat(name, "(").concat(i, ")") : name;
-        if (siblings.some(function (n) { return n.name === newName; })) {
+    getUniqueName(siblings, name, i = 0) {
+        const numMatched = name.match(/[0-9]+$/);
+        let newName = i ? `${name}${i}` : name;
+        if (numMatched) {
+            newName = name.slice(0, numMatched.index) + (parseInt(numMatched[0]) + i);
+        }
+        if (siblings.some(n => n.name === newName)) {
             return this.getUniqueName(siblings, name, i + 1);
         }
         return newName;
@@ -381,22 +326,22 @@ var Editor2dDocument = /** @class */ (function (_super) {
           return this.getUniqueName(siblings, name, displayType);
         }
         return name; */
-    };
-    Editor2dDocument.prototype.getSiblings = function (treeNode) {
+    }
+    getSiblings(treeNode) {
         if (treeNode.parent) {
-            return treeNode.parent.children.filter(function (n) { return n !== treeNode; });
+            return treeNode.parent.children.filter(n => n !== treeNode);
         }
         return [];
-    };
-    Editor2dDocument.prototype.reloadContent = function (content) {
-        var data = { version: this.version };
+    }
+    reloadContent(content) {
+        let data = { version: this.version };
         this.loading = true;
         try {
             data = JSON.parse(content || '{}');
         }
         catch (e) {
             console.error(e);
-            this.message.error("\u6587\u4EF6 ".concat(this.uri, " \u5185\u5BB9\u89E3\u6790\u5931\u8D25"));
+            this.message.error(`文件 ${this.uri} 内容解析失败`);
         }
         if (data.content) {
             this._localVersion = data.content.version;
@@ -411,113 +356,262 @@ var Editor2dDocument = /** @class */ (function (_super) {
             this._snaplines = data.snaplines;
         }
         this.refresh();
-        this.loadRefInfos();
+        // this.loadRefInfos();
         this.fireContentChanged([], 'add', true);
-    };
-    Editor2dDocument.prototype.reloadEnd = function () {
+    }
+    reloadEnd() {
         if (this.loading) {
             this.loading = false;
         }
-    };
-    Editor2dDocument.prototype.createRootNode = function () {
-        var root = editor2d_1.Editor2dNode.createRootNode(new utils_1.URI(this.uri));
+    }
+    createRootNode() {
+        const root = editor2d_1.Editor2dNode.createRootNode(new utils_1.URI(this.uri));
         if (root.displayType === render_engine_1.GameObjectBaseType.SCENE) {
-            var defaultData = this.engineService.getDisplayDefaultData(this.engineName, render_engine_1.GameObjectBaseType.SCENE);
+            const defaultData = this.engineService.getDisplayDefaultData(this.engineName, render_engine_1.GameObjectBaseType.SCENE);
             Object.assign(root, defaultData);
         }
         return root;
-    };
-    Editor2dDocument.prototype.save = function () {
+    }
+    save() {
         return this.resourceAutoSaveService.save();
-    };
+    }
     ;
-    Object.defineProperty(Editor2dDocument.prototype, "dirty", {
-        get: function () {
-            return this.resourceAutoSaveService.dirty;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Editor2dDocument.prototype, "autoSave", {
-        get: function () {
-            return this.resourceAutoSaveService.autoSave;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Editor2dDocument.prototype, "onDirtyChanged", {
-        get: function () {
-            return this.resourceAutoSaveService.onDirtyChanged;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Editor2dDocument.prototype.toggleVisible = function (nodes, visible) {
-        var _this = this;
-        nodes.forEach(function (node) {
-            if (_this.checkDecoration(node, 'hidable')) {
-                _this.updateNode(node, { canvasHide: visible !== undefined ? !visible : !node.canvasHide });
+    get dirty() {
+        return this.resourceAutoSaveService.dirty;
+    }
+    get autoSave() {
+        return this.resourceAutoSaveService.autoSave;
+    }
+    get onDirtyChanged() {
+        return this.resourceAutoSaveService.onDirtyChanged;
+    }
+    /**
+     * @mask 操作说明
+     * 1. 当前 isMask 为 true, 移除 prevNode 上的 mask, 移到相应的图层后再设。
+     * 2. 当前 isMask 为 true 且 mask 有值，只清除 mask;
+     * 3. 当前是 mask child，先移除 mask, 拖到指定后再判断下一个是否 mask, 再附值；
+     * 4. 当前不是 mask， 移到 mask 树下，，设定下一个 node 上的 mask， 如果下一个 node 是 mask, 直接附值 id;
+     */
+    clearMask(node) {
+        // 只 mask 状态时, 移除 prevNode 上的 mask;
+        if (node.isMask && !node.mask) {
+            this.setPrevNodeMask(node.previousSibling);
+        }
+        // 当前忽略底层 mask 的，恢复上面的 mask；
+        if (node.mask && node.ignoreMask) {
+            this.setPrevNodeMask(node.previousSibling, node.mask);
+        }
+        if (node.mask) {
+            // 移除 mask;
+            node.mask = undefined;
+        }
+    }
+    nextMaskToNode(node) {
+        // 判断父级是否 mask 或 maskChild, 如果是则不用设
+        const nextNode = node.nextSibling;
+        const nextIsMask = nextNode && (nextNode.isMask || nextNode.mask);
+        // 如果底下有 mask；
+        if (nextIsMask) {
+            node.mask = nextNode.mask || nextNode.id;
+            // 底层忽略 mask 又是 mask 的情况，用底层的 id；
+            if (nextNode.ignoreMask && nextNode.isMask) {
+                node.mask = nextNode.id;
+            }
+            // 忽略 mask， 清除上一层的 mask；
+            if (node.ignoreMask) {
+                this.setPrevNodeMask(node.previousSibling);
+            }
+            //
+            // this.fireContentChanged([node], 'update', false, true);
+        }
+        else if (node.isMask) {
+            // 不是 mask，且当前是 mask， 设定上一层为 mask child;
+            this.setPrevNodeMask(node.previousSibling, node.id);
+        }
+    }
+    setPrevNodeMask(node, id) {
+        if (!node) {
+            return;
+        }
+        const n = node;
+        // 跳出不是 mask 实列
+        if (!exports.maskShowArray.concat(exports.maskEnabledArray).includes(n.displayType)) {
+            return;
+        }
+        // this.updateNode(n, { mask: id });
+        if (id !== n.mask) {
+            // n.version = (n.version || 0) + 1;
+            n.mask = id;
+            // this.updateNode(n, { mask: id }, true);
+            // this.fireContentChanged([n], 'update');
+        }
+        /**
+         * 断掉蒙板条件
+         * 1. 上一个忽略蒙板
+         * 2. 上一个类型不是图形或图片
+         * 3. 当前是蒙板，且 id 为 undefined
+         */
+        const prevNode = node.previousSibling;
+        if (prevNode &&
+            !n.ignoreMask &&
+            exports.maskShowArray.concat(exports.maskEnabledArray).includes(prevNode.displayType)
+            && !(n.isMask && typeof id === 'undefined')) {
+            this.setPrevNodeMask(node.previousSibling, id);
+        }
+    }
+    /**
+     * 切换 mask 图层;
+     * 多选：取最后一个当 mask， 并创建编组；
+     * 单选：设定同级的 previousSibling 的 isMaskChild = true;
+     * @param nodes
+     * @param mask
+     */
+    toggleMask(nodes, mask) {
+        if (nodes.length === 1) {
+            const node = nodes[0];
+            // this.updateNode(node, { isMask: !!mask });
+            /**
+             * @设定mask
+             * 1. 无特殊情况直接设
+             * 2. 在 mask 中且没有忽略底层，只改 isMask 值;
+             * 3. 在 mask 中且忽略了底层，改 isMask 和上一层的值；
+             */
+            node.isMask = mask;
+            // 1 和 3 处理
+            if (node.mask && node.ignoreMask || !node.mask) {
+                this.setPrevNodeMask(node.previousSibling, mask ? node.id : undefined);
+            }
+            this.fireContentChanged([node], 'update');
+            return;
+        }
+        /**
+         * @多个处理
+         * 多个用 getSelectedNodes, 保持图层顺序
+         * 检查最底下一个是否是可当 mask 的元素
+         * 1. 是：建个分组将最后个设 mask
+         * 2. 不是：Enabled 设定 mask, hierarchy-contribution 里判断
+         */
+        nodes = this.getSelectedNodes();
+        const group = this.combineNodes(nodes);
+        if (!group) {
+            return;
+        }
+        const lastNode = nodes[nodes.length - 1];
+        const childNodes = nodes.splice(0, nodes.length - 1);
+        lastNode.isMask = true;
+        childNodes.forEach(c => {
+            if (c.mask !== lastNode.id) {
+                c.mask = lastNode.id;
+            }
+        });
+        const groupNextNode = group.nextSibling;
+        let id;
+        // 如果底层是 maskChild 且没忽略，group 同步底层的 mask
+        if (groupNextNode.mask && !groupNextNode.ignoreMask) {
+            id = groupNextNode.mask;
+        }
+        // 如果底层是 mask，且忽略了底层，group mask 设为底层 id
+        if (groupNextNode.isMask && groupNextNode.ignoreMask) {
+            id = groupNextNode.id;
+        }
+        if (id) {
+            group.mask = id;
+        }
+        this.fireContentChanged(childNodes.concat([lastNode, group]), 'update');
+    }
+    /**
+     * 忽略底层 mask
+     * 忽略层 mask 不删除，留着恢复用,
+     * 设定忽略层 ignoreMask 和 清除 prev 上的 mask;
+     * @param nodes length === 1, 多个忽略
+     * @param ignore
+     */
+    ignoreMask(nodes, ignore) {
+        const node = nodes[0];
+        /**
+         * @忽略处理
+         * 1. 无特殊直接处理
+         * 2. 当前是 mask, 设定上一层的 mask 为当前 id；
+         */
+        if (ignore !== node.ignoreMask) {
+            node.ignoreMask = ignore;
+        }
+        const nextNode = node.nextSibling;
+        if (!ignore && nextNode && !(nextNode.mask || nextNode.isMask)) {
+            // 如果底层不是 mask, 清掉mask
+            node.mask = undefined;
+        }
+        // this.updateNode(node, { ignoreMask: ignore });
+        let id = ignore ? undefined : node.mask;
+        id = node.isMask && ignore ? node.id : id;
+        // id = node.isMask && !ignore ? node.mask : id;
+        // console.log(id, ignore);
+        this.setPrevNodeMask(node.previousSibling, id);
+        this.fireContentChanged([node], 'update');
+    }
+    toggleVisible(nodes, visible) {
+        nodes.forEach(node => {
+            if (this.checkDecoration(node, 'hidable')) {
+                this.updateNode(node, { canvasHide: visible !== undefined ? !visible : !node.canvasHide });
             }
         });
-    };
-    Editor2dDocument.prototype.toggleLock = function (nodes, locked) {
-        var _this = this;
-        nodes.forEach(function (node) {
-            if (_this.checkDecoration(node, 'lockable')) {
-                _this.updateNode(node, { locked: locked !== undefined ? locked : !node.locked });
+    }
+    toggleLock(nodes, locked) {
+        nodes.forEach(node => {
+            if (this.checkDecoration(node, 'lockable')) {
+                this.updateNode(node, { locked: locked !== undefined ? locked : !node.locked });
             }
         });
-    };
-    Editor2dDocument.prototype.moveUp = function (node, toTop) {
-        var children = node.parent.children;
-        var targetNode = toTop ? children[0] : node.previousSibling;
+    }
+    moveUp(node, toTop) {
+        const children = node.parent.children;
+        const targetNode = toTop ? children[0] : node.previousSibling;
         if (targetNode) {
             this.moveToNode(node, targetNode);
         }
-    };
+    }
     /**
      * 上移动多个节点
      * @param nodes
      */
-    Editor2dDocument.prototype.moveUpMore = function (nodes) {
-        var _this = this;
+    moveUpMore(nodes) {
         nodes = nodes.length > 1
-            ? nodes.slice().sort(function (n1, n2) { return tree_1.CompositeTreeNode.indexOf(n1.parent, n1) - tree_1.CompositeTreeNode.indexOf(n2.parent, n2); })
+            ? nodes.slice().sort((n1, n2) => tree_1.CompositeTreeNode.indexOf(n1.parent, n1) - tree_1.CompositeTreeNode.indexOf(n2.parent, n2))
             : nodes;
-        nodes.forEach(function (n) { return _this.moveUp(n); });
-    };
+        nodes.forEach(n => this.moveUp(n));
+    }
     /**
      * 下移动多个节点
      */
-    Editor2dDocument.prototype.moveDownMore = function (nodes) {
-        var _this = this;
+    moveDownMore(nodes) {
         nodes = nodes.length > 1
-            ? nodes.slice().sort(function (n1, n2) { return tree_1.CompositeTreeNode.indexOf(n2.parent, n2) - tree_1.CompositeTreeNode.indexOf(n1.parent, n1); })
+            ? nodes.slice().sort((n1, n2) => tree_1.CompositeTreeNode.indexOf(n2.parent, n2) - tree_1.CompositeTreeNode.indexOf(n1.parent, n1))
             : nodes;
-        nodes.forEach(function (n) { return _this.moveDown(n); });
-    };
-    Editor2dDocument.prototype.moveDown = function (node, toBottom) {
-        var children = node.parent.children;
-        var targetNode = toBottom ? children[children.length - 1] : node.nextSibling;
+        nodes.forEach(n => this.moveDown(n));
+    }
+    moveDown(node, toBottom) {
+        const children = node.parent.children;
+        const targetNode = toBottom ? children[children.length - 1] : node.nextSibling;
         if (targetNode) {
             this.moveToNode(node, targetNode, true);
         }
-    };
+    }
     /**
      * 移动到对应节点位置
      * @param node
      * @param targetNode
      * @param toAfter - 是否加到目标节点的后边，默认前面
      */
-    Editor2dDocument.prototype.moveToNode = function (node, targetNode, toAfter) {
+    moveToNode(node, targetNode, toAfter) {
         if (editor2d_1.Editor2dNode.isRootNode(targetNode) || tree_1.TreeNode.equals(node, targetNode))
             return;
-        var parent = targetNode.parent;
-        var children = parent.children;
+        this.clearMask(node);
+        const parent = targetNode.parent;
+        const children = parent.children;
         this.delNode(node, true);
-        var targetIndex = children.indexOf(targetNode);
-        var previousSibling = targetNode.previousSibling;
-        var nextSibling = targetNode.nextSibling;
+        const targetIndex = children.indexOf(targetNode);
+        const previousSibling = targetNode.previousSibling;
+        const nextSibling = targetNode.nextSibling;
         // const uniqueName = this.getUniqueName(children, node.name!, node.displayType);
         if (!toAfter) {
             children.splice(targetIndex, 0, node);
@@ -527,8 +621,8 @@ var Editor2dDocument = /** @class */ (function (_super) {
                 });
             }
             Object.assign(node, {
-                parent: parent,
-                previousSibling: previousSibling,
+                parent,
+                previousSibling,
                 nextSibling: targetNode,
             });
             Object.assign(targetNode, {
@@ -541,9 +635,9 @@ var Editor2dDocument = /** @class */ (function (_super) {
                 nextSibling: node
             });
             Object.assign(node, {
-                parent: parent,
+                parent,
                 previousSibling: targetNode,
-                nextSibling: nextSibling,
+                nextSibling,
             });
             if (nextSibling) {
                 Object.assign(nextSibling, {
@@ -551,137 +645,138 @@ var Editor2dDocument = /** @class */ (function (_super) {
                 });
             }
         }
+        this.nextMaskToNode(node);
         this.refresh(parent);
         this.fireContentChanged([node], 'update');
-    };
-    Editor2dDocument.prototype.moveToNodesAsChildren = function (nodes, targetNode) {
-        var _this = this;
+    }
+    moveToNodesAsChildren(nodes, targetNode) {
         // 后边的先加
         nodes = nodes.slice().reverse();
-        var canAddAsChild = !nodes.find(function (s) { return !_this.canbeAddAsChild(targetNode, s.displayType, s); });
+        const canAddAsChild = !nodes.find(s => !this.canbeAddAsChild(targetNode, s.displayType, s));
         if (canAddAsChild) {
-            nodes.forEach(function (node) { return _this.addChildren(node, targetNode, 0); });
+            nodes.forEach(node => this.addChildren(node, targetNode, 0));
             return true;
         }
         return false;
-    };
-    Editor2dDocument.prototype.moveToNodesAsSiblings = function (nodes, targetNode) {
-        var _this = this;
+    }
+    moveToNodesAsSiblings(nodes, targetNode) {
         // 后边的先加
         nodes = nodes.slice().reverse();
-        var canAddAsSibling = targetNode.parent && !nodes.find(function (s) { return !_this.canbeAddAsChild(targetNode.parent, s.displayType, s); });
+        const canAddAsSibling = targetNode.parent && !nodes.find(s => !this.canbeAddAsChild(targetNode.parent, s.displayType, s));
         if (canAddAsSibling) {
-            nodes.forEach(function (node) {
-                _this.moveToNode(node, targetNode, true);
+            nodes.forEach(node => {
+                this.moveToNode(node, targetNode, true);
             });
             return true;
         }
         return false;
-    };
-    Editor2dDocument.prototype.getSelectedNodes = function () {
-        var nodes = [];
+    }
+    getSelectedNodes() {
+        const nodes = [];
         // eslint-disable-next-line guard-for-in
-        for (var id in this.nodes) {
-            var node = this.nodes[id];
+        for (const id in this.nodes) {
+            const node = this.nodes[id];
             if (node && node.selected) {
                 nodes.push(node);
             }
         }
         return nodes;
-    };
-    Editor2dDocument.prototype.getNodeById = function (nodeId) {
+    }
+    getNodeById(nodeId) {
         return this.nodes[nodeId];
-    };
-    Editor2dDocument.prototype.getNodeIcon = function (node) {
+    }
+    getNodeIcon(node) {
         if (node.tags && node.tags.length > 0) {
-            var tagId = node.tags[0].id;
-            var tagIcon = this.appConfig.getTagIconClass(tagId);
+            const tagId = node.tags[0].id;
+            const tagIcon = this.appConfig.getTagIconClass(tagId);
             if (tagIcon)
                 return tagIcon;
         }
-        var register = this.engineService.getGameObjectIDERegister(this.engineName, node.displayType);
+        const register = this.engineService.getGameObjectIDERegister(this.engineName, node.displayType);
         if (register && register.decoration && register.decoration.iconClass) {
             return register.decoration.iconClass;
         }
         return '';
-    };
-    Editor2dDocument.prototype.getNodeIconColor = function (node) {
+    }
+    getNodeIconColor(node) {
         if (node.tags && node.tags.length > 0) {
-            var tagId = node.tags[0].id;
-            var tagIcon = this.appConfig.getTagColorClass(tagId);
+            const tagId = node.tags[0].id;
+            const tagIcon = this.appConfig.getTagColorClass(tagId);
             if (tagIcon)
                 return tagIcon;
         }
         return '';
-    };
-    Editor2dDocument.prototype.getSelectedNodesWithoutRoot = function () {
-        return this.getSelectedNodes().filter(function (n) { return !editor2d_1.Editor2dNode.isRootNode(n); });
-    };
-    Editor2dDocument.prototype.isContainNode = function (parent, id) {
-        var target = this.nodes[id];
+    }
+    getSelectedNodesWithoutRoot() {
+        return this.getSelectedNodes().filter(n => !editor2d_1.Editor2dNode.isRootNode(n));
+    }
+    isContainNode(parent, id) {
+        let target = this.nodes[id];
         while (target) {
             if (target.id === parent.id)
                 return true;
             target = target.parent;
         }
         return false;
-    };
+    }
     /**
      * 合并分组
      * @param nodes
      */
-    Editor2dDocument.prototype.combineNodes = function (nodes) {
+    combineNodes(n) {
+        // 合成分组保持图层顺序
+        const nodes = n || this.getSelectedNodes();
         if (nodes.length > 0) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            var parent_1 = nodes[0].parent;
-            var index = tree_1.CompositeTreeNode.indexOf(parent_1, nodes[0]);
-            var group = this.createDisplayNode(render_engine_1.GameObjectBaseType.GROUP, parent_1, undefined, index);
+            const parent = nodes[0].parent;
+            const index = tree_1.CompositeTreeNode.indexOf(parent, nodes[0]);
+            const group = this.createDisplayNode(render_engine_1.GameObjectBaseType.GROUP, parent, undefined, index);
             this.moveToNodesAsChildren(nodes, group);
+            return group;
         }
-    };
+    }
     /**
      * 解除分组，目前只支持图层
      * @param node
      */
-    Editor2dDocument.prototype.unCombineNode = function (node) {
-        var _this = this;
+    unCombineNode(node) {
         if (node.children && node.parent) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            var parentNode_1 = node.parent;
-            var curIndex_1 = tree_1.CompositeTreeNode.indexOf(parentNode_1, node);
-            node.children.slice().reverse().forEach(function (n) {
-                _this.addChildren(n, parentNode_1, curIndex_1);
+            const parentNode = node.parent;
+            const curIndex = tree_1.CompositeTreeNode.indexOf(parentNode, node);
+            node.children.slice().reverse().forEach((n) => {
+                this.addChildren(n, parentNode, curIndex);
             });
         }
         this.delNode(node);
-    };
+    }
     /**
      * 可以作为子节点
      * @param targetNode
      * @param childDisplayType
      * @param childNode
      */
-    Editor2dDocument.prototype.canbeAddAsChild = function (targetNode, childDisplayType, childNode) {
+    canbeAddAsChild(targetNode, childDisplayType, childNode) {
         if (childNode && childNode.parent === targetNode)
             return true;
-        var isRootNode = editor2d_1.Editor2dNode.isRootNode(targetNode);
-        var nodeDeco = this.engineService.getGameObjectDecoration(this.engineName, targetNode.displayType);
-        var childDeco = this.engineService.getGameObjectDecoration(this.engineName, childDisplayType);
-        var childTypes = typeof nodeDeco.childTypes === 'function' ? nodeDeco.childTypes(targetNode) : (nodeDeco.childTypes || []);
-        var checkParent = false;
+        const isRootNode = editor2d_1.Editor2dNode.isRootNode(targetNode);
+        const nodeDeco = this.engineService.getGameObjectDecoration(this.engineName, targetNode.displayType);
+        const childDeco = this.engineService.getGameObjectDecoration(this.engineName, childDisplayType);
+        const childTypes = typeof nodeDeco.childTypes === 'function' ? nodeDeco.childTypes(targetNode) : (nodeDeco.childTypes || []);
+        let checkParent = false;
         if (childDeco.parentTypes !== undefined) {
-            checkParent = childDeco.parentTypes.find(function (d) { return targetNode.displayType === d || (isRootNode && d === 'root') || nodeDeco.group === d; }) !== undefined;
+            checkParent = childDeco.parentTypes.find(d => targetNode.displayType === d || (isRootNode && d === 'root') || nodeDeco.group === d) !== undefined;
             if (checkParent && childDeco.parentIgnoreTypes !== undefined) {
-                checkParent = !childDeco.parentIgnoreTypes.find(function (d) { return targetNode.displayType === d || (isRootNode && d === 'root') || nodeDeco.group === d; });
+                checkParent = !childDeco.parentIgnoreTypes.find(d => targetNode.displayType === d || (isRootNode && d === 'root') || nodeDeco.group === d);
             }
         }
-        var checkChildren = childTypes.find(function (d) { return childDisplayType === d || childDeco.group === d; }) !== undefined;
-        var checkSuccess = checkParent || checkChildren;
+        const checkChildren = childTypes.find(d => childDisplayType === d || childDeco.group === d) !== undefined;
+        const checkSuccess = checkParent || checkChildren;
         if (!checkSuccess)
             return false;
-        var siblings = targetNode.children || [];
+        const siblings = targetNode.children || [];
         if (childDeco.single) {
-            var addedNodes = siblings.filter(function (s) { return s.displayType === childDisplayType; });
+            const addedNodes = siblings.filter(s => s.displayType === childDisplayType);
             if (addedNodes.length > 0)
                 return false;
         }
@@ -689,43 +784,40 @@ var Editor2dDocument = /** @class */ (function (_super) {
             return childDeco.canbeAddedAsChild(targetNode, siblings);
         }
         return true;
-    };
-    Editor2dDocument.prototype.checkDecoration = function (node, decoKey) {
-        var deco = this.engineService.getGameObjectDecoration(this.engineName, node.displayType);
+    }
+    checkDecoration(node, decoKey) {
+        const deco = this.engineService.getGameObjectDecoration(this.engineName, node.displayType);
         return deco[decoKey] === undefined || !!deco[decoKey];
-    };
-    Editor2dDocument.prototype.setAnimationStarted = function (b) {
+    }
+    setAnimationStarted(b) {
         this.animationStarted = b;
-    };
-    Editor2dDocument.prototype.startRecordAnimation = function (animationIds, onNodeChange) {
-        var _this = this;
+    }
+    startRecordAnimation(animationIds, onNodeChange) {
         // this.animationStarted = true;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        var getNodesToChildrenById = function (n, id) {
-            return n.children && n.children.some(function (c) { return c.id === id || getNodesToChildrenById(c, id); });
-        };
+        const getNodesToChildrenById = (n, id) => n.children && n.children.some((c) => c.id === id || getNodesToChildrenById(c, id));
         this.animationIds = animationIds();
-        var cache = this.animationIds
-            .map(function (id) { return _this.getNodeById(id); }).filter(function (n) { return !!n; })
-            .map(function (node) { return _this.cloneNodeData(node); });
-        var toDispose = this.onContentChanged(function (e) {
-            _this.animationIds = animationIds();
+        // 缓存移到 timeline 里处理
+        /* const cache: Editor2dNode[] = this.animationIds
+          .map(id => this.getNodeById(id)).filter(n => !!n)
+          .map(node => this.cloneNodeData(node as Editor2dNode)); */
+        const toDispose = this.onContentChanged(e => {
+            this.animationIds = animationIds();
             // TODO 删除动画元件后，动画面板清空数据
             if (e.nodes) {
-                var nodes = e.nodes.filter(function (n) {
-                    // 新建面板时，加入的元素先插入 cache 记录初始值
-                    if (n && n.animation && n.displayType === render_engine_1.GameObjectBaseType.ANIMATION) {
-                        var _a = n.animation, animation = _a === void 0 ? {} : _a;
-                        var _b = (animation || {}).frames, frames_1 = _b === void 0 ? {} : _b;
-                        frames_1.forEach(function (c) {
-                            if (!cache.some(function (d) { return d.id === c.id; })) {
-                                var node = _this.cloneNodeData(_this.getNodeById(c.id));
-                                cache.push(node);
-                            }
-                        });
+                const nodes = e.nodes.filter((n) => 
+                // 新建面板时，加入的元素先插入 cache 记录初始值
+                /* if (n && n.animation && n.displayType === GameObjectBaseType.ANIMATION) {
+                  const { animation = {} } = n;
+                  const { frames = {} } = animation || {};
+                  frames.forEach((c: any) => {
+                    if (!cache.some(d => d.id === c.id)) {
+                      const node = this.cloneNodeData(this.getNodeById(c.id) as Editor2dNode);
+                      cache.push(node);
                     }
-                    return _this.animationIds.some(function (id) { return (id === n.id) || getNodesToChildrenById(n, id); });
-                });
+                  });
+                } */
+                this.animationIds.some(id => (id === n.id) || getNodesToChildrenById(n, id)));
                 if (nodes.length) {
                     // TODO: 音乐素材变更
                     onNodeChange(nodes, e.type);
@@ -733,179 +825,147 @@ var Editor2dDocument = /** @class */ (function (_super) {
             }
         });
         return {
-            dispose: function () {
+            dispose: () => {
                 toDispose.dispose();
                 // reset node data
-                cache.forEach(function (nodeData) {
-                    var displayType = nodeData.displayType;
-                    var currentNode = _this.getNodeById(nodeData.id);
-                    if (!currentNode) {
-                        return;
-                    }
-                    var register = _this.engineService.getGameObjectIDERegister(_this.engineService.engineName, displayType);
-                    var _a = _this.engineService.getGameObjectDecoration(_this.engineService.engineName, displayType).timelineDisabledKeys, timelineDisabledKeys = _a === void 0 ? [] : _a;
-                    var keysList = (0, utils_2.getAnimationKeys)(_this.engineService, register, timelineDisabledKeys);
-                    var changeData = (0, utils_2.getChangeAnimationData)(keysList, currentNode, nodeData);
-                    changeData.name = currentNode === null || currentNode === void 0 ? void 0 : currentNode.name;
-                    _this.updateNode(nodeData.id, changeData, true);
-                });
+                /* cache.forEach(nodeData => {
+                  const { displayType } = nodeData;
+                  const currentNode = this.getNodeById(nodeData.id);
+                  if (!currentNode) {
+                    return;
+                  }
+                  const register = this.engineService.getGameObjectIDERegister(this.engineService.engineName, displayType);
+                  const {
+                    timelineDisabledKeys = [],
+                  } = this.engineService.getGameObjectDecoration(
+                    this.engineService.engineName,
+                    displayType,
+                  );
+                  const keysList = getAnimationKeys(this.engineService, register, timelineDisabledKeys);
+                  const changeData: {[key: string]: any} = getChangeAnimationData(keysList, currentNode, nodeData);
+                  changeData.name = currentNode?.name;
+                  this.updateNode(nodeData.id, changeData, true);
+                }); */
                 // this.animationStarted = false;
-                _this.animationIds = [];
+                this.animationIds = [];
             }
         };
-    };
+    }
     /**
      * 同一个时间周期的refresh自动取消
      * @param raw
      */
-    Editor2dDocument.prototype.refresh = function (raw) {
-        var _this = this;
+    refresh(raw) {
         if (!raw)
-            return _super.prototype.refresh.call(this);
-        var deferred = new utils_1.PromiseDeferred();
+            return super.refresh();
+        const deferred = new utils_1.PromiseDeferred();
         if (this.refreshingNodes.has(raw)) {
-            var cache = this.refreshingNodes.get(raw);
+            const cache = this.refreshingNodes.get(raw);
             cache.deferred.resolve(undefined);
             clearTimeout(cache.timeout);
             this.refreshingNodes.delete(raw);
         }
-        var timeout = setTimeout(function () {
-            _this.refreshingNodes.delete(raw);
-            _super.prototype.refresh.call(_this, raw)
-                .then(function (res) { return deferred.resolve(res); })
-                .catch(function (rej) { return deferred.reject(rej); });
+        const timeout = setTimeout(() => {
+            this.refreshingNodes.delete(raw);
+            super.refresh(raw)
+                .then(res => deferred.resolve(res))
+                .catch(rej => deferred.reject(rej));
         });
         // @ts-ignore
-        this.refreshingNodes.set(raw, { timeout: timeout, deferred: deferred });
+        this.refreshingNodes.set(raw, { timeout, deferred });
         return deferred.promise;
-    };
-    Editor2dDocument.prototype.cloneNodeData = function (node) {
+    }
+    cloneNodeData(node) {
         return (0, utils_1.deepClone)((0, utils_1.omit)(node, ['parent', 'previousSibling', 'nextSibling', 'selected', 'canvasHide', 'version']));
-    };
-    Object.defineProperty(Editor2dDocument.prototype, "version", {
-        get: function () {
-            return this._localVersion;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Editor2dDocument.prototype, "length", {
-        get: function () {
-            return Object.keys(this.nodes).length;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    /**
-     * 检测错误
-     * @protected
-     */
-    Editor2dDocument.prototype.loadRefInfos = function () {
-        return __awaiter(this, void 0, void 0, function () {
-            var componentContents, _a, normalize;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
-                    case 0: return [4 /*yield*/, this.resourceService.getDependenciesContent(this.uri, function (u) { return !!u.match(/\.comp/); })];
-                    case 1:
-                        componentContents = _b.sent();
-                        if (!!this.options.isTemplate) return [3 /*break*/, 3];
-                        _a = this;
-                        return [4 /*yield*/, this.resourceService.checkRefsErrors(this.uri)];
-                    case 2:
-                        _a.errors = _b.sent();
-                        _b.label = 3;
-                    case 3:
-                        normalize = function (node, version, parent) {
-                            if (parent) {
-                                node.parent = parent;
-                            }
-                            if (version !== undefined) {
-                                node.version = version;
-                            }
-                            node.children = node.children ? node.children.map(function (c) { return normalize(c, version, node); }) : undefined;
-                            return node;
-                        };
-                        this.componentContents = (0, utils_1.mapValues)(componentContents, function (value) { return value.content ? normalize(value.content, value.version) : undefined; });
-                        return [4 /*yield*/, this.refresh()];
-                    case 4:
-                        _b.sent();
-                        this.fireContentChanged([], 'add', true);
-                        return [2 /*return*/];
-                }
-            });
-        });
-    };
-    Editor2dDocument.prototype.getWarningDesc = function (node) {
+    }
+    get version() {
+        return this._localVersion;
+    }
+    get length() {
+        return Object.keys(this.nodes).length;
+    }
+    // /**
+    //  * 检测错误
+    //  * @protected
+    //  */
+    // protected async loadRefInfos(): Promise<void> {
+    //   const componentContents = await this.resourceService.getDependenciesContent<Editor2dContent>(this.uri, u => !!u.match(/\.comp/));
+    //   // 模板模式暂时不做资源依赖检测
+    //   if (!this.options.isTemplate) {
+    //     this.errors = await this.resourceService.checkRefsErrors(this.uri);
+    //   }
+    //   const normalize = (node: Editor2dNode, version?: number, parent?: Editor2dNode) => {
+    //     if (parent) {
+    //       node.parent = parent as Editor2dContainerNode;
+    //     }
+    //     if (version !== undefined) {
+    //       node.version = version;
+    //     }
+    //     node.children = node.children ? node.children.map(c => normalize(c as Editor2dNode, version, node)) : undefined;
+    //     return node;
+    //   };
+    //   this.componentContents = mapValues<Editor2dNode>(componentContents, (value: Editor2dContent) => value.content ? normalize(value.content!, value.version) : undefined);
+    //   await this.refresh();
+    //   this.fireContentChanged([], 'add', true);
+    // }
+    getWarningDesc(node) {
         if (node.error && node.error.message)
             return node.error.message;
-        var uris = [];
-        var register = this.engineService.getGameObjectIDERegister(this.engineName, node.displayType);
+        let uris = [];
+        const register = this.engineService.getGameObjectIDERegister(this.engineName, node.displayType);
         if (register.getReferenceUris) {
             uris = register.getReferenceUris(node);
         }
         else {
             return undefined;
         }
-        var error = this.errors.find(function (e) { return uris.includes(e.uri); });
+        const error = this.errors.find(e => uris.includes(e.uri));
         return error === null || error === void 0 ? void 0 : error.message;
-    };
-    Editor2dDocument.prototype.queryNodesByTypes = function (types) {
-        var e_1, _a;
+    }
+    queryNodesByTypes(types) {
         if (!this.root)
             return [];
-        var nodes = [];
-        try {
-            for (var _b = __values(new editor2d_iterator_1.Editor2dIterator(this.root)), _c = _b.next(); !_c.done; _c = _b.next()) {
-                var node = _c.value;
-                if (node !== this.root && (!types || types.includes(node.displayType))) {
-                    nodes.push(node);
-                }
-            }
-        }
-        catch (e_1_1) { e_1 = { error: e_1_1 }; }
-        finally {
-            try {
-                if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+        const nodes = [];
+        for (const node of new editor2d_iterator_1.Editor2dIterator(this.root)) {
+            if (node !== this.root && (!types || types.includes(node.displayType))) {
+                nodes.push(node);
             }
-            finally { if (e_1) throw e_1.error; }
         }
         return nodes;
-    };
-    Editor2dDocument.prototype.nodeIdToGameObjectId = function (nodeId) {
-        var node = this.nodes[nodeId];
+    }
+    nodeIdToGameObjectId(nodeId) {
+        const node = this.nodes[nodeId];
         if (!node)
             return '';
-        var objectId = editor2d_1.Editor2dNode.getNodePath(node);
+        const objectId = editor2d_1.Editor2dNode.getNodePath(node);
         return objectId;
-    };
+    }
     /**
      * 获取游戏对象
      * @param nodeId
      */
-    Editor2dDocument.prototype.getGameObjectById = function (nodeId) {
-        var objectId = this.nodeIdToGameObjectId(nodeId);
-        var game = this.engineService.getGameWidgetByUri(this.uri);
+    getGameObjectById(nodeId) {
+        const objectId = this.nodeIdToGameObjectId(nodeId);
+        const game = this.engineService.getGameWidgetByUri(this.uri);
         if (game) {
-            var scene = game.getCurrentScene();
+            const scene = game.getCurrentScene();
             if (scene) {
                 return scene.gameObjectStore.get(objectId);
             }
         }
-    };
+    }
     /**
      * 位置移动
      * @param nodes
      * @param type
      * @param delta
      */
-    Editor2dDocument.prototype.positionMove = function (nodes, type, delta) {
-        var _this = this;
-        if (delta === void 0) { delta = 1; }
-        nodes = nodes.filter(function (node) { return node.position; });
+    positionMove(nodes, type, delta = 1) {
+        nodes = nodes.filter(node => node.position);
         if (nodes.length === 0)
             return;
-        var moveType = 'x';
-        var moveDelta = delta;
+        let moveType = 'x';
+        let moveDelta = delta;
         switch (type) {
             case 'left':
                 moveDelta = -moveDelta;
@@ -920,58 +980,51 @@ var Editor2dDocument = /** @class */ (function (_super) {
                 moveType = 'y';
                 break;
         }
-        nodes.forEach(function (node) {
-            var position = node.position;
-            var newPosition = {
+        nodes.forEach(node => {
+            const position = node.position;
+            const newPosition = {
                 x: moveType === 'x' ? position.x + moveDelta : position.x,
                 y: moveType === 'y' ? position.y + moveDelta : position.y,
             };
-            _this.updateNode(node, { position: newPosition, }, true, true, true);
+            this.updateNode(node, { position: newPosition, }, true, true, true);
         });
         this.fireContentChanged(nodes, 'update');
-    };
-    Object.defineProperty(Editor2dDocument.prototype, "snaplines", {
-        get: function () {
-            return this._snaplines;
-        },
-        set: function (lines) {
-            this._snaplines = lines;
-            if (JSON.stringify(lines) !== JSON.stringify(this._snaplines)) {
-                this.fireContentChanged([], 'update');
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Editor2dDocument.prototype, "saveVersion", {
-        get: function () {
-            return this._saveVersion;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Editor2dDocument.prototype.findIndex = function (node) {
-        var parent = node.parent;
+    }
+    get snaplines() {
+        return this._snaplines;
+    }
+    set snaplines(lines) {
+        this._snaplines = lines;
+        if (JSON.stringify(lines) !== JSON.stringify(this._snaplines)) {
+            this.fireContentChanged([], 'update');
+        }
+    }
+    get saveVersion() {
+        return this._saveVersion;
+    }
+    findIndex(node) {
+        const parent = node.parent;
         if (parent) {
             return parent.children.indexOf(node);
         }
         return 0;
-    };
-    Editor2dDocument = __decorate([
-        (0, inversify_1.injectable)(),
-        __param(0, (0, inversify_1.inject)(connection_1.MessageService)),
-        __param(1, (0, inversify_1.inject)(editor2d_1.Editor2dModelOptions)),
-        __param(2, (0, inversify_1.inject)(resource_1.ResourceProvider)),
-        __param(3, (0, inversify_1.inject)(browser_1.ResourceAutoSaveService)),
-        __param(4, (0, inversify_1.inject)(workspace_2d_1.WorkspaceResourceService)),
-        __param(5, (0, inversify_1.inject)(render_engine_ide_1.RenderEngineIDEService)),
-        __param(6, (0, inversify_1.inject)(app_config_1.AppConfigService)),
-        __metadata("design:paramtypes", [connection_1.MessageService, Object, Function, browser_1.ResourceAutoSaveService,
-            workspace_2d_1.WorkspaceResourceService,
-            render_engine_ide_1.RenderEngineIDEService,
-            app_config_1.AppConfigService])
-    ], Editor2dDocument);
-    return Editor2dDocument;
-}(tree_1.TreeImpl));
+    }
+};
+Editor2dDocument = __decorate([
+    (0, inversify_1.injectable)(),
+    __param(0, (0, inversify_1.inject)(connection_1.MessageService)),
+    __param(1, (0, inversify_1.inject)(editor2d_1.Editor2dModelOptions)),
+    __param(2, (0, inversify_1.inject)(resource_1.ResourceProvider)),
+    __param(3, (0, inversify_1.inject)(browser_1.ResourceAutoSaveService)),
+    __param(4, (0, inversify_1.inject)(workspace_2d_1.WorkspaceResourceService)),
+    __param(5, (0, inversify_1.inject)(render_engine_ide_1.RenderEngineIDEService)),
+    __param(6, (0, inversify_1.inject)(app_config_1.AppConfigService)),
+    __param(7, (0, inversify_1.inject)(exports.Editor2dComponentProvider)),
+    __param(7, (0, inversify_1.optional)()),
+    __metadata("design:paramtypes", [connection_1.MessageService, Object, Function, browser_1.ResourceAutoSaveService,
+        workspace_2d_1.WorkspaceResourceService,
+        render_engine_ide_1.RenderEngineIDEService,
+        app_config_1.AppConfigService, Object])
+], Editor2dDocument);
 exports.Editor2dDocument = Editor2dDocument;
 //# sourceMappingURL=editor2d-document.js.map