canvas-editor-engine 2.3.19 → 2.3.20

package/dist/index.mjs

@@ -2143,194 +2143,6 @@ var TempCanvas = function() {
     return TempCanvas;
 }();
 
-var DrawAccumulator = function() {
-    function DrawAccumulator(appConfig, appStoreRepository, eventService, drawLayersService) {
-        this.appConfig = appConfig;
-        this.appStoreRepository = appStoreRepository;
-        this.eventService = eventService;
-        this.drawLayersService = drawLayersService;
-        this.painters = new Proxy([], {
-            get: function(target, name) {
-                return target[name];
-            },
-            set: function(target, name, value) {
-                try {
-                    if (typeof (value === null || value === void 0 ? void 0 : value.object) !== "undefined") {
-                        target[name] = value.object;
-                        value.update();
-                        return true;
-                    } else {
-                        if (name != "length") {
-                            console.warn("Proxy set error: object denied");
-                            return false;
-                        } else {
-                            var MIN_LENGTH = -1;
-                            var MAX_LENGTH = __spreadArray([], Object.keys(target), true);
-                            if (value <= Math.max.apply(Math, __spreadArray([ MIN_LENGTH ], MAX_LENGTH, false)) + 1) {
-                                target.length = value;
-                            }
-                        }
-                        return true;
-                    }
-                } catch (error) {
-                    console.error("Proxy set error:", error);
-                    return false;
-                }
-            }
-        });
-    }
-    DrawAccumulator.prototype.add = function(layerId, drawType, options, initialSize) {
-        return __awaiter(this, void 0, void 0, (function() {
-            var id, painter;
-            return __generator(this, (function(_a) {
-                id = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
-                painter = {
-                    drawService: new DrawService(this.appConfig, this.appStoreRepository, this.eventService),
-                    drawType,
-                    id
-                };
-                painter.drawService.bindOptions(drawType, options);
-                painter.drawService.tempCanvas.bindOptions(initialSize);
-                this.painters.push({
-                    object: painter,
-                    update: this.update.bind(this)
-                });
-                this.drawLayersService.addToLayer(layerId, painter);
-                this.invokePainter(drawType, painter.drawService);
-                return [ 2 ];
-            }));
-        }));
-    };
-    DrawAccumulator.prototype.removePainter = function(id) {
-        return __awaiter(this, void 0, void 0, (function() {
-            var painter;
-            return __generator(this, (function(_a) {
-                painter = this.painters.find((function(painter) {
-                    return painter.id === id;
-                }));
-                if (!!painter) {
-                    this.painters = this.painters.filter((function(painter) {
-                        return painter.id !== id;
-                    }));
-                }
-                this.drawLayersService.removePainter(id);
-                return [ 2 ];
-            }));
-        }));
-    };
-    DrawAccumulator.prototype.smoothFilter = function(painterId, smoothFilterOptions) {
-        return __awaiter(this, void 0, void 0, (function() {
-            var useStore, options, filterOptions, painter;
-            var _this = this;
-            return __generator(this, (function(_a) {
-                useStore = smoothFilterOptions.useStore, options = smoothFilterOptions.options, 
-                filterOptions = smoothFilterOptions.filterOptions;
-                painter = this.painters.find((function(painter) {
-                    return painter.id === painterId;
-                }));
-                if (!painter) return [ 2 ];
-                painter.drawService.drawSmoothImage(useStore, options, filterOptions).then((function() {
-                    _this.update();
-                }));
-                return [ 2 ];
-            }));
-        }));
-    };
-    DrawAccumulator.prototype.update = function() {
-        var _this = this;
-        setTimeout((function() {
-            _this.clearCanvas();
-            _this.invokePaintersOnLayers();
-        }), 1e3);
-    };
-    Object.defineProperty(DrawAccumulator.prototype, "gradient", {
-        get: function() {
-            var _this = this;
-            var gradient = [];
-            this.painters.forEach((function(painter) {
-                var layer = _this.drawLayersService.layerList.find((function(layer) {
-                    return layer.painters.includes(painter);
-                }));
-                if (layer) {
-                    gradient.push(layer.order);
-                }
-            }));
-            return gradient.sort((function(a, b) {
-                return a - b;
-            }));
-        },
-        enumerable: false,
-        configurable: true
-    });
-    DrawAccumulator.prototype.clearCanvas = function() {
-        var ctx = this.appConfig.canvas.getContext("2d");
-        ctx.clearRect(0, 0, this.appConfig.CANVAS_SIZE.width, this.appConfig.CANVAS_SIZE.height);
-        ctx.save();
-    };
-    DrawAccumulator.prototype.invokePaintersOnLayers = function() {
-        var _this = this;
-        var stash = [];
-        this.gradient.forEach((function(order) {
-            _this.painters.forEach((function(painter) {
-                var layer = _this.drawLayersService.layerList.find((function(layer) {
-                    return layer.painters.includes(painter);
-                }));
-                if (!layer) return console.warn("[invoke] Layer not found");
-                if (!stash.includes(painter) && layer.order === order) {
-                    _this.invokePainterWithTempCtx(painter.drawType, painter.drawService);
-                    stash.push(painter);
-                }
-            }));
-        }));
-    };
-    DrawAccumulator.prototype.invokePainter = function(drawType, painter) {
-        return __awaiter(this, void 0, void 0, (function() {
-            return __generator(this, (function(_a) {
-                switch (_a.label) {
-                  case 0:
-                    if (!(drawType === "image")) return [ 3, 2 ];
-                    return [ 4, painter.drawImage() ];
-
-                  case 1:
-                    _a.sent();
-                    return [ 3, 4 ];
-
-                  case 2:
-                    if (!(drawType === "project")) return [ 3, 4 ];
-                    return [ 4, painter.drawProject() ];
-
-                  case 3:
-                    _a.sent();
-                    _a.label = 4;
-
-                  case 4:
-                    return [ 2 ];
-                }
-            }));
-        }));
-    };
-    DrawAccumulator.prototype.invokePainterWithTempCtx = function(drawType, painter) {
-        return __awaiter(this, void 0, void 0, (function() {
-            var imageData, ctx, x, y;
-            return __generator(this, (function(_a) {
-                imageData = painter.tempCanvas.getImageData();
-                ctx = this.appConfig.canvas.getContext("2d");
-                if (drawType === "image") {
-                    x = painter.options.image.drawImageArgs.position.x;
-                    y = painter.options.image.drawImageArgs.position.y;
-                    ctx.putImageData(imageData, x, y);
-                    ctx.save();
-                } else if (drawType === "project") {
-                    ctx.putImageData(imageData, 0, 0);
-                    ctx.save();
-                }
-                return [ 2 ];
-            }));
-        }));
-    };
-    return DrawAccumulator;
-}();
-
 var DrawService = function() {
     function DrawService(appConfig, appStoreRepository, eventService) {
         this.appConfig = appConfig;
@@ -2658,6 +2470,194 @@ var DrawLayersService = function() {
     return DrawLayersService;
 }();
 
+var DrawAccumulatorService = function() {
+    function DrawAccumulatorService(appConfig, appStoreRepository, eventService, drawLayersService) {
+        this.appConfig = appConfig;
+        this.appStoreRepository = appStoreRepository;
+        this.eventService = eventService;
+        this.drawLayersService = drawLayersService;
+        this.painters = new Proxy([], {
+            get: function(target, name) {
+                return target[name];
+            },
+            set: function(target, name, value) {
+                try {
+                    if (typeof (value === null || value === void 0 ? void 0 : value.object) !== "undefined") {
+                        target[name] = value.object;
+                        value.update();
+                        return true;
+                    } else {
+                        if (name != "length") {
+                            console.warn("Proxy set error: object denied");
+                            return false;
+                        } else {
+                            var MIN_LENGTH = -1;
+                            var MAX_LENGTH = __spreadArray([], Object.keys(target), true);
+                            if (value <= Math.max.apply(Math, __spreadArray([ MIN_LENGTH ], MAX_LENGTH, false)) + 1) {
+                                target.length = value;
+                            }
+                        }
+                        return true;
+                    }
+                } catch (error) {
+                    console.error("Proxy set error:", error);
+                    return false;
+                }
+            }
+        });
+    }
+    DrawAccumulatorService.prototype.add = function(layerId, drawType, options, initialSize) {
+        return __awaiter(this, void 0, void 0, (function() {
+            var id, painter;
+            return __generator(this, (function(_a) {
+                id = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
+                painter = {
+                    drawService: new DrawService(this.appConfig, this.appStoreRepository, this.eventService),
+                    drawType,
+                    id
+                };
+                painter.drawService.bindOptions(drawType, options);
+                painter.drawService.tempCanvas.bindOptions(initialSize);
+                this.painters.push({
+                    object: painter,
+                    update: this.update.bind(this)
+                });
+                this.drawLayersService.addToLayer(layerId, painter);
+                this.invokePainter(drawType, painter.drawService);
+                return [ 2 ];
+            }));
+        }));
+    };
+    DrawAccumulatorService.prototype.removePainter = function(id) {
+        return __awaiter(this, void 0, void 0, (function() {
+            var painter;
+            return __generator(this, (function(_a) {
+                painter = this.painters.find((function(painter) {
+                    return painter.id === id;
+                }));
+                if (!!painter) {
+                    this.painters = this.painters.filter((function(painter) {
+                        return painter.id !== id;
+                    }));
+                }
+                this.drawLayersService.removePainter(id);
+                return [ 2 ];
+            }));
+        }));
+    };
+    DrawAccumulatorService.prototype.smoothFilter = function(painterId, smoothFilterOptions) {
+        return __awaiter(this, void 0, void 0, (function() {
+            var useStore, options, filterOptions, painter;
+            var _this = this;
+            return __generator(this, (function(_a) {
+                useStore = smoothFilterOptions.useStore, options = smoothFilterOptions.options, 
+                filterOptions = smoothFilterOptions.filterOptions;
+                painter = this.painters.find((function(painter) {
+                    return painter.id === painterId;
+                }));
+                if (!painter) return [ 2 ];
+                painter.drawService.drawSmoothImage(useStore, options, filterOptions).then((function() {
+                    _this.update();
+                }));
+                return [ 2 ];
+            }));
+        }));
+    };
+    DrawAccumulatorService.prototype.update = function() {
+        var _this = this;
+        setTimeout((function() {
+            _this.clearCanvas();
+            _this.invokePaintersOnLayers();
+        }), 1e3);
+    };
+    Object.defineProperty(DrawAccumulatorService.prototype, "gradient", {
+        get: function() {
+            var _this = this;
+            var gradient = [];
+            this.painters.forEach((function(painter) {
+                var layer = _this.drawLayersService.layerList.find((function(layer) {
+                    return layer.painters.includes(painter);
+                }));
+                if (layer) {
+                    gradient.push(layer.order);
+                }
+            }));
+            return gradient.sort((function(a, b) {
+                return a - b;
+            }));
+        },
+        enumerable: false,
+        configurable: true
+    });
+    DrawAccumulatorService.prototype.clearCanvas = function() {
+        var ctx = this.appConfig.canvas.getContext("2d");
+        ctx.clearRect(0, 0, this.appConfig.CANVAS_SIZE.width, this.appConfig.CANVAS_SIZE.height);
+        ctx.save();
+    };
+    DrawAccumulatorService.prototype.invokePaintersOnLayers = function() {
+        var _this = this;
+        var stash = [];
+        this.gradient.forEach((function(order) {
+            _this.painters.forEach((function(painter) {
+                var layer = _this.drawLayersService.layerList.find((function(layer) {
+                    return layer.painters.includes(painter);
+                }));
+                if (!layer) return console.warn("[invoke] Layer not found");
+                if (!stash.includes(painter) && layer.order === order) {
+                    _this.invokePainterWithTempCtx(painter.drawType, painter.drawService);
+                    stash.push(painter);
+                }
+            }));
+        }));
+    };
+    DrawAccumulatorService.prototype.invokePainter = function(drawType, painter) {
+        return __awaiter(this, void 0, void 0, (function() {
+            return __generator(this, (function(_a) {
+                switch (_a.label) {
+                  case 0:
+                    if (!(drawType === "image")) return [ 3, 2 ];
+                    return [ 4, painter.drawImage() ];
+
+                  case 1:
+                    _a.sent();
+                    return [ 3, 4 ];
+
+                  case 2:
+                    if (!(drawType === "project")) return [ 3, 4 ];
+                    return [ 4, painter.drawProject() ];
+
+                  case 3:
+                    _a.sent();
+                    _a.label = 4;
+
+                  case 4:
+                    return [ 2 ];
+                }
+            }));
+        }));
+    };
+    DrawAccumulatorService.prototype.invokePainterWithTempCtx = function(drawType, painter) {
+        return __awaiter(this, void 0, void 0, (function() {
+            var imageData, ctx, x, y;
+            return __generator(this, (function(_a) {
+                imageData = painter.tempCanvas.getImageData();
+                ctx = this.appConfig.canvas.getContext("2d");
+                if (drawType === "image") {
+                    x = painter.options.image.drawImageArgs.position.x;
+                    y = painter.options.image.drawImageArgs.position.y;
+                    ctx.putImageData(imageData, x, y);
+                    ctx.save();
+                } else if (drawType === "project") {
+                    ctx.putImageData(imageData, 0, 0);
+                    ctx.save();
+                }
+                return [ 2 ];
+            }));
+        }));
+    };
+    return DrawAccumulatorService;
+}();
+
 reflect();
 
 var WebComponentWrapper = function() {
@@ -2764,7 +2764,7 @@ var WebComponent = function(_super) {
         this.pullProjectService = new PullProjectService(this.throughHistoryService, this.appStoreRepository);
         this.drawService = new DrawService(this.appConfig, this.appStoreRepository, this.eventService);
         this.drawLayersService = new DrawLayersService(this.appStoreRepository);
-        this.drawAccumulator = new DrawAccumulator(this.appConfig, this.appStoreRepository, this.eventService, this.drawLayersService);
+        this.drawAccumulatorService = new DrawAccumulatorService(this.appConfig, this.appStoreRepository, this.eventService, this.drawLayersService);
         this.downloadService = new DownloadService(this.canvasComponent);
         var _a = this.canvasComponent.getComponent(), canvasTemplate = _a.canvasTemplate, canvasStyle = _a.canvasStyle;
         this.canvasElement = this.webComponentWrapper.editorWrap.add(canvasTemplate, canvasStyle);
@@ -2796,7 +2796,7 @@ var WebComponent = function(_super) {
         var projectProcessor = this.projectsService.on("File");
         var serializer = projectProcessor.getSerializerInstance(jsonProjects);
         var projects = serializer.getProjects();
-        this.drawAccumulator.add(layerId, "project", projects[0], projects[0].state.current.size);
+        this.drawAccumulatorService.add(layerId, "project", projects[0], projects[0].state.current.size);
         this.throughHistoryService.recovery(projects[0]);
     };
     return WebComponent;
@@ -2835,4 +2835,4 @@ var VueCanvasEditorEngine = function(_super) {
     return VueCanvasEditorEngine;
 }(CanvasEditorEngine);
 
-export { AppConfig, AppStore, AppStoreRepository, CanvasComponent, CropService, DownloadService, DrawService, EventService, ExcretionsComponent as ExcretionComponent, LoadingComponent, LoggerService, PipetteComponent, ProjectsService, PullProjectService, SlotComponent, StaticCanvasEditorEngine, ThroughHistoryService, ToolLayerService, ToolService, VueCanvasEditorEngine };
+export { AppConfig, AppStore, AppStoreRepository, CanvasComponent, CropService, DownloadService, DrawAccumulatorService, DrawService, EventService, ExcretionsComponent as ExcretionComponent, LoadingComponent, LoggerService, PipetteComponent, ProjectsService, PullProjectService, SlotComponent, StaticCanvasEditorEngine, ThroughHistoryService, ToolLayerService, ToolService, VueCanvasEditorEngine };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "canvas-editor-engine",
-  "version": "2.3.19",
+  "version": "2.3.20",
   "description": "CanvasEditorEngine library, use: [typescript] [canvas]",
   "main": "dist/index.mjs",
   "types": "dist/index.d.ts",

package/dist/services/draw-leayers.service.d.ts

@@ -1,17 +0,0 @@
-import AppStoreRepository from "../store/storeRepository";
-import { ILayer, ILayerUpdate } from "../types/draw-layers";
-import { IPainter } from "../types/draw-service";
-export default class DrawLayersService {
-    private appStoreRepository;
-    layerList: ILayer[];
-    constructor(appStoreRepository: AppStoreRepository);
-    addLayer(layerOptions?: {
-        layerName?: string;
-        painter?: IPainter;
-    }): void;
-    getLayerByOrder(order: number): ILayer;
-    getLayerById(layerId: ILayer['id']): ILayer;
-    addToLayer(id: ILayer['id'], painter: IPainter): void;
-    updateLayer(id: ILayer['id'], updateData?: ILayerUpdate): void;
-    removePainter(id: IPainter['id']): void;
-}

package/dist/services/draw-leayers.service.js

@@ -1,72 +0,0 @@
-var DrawLayersService = /** @class */ (function () {
-    function DrawLayersService(appStoreRepository) {
-        this.appStoreRepository = appStoreRepository;
-        this.layerList = [];
-        this.addLayer({ layerName: 'Base Layer' });
-    }
-    DrawLayersService.prototype.addLayer = function (layerOptions) {
-        var _a;
-        var layerName = layerOptions === null || layerOptions === void 0 ? void 0 : layerOptions.layerName;
-        var painter = layerOptions === null || layerOptions === void 0 ? void 0 : layerOptions.painter;
-        var id = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
-        var name = (function () {
-            if (layerName)
-                return layerName;
-            if (painter) {
-                return "".concat(painter.drawType, "-").concat(painter.id);
-            }
-            else {
-                return 'New Layer';
-            }
-        })();
-        var painters = (painter) ? [painter] : [];
-        var sortedLayers = (_a = this.layerList) === null || _a === void 0 ? void 0 : _a.sort(function (a, b) { return a.order - b.order; });
-        var order = (sortedLayers === null || sortedLayers === void 0 ? void 0 : sortedLayers.length) ? sortedLayers.at(-1).order + 1 : 1;
-        var layer = {
-            id: id,
-            painters: painters,
-            order: order,
-            name: name,
-        };
-        this.layerList.push(layer);
-        this.appStoreRepository.store.drawLayersState.reduce('ADD_LAYER', layer);
-    };
-    DrawLayersService.prototype.getLayerByOrder = function (order) {
-        return this.layerList.find(function (layer) { return layer.order === order; });
-    };
-    DrawLayersService.prototype.getLayerById = function (layerId) {
-        return this.layerList.find(function (layer) { return layer.id === layerId; });
-    };
-    DrawLayersService.prototype.addToLayer = function (id, painter) {
-        var layerIndex = this.layerList.findIndex(function (layer) { return layer.id === id; });
-        if (layerIndex === -1)
-            return;
-        var layer = this.layerList[layerIndex];
-        layer.painters.push(painter);
-        this.appStoreRepository.store.drawLayersState.reduce('UPDATE_LAYER', layer);
-    };
-    DrawLayersService.prototype.updateLayer = function (id, updateData) {
-        var layerIndex = this.layerList.findIndex(function (layer) { return layer.id === id; });
-        var fields = Object.keys(updateData);
-        if (!fields.length || layerIndex === -1)
-            return;
-        var layer = this.layerList[layerIndex];
-        fields.forEach(function (field) {
-            layer[field] = updateData[field];
-        });
-        this.layerList[layerIndex] = layer;
-        this.appStoreRepository.store.drawLayersState.reduce('UPDATE_LAYER', layer);
-    };
-    DrawLayersService.prototype.removePainter = function (id) {
-        var layerIndex = this.layerList.findIndex(function (layer) {
-            return layer.painters.find(function (painter) { return painter.id === id; });
-        });
-        if (layerIndex === -1)
-            return;
-        this.layerList[layerIndex].painters = this.layerList[layerIndex].painters.filter(function (painter) { return painter.id !== id; });
-        var layer = this.layerList[layerIndex];
-        this.appStoreRepository.store.drawLayersState.reduce('UPDATE_LAYER', layer);
-    };
-    return DrawLayersService;
-}());
-export default DrawLayersService;