@labelbee/lb-annotation 1.14.0-alpha.0 → 1.14.0-alpha.10

package/es/core/toolOperation/scribbleTool2.js

@@ -1,249 +0,0 @@
-import { ImgConversionUtils } from '@labelbee/lb-utils';
-import AxisUtils from '../../utils/tool/AxisUtils.js';
-import DrawUtils from '../../utils/tool/DrawUtils.js';
-import { EToolName, EScribblePattern } from '../../constant/tool.js';
-import CommonToolUtils from '../../utils/tool/CommonToolUtils.js';
-import AttributeUtils from '../../utils/tool/AttributeUtils.js';
-import { BasicToolOperation } from './basicToolOperation.js';
-
-const DEFAULT_PEN_SIZE = 20;
-const DEFAULT_COLOR = "white";
-class ScribbleTool extends BasicToolOperation {
-  constructor(props) {
-    super(props);
-    this.toolName = EToolName.ScribbleTool;
-    this.action = EScribblePattern.Scribble;
-    this.getOriginCoordinate = (e) => {
-      return AxisUtils.changePointByZoom(this.getCoordinateUnderZoom(e), 1 / this.zoom);
-    };
-    this.onMouseDown = (e) => {
-      if (super.onMouseDown(e) || this.forbidMouseOperation || !this.imgInfo) {
-        return void 0;
-      }
-      this.initCacheCanvas(this.imgNode);
-      this.mouseEvents("onMouseDown").call(this, e);
-    };
-    this.onMouseMove = (e) => {
-      if (super.onMouseMove(e) || this.forbidMouseOperation || !this.imgInfo) {
-        return void 0;
-      }
-      this.mouseEvents("onMouseMove").call(this, e);
-    };
-    this.onMouseUp = (e) => {
-      if (super.onMouseUp(e) || this.forbidMouseOperation || !this.imgInfo) {
-        return void 0;
-      }
-      this.mouseEvents("onMouseUp").call(this, e);
-    };
-    this.mouseEvents = (eventType) => {
-      const events = {
-        [EScribblePattern.Scribble]: {
-          onMouseMove: this.onScribbleMove,
-          onMouseUp: this.onScribbleEnd,
-          onMouseDown: this.onScribbleStart
-        },
-        [EScribblePattern.Erase]: {
-          onMouseMove: this.onEraseMove,
-          onMouseUp: this.onEraseEnd,
-          onMouseDown: this.onEraseStart
-        }
-      };
-      return events[this.action][eventType];
-    };
-    this.setPattern = (pattern) => {
-      this.action = pattern;
-    };
-    this.penSize = DEFAULT_PEN_SIZE;
-  }
-  get color() {
-    var _a, _b;
-    return (_b = (_a = this == null ? void 0 : this.defaultAttributeInfo) == null ? void 0 : _a.color) != null ? _b : DEFAULT_COLOR;
-  }
-  get penSizeWithZoom() {
-    return this.penSize / this.zoom;
-  }
-  setPenSize(size) {
-    this.penSize = size;
-  }
-  initCacheCanvas(imgNode) {
-    if (this.cacheCanvas || !imgNode) {
-      return;
-    }
-    const {canvas, ctx} = ImgConversionUtils.createCanvas(imgNode);
-    this.cacheCanvas = canvas;
-    this.cacheContext = ctx;
-  }
-  updateCacheCanvasSize(imgNode) {
-    if (this.cacheCanvas) {
-      this.cacheCanvas.width = imgNode.width;
-      this.cacheCanvas.height = imgNode.height;
-    }
-  }
-  updateUrl2CacheContext(url) {
-    ImgConversionUtils.createImgDom(url).then((img) => {
-      if (!this.cacheContext) {
-        this.initCacheCanvas(img);
-      }
-      if (this.cacheContext) {
-        this.cacheContext.save();
-        this.clearResult();
-        this.cacheContext.drawImage(img, 0, 0, img.width, img.height);
-        this.cacheContext.restore();
-        this.render();
-      }
-    });
-  }
-  setImgNode(imgNode, basicImgInfo) {
-    super.setImgNode(imgNode, basicImgInfo);
-    if (this.cacheCanvas) {
-      this.updateCacheCanvasSize(imgNode);
-    } else {
-      this.initCacheCanvas(imgNode);
-    }
-  }
-  setResult(data) {
-    var _a;
-    const {url} = (_a = data == null ? void 0 : data[0]) != null ? _a : {};
-    this.history.initRecord([url], !!url);
-    this.clearResult();
-    if (!url) {
-      this.render();
-      return;
-    }
-    this.updateUrl2CacheContext(url);
-  }
-  onKeyDown(e) {
-    if (!CommonToolUtils.hotkeyFilter(e) || super.onKeyDown(e) === false) {
-      return;
-    }
-    const {keyCode} = e;
-    const keyCode2Attribute = AttributeUtils.getAttributeByKeycode(keyCode, this.config.attributeList);
-    if (keyCode2Attribute !== void 0) {
-      this.setDefaultAttribute(keyCode2Attribute);
-    }
-  }
-  eventBinding() {
-    super.eventBinding();
-  }
-  setDefaultAttribute(attributeValue) {
-    const attributeInfo = this.config.attributeList.find((v) => v.value === attributeValue);
-    if (attributeInfo) {
-      this.defaultAttribute = attributeInfo.value;
-      this.defaultAttributeInfo = attributeInfo;
-      this.emit("changeAttributeSidebar");
-      this.render();
-    }
-  }
-  clearStatusAfterLeave() {
-    this.onScribbleEnd();
-    this.startPoint = void 0;
-  }
-  onMouseLeave() {
-    super.onMouseLeave();
-    this.clearStatusAfterLeave();
-  }
-  onScribbleStart(e) {
-    if (!this.cacheContext) {
-      return;
-    }
-    this.cacheContext.save();
-    this.cacheContext.beginPath();
-    this.cacheContext.strokeStyle = this.color;
-    this.cacheContext.lineWidth = this.penSizeWithZoom;
-    this.cacheContext.lineCap = "round";
-    this.cacheContext.lineJoin = "round";
-    const originCoordinate = AxisUtils.changePointByZoom(this.getCoordinateUnderZoom(e), 1 / this.zoom);
-    this.cacheContext.moveTo(originCoordinate.x, originCoordinate.y);
-    this.startPoint = originCoordinate;
-  }
-  onScribbleMove(e) {
-    if (e.buttons === 1 && this.cacheContext && this.startPoint) {
-      const originCoordinate = this.getOriginCoordinate(e);
-      this.cacheContext.lineTo(originCoordinate.x, originCoordinate.y);
-      this.cacheContext.stroke();
-    }
-  }
-  onScribbleEnd() {
-    var _a, _b, _c;
-    if (this.startPoint) {
-      (_a = this.cacheContext) == null ? void 0 : _a.closePath();
-      (_b = this.cacheContext) == null ? void 0 : _b.restore();
-      this.startPoint = void 0;
-      this.history.pushHistory((_c = this.cacheCanvas) == null ? void 0 : _c.toDataURL("image/png", 0));
-    }
-  }
-  eraseArc(e) {
-    var _a;
-    if (this.cacheContext) {
-      const originCoordinate = this.getOriginCoordinate(e);
-      this.cacheContext.save();
-      this.cacheContext.beginPath();
-      this.cacheContext.arc(originCoordinate.x, originCoordinate.y, this.penSizeWithZoom / 2, 0, Math.PI * 2, false);
-      this.cacheContext.clip();
-      this.cacheContext.clearRect(0, 0, this.cacheContext.canvas.width, this.cacheContext.canvas.height);
-      (_a = this.cacheContext) == null ? void 0 : _a.restore();
-    }
-  }
-  onEraseStart(e) {
-    if (!this.cacheContext || e.buttons !== 1) {
-      return;
-    }
-    this.eraseArc(e);
-  }
-  onEraseMove(e) {
-    if (!this.cacheContext || e.buttons !== 1) {
-      return;
-    }
-    this.eraseArc(e);
-  }
-  onEraseEnd() {
-  }
-  exportData() {
-    var _a;
-    const imgBase64 = (_a = this.cacheCanvas) == null ? void 0 : _a.toDataURL("image/png", 0);
-    return [[], this.basicImgInfo, {imgBase64}];
-  }
-  clearCacheCanvas() {
-    var _a;
-    (_a = this.cacheContext) == null ? void 0 : _a.clearRect(0, 0, this.cacheContext.canvas.width, this.cacheContext.canvas.height);
-    this.render();
-  }
-  clearResult() {
-    this.clearCacheCanvas();
-  }
-  renderPoint(radius) {
-    DrawUtils.drawCircleWithFill(this.canvas, this.coord, radius, {color: this.color});
-  }
-  render() {
-    super.render();
-    if (!this.ctx || !this.cacheCanvas) {
-      return;
-    }
-    this.ctx.save();
-    this.ctx.globalAlpha = 0.5;
-    DrawUtils.drawImg(this.canvas, this.cacheCanvas, {
-      zoom: this.zoom,
-      currentPos: this.currentPos,
-      rotate: this.rotate
-    });
-    this.ctx.restore();
-    if (this.forbidOperation || this.forbidCursorLine) {
-      return;
-    }
-    this.renderPoint(this.penSize / 2);
-  }
-  undo() {
-    const url = this.history.undo();
-    if (url && this.cacheCanvas) {
-      this.updateUrl2CacheContext(url);
-    }
-  }
-  redo() {
-    const url = this.history.redo();
-    if (url && this.cacheCanvas) {
-      this.updateUrl2CacheContext(url);
-    }
-  }
-}
-
-export { ScribbleTool as default };