kritzel-stencil 0.0.157 → 0.0.159

package/dist/collection/classes/structures/quadtree.structure.js

@@ -0,0 +1,113 @@
+export class KritzelQuadtree {
+    bounds;
+    capacity;
+    objects = [];
+    children = null;
+    constructor(bounds, capacity = 16) {
+        this.bounds = bounds;
+        this.capacity = capacity;
+    }
+    reset() {
+        this.objects = [];
+        this.children = null;
+    }
+    insert(object) {
+        if (!this.intersects(object.rotatedBoundingBox, this.bounds)) {
+            return false;
+        }
+        if (this.objects.length < this.capacity && this.children === null) {
+            this.objects.push(object);
+            return true;
+        }
+        if (this.children === null) {
+            this.subdivide();
+        }
+        for (const child of this.children) {
+            if (child.insert(object)) {
+                return true;
+            }
+        }
+        return false;
+    }
+    update(object) {
+        const index = this.objects.findIndex(o => o.id === object.id);
+        if (index !== -1) {
+            this.objects[index] = object;
+            return true;
+        }
+        if (this.children !== null) {
+            for (const child of this.children) {
+                if (child.update(object)) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
+    remove(predicate) {
+        const index = this.objects.findIndex(o => predicate(o));
+        if (index !== -1) {
+            this.objects.splice(index, 1);
+        }
+        if (this.children !== null) {
+            for (const child of this.children) {
+                child.remove(predicate);
+            }
+        }
+    }
+    query(range) {
+        const results = [];
+        if (!this.intersects(range, this.bounds)) {
+            return results;
+        }
+        for (const object of this.objects) {
+            if (this.intersects(object.rotatedBoundingBox, range)) {
+                results.push(object);
+            }
+        }
+        if (this.children !== null) {
+            for (const child of this.children) {
+                results.push(...child.query(range));
+            }
+        }
+        return results;
+    }
+    filter(predicate) {
+        const results = this.objects.filter(o => predicate(o));
+        if (this.children !== null) {
+            for (const child of this.children) {
+                results.push(...child.filter(predicate));
+            }
+        }
+        return results;
+    }
+    allObjects() {
+        const results = [...this.objects];
+        if (this.children !== null) {
+            for (const child of this.children) {
+                results.push(...child.allObjects());
+            }
+        }
+        return results;
+    }
+    subdivide() {
+        const { x, y, z, width, height } = this.bounds;
+        const halfWidth = width / 2;
+        const halfHeight = height / 2;
+        // Create 4 quadrants: NW, NE, SW, SE
+        this.children = [
+            new KritzelQuadtree({ x, y, z, width: halfWidth, height: halfHeight }, this.capacity), // Northwest
+            new KritzelQuadtree({ x: x + halfWidth, y, z, width: halfWidth, height: halfHeight }, this.capacity), // Northeast
+            new KritzelQuadtree({ x, y: y + halfHeight, z, width: halfWidth, height: halfHeight }, this.capacity), // Southwest
+            new KritzelQuadtree({ x: x + halfWidth, y: y + halfHeight, z, width: halfWidth, height: halfHeight }, this.capacity), // Southeast
+        ];
+    }
+    intersects(a, b) {
+        return !(a.x >= b.x + b.width || // a is completely to the right of b
+            a.x + a.width <= b.x || // a is completely to the left of b
+            a.y >= b.y + b.height || // a is completely below b
+            a.y + a.height <= b.y // a is completely above b
+        );
+    }
+}
+//# sourceMappingURL=quadtree.structure.js.map

package/dist/collection/classes/structures/quadtree.structure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"quadtree.structure.js","sourceRoot":"","sources":["../../../src/classes/structures/quadtree.structure.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelBoundingBox } from '../../interfaces/bounding-box.interface';\r\nimport { KritzelBaseObject } from '../objects/base-object.class';\r\n\r\nexport class KritzelQuadtree<T extends KritzelBaseObject<any>> {\r\n  private bounds: KritzelBoundingBox;\r\n  private capacity: number;\r\n  private objects: T[] = [];\r\n  private children: KritzelQuadtree<T>[] | null = null;\r\n\r\n  constructor(bounds: KritzelBoundingBox, capacity: number = 16) {\r\n    this.bounds = bounds;\r\n    this.capacity = capacity;\r\n  }\r\n\r\n  reset(): void {\r\n    this.objects = [];\r\n    this.children = null;\r\n  }\r\n\r\n  insert(object: T): boolean {\r\n    if (!this.intersects(object.rotatedBoundingBox, this.bounds)) {\r\n      return false;\r\n    }\r\n\r\n    if (this.objects.length < this.capacity && this.children === null) {\r\n      this.objects.push(object);\r\n      return true;\r\n    }\r\n\r\n    if (this.children === null) {\r\n      this.subdivide();\r\n    }\r\n\r\n    for (const child of this.children!) {\r\n      if (child.insert(object)) {\r\n        return true;\r\n      }\r\n    }\r\n\r\n    return false;\r\n  }\r\n\r\n  update(object: T): boolean {\r\n    const index = this.objects.findIndex(o => o.id === object.id);\r\n\r\n    if (index !== -1) {\r\n      this.objects[index] = object;\r\n      return true;\r\n    }\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        if (child.update(object)) {\r\n          return true;\r\n        }\r\n      }\r\n    }\r\n    return false;\r\n  }\r\n\r\n  remove(predicate: (object: T) => boolean): void {\r\n    const index = this.objects.findIndex(o => predicate(o));\r\n    if (index !== -1) {\r\n      this.objects.splice(index, 1);\r\n    }\r\n\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        child.remove(predicate);\r\n      }\r\n    }\r\n  }\r\n\r\n  query(range: KritzelBoundingBox): T[] {\r\n    const results: T[] = [];\r\n\r\n    if (!this.intersects(range, this.bounds)) {\r\n      return results;\r\n    }\r\n\r\n    for (const object of this.objects) {\r\n      if (this.intersects(object.rotatedBoundingBox, range)) {\r\n        results.push(object);\r\n      }\r\n    }\r\n\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.query(range));\r\n      }\r\n    }\r\n\r\n    return results;\r\n  }\r\n\r\n  filter(predicate: (object: T) => boolean): T[] {\r\n    const results: T[] = this.objects.filter(o => predicate(o));\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.filter(predicate));\r\n      }\r\n    }\r\n    return results;\r\n  }\r\n\r\n  allObjects(): T[] {\r\n    const results: T[] = [...this.objects];\r\n    if (this.children !== null) {\r\n      for (const child of this.children) {\r\n        results.push(...child.allObjects());\r\n      }\r\n    }\r\n    return results;\r\n  }\r\n\r\n  private subdivide(): void {\r\n    const { x, y, z, width, height } = this.bounds;\r\n    const halfWidth = width / 2;\r\n    const halfHeight = height / 2;\r\n\r\n    // Create 4 quadrants: NW, NE, SW, SE\r\n    this.children = [\r\n      new KritzelQuadtree<T>({ x, y, z, width: halfWidth, height: halfHeight }, this.capacity), // Northwest\r\n      new KritzelQuadtree<T>({ x: x + halfWidth, y, z, width: halfWidth, height: halfHeight }, this.capacity), // Northeast\r\n      new KritzelQuadtree<T>({ x, y: y + halfHeight, z, width: halfWidth, height: halfHeight }, this.capacity), // Southwest\r\n      new KritzelQuadtree<T>({ x: x + halfWidth, y: y + halfHeight, z, width: halfWidth, height: halfHeight }, this.capacity), // Southeast\r\n    ];\r\n  }\r\n\r\n  private intersects(a: KritzelBoundingBox, b: KritzelBoundingBox): boolean {\r\n    return !(\r\n      a.x >= b.x + b.width || // a is completely to the right of b\r\n      a.x + a.width <= b.x || // a is completely to the left of b\r\n      a.y >= b.y + b.height || // a is completely below b\r\n      a.y + a.height <= b.y // a is completely above b\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/base-tool.class.js

@@ -0,0 +1,38 @@
+export class KritzelBaseTool {
+    __class__ = this.constructor.name;
+    name = 'base-tool';
+    _core;
+    constructor(core) {
+        this._core = core;
+        void this._core; // Avoid unused variable warning
+    }
+    onActivate() {
+        // default implementation
+    }
+    onDeactivate() {
+        // default implementation
+    }
+    handlePointerDown(_event) {
+        // default implementation
+    }
+    handlePointerMove(_event) {
+        // default implementation
+    }
+    handlePointerUp(_event) {
+        // default implementation
+    }
+    handleWheel(_event) {
+        // default implementation
+    }
+    serialize() {
+        return {
+            __class__: this.__class__,
+            name: this.name,
+        };
+    }
+    deserialize(object) {
+        Object.assign(this, object);
+        return this;
+    }
+}
+//# sourceMappingURL=base-tool.class.js.map

package/dist/collection/classes/tools/base-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/base-tool.class.ts"],"names":[],"mappings":"AAIA,MAAM,OAAO,eAAe;IAC1B,SAAS,GAAW,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;IAE1C,IAAI,GAAW,WAAW,CAAC;IAER,KAAK,CAAc;IAEtC,YAAY,IAAiB;QAC3B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,KAAK,IAAI,CAAC,KAAK,CAAC,CAAC,gCAAgC;IACnD,CAAC;IAED,UAAU;QACR,yBAAyB;IAC3B,CAAC;IAED,YAAY;QACV,yBAAyB;IAC3B,CAAC;IAED,iBAAiB,CAAC,MAAoB;QACpC,yBAAyB;IAC3B,CAAC;IAED,iBAAiB,CAAC,MAAoB;QACpC,yBAAyB;IAC3B,CAAC;IAED,eAAe,CAAC,MAAoB;QAClC,yBAAyB;IAC3B,CAAC;IAED,WAAW,CAAC,MAAkB;QAC5B,yBAAyB;IAC3B,CAAC;IAED,SAAS;QACP,OAAO;YACL,SAAS,EAAE,IAAI,CAAC,SAAS;YACzB,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAC;IACJ,CAAC;IAED,WAAW,CAAC,MAAW;QACrB,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;QAC5B,OAAO,IAAI,CAAC;IACd,CAAC;CACF","sourcesContent":["import { KritzelTool } from '../../components';\r\nimport { KritzelSerializable } from '../../interfaces/serializable.interface';\r\nimport { KritzelCore } from '../core/core.class';\r\n\r\nexport class KritzelBaseTool implements KritzelTool, KritzelSerializable {\r\n  __class__: string = this.constructor.name;\r\n\r\n  name: string = 'base-tool';\r\n\r\n  protected readonly _core: KritzelCore;\r\n\r\n  constructor(core: KritzelCore) {\r\n    this._core = core;\r\n    void this._core; // Avoid unused variable warning\r\n  }\r\n\r\n  onActivate(): void {\r\n    // default implementation\r\n  }\r\n\r\n  onDeactivate(): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerDown(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerMove(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handlePointerUp(_event: PointerEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  handleWheel(_event: WheelEvent): void {\r\n    // default implementation\r\n  }\r\n\r\n  serialize() {\r\n    return {\r\n      __class__: this.__class__,\r\n      name: this.name,\r\n    };\r\n  }\r\n\r\n  deserialize(object: any): KritzelSerializable {\r\n    Object.assign(this, object);\r\n    return this;\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/brush-tool.class.js

@@ -0,0 +1,133 @@
+import { KritzelEventHelper } from "../../helpers/event.helper";
+import { KritzelPath } from "../objects/path.class";
+import { KritzelBaseTool } from "./base-tool.class";
+export class KritzelBrushTool extends KritzelBaseTool {
+    type = 'pen';
+    color = '#000000';
+    size = 6;
+    palettes = {
+        pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],
+        highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],
+    };
+    constructor(core) {
+        super(core);
+    }
+    handlePointerDown(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (KritzelEventHelper.isLeftClick(event)) {
+                this._core.store.state.isDrawing = true;
+                const x = event.clientX - this._core.store.offsetX;
+                const y = event.clientY - this._core.store.offsetY;
+                const path = KritzelPath.create(this._core, {
+                    points: [[x, y]],
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+                path.isCompleted = false;
+                this._core.store.state.objects.insert(path);
+            }
+        }
+        if (event.pointerType === 'touch') {
+            const activePointers = Array.from(this._core.store.state.pointers.values());
+            if (activePointers.length === 1) {
+                const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+                const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+                this._core.store.state.isDrawing = true;
+                const path = KritzelPath.create(this._core, {
+                    points: [[x, y]],
+                    translateX: -this._core.store.state.translateX,
+                    translateY: -this._core.store.state.translateY,
+                    scale: this._core.store.state.scale,
+                    fill: this.color,
+                    strokeWidth: this.size,
+                });
+                path.isCompleted = false;
+                this._core.store.state.objects.insert(path);
+            }
+        }
+    }
+    handlePointerMove(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (this._core.store.state.isDrawing) {
+                const currentPath = this._core.store.currentPath;
+                if (currentPath) {
+                    const x = event.clientX - this._core.store.offsetX;
+                    const y = event.clientY - this._core.store.offsetY;
+                    const updatedPath = KritzelPath.create(this._core, {
+                        points: [...currentPath.points, [x, y]],
+                        translateX: -this._core.store.state.translateX,
+                        translateY: -this._core.store.state.translateY,
+                        scale: this._core.store.state.scale,
+                        fill: this.color,
+                        strokeWidth: this.size,
+                    });
+                    updatedPath.id = currentPath.id;
+                    updatedPath.workspaceId = currentPath.workspaceId;
+                    updatedPath.isCompleted = false;
+                    this._core.store.state.objects.update(updatedPath);
+                }
+            }
+        }
+        if (event.pointerType === 'touch') {
+            const activePointers = Array.from(this._core.store.state.pointers.values());
+            if (activePointers.length === 1) {
+                const currentPath = this._core.store.currentPath;
+                if (currentPath) {
+                    const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);
+                    const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);
+                    const updatedPath = KritzelPath.create(this._core, {
+                        points: [...currentPath.points, [x, y]],
+                        translateX: -this._core.store.state.translateX,
+                        translateY: -this._core.store.state.translateY,
+                        scale: this._core.store.state.scale,
+                        fill: this.color,
+                        strokeWidth: this.size,
+                    });
+                    updatedPath.id = currentPath.id;
+                    updatedPath.workspaceId = currentPath.workspaceId;
+                    updatedPath.isCompleted = false;
+                    this._core.store.state.objects.update(updatedPath);
+                }
+            }
+        }
+    }
+    handlePointerUp(event) {
+        if (event.cancelable) {
+            event.preventDefault();
+        }
+        if (event.pointerType === 'mouse') {
+            if (this._core.store.state.isDrawing) {
+                this._core.store.state.isDrawing = false;
+                const currentPath = this._core.store.currentPath;
+                if (currentPath) {
+                    currentPath.isCompleted = true;
+                    currentPath.zIndex = this._core.store.currentZIndex;
+                    this._core.store.state.objects.update(currentPath);
+                    this._core.engine.emitObjectsChange();
+                }
+            }
+        }
+        if (event.pointerType === 'touch') {
+            if (this._core.store.state.isDrawing) {
+                this._core.store.state.isDrawing = false;
+                const currentPath = this._core.store.currentPath;
+                if (currentPath) {
+                    currentPath.isCompleted = true;
+                    currentPath.zIndex = this._core.store.currentZIndex;
+                    this._core.store.state.objects.update(currentPath);
+                    this._core.engine.emitObjectsChange();
+                }
+            }
+        }
+    }
+}
+//# sourceMappingURL=brush-tool.class.js.map

package/dist/collection/classes/tools/brush-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brush-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/brush-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelEventHelper } from '../../helpers/event.helper';\r\nimport { KritzelPath } from '../objects/path.class';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\nimport { KritzelCore } from '../core/core.class';\r\n\r\nexport class KritzelBrushTool extends KritzelBaseTool {\r\n  type: 'pen' | 'highlighter' = 'pen';\r\n\r\n  color: string = '#000000';\r\n\r\n  size: number = 6;\r\n\r\n  palettes: {\r\n    [brushType: string]: string[];\r\n  } = {\r\n    pen: ['#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF', '#FFFF00', '#FF00FF', '#00FFFF', '#808080', '#C0C0C0', '#800000', '#008000', '#000080', '#808000', '#800080'],\r\n    highlighter: ['#ffff00', '#ffb347', '#b4ffb4'],\r\n  };\r\n\r\n  constructor(core: KritzelCore) {\r\n    super(core);\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (KritzelEventHelper.isLeftClick(event)) {\r\n        this._core.store.state.isDrawing = true;\r\n        const x = event.clientX - this._core.store.offsetX;\r\n        const y = event.clientY - this._core.store.offsetY;\r\n\r\n        const path = KritzelPath.create(this._core, {\r\n          points: [[x, y]],\r\n          translateX: -this._core.store.state.translateX,\r\n          translateY: -this._core.store.state.translateY,\r\n          scale: this._core.store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n        path.isCompleted = false;\r\n        \r\n        this._core.store.state.objects.insert(path);\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      const activePointers = Array.from(this._core.store.state.pointers.values());\r\n\r\n      if (activePointers.length === 1) {\r\n        const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);\r\n        const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);\r\n\r\n        this._core.store.state.isDrawing = true;\r\n\r\n        const path = KritzelPath.create(this._core, {\r\n          points: [[x, y]],\r\n          translateX: -this._core.store.state.translateX,\r\n          translateY: -this._core.store.state.translateY,\r\n          scale: this._core.store.state.scale,\r\n          fill: this.color,\r\n          strokeWidth: this.size,\r\n        });\r\n        path.isCompleted = false;\r\n\r\n        this._core.store.state.objects.insert(path);\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._core.store.state.isDrawing) {\r\n        const currentPath = this._core.store.currentPath;\r\n        if (currentPath) {\r\n          const x = event.clientX - this._core.store.offsetX;\r\n          const y = event.clientY - this._core.store.offsetY;\r\n\r\n          const updatedPath = KritzelPath.create(this._core, {\r\n            points: [...currentPath.points, [x, y]],\r\n            translateX: -this._core.store.state.translateX,\r\n            translateY: -this._core.store.state.translateY,\r\n            scale: this._core.store.state.scale,\r\n            fill: this.color,\r\n            strokeWidth: this.size,\r\n          });\r\n          updatedPath.id = currentPath.id;\r\n          updatedPath.workspaceId = currentPath.workspaceId;\r\n          updatedPath.isCompleted = false;\r\n\r\n          this._core.store.state.objects.update(updatedPath);\r\n        }\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      const activePointers = Array.from(this._core.store.state.pointers.values());\r\n\r\n      if (activePointers.length === 1) {\r\n        const currentPath = this._core.store.currentPath;\r\n        if (currentPath) {\r\n          const x = Math.round(activePointers[0].clientX - this._core.store.offsetX);\r\n          const y = Math.round(activePointers[0].clientY - this._core.store.offsetY);\r\n\r\n          const updatedPath = KritzelPath.create(this._core, {\r\n            points: [...currentPath.points, [x, y]],\r\n            translateX: -this._core.store.state.translateX,\r\n            translateY: -this._core.store.state.translateY,\r\n            scale: this._core.store.state.scale,\r\n            fill: this.color,\r\n            strokeWidth: this.size,\r\n          });\r\n          updatedPath.id = currentPath.id;\r\n          updatedPath.workspaceId = currentPath.workspaceId;\r\n          updatedPath.isCompleted = false;\r\n\r\n          this._core.store.state.objects.update(updatedPath);\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerUp(event: PointerEvent): void {\r\n    if (event.cancelable) {\r\n      event.preventDefault();\r\n    }\r\n\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._core.store.state.isDrawing) {\r\n        this._core.store.state.isDrawing = false;\r\n\r\n        const currentPath = this._core.store.currentPath;\r\n        if (currentPath) {\r\n          currentPath.isCompleted = true;\r\n          currentPath.zIndex = this._core.store.currentZIndex;\r\n          this._core.store.state.objects.update(currentPath);\r\n          this._core.engine.emitObjectsChange();\r\n        }\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._core.store.state.isDrawing) {\r\n        this._core.store.state.isDrawing = false;\r\n\r\n        const currentPath = this._core.store.currentPath;\r\n        if (currentPath) {\r\n          currentPath.isCompleted = true;\r\n          currentPath.zIndex = this._core.store.currentZIndex;\r\n          this._core.store.state.objects.update(currentPath);\r\n          this._core.engine.emitObjectsChange();\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/eraser-tool.class.js

@@ -0,0 +1,85 @@
+import { KritzelEventHelper } from "../../helpers/event.helper";
+import { KritzelBaseTool } from "./base-tool.class";
+export class KritzelEraserTool extends KritzelBaseTool {
+    touchStartTimeout = null;
+    constructor(core) {
+        super(core);
+    }
+    handlePointerDown(event) {
+        if (event.pointerType === 'mouse') {
+            if (KritzelEventHelper.isLeftClick(event)) {
+                this._core.store.state.isErasing = true;
+            }
+        }
+        if (event.pointerType === 'touch') {
+            this.touchStartTimeout = setTimeout(() => {
+                if (this._core.store.state.pointers.size === 1 && !this._core.store.state.isScaling) {
+                    this._core.store.state.isErasing = true;
+                }
+            }, 80);
+        }
+    }
+    handlePointerMove(event) {
+        if (event.pointerType === 'mouse') {
+            if (this._core.store.state.isErasing) {
+                const selectedObjects = this._core.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
+                    return;
+                const x = this._core.store.state.pointerX;
+                const y = this._core.store.state.pointerY;
+                selectedObjects.forEach(selectedObject => {
+                    selectedObject.markedForRemoval = selectedObject.hitTest(x, y);
+                });
+                this._core.rerender();
+            }
+        }
+        if (event.pointerType === 'touch') {
+            if (this._core.store.state.pointers.size === 1 && this._core.store.state.isErasing) {
+                const shadowRoot = this._core.store.state.host?.shadowRoot;
+                if (!shadowRoot)
+                    return;
+                const selectedObjects = this._core.getObjectsFromPointerEvent(event, '.object');
+                if (selectedObjects.length === 0)
+                    return;
+                const x = this._core.store.state.pointerX;
+                const y = this._core.store.state.pointerY;
+                selectedObjects.forEach(selectedObject => {
+                    selectedObject.markedForRemoval = selectedObject.hitTest(x, y);
+                });
+                this._core.rerender();
+            }
+        }
+    }
+    handlePointerUp(event) {
+        if (event.pointerType === 'mouse') {
+            if (this._core.store.state.isErasing) {
+                const objectsToRemove = this._core.store.allObjects.filter(object => object.markedForRemoval);
+                objectsToRemove.forEach(object => {
+                    object.markedForRemoval = false;
+                    this._core.removeObject(object);
+                });
+                if (objectsToRemove.length > 0) {
+                    this._core.rerender();
+                }
+                this._core.store.state.isErasing = false;
+                this._core.engine.emitObjectsChange();
+            }
+        }
+        if (event.pointerType === 'touch') {
+            clearTimeout(this.touchStartTimeout);
+            if (this._core.store.state.isErasing) {
+                const objectsToRemove = this._core.store.allObjects.filter(object => object.markedForRemoval);
+                objectsToRemove.forEach(object => {
+                    object.markedForRemoval = false;
+                    this._core.removeObject(object);
+                });
+                if (objectsToRemove.length > 0) {
+                    this._core.rerender();
+                }
+                this._core.store.state.isErasing = false;
+                this._core.engine.emitObjectsChange();
+            }
+        }
+    }
+}
+//# sourceMappingURL=eraser-tool.class.js.map

package/dist/collection/classes/tools/eraser-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"eraser-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/eraser-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelEventHelper } from '../../helpers/event.helper';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\nimport { KritzelCore } from '../core/core.class';\r\n\r\nexport class KritzelEraserTool extends KritzelBaseTool {\r\n  touchStartTimeout: any = null;\r\n\r\n  constructor(core: KritzelCore) {\r\n    super(core);\r\n  }\r\n\r\n  handlePointerDown(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (KritzelEventHelper.isLeftClick(event)) {\r\n        this._core.store.state.isErasing = true;\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      this.touchStartTimeout = setTimeout(() => {\r\n        if (this._core.store.state.pointers.size === 1 && !this._core.store.state.isScaling) {\r\n          this._core.store.state.isErasing = true;\r\n        }\r\n      }, 80);\r\n    }\r\n  }\r\n\r\n  handlePointerMove(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._core.store.state.isErasing) {\r\n        const selectedObjects = this._core.getObjectsFromPointerEvent(event, '.object');\r\n\r\n        if (selectedObjects.length === 0) return;\r\n\r\n        const x = this._core.store.state.pointerX;\r\n        const y = this._core.store.state.pointerY;\r\n\r\n        selectedObjects.forEach(selectedObject => {\r\n          selectedObject.markedForRemoval = selectedObject.hitTest(x, y);\r\n        });\r\n\r\n        this._core.rerender();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      if (this._core.store.state.pointers.size === 1 && this._core.store.state.isErasing) {\r\n        const shadowRoot = this._core.store.state.host?.shadowRoot;\r\n        if (!shadowRoot) return;\r\n\r\n        const selectedObjects = this._core.getObjectsFromPointerEvent(event, '.object');\r\n\r\n        if (selectedObjects.length === 0) return;\r\n\r\n        const x = this._core.store.state.pointerX;\r\n        const y = this._core.store.state.pointerY;\r\n\r\n        selectedObjects.forEach(selectedObject => {\r\n          selectedObject.markedForRemoval = selectedObject.hitTest(x, y);\r\n        });\r\n\r\n        this._core.rerender();\r\n      }\r\n    }\r\n  }\r\n\r\n  handlePointerUp(event: PointerEvent): void {\r\n    if (event.pointerType === 'mouse') {\r\n      if (this._core.store.state.isErasing) {\r\n        const objectsToRemove = this._core.store.allObjects.filter(object => object.markedForRemoval);\r\n\r\n        objectsToRemove.forEach(object => {\r\n          object.markedForRemoval = false;\r\n          this._core.removeObject(object);\r\n        });\r\n\r\n        if (objectsToRemove.length > 0) {\r\n          this._core.rerender();\r\n        }\r\n\r\n        this._core.store.state.isErasing = false;\r\n\r\n        this._core.engine.emitObjectsChange();\r\n      }\r\n    }\r\n\r\n    if (event.pointerType === 'touch') {\r\n      clearTimeout(this.touchStartTimeout);\r\n\r\n      if (this._core.store.state.isErasing) {\r\n        const objectsToRemove = this._core.store.allObjects.filter(object => object.markedForRemoval);\r\n        \r\n        objectsToRemove.forEach(object => {\r\n          object.markedForRemoval = false;\r\n          this._core.removeObject(object);\r\n        });\r\n\r\n        if (objectsToRemove.length > 0) {\r\n          this._core.rerender();\r\n        }\r\n\r\n        this._core.store.state.isErasing = false;\r\n\r\n        this._core.engine.emitObjectsChange();\r\n      }\r\n    }\r\n  }\r\n}\r\n"]}

package/dist/collection/classes/tools/image-tool.class.js

@@ -0,0 +1,83 @@
+import { KritzelImage } from "../objects/image.class";
+import { KritzelBaseTool } from "./base-tool.class";
+import imageCompression from "browser-image-compression";
+import { KritzelToolRegistry } from "../registries/tool.registry";
+export class KritzelImageTool extends KritzelBaseTool {
+    fileInput = null;
+    maxCompressionSize = 300;
+    constructor(core) {
+        super(core);
+        this.setupFileInput();
+    }
+    onActivate() {
+        this.openFilePicker();
+    }
+    openFilePicker() {
+        if (this._core.store.isDisabled) {
+            return;
+        }
+        this.fileInput.click();
+    }
+    setupFileInput() {
+        this.fileInput = document.createElement('input');
+        this.fileInput.type = 'file';
+        this.fileInput.accept = 'image/*';
+        this.fileInput.style.display = 'none';
+        this.fileInput.addEventListener('change', this.handleFileSelect.bind(this));
+        this.fileInput.addEventListener('cancel', this.handleCancel.bind(this));
+        document.body.appendChild(this.fileInput);
+    }
+    handleFileSelect(event) {
+        const input = event.target;
+        if (input.files && input.files[0]) {
+            const file = input.files[0];
+            imageCompression(file, {
+                maxWidthOrHeight: this.maxCompressionSize,
+            })
+                .then(compressedFile => {
+                this.readFile(compressedFile);
+            })
+                .catch(error => {
+                console.error('Error during image compression or processing:', error);
+                this.handleCancel();
+            });
+        }
+        else {
+            console.info('File selection cancelled by user.');
+            this.handleCancel();
+        }
+        if (input) {
+            input.value = '';
+        }
+    }
+    readFile(file) {
+        const reader = new FileReader();
+        reader.onload = e => {
+            const img = new Image();
+            img.src = e.target?.result;
+            img.onload = () => this.createKritzelImage(img);
+        };
+        reader.readAsDataURL(file);
+    }
+    createKritzelImage(img) {
+        const image = KritzelImage.create(this._core);
+        const { scaledWidth, scaledHeight } = image.calculateScaledDimensions(img);
+        image.src = img.src;
+        image.width = scaledWidth;
+        image.height = scaledHeight;
+        image.zIndex = this._core.store.currentZIndex;
+        image.centerInViewport();
+        this.addImageToStore(image);
+        return image;
+    }
+    addImageToStore(image) {
+        this._core.addObject(image);
+        this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+        this._core.selectObjects([image]);
+        this._core.engine.emitObjectsChange();
+    }
+    handleCancel() {
+        this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
+    }
+}
+//# sourceMappingURL=image-tool.class.js.map

package/dist/collection/classes/tools/image-tool.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"image-tool.class.js","sourceRoot":"","sources":["../../../src/classes/tools/image-tool.class.ts"],"names":[],"mappings":"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","sourcesContent":["import { KritzelImage } from '../objects/image.class';\r\nimport { KritzelBaseTool } from './base-tool.class';\r\nimport imageCompression from 'browser-image-compression';\r\nimport { KritzelToolRegistry } from '../registries/tool.registry';\r\nimport { KritzelCore } from '../core/core.class';\r\n\r\nexport class KritzelImageTool extends KritzelBaseTool {\r\n  fileInput: HTMLInputElement | null = null;\r\n\r\n  maxCompressionSize: number = 300;\r\n\r\n  constructor(core: KritzelCore) {\r\n    super(core);\r\n    this.setupFileInput();\r\n  }\r\n\r\n  override onActivate(): void {\r\n    this.openFilePicker();\r\n  }\r\n\r\n  private openFilePicker(): void {\r\n     if(this._core.store.isDisabled){\r\n      return;\r\n    }\r\n    \r\n    this.fileInput.click();\r\n  }\r\n\r\n  private setupFileInput(): void {\r\n    this.fileInput = document.createElement('input');\r\n    this.fileInput.type = 'file';\r\n    this.fileInput.accept = 'image/*';\r\n    this.fileInput.style.display = 'none';\r\n\r\n    this.fileInput.addEventListener('change', this.handleFileSelect.bind(this));\r\n    this.fileInput.addEventListener('cancel', this.handleCancel.bind(this));\r\n    document.body.appendChild(this.fileInput);\r\n  }\r\n\r\n  private handleFileSelect(event: Event): void {\r\n    const input = event.target as HTMLInputElement;\r\n    if (input.files && input.files[0]) {\r\n      const file = input.files[0];\r\n      imageCompression(file, {\r\n        maxWidthOrHeight: this.maxCompressionSize,\r\n      })\r\n        .then(compressedFile => {\r\n          this.readFile(compressedFile);\r\n        })\r\n        .catch(error => {\r\n          console.error('Error during image compression or processing:', error);\r\n          this.handleCancel();\r\n        });\r\n    } else {\r\n      console.info('File selection cancelled by user.');\r\n      this.handleCancel();\r\n    }\r\n\r\n    if (input) {\r\n      input.value = '';\r\n    }\r\n  }\r\n\r\n  private readFile(file: File): void {\r\n    const reader = new FileReader();\r\n    reader.onload = e => {\r\n      const img = new Image();\r\n      img.src = e.target?.result as string;\r\n      img.onload = () => this.createKritzelImage(img);\r\n    };\r\n    reader.readAsDataURL(file);\r\n  }\r\n\r\n\r\n  private createKritzelImage(img: HTMLImageElement): KritzelImage {\r\n    const image = KritzelImage.create(this._core);\r\n    const { scaledWidth, scaledHeight } = image.calculateScaledDimensions(img);\r\n    image.src = img.src;\r\n    image.width = scaledWidth;\r\n    image.height = scaledHeight;\r\n    image.zIndex = this._core.store.currentZIndex;\r\n    image.centerInViewport();\r\n    this.addImageToStore(image);\r\n    return image;\r\n  }\r\n\r\n  private addImageToStore(image: KritzelImage): void {\r\n    this._core.addObject(image);\r\n    this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));\r\n    this._core.selectObjects([image]);\r\n    this._core.engine.emitObjectsChange();\r\n  }\r\n\r\n  private handleCancel(): void {\r\n    this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));\r\n  }\r\n}\r\n"]}