@labelbee/lb-annotation 1.14.0-alpha.3 → 1.14.0-alpha.6

package/dist/core/toolOperation/ViewOperation.js

@@ -1,556 +1 @@
-'use strict';
-
-var _ = require('lodash');
-var rgba = require('color-rgba');
-var DrawUtils = require('../../utils/tool/DrawUtils.js');
-var AxisUtils = require('../../utils/tool/AxisUtils.js');
-var RectUtils = require('../../utils/tool/RectUtils.js');
-var PolygonUtils = require('../../utils/tool/PolygonUtils.js');
-var MathUtils = require('../../utils/MathUtils.js');
-var RenderDomClass = require('../../utils/tool/RenderDomClass.js');
-var tool = require('../../constant/tool.js');
-var annotation = require('../../constant/annotation.js');
-var ImgPosUtils = require('../../utils/tool/ImgPosUtils.js');
-var basicToolOperation = require('./basicToolOperation.js');
-var matrix = require('../pointCloud/matrix.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
-var rgba__default = /*#__PURE__*/_interopDefaultLegacy(rgba);
-
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {enumerable: true, configurable: true, writable: true, value}) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-const newScope = 3;
-const DEFAULT_RADIUS = 3;
-const DEFAULT_STROKE_COLOR = "#6371FF";
-class ViewOperation extends basicToolOperation.BasicToolOperation {
-  constructor(props) {
-    super(__spreadProps(__spreadValues({}, props), {showDefaultCursor: true}));
-    this.style = {};
-    this.annotations = [];
-    this.connectionPoints = [];
-    this.getHoverRectID = (e) => {
-      var _a, _b;
-      const coordinate = this.getCoordinateUnderZoom(e);
-      const originCoordinate = AxisUtils["default"].changePointByZoom(coordinate, 1 / this.zoom);
-      if (((_a = this.annotations) == null ? void 0 : _a.length) <= 0 || !((_b = this.annotations) == null ? void 0 : _b.length)) {
-        return;
-      }
-      let id = "";
-      let minArea = Number.MAX_SAFE_INTEGER;
-      for (let i = 0; i < this.annotations.length; i++) {
-        const annotation = this.annotations[i];
-        switch (annotation.type) {
-          case "rect": {
-            const rect = annotation.annotation;
-            if (RectUtils.isInRect(coordinate, rect, newScope, this.zoom)) {
-              const area = rect.width * rect.height;
-              if (area < minArea) {
-                id = rect.id;
-                minArea = area;
-              }
-            }
-            break;
-          }
-          case "polygon": {
-            const polygon = annotation.annotation;
-            if (PolygonUtils.isInPolygon(originCoordinate, polygon.pointList)) {
-              const area = PolygonUtils.getPolygonArea(polygon.pointList);
-              if (area < minArea) {
-                id = polygon.id;
-                minArea = area;
-              }
-            }
-            break;
-          }
-        }
-      }
-      return id;
-    };
-    var _a;
-    this.style = (_a = props.style) != null ? _a : {stroke: DEFAULT_STROKE_COLOR, thickness: 3};
-    this.annotations = props.annotations;
-    this.loading = false;
-    this.renderDomInstance = new RenderDomClass({
-      container: this.container,
-      height: this.canvas.height
-    });
-  }
-  clearConnectionPoints() {
-    this.connectionPoints = [];
-    this.render();
-  }
-  checkConnectionPoints(newAnnotations = this.annotations) {
-    var _a, _b;
-    if (this.connectPointsStatus) {
-      (_b = (_a = this.connectPointsStatus).close) == null ? void 0 : _b.call(_a);
-    }
-    this.emit("connectionPointsStatusUpdate", () => {
-      return new Promise((resolve) => {
-        const {promise, close} = MathUtils["default"].getCollectionPointByAnnotationDataPromise(newAnnotations);
-        this.connectPointsStatus = {
-          close
-        };
-        promise.then((res) => {
-          this.connectionPoints = res.connectionPoints;
-          this.render();
-          this.connectPointsStatus = void 0;
-          resolve({connectionPoints: res.connectionPoints});
-        });
-      });
-    });
-  }
-  setLoading(loading) {
-    this.loading = loading;
-    this.render();
-  }
-  onMouseLeave() {
-    super.onMouseLeave();
-    this.mouseHoverID = void 0;
-    this.emit("onChange", "hover", []);
-  }
-  onMouseDown(e) {
-    if (super.onMouseDown(e) || this.forbidMouseOperation || !this.imgInfo) {
-      return true;
-    }
-    const newMouseSelectedID = this.mouseHoverID;
-    if (e.button === 0) {
-      let selectedID = [];
-      if (newMouseSelectedID) {
-        selectedID = [newMouseSelectedID];
-      }
-      this.emit("onChange", "selected", selectedID);
-      this.render();
-    }
-  }
-  onMouseMove(e) {
-    if (super.onMouseMove(e) || this.forbidMouseOperation || !this.imgInfo) {
-      return;
-    }
-    const oldMouseHoverID = this.mouseHoverID;
-    const newMouseHoverID = this.getHoverRectID(e);
-    if (oldMouseHoverID !== newMouseHoverID) {
-      this.mouseHoverID = newMouseHoverID;
-      let hoverID = [];
-      if (newMouseHoverID) {
-        hoverID = [newMouseHoverID];
-      }
-      this.emit("onChange", "hover", hoverID);
-      this.render();
-    }
-  }
-  updateData(annotations) {
-    this.annotations = annotations;
-    this.render();
-  }
-  getSpecificStyle(obj) {
-    const specificStyle = ___default["default"].pick(obj, ["stroke", "thickness", "fill", "radius"]);
-    const newStyle = __spreadValues(__spreadValues({}, this.style), specificStyle);
-    if (newStyle.stroke) {
-      Object.assign(newStyle, {
-        color: newStyle.stroke
-      });
-    }
-    return newStyle;
-  }
-  getFontStyle(obj, style) {
-    var _a, _b;
-    const fontSize = (_a = obj == null ? void 0 : obj.fontSize) != null ? _a : 14;
-    const fontFamily = (_b = obj == null ? void 0 : obj.fontFamily) != null ? _b : "Arial";
-    return __spreadProps(__spreadValues({}, annotation.DEFAULT_TEXT_SHADOW), {
-      color: style.stroke,
-      font: `normal normal 600 ${fontSize}px ${fontFamily}`
-    });
-  }
-  appendOffset({x, y}) {
-    return {x: x + annotation.DEFAULT_TEXT_OFFSET.offsetX, y: y + annotation.DEFAULT_TEXT_OFFSET.offsetY};
-  }
-  getRenderText(result, hiddenText = false) {
-    let headerText = "";
-    let bottomText = "";
-    if (!result || hiddenText === true) {
-      return {headerText, bottomText};
-    }
-    if (result == null ? void 0 : result.order) {
-      headerText = `${result.order}`;
-    }
-    if (result == null ? void 0 : result.label) {
-      if (headerText) {
-        headerText = `${headerText}_${result.label}`;
-      } else {
-        headerText = `${result.label}`;
-      }
-    }
-    if (result == null ? void 0 : result.attribute) {
-      if (headerText) {
-        headerText = `${headerText}  ${result.attribute}`;
-      } else {
-        headerText = `${result.attribute}`;
-      }
-    }
-    if (result == null ? void 0 : result.textAttribute) {
-      bottomText = result == null ? void 0 : result.textAttribute;
-    }
-    return {headerText, bottomText};
-  }
-  getReferenceOptions(isReference) {
-    return isReference ? {lineCap: "butt", lineDash: [20, 20]} : {};
-  }
-  focusPositionByPointList(pointList) {
-    const basicZone = MathUtils["default"].calcViewportBoundaries(pointList);
-    const newBoundary = {
-      x: basicZone.left,
-      y: basicZone.top,
-      width: basicZone.right - basicZone.left,
-      height: basicZone.bottom - basicZone.top
-    };
-    const pos = ImgPosUtils.getBasicRecPos(this.imgNode, newBoundary, this.size, 0.5);
-    if (pos) {
-      this.setCurrentPos(pos.currentPos);
-      this.setCurrentPosStorage(pos.currentPos);
-      const {imgInfo} = this;
-      const {innerZoom} = this.innerPosAndZoom;
-      if (imgInfo) {
-        this.setImgInfo(__spreadProps(__spreadValues({}, imgInfo), {
-          width: imgInfo.width / innerZoom * pos.innerZoom,
-          height: imgInfo.height / innerZoom * pos.innerZoom
-        }));
-      }
-      this.setZoom(pos.innerZoom);
-      this.render();
-      this.renderBasicCanvas();
-    }
-  }
-  renderConnectionPoints() {
-    this.connectionPoints.forEach((point) => {
-      const renderPoint = AxisUtils["default"].changePointByZoom(point, this.zoom, this.currentPos);
-      DrawUtils.drawCircleWithFill(this.canvas, renderPoint, 4, {color: "#fff"});
-      DrawUtils.drawCircleWithFill(this.canvas, renderPoint, 2, {color: "#000"});
-    });
-  }
-  getRenderStyle(annotation) {
-    const style = this.getSpecificStyle(annotation.annotation);
-    const fontStyle = this.getFontStyle(annotation.annotation, style);
-    return {
-      style,
-      fontStyle
-    };
-  }
-  renderLine(annotation$1) {
-    var _a, _b, _c;
-    if (annotation$1.type !== "line") {
-      return;
-    }
-    const {style, fontStyle} = this.getRenderStyle(annotation$1);
-    const line = annotation$1.annotation;
-    if (!(((_a = line == null ? void 0 : line.pointList) == null ? void 0 : _a.length) >= 2)) {
-      return;
-    }
-    const {lineType = tool.ELineTypes.Line} = line;
-    const renderLineWithZoom = AxisUtils["default"].changePointListByZoom((_b = line == null ? void 0 : line.pointList) != null ? _b : [], this.zoom, this.currentPos);
-    const lineRenderOptions = __spreadProps(__spreadValues(__spreadValues({}, style), this.getReferenceOptions(line == null ? void 0 : line.isReference)), {
-      lineType,
-      strokeColor: style.stroke
-    });
-    let newPointList = [];
-    if (line.showKeyPoint) {
-      newPointList = DrawUtils.drawPolygonWithKeyPoint(this.canvas, renderLineWithZoom, lineRenderOptions);
-    } else {
-      newPointList = DrawUtils.drawPolygon(this.canvas, renderLineWithZoom, lineRenderOptions);
-    }
-    const isShowDirection = (line == null ? void 0 : line.showDirection) === true && ((_c = line == null ? void 0 : line.pointList) == null ? void 0 : _c.length) >= 2;
-    if (isShowDirection) {
-      let startPoint = renderLineWithZoom[0];
-      let endPoint = MathUtils["default"].getLineCenterPoint([renderLineWithZoom[0], renderLineWithZoom[1]]);
-      if (lineType === tool.ELineTypes.Curve) {
-        const pos = Math.floor(tool.SEGMENT_NUMBER / 2);
-        startPoint = newPointList[pos];
-        endPoint = newPointList[pos + 1];
-      }
-      DrawUtils.drawArrowByCanvas(this.canvas, startPoint, endPoint, {
-        color: style.stroke,
-        thickness: style.thickness
-      });
-      DrawUtils.drawCircle(this.canvas, renderLineWithZoom[0], style.thickness + 6, {
-        color: style.stroke,
-        thickness: style.thickness
-      });
-    }
-    const {headerText, bottomText} = this.getRenderText(line, line == null ? void 0 : line.hiddenText);
-    if (headerText) {
-      DrawUtils.drawText(this.canvas, this.appendOffset(renderLineWithZoom[0]), headerText, fontStyle);
-    }
-    if (bottomText) {
-      const endPoint = renderLineWithZoom[renderLineWithZoom.length - 1];
-      DrawUtils.drawText(this.canvas, this.appendOffset({x: endPoint.x + annotation.TEXT_ATTRIBUTE_OFFSET.x, y: endPoint.y + annotation.TEXT_ATTRIBUTE_OFFSET.y}), bottomText, fontStyle);
-    }
-  }
-  renderPolygon(annotation$1) {
-    var _a, _b, _c, _d, _e;
-    if (annotation$1.type !== "polygon") {
-      return;
-    }
-    const {style, fontStyle} = this.getRenderStyle(annotation$1);
-    const polygon = annotation$1.annotation;
-    if (!(((_a = polygon == null ? void 0 : polygon.pointList) == null ? void 0 : _a.length) >= 3)) {
-      return;
-    }
-    const {lineType = tool.ELineTypes.Line} = polygon;
-    const renderPolygon = AxisUtils["default"].changePointListByZoom((_b = polygon == null ? void 0 : polygon.pointList) != null ? _b : [], this.zoom, this.currentPos);
-    if (polygon.id === this.mouseHoverID || style.fill) {
-      const fillArr = rgba__default["default"]((_d = (_c = style == null ? void 0 : style.fill) != null ? _c : style == null ? void 0 : style.stroke) != null ? _d : DEFAULT_STROKE_COLOR);
-      const fill = `rgba(${fillArr[0]}, ${fillArr[1]}, ${fillArr[2]},${fillArr[3] * 0.8})`;
-      DrawUtils.drawPolygonWithFill(this.canvas, renderPolygon, {color: fill, lineType});
-    }
-    const polygonRenderOptions = __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, style), {
-      isClose: true
-    }), this.getReferenceOptions(polygon == null ? void 0 : polygon.isReference)), {
-      lineType,
-      strokeColor: style.stroke
-    });
-    let newPointList = [];
-    if (polygon.showKeyPoint) {
-      newPointList = DrawUtils.drawPolygonWithKeyPoint(this.canvas, renderPolygon, polygonRenderOptions);
-    } else {
-      newPointList = DrawUtils.drawPolygon(this.canvas, renderPolygon, polygonRenderOptions);
-    }
-    const isShowDirection = (polygon == null ? void 0 : polygon.showDirection) === true && ((_e = polygon == null ? void 0 : polygon.pointList) == null ? void 0 : _e.length) >= 2;
-    if (isShowDirection) {
-      let startPoint = renderPolygon[0];
-      let endPoint = MathUtils["default"].getLineCenterPoint([renderPolygon[0], renderPolygon[1]]);
-      if (lineType === tool.ELineTypes.Curve) {
-        const pos = Math.floor(tool.SEGMENT_NUMBER / 2);
-        startPoint = newPointList[pos];
-        endPoint = newPointList[pos + 1];
-      }
-      DrawUtils.drawArrowByCanvas(this.canvas, startPoint, endPoint, {
-        color: style.stroke,
-        thickness: style.thickness
-      });
-      DrawUtils.drawCircle(this.canvas, renderPolygon[0], style.thickness + 6, {
-        color: style.stroke,
-        thickness: style.thickness
-      });
-    }
-    const {headerText, bottomText} = this.getRenderText(polygon, polygon == null ? void 0 : polygon.hiddenText);
-    if (headerText) {
-      DrawUtils.drawText(this.canvas, this.appendOffset(renderPolygon[0]), headerText, fontStyle);
-    }
-    if (bottomText) {
-      const endPoint = renderPolygon[renderPolygon.length - 1];
-      DrawUtils.drawText(this.canvas, this.appendOffset({x: endPoint.x + annotation.TEXT_ATTRIBUTE_OFFSET.x, y: endPoint.y + annotation.TEXT_ATTRIBUTE_OFFSET.y}), bottomText, fontStyle);
-    }
-  }
-  renderSingleCuboid(annotation) {
-    var _a, _b;
-    const {style} = this.getRenderStyle(annotation);
-    const cuboid = annotation.annotation;
-    const fillArr = rgba__default["default"]((_b = (_a = style == null ? void 0 : style.fill) != null ? _a : style == null ? void 0 : style.stroke) != null ? _b : DEFAULT_STROKE_COLOR);
-    const fillColor = `rgba(${fillArr[0]}, ${fillArr[1]}, ${fillArr[2]},${fillArr[3] * 0.8})`;
-    const strokeColor = style.stroke;
-    const transformCuboid = AxisUtils["default"].changeCuboidByZoom(cuboid, this.zoom, this.currentPos);
-    const {headerText, bottomText} = this.getRenderText(cuboid, cuboid == null ? void 0 : cuboid.hiddenText);
-    DrawUtils.drawCuboidWithText(this.canvas, transformCuboid, {strokeColor, fillColor, thickness: style.thickness}, {
-      config: this.config,
-      hiddenText: cuboid == null ? void 0 : cuboid.hiddenText,
-      headerText,
-      bottomText
-    });
-  }
-  renderBox3d(annotation) {
-    if (annotation.type !== "box3d") {
-      return;
-    }
-    const data = annotation.annotation;
-    const viewDataPointList = matrix.pointCloudLidar2image(data, data.calib);
-    const defaultViewStyle = {
-      fill: "transparent"
-    };
-    const extraData = ___default["default"].pick(data, ["stroke", "thickness"]);
-    viewDataPointList.forEach((v, i) => {
-      const newAnnotation = __spreadValues(__spreadProps(__spreadValues({}, extraData), {
-        id: `${annotation.annotation.id}-${i}`,
-        pointList: v.pointList
-      }), defaultViewStyle);
-      switch (v.type) {
-        case "line":
-          this.renderLine({
-            type: "line",
-            annotation: newAnnotation
-          });
-          break;
-        case "polygon":
-          this.renderPolygon({
-            type: "polygon",
-            annotation: newAnnotation
-          });
-          break;
-      }
-    });
-  }
-  render() {
-    try {
-      super.render();
-      if (this.loading === true) {
-        return;
-      }
-      const globalDomTextAnnotation = this.annotations.filter((v) => v.type === "text" && v.annotation.position === "rt").map((v) => v.annotation);
-      this.renderDomInstance.render(globalDomTextAnnotation);
-      this.annotations.forEach((annotation) => {
-        var _a, _b, _c, _d, _e;
-        const style = this.getSpecificStyle(annotation.annotation);
-        const fontStyle = this.getFontStyle(annotation.annotation, style);
-        switch (annotation.type) {
-          case "rect": {
-            const rect = annotation.annotation;
-            const {hiddenText = false, isReference, hiddenRectSize = false} = rect;
-            const {zoom} = this;
-            const renderRect = AxisUtils["default"].changeRectByZoom(rect, this.zoom, this.currentPos);
-            const {x, y, width, height} = renderRect;
-            if (rect.id === this.mouseHoverID || style.fill) {
-              const fillArr = rgba__default["default"]((_b = (_a = style == null ? void 0 : style.fill) != null ? _a : style == null ? void 0 : style.stroke) != null ? _b : DEFAULT_STROKE_COLOR);
-              const fill = `rgba(${fillArr[0]}, ${fillArr[1]}, ${fillArr[2]},${fillArr[3] * 0.8})`;
-              DrawUtils.drawRectWithFill(this.canvas, renderRect, {color: fill});
-            }
-            DrawUtils.drawRect(this.canvas, renderRect, __spreadValues(__spreadProps(__spreadValues({}, style), {
-              hiddenText: true
-            }), this.getReferenceOptions(isReference)));
-            const {headerText, bottomText} = this.getRenderText(rect, rect == null ? void 0 : rect.hiddenText);
-            if (headerText) {
-              DrawUtils.drawText(this.canvas, {x, y: y - 6}, headerText, __spreadValues({
-                textMaxWidth: 300
-              }, fontStyle));
-            }
-            const rectSize = `${Math.round(width / zoom)} * ${Math.round(height / zoom)}`;
-            const textSizeWidth = rectSize.length * 7;
-            if (!hiddenText && !hiddenRectSize) {
-              DrawUtils.drawText(this.canvas, {x: x + width - textSizeWidth, y: y + height + 15}, rectSize, fontStyle);
-            }
-            if (bottomText) {
-              const marginTop = 20;
-              const textWidth = Math.max(20, width - textSizeWidth);
-              DrawUtils.drawText(this.canvas, {x, y: y + height + marginTop}, rect.textAttribute, __spreadValues({
-                textMaxWidth: textWidth
-              }, fontStyle));
-            }
-            break;
-          }
-          case "polygon": {
-            this.renderPolygon(annotation);
-            break;
-          }
-          case "line": {
-            this.renderLine(annotation);
-            break;
-          }
-          case "point": {
-            const point = annotation.annotation;
-            const renderPoint = AxisUtils["default"].changePointByZoom(point, this.zoom, this.currentPos);
-            const radius = (_c = style.radius) != null ? _c : DEFAULT_RADIUS;
-            DrawUtils.drawCircle(this.canvas, renderPoint, radius, style);
-            const {headerText, bottomText} = this.getRenderText(point, point == null ? void 0 : point.hiddenText);
-            if (headerText) {
-              DrawUtils.drawText(this.canvas, {x: renderPoint.x + radius / 2, y: renderPoint.y - radius - 4}, headerText, __spreadValues({
-                textAlign: "center"
-              }, fontStyle));
-            }
-            if (bottomText) {
-              DrawUtils.drawText(this.canvas, this.appendOffset({x: renderPoint.x + radius, y: renderPoint.y + radius + 24}), bottomText, fontStyle);
-            }
-            break;
-          }
-          case "text": {
-            const textAnnotation = annotation.annotation;
-            const {
-              text,
-              x,
-              y,
-              textMaxWidth,
-              color = "white",
-              background = "rgba(0, 0, 0, 0.6)",
-              lineHeight = 25,
-              font = tool.DEFAULT_FONT,
-              position
-            } = textAnnotation;
-            const paddingTB = 10;
-            const paddingLR = 10;
-            const renderPoint = AxisUtils["default"].changePointByZoom({x, y}, this.zoom, this.currentPos);
-            const {
-              width,
-              height,
-              fontHeight = 0
-            } = MathUtils["default"].getTextArea(this.canvas, textAnnotation.text, textMaxWidth, font, lineHeight);
-            if (position === "rt") {
-              break;
-            }
-            DrawUtils.drawRectWithFill(this.canvas, {
-              x: renderPoint.x,
-              y: renderPoint.y,
-              width: width + paddingLR * 2,
-              height: height + paddingTB * 2,
-              id: "",
-              sourceID: "",
-              valid: true,
-              textAttribute: "",
-              attribute: ""
-            }, {
-              color: background
-            });
-            DrawUtils.drawText(this.canvas, {
-              x: renderPoint.x + paddingLR,
-              y: renderPoint.y + fontHeight + paddingTB
-            }, text, {
-              color,
-              lineHeight,
-              font,
-              textMaxWidth
-            });
-            break;
-          }
-          case "box3d": {
-            this.renderBox3d(annotation);
-            break;
-          }
-          case "cuboid": {
-            this.renderSingleCuboid(annotation);
-            break;
-          }
-          default: {
-            break;
-          }
-        }
-        (_e = (_d = annotation.annotation) == null ? void 0 : _d.renderEnhance) == null ? void 0 : _e.call(_d, {
-          ctx: this.ctx,
-          canvas: this.canvas,
-          currentPos: this.currentPos,
-          zoom: this.zoom,
-          data: annotation,
-          toolInstance: this
-        });
-      });
-      this.renderConnectionPoints();
-    } catch (e) {
-      console.error("ViewOperation Render Error", e);
-    }
-  }
-}
-
-module.exports = ViewOperation;
+"use strict";var _=require("lodash"),rgba=require("color-rgba"),DrawUtils=require("../../utils/tool/DrawUtils.js"),AxisUtils=require("../../utils/tool/AxisUtils.js"),RectUtils=require("../../utils/tool/RectUtils.js"),PolygonUtils=require("../../utils/tool/PolygonUtils.js"),MathUtils=require("../../utils/MathUtils.js"),RenderDomClass=require("../../utils/tool/RenderDomClass.js"),tool=require("../../constant/tool.js"),annotation=require("../../constant/annotation.js"),ImgPosUtils=require("../../utils/tool/ImgPosUtils.js"),basicToolOperation=require("./basicToolOperation.js"),matrix=require("../pointCloud/matrix.js");function _interopDefaultLegacy(v){return v&&typeof v=="object"&&"default"in v?v:{default:v}}var ___default=_interopDefaultLegacy(_),rgba__default=_interopDefaultLegacy(rgba),__defProp=Object.defineProperty,__defProps=Object.defineProperties,__getOwnPropDescs=Object.getOwnPropertyDescriptors,__getOwnPropSymbols=Object.getOwnPropertySymbols,__hasOwnProp=Object.prototype.hasOwnProperty,__propIsEnum=Object.prototype.propertyIsEnumerable,__defNormalProp=(v,t,e)=>t in v?__defProp(v,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):v[t]=e,__spreadValues=(v,t)=>{for(var e in t||(t={}))__hasOwnProp.call(t,e)&&__defNormalProp(v,e,t[e]);if(__getOwnPropSymbols)for(var e of __getOwnPropSymbols(t))__propIsEnum.call(t,e)&&__defNormalProp(v,e,t[e]);return v},__spreadProps=(v,t)=>__defProps(v,__getOwnPropDescs(t));const newScope=3,DEFAULT_RADIUS=3,DEFAULT_STROKE_COLOR="#6371FF";class ViewOperation extends basicToolOperation.BasicToolOperation{constructor(t){super(__spreadProps(__spreadValues({},t),{showDefaultCursor:!0}));this.style={},this.annotations=[],this.connectionPoints=[],this.getHoverRectID=o=>{var i,r;const c=this.getCoordinateUnderZoom(o),n=AxisUtils.default.changePointByZoom(c,1/this.zoom);if(((i=this.annotations)==null?void 0:i.length)<=0||!((r=this.annotations)==null?void 0:r.length))return;let h="",s=Number.MAX_SAFE_INTEGER;for(let l=0;l<this.annotations.length;l++){const a=this.annotations[l];switch(a.type){case"rect":{const d=a.annotation;if(RectUtils.isInRect(c,d,newScope,this.zoom)){const u=d.width*d.height;u<s&&(h=d.id,s=u)}break}case"polygon":{const d=a.annotation;if(PolygonUtils.isInPolygon(n,d.pointList)){const u=PolygonUtils.getPolygonArea(d.pointList);u<s&&(h=d.id,s=u)}break}}}return h};var e;this.style=(e=t.style)!=null?e:{stroke:DEFAULT_STROKE_COLOR,thickness:3},this.annotations=t.annotations,this.loading=!1,this.renderDomInstance=new RenderDomClass({container:this.container,height:this.canvas.height})}clearConnectionPoints(){this.connectionPoints=[],this.render()}checkConnectionPoints(t=this.annotations){var e,o;this.connectPointsStatus&&((o=(e=this.connectPointsStatus).close)==null||o.call(e)),this.emit("connectionPointsStatusUpdate",()=>new Promise(i=>{const{promise:r,close:c}=MathUtils.default.getCollectionPointByAnnotationDataPromise(t);this.connectPointsStatus={close:c},r.then(n=>{this.connectionPoints=n.connectionPoints,this.render(),this.connectPointsStatus=void 0,i({connectionPoints:n.connectionPoints})})}))}setLoading(t){this.loading=t,this.render()}onMouseLeave(){super.onMouseLeave(),this.mouseHoverID=void 0,this.emit("onChange","hover",[])}onMouseDown(t){if(super.onMouseDown(t)||this.forbidMouseOperation||!this.imgInfo)return!0;const e=this.mouseHoverID;if(t.button===0){let o=[];e&&(o=[e]),this.emit("onChange","selected",o),this.render()}}onMouseMove(t){if(super.onMouseMove(t)||this.forbidMouseOperation||!this.imgInfo)return;const e=this.mouseHoverID,o=this.getHoverRectID(t);if(e!==o){this.mouseHoverID=o;let i=[];o&&(i=[o]),this.emit("onChange","hover",i),this.render()}}updateData(t){this.annotations=t,this.render()}getSpecificStyle(t){const e=___default.default.pick(t,["stroke","thickness","fill","radius"]),o=__spreadValues(__spreadValues({},this.style),e);return o.stroke&&Object.assign(o,{color:o.stroke}),o}getFontStyle(t,e){var o,i;const r=(o=t==null?void 0:t.fontSize)!=null?o:14,c=(i=t==null?void 0:t.fontFamily)!=null?i:"Arial";return __spreadProps(__spreadValues({},annotation.DEFAULT_TEXT_SHADOW),{color:e.stroke,font:`normal normal 600 ${r}px ${c}`})}appendOffset({x:t,y:e}){return{x:t+annotation.DEFAULT_TEXT_OFFSET.offsetX,y:e+annotation.DEFAULT_TEXT_OFFSET.offsetY}}getRenderText(t,e=!1){let o="",i="";return!t||e===!0?{headerText:o,bottomText:i}:((t==null?void 0:t.order)&&(o=`${t.order}`),(t==null?void 0:t.label)&&(o?o=`${o}_${t.label}`:o=`${t.label}`),(t==null?void 0:t.attribute)&&(o?o=`${o}  ${t.attribute}`:o=`${t.attribute}`),(t==null?void 0:t.textAttribute)&&(i=t==null?void 0:t.textAttribute),{headerText:o,bottomText:i})}getReferenceOptions(t){return t?{lineCap:"butt",lineDash:[20,20]}:{}}focusPositionByPointList(t){const e=MathUtils.default.calcViewportBoundaries(t),o={x:e.left,y:e.top,width:e.right-e.left,height:e.bottom-e.top},i=ImgPosUtils.getBasicRecPos(this.imgNode,o,this.size,.5);if(i){this.setCurrentPos(i.currentPos),this.setCurrentPosStorage(i.currentPos);const{imgInfo:r}=this,{innerZoom:c}=this.innerPosAndZoom;r&&this.setImgInfo(__spreadProps(__spreadValues({},r),{width:r.width/c*i.innerZoom,height:r.height/c*i.innerZoom})),this.setZoom(i.innerZoom),this.render(),this.renderBasicCanvas()}}renderConnectionPoints(){this.connectionPoints.forEach(t=>{const e=AxisUtils.default.changePointByZoom(t,this.zoom,this.currentPos);DrawUtils.drawCircleWithFill(this.canvas,e,4,{color:"#fff"}),DrawUtils.drawCircleWithFill(this.canvas,e,2,{color:"#000"})})}getRenderStyle(t){const e=this.getSpecificStyle(t.annotation),o=this.getFontStyle(t.annotation,e);return{style:e,fontStyle:o}}renderLine(t){var e,o,i;if(t.type!=="line")return;const{style:r,fontStyle:c}=this.getRenderStyle(t),n=t.annotation;if(!(((e=n==null?void 0:n.pointList)==null?void 0:e.length)>=2))return;const{lineType:h=tool.ELineTypes.Line}=n,s=AxisUtils.default.changePointListByZoom((o=n==null?void 0:n.pointList)!=null?o:[],this.zoom,this.currentPos),l=__spreadProps(__spreadValues(__spreadValues({},r),this.getReferenceOptions(n==null?void 0:n.isReference)),{lineType:h,strokeColor:r.stroke});let a=[];if(n.showKeyPoint?a=DrawUtils.drawPolygonWithKeyPoint(this.canvas,s,l):a=DrawUtils.drawPolygon(this.canvas,s,l),(n==null?void 0:n.showDirection)===!0&&((i=n==null?void 0:n.pointList)==null?void 0:i.length)>=2){let g=s[0],y=MathUtils.default.getLineCenterPoint([s[0],s[1]]);if(h===tool.ELineTypes.Curve){const f=Math.floor(tool.SEGMENT_NUMBER/2);g=a[f],y=a[f+1]}DrawUtils.drawArrowByCanvas(this.canvas,g,y,{color:r.stroke,thickness:r.thickness}),DrawUtils.drawCircle(this.canvas,s[0],r.thickness+6,{color:r.stroke,thickness:r.thickness})}const{headerText:u,bottomText:p}=this.getRenderText(n,n==null?void 0:n.hiddenText);if(u&&DrawUtils.drawText(this.canvas,this.appendOffset(s[0]),u,c),p){const g=s[s.length-1];DrawUtils.drawText(this.canvas,this.appendOffset({x:g.x+annotation.TEXT_ATTRIBUTE_OFFSET.x,y:g.y+annotation.TEXT_ATTRIBUTE_OFFSET.y}),p,c)}}renderPolygon(t){var e,o,i,r,c;if(t.type!=="polygon")return;const{style:n,fontStyle:h}=this.getRenderStyle(t),s=t.annotation;if(!(((e=s==null?void 0:s.pointList)==null?void 0:e.length)>=3))return;const{lineType:l=tool.ELineTypes.Line}=s,a=AxisUtils.default.changePointListByZoom((o=s==null?void 0:s.pointList)!=null?o:[],this.zoom,this.currentPos);if(s.id===this.mouseHoverID||n.fill){const f=rgba__default.default((r=(i=n==null?void 0:n.fill)!=null?i:n==null?void 0:n.stroke)!=null?r:DEFAULT_STROKE_COLOR),T=`rgba(${f[0]}, ${f[1]}, ${f[2]},${f[3]*.8})`;DrawUtils.drawPolygonWithFill(this.canvas,a,{color:T,lineType:l})}const d=__spreadProps(__spreadValues(__spreadProps(__spreadValues({},n),{isClose:!0}),this.getReferenceOptions(s==null?void 0:s.isReference)),{lineType:l,strokeColor:n.stroke});let u=[];if(s.showKeyPoint?u=DrawUtils.drawPolygonWithKeyPoint(this.canvas,a,d):u=DrawUtils.drawPolygon(this.canvas,a,d),(s==null?void 0:s.showDirection)===!0&&((c=s==null?void 0:s.pointList)==null?void 0:c.length)>=2){let f=a[0],T=MathUtils.default.getLineCenterPoint([a[0],a[1]]);if(l===tool.ELineTypes.Curve){const x=Math.floor(tool.SEGMENT_NUMBER/2);f=u[x],T=u[x+1]}DrawUtils.drawArrowByCanvas(this.canvas,f,T,{color:n.stroke,thickness:n.thickness}),DrawUtils.drawCircle(this.canvas,a[0],n.thickness+6,{color:n.stroke,thickness:n.thickness})}const{headerText:g,bottomText:y}=this.getRenderText(s,s==null?void 0:s.hiddenText);if(g&&DrawUtils.drawText(this.canvas,this.appendOffset(a[0]),g,h),y){const f=a[a.length-1];DrawUtils.drawText(this.canvas,this.appendOffset({x:f.x+annotation.TEXT_ATTRIBUTE_OFFSET.x,y:f.y+annotation.TEXT_ATTRIBUTE_OFFSET.y}),y,h)}}renderSingleCuboid(t){var e,o;const{style:i}=this.getRenderStyle(t),r=t.annotation,c=rgba__default.default((o=(e=i==null?void 0:i.fill)!=null?e:i==null?void 0:i.stroke)!=null?o:DEFAULT_STROKE_COLOR),n=`rgba(${c[0]}, ${c[1]}, ${c[2]},${c[3]*.8})`,h=i.stroke,s=AxisUtils.default.changeCuboidByZoom(r,this.zoom,this.currentPos),{headerText:l,bottomText:a}=this.getRenderText(r,r==null?void 0:r.hiddenText);DrawUtils.drawCuboidWithText(this.canvas,s,{strokeColor:h,fillColor:n,thickness:i.thickness},{config:this.config,hiddenText:r==null?void 0:r.hiddenText,headerText:l,bottomText:a})}renderBox3d(t){if(t.type!=="box3d")return;const e=t.annotation,o=matrix.pointCloudLidar2image(e,e.calib),i={fill:"transparent"},r=___default.default.pick(e,["stroke","thickness"]);o.forEach((c,n)=>{const h=__spreadValues(__spreadProps(__spreadValues({},r),{id:`${t.annotation.id}-${n}`,pointList:c.pointList}),i);switch(c.type){case"line":this.renderLine({type:"line",annotation:h});break;case"polygon":this.renderPolygon({type:"polygon",annotation:h});break}})}render(){try{if(super.render(),this.loading===!0)return;const t=this.annotations.filter(e=>e.type==="text"&&e.annotation.position==="rt").map(e=>e.annotation);this.renderDomInstance.render(t),this.annotations.forEach(e=>{var o,i,r,c,n;const h=this.getSpecificStyle(e.annotation),s=this.getFontStyle(e.annotation,h);switch(e.type){case"rect":{const l=e.annotation,{hiddenText:a=!1,isReference:d,hiddenRectSize:u=!1}=l,{zoom:p}=this,g=AxisUtils.default.changeRectByZoom(l,this.zoom,this.currentPos),{x:y,y:f,width:T,height:x}=g;if(l.id===this.mouseHoverID||h.fill){const P=rgba__default.default((i=(o=h==null?void 0:h.fill)!=null?o:h==null?void 0:h.stroke)!=null?i:DEFAULT_STROKE_COLOR),b=`rgba(${P[0]}, ${P[1]}, ${P[2]},${P[3]*.8})`;DrawUtils.drawRectWithFill(this.canvas,g,{color:b})}DrawUtils.drawRect(this.canvas,g,__spreadValues(__spreadProps(__spreadValues({},h),{hiddenText:!0}),this.getReferenceOptions(d)));const{headerText:w,bottomText:S}=this.getRenderText(l,l==null?void 0:l.hiddenText);w&&DrawUtils.drawText(this.canvas,{x:y,y:f-6},w,__spreadValues({textMaxWidth:300},s));const m=`${Math.round(T/p)} * ${Math.round(x/p)}`,k=m.length*7;if(!a&&!u&&DrawUtils.drawText(this.canvas,{x:y+T-k,y:f+x+15},m,s),S){const P=20,b=Math.max(20,T-k);DrawUtils.drawText(this.canvas,{x:y,y:f+x+P},l.textAttribute,__spreadValues({textMaxWidth:b},s))}break}case"polygon":{this.renderPolygon(e);break}case"line":{this.renderLine(e);break}case"point":{const l=e.annotation,a=AxisUtils.default.changePointByZoom(l,this.zoom,this.currentPos),d=(r=h.radius)!=null?r:DEFAULT_RADIUS;DrawUtils.drawCircle(this.canvas,a,d,h);const{headerText:u,bottomText:p}=this.getRenderText(l,l==null?void 0:l.hiddenText);u&&DrawUtils.drawText(this.canvas,{x:a.x+d/2,y:a.y-d-4},u,__spreadValues({textAlign:"center"},s)),p&&DrawUtils.drawText(this.canvas,this.appendOffset({x:a.x+d,y:a.y+d+24}),p,s);break}case"text":{const l=e.annotation,{text:a,x:d,y:u,textMaxWidth:p,color:g="white",background:y="rgba(0, 0, 0, 0.6)",lineHeight:f=25,font:T=tool.DEFAULT_FONT,position:x}=l,w=10,S=10,m=AxisUtils.default.changePointByZoom({x:d,y:u},this.zoom,this.currentPos),{width:k,height:P,fontHeight:b=0}=MathUtils.default.getTextArea(this.canvas,l.text,p,T,f);if(x==="rt")break;DrawUtils.drawRectWithFill(this.canvas,{x:m.x,y:m.y,width:k+S*2,height:P+w*2,id:"",sourceID:"",valid:!0,textAttribute:"",attribute:""},{color:y}),DrawUtils.drawText(this.canvas,{x:m.x+S,y:m.y+b+w},a,{color:g,lineHeight:f,font:T,textMaxWidth:p});break}case"box3d":{this.renderBox3d(e);break}case"cuboid":{this.renderSingleCuboid(e);break}default:break}(n=(c=e.annotation)==null?void 0:c.renderEnhance)==null||n.call(c,{ctx:this.ctx,canvas:this.canvas,currentPos:this.currentPos,zoom:this.zoom,data:e,toolInstance:this})}),this.renderConnectionPoints()}catch(t){console.error("ViewOperation Render Error",t)}}}module.exports=ViewOperation;