canvas-editor-engine 1.0.1 → 1.0.3

package/dist/components/canvas.component.js

@@ -2,7 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const config_1 = require("../config");
 const component_service_1 = require("../services/component.service");
+const logger_service_1 = require("../services/logger.service");
 class CanvasComponent extends component_service_1.default {
+    ;
     static getComponent() {
         const canvasTemplate = CanvasComponent.getTemplate(CanvasComponent.template);
         const canvasStyle = CanvasComponent.getStyle(CanvasComponent.css);
@@ -72,4 +74,13 @@ CanvasComponent._cursorStyle = {
     before: null,
     current: 'default',
 };
+(() => {
+    logger_service_1.default.components.add({
+        info: {
+            name: 'canvas',
+            description: 'canvas component',
+        },
+        prototype: CanvasComponent,
+    });
+})();
 exports.default = CanvasComponent;

package/dist/components/crop.component.d.ts

@@ -0,0 +1,5 @@
+import ComponentService from "../services/component.service";
+export default class CropComponent extends ComponentService {
+    private static template;
+    private static css;
+}

package/dist/components/crop.component.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const component_service_1 = require("../services/component.service");
+class CropComponent extends component_service_1.default {
+}
+CropComponent.template = '';
+CropComponent.css = '';
+exports.default = CropComponent;

package/dist/components/excretions.component.d.ts

@@ -1,5 +1,5 @@
 import ComponentService from "../services/component.service";
-import type { IExcretionsCoords, TExcretionToolState } from "../types/excretion";
+import type { IExcretionsCoords, TExcretionStyle, TExcretionToolState } from "../types/excretion";
 export default class ExcretionsComponent extends ComponentService {
     private static template;
     private static css;
@@ -10,6 +10,10 @@ export default class ExcretionsComponent extends ComponentService {
     private static _excretionToolState;
     private static _tempCoords;
     static excretionsCoords: IExcretionsCoords[];
+    private static _style;
+    static get style(): TExcretionStyle;
+    static set style(value: TExcretionStyle);
+    private static applyExcretionStyle;
     private static tool;
     static getComponent(): {
         excretionsTemplate: HTMLElement;

package/dist/components/excretions.component.js

@@ -3,7 +3,36 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const component_service_1 = require("../services/component.service");
 const tool_service_1 = require("../services/tool.service");
 const canvas_component_1 = require("./canvas.component");
+const logger_service_1 = require("../services/logger.service");
 class ExcretionsComponent extends component_service_1.default {
+    static get style() {
+        return ExcretionsComponent._style;
+    }
+    static set style(value) {
+        ExcretionsComponent._style = value;
+        ExcretionsComponent.applyExcretionStyle();
+    }
+    static applyExcretionStyle() {
+        if (ExcretionsComponent._style === 'crop') {
+            ExcretionsComponent._excretions.forEach((excretion) => {
+                if (!!excretion) {
+                    if (!excretion.classList.contains('excretion_crop')) {
+                        excretion.classList.add("excretion_crop");
+                    }
+                }
+            });
+        }
+        else {
+            ExcretionsComponent._excretions.forEach((excretion) => {
+                if (!!excretion) {
+                    if (excretion.classList.contains('excretion_crop')) {
+                        excretion.classList.remove("excretion_crop");
+                    }
+                }
+            });
+        }
+    }
+    ;
     static getComponent() {
         const wrapOptions = {
             className: 'excretions-wrap',
@@ -16,6 +45,7 @@ class ExcretionsComponent extends component_service_1.default {
     }
     static set excretionState(state) {
         ExcretionsComponent._excretionState = state;
+        ExcretionsComponent.applyExcretionStyle();
         switch (state) {
             case 'abandoned':
                 canvas_component_1.default.cursorStyle = 'default';
@@ -96,6 +126,7 @@ class ExcretionsComponent extends component_service_1.default {
                 };
                 ExcretionsComponent._tempCoords.push(tempStart);
             }
+            ExcretionsComponent.applyExcretionStyle();
             ExcretionsComponent._excretionActivity = 'active';
         });
         canvas_component_1.default.subscribe('mousemove', (event, cursorPosition) => {
@@ -164,6 +195,10 @@ ExcretionsComponent.css = `
       animation: border-dance 1s infinite linear;
     }
 
+    .excretion_crop {
+      box-shadow: 0px 0px 0px 100% rgba(34, 60, 80, 0.2);
+    }
+
     @keyframes border-dance {
       0% {
         background-position: left top, right bottom, left bottom, right top;
@@ -179,6 +214,7 @@ ExcretionsComponent._excretionActivity = 'abandoned';
 ExcretionsComponent._excretionToolState = 'abandoned';
 ExcretionsComponent._tempCoords = [];
 ExcretionsComponent.excretionsCoords = [];
+ExcretionsComponent._style = 'default';
 ExcretionsComponent.tool = {
     id: 1,
     name: 'excretion',
@@ -188,5 +224,12 @@ ExcretionsComponent.tool = {
 };
 (() => {
     tool_service_1.default.add(ExcretionsComponent.tool);
+    logger_service_1.default.components.add({
+        info: {
+            name: 'excretion',
+            description: 'excretion component',
+        },
+        prototype: ExcretionsComponent,
+    });
 })();
 exports.default = ExcretionsComponent;

package/dist/components/pipette.component.js

@@ -4,6 +4,7 @@ const convert_1 = require("../utils/convert");
 const canvas_component_1 = require("./canvas.component");
 const component_service_1 = require("../services/component.service");
 const tool_service_1 = require("../services/tool.service");
+const logger_service_1 = require("../services/logger.service");
 class PipetteComponent extends component_service_1.default {
     static set pipetteColor(color) {
         PipetteComponent._pipetteColor = color;
@@ -134,5 +135,12 @@ PipetteComponent.tool = {
 };
 (() => {
     tool_service_1.default.add(PipetteComponent.tool);
+    logger_service_1.default.components.add({
+        info: {
+            name: 'pipette',
+            description: 'pipette component',
+        },
+        prototype: PipetteComponent,
+    });
 })();
 exports.default = PipetteComponent;

package/dist/components/slot.component.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const component_service_1 = require("../services/component.service");
+const logger_service_1 = require("../services/logger.service");
 class SlotComponent extends component_service_1.default {
     static getComponent(slotName) {
         const wrapOptions = {
@@ -17,4 +18,13 @@ SlotComponent.template = `
     <slot class="slot"></slot>
   `;
 SlotComponent.css = ``;
+(() => {
+    logger_service_1.default.components.add({
+        info: {
+            name: 'slot',
+            description: 'slot component',
+        },
+        prototype: SlotComponent,
+    });
+})();
 exports.default = SlotComponent;

package/dist/index.d.ts

@@ -6,6 +6,7 @@ import ExcretionComponent from "./components/excretions.component";
 import SlotComponent from "./components/slot.component";
 import DrawService from "./services/draw.service";
 import ToolService from "./services/tool.service";
+import LoggerService from "./services/logger.service";
 declare class CanvasEditorEngine {
     constructor(webComponentTagName?: string);
     getInitial(): {
@@ -22,4 +23,4 @@ declare class VueCanvasEditorEngine extends CanvasEditorEngine {
     getContext2D(): CanvasRenderingContext2D;
     getCanvas(): HTMLCanvasElement;
 }
-export { AppConfig, PipetteComponent, CanvasComponent, ExcretionComponent, SlotComponent, ToolService, DrawService, StaticCanvasEditorEngine, VueCanvasEditorEngine, };
+export { AppConfig, PipetteComponent, CanvasComponent, ExcretionComponent, SlotComponent, ToolService, DrawService, LoggerService, StaticCanvasEditorEngine, VueCanvasEditorEngine, };

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VueCanvasEditorEngine = exports.StaticCanvasEditorEngine = exports.DrawService = exports.ToolService = exports.SlotComponent = exports.ExcretionComponent = exports.CanvasComponent = exports.PipetteComponent = exports.AppConfig = void 0;
+exports.VueCanvasEditorEngine = exports.StaticCanvasEditorEngine = exports.LoggerService = exports.DrawService = exports.ToolService = exports.SlotComponent = exports.ExcretionComponent = exports.CanvasComponent = exports.PipetteComponent = exports.AppConfig = void 0;
 const config_1 = require("./config");
 exports.AppConfig = config_1.default;
 const web_component_1 = require("./web-component");
@@ -16,6 +16,8 @@ const draw_service_1 = require("./services/draw.service");
 exports.DrawService = draw_service_1.default;
 const tool_service_1 = require("./services/tool.service");
 exports.ToolService = tool_service_1.default;
+const logger_service_1 = require("./services/logger.service");
+exports.LoggerService = logger_service_1.default;
 class CanvasEditorEngine {
     constructor(webComponentTagName) {
         config_1.default.WEB_COMPONENT_TAG_NAME = webComponentTagName;

package/dist/services/logger.service.d.ts

@@ -0,0 +1,20 @@
+import { ILog, ILogItem } from "../types/log";
+import ComponentService from "./component.service";
+export default class LoggerService {
+    static log: ILog<ComponentService, any, any>;
+    static get components(): {
+        add<TLogPrototype>(logItem: ILogItem<TLogPrototype>): void;
+        get<TLogPrototype>(field: keyof ILog<ComponentService, any, any>, name: string): void;
+    };
+    static get services(): {
+        add<TLogPrototype>(logItem: ILogItem<TLogPrototype>): void;
+        get<TLogPrototype>(field: keyof ILog<ComponentService, any, any>, name: string): void;
+    };
+    static get planed(): {
+        add<TLogPrototype>(logItem: ILogItem<TLogPrototype>): void;
+        get<TLogPrototype>(field: keyof ILog<ComponentService, any, any>, name: string): void;
+    };
+    private static getMethods;
+    private static _add;
+    private static _get;
+}

package/dist/services/logger.service.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+class LoggerService {
+    static get components() {
+        return LoggerService.getMethods('components');
+    }
+    ;
+    static get services() {
+        return LoggerService.getMethods('services');
+    }
+    ;
+    static get planed() {
+        return LoggerService.getMethods('planed');
+    }
+    ;
+    static getMethods(fields) {
+        return {
+            add(logItem) {
+                LoggerService._add(fields, logItem);
+            },
+            get(...args) {
+                LoggerService._get(...args);
+            },
+        };
+    }
+    static _add(field, logItem) {
+        LoggerService.log[field].push(logItem);
+    }
+    static _get(field, name) {
+        return LoggerService.log[field].find((logItem) => logItem.info.name === name);
+    }
+}
+LoggerService.log = {
+    components: [],
+    services: [],
+    planed: [],
+};
+exports.default = LoggerService;

package/dist/types/excretion.d.ts

@@ -24,3 +24,4 @@ export type TExcretionTempCoords = (IExcretionTempStart | IExcretionTempEnd)[];
 export type TExcretionToolState = 'taken' | 'abandoned';
 export type TExcretionState = 'create' | 'add' | 'remove' | 'abandoned';
 export type TExcretionActivity = 'active' | 'end' | 'abandoned';
+export type TExcretionStyle = 'default' | 'crop';

package/dist/types/log.d.ts

@@ -0,0 +1,13 @@
+export interface ILog<A, R, P> {
+    components: ILogItem<A>[];
+    services: ILogItem<R>[];
+    planed: ILogItem<P>[];
+}
+export interface ILogItem<TLogPrototype> {
+    info: ILogItemInfo;
+    prototype: TLogPrototype;
+}
+export interface ILogItemInfo {
+    name: string;
+    description: string;
+}

package/dist/types/log.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+;
+;
+;

package/package.json

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