poc-igeom-karla/src/app/components/circumference-component/drawers/circumference-drawer.js

import { CircumferenceModel } from "../models/circumference-model";
import { PointDrawer } from "../../point-component/drawers/point-drawer";
import { DrawerAggregator } from "../../../core/drawers/drawer-aggregator";
import { ELEMENTS_CLASS } from "../../../core/enums/elements-class-enum";
import { selector as Selector } from "../../../core/application/selector";
import { SelectableDrawer } from "../../../core/drawers/selectable-drawer";

export class CircumferenceDrawer extends SelectableDrawer {
  constructor() {
    super();
    this.states = ["center", "radius"];
    this.state = undefined;
    this.circumference = undefined;
    this.pointDrawer = new PointDrawer();
    this.center;
    this.radius;
    this.centerAggregator;
    this.konvaObject;
  }

  draw(e) {
    const points = Selector.getSelectedPoints();
    if (points == undefined || points.length == 0) {
      this.drawByStates(e);
    } else this.drawByPoints(points, undefined, e);
  }
  drawByPoints(points, aggregators, e) {
    if (aggregators == undefined)
      aggregators = Selector.getSelectedPointsAggregators();
    else {
      aggregators = [
        Objects.getByGenericObject(this.pointA)[0],
        Objects.getByGenericObject(this.pointB)[0]
      ];
    }
    this.centerAggregator = aggregators[0];
    this.radiusAggregator = aggregators[1];
    this.center = points[0];
    this.radius = points[1];
    this.createAndDraw(this.center, this.radius);
    this.reset();
    this.setStatus("");
  }
  drawByStates(e) {
    if (this.state == undefined) {
      this.state = this.states[0];
      this.setStatus("Selecione o centro da Circunferência");
    } else if (this.state == this.states[0]) {
      this.centerAggregator = this.pointDrawer.drawPoint();
      this.center = this.centerAggregator.genericObject;
      this.state = this.states[1];
      this.setStatus("Selecione o raio da Circunferência");
    } else if (this.state == this.states[1]) {
      this.radiusAggregator = this.pointDrawer.drawPoint();
      this.radius = this.radiusAggregator.genericObject;
      this.createAndDraw(this.center, this.radius);
      this.reset();
      this.state = this.states[0];
    }
  }
  createAndDraw(center, radius) {
    this.center = center;
    this.radius = radius;
    this.circumference = new CircumferenceModel(this.center, this.radius);
    this.konvaObject = this.drawcircumference(this.circumference);
    const aggregator = new DrawerAggregator(
      this,
      this.circumference,
      this.konvaObject,
      ELEMENTS_CLASS.CIRCUMFERENCE
    );
    super.addAggregator(aggregator);
    this.centerAggregator.addAggregator(aggregator);
    this.radiusAggregator.addAggregator(aggregator);
    SelectableDrawer.drawObject(this.konvaObject);
    this.konvaObject.zIndex(0);
    super.batchDraw();
    return aggregator;
  }
  drawcircumference(circumference) {
    // const circle = new Konva.Circle({
    //   x: circumference.center.posX,
    //   y: circumference.center.posY,
    //   radius: circumference.getRadius(),
    //   fill: "transparent",
    //   stroke: "grey",
    //   strokeWidth: 2,
    //   strokeScaleEnabled: false,
    //   transformEnabled: false,
    //   draggable: false,
    //   selectable: false,
    //   index: 0,
    //   class: ELEMENTS_CLASS.CIRCUMFERENCE,
    //   style: { stroke: "grey", fill: "grey" },
    //   fillEnable: false,
    //   strokeHitEnabled: true,
    //   hitStrokeWidth: true,
    //   strokeEnabled: true
    // });
    const circle = new Konva.Arc({
      x: circumference.center.posX,
      y: circumference.center.posY,
      innerRadius: circumference.getRadius(),
      outerRadius: circumference.getRadius(),
      angle: 360,
      fill: "grey",
      stroke: "grey",
      strokeWidth: 2,
      strokeScaleEnabled: false,
      transformEnabled: false,
      draggable: false,
      selectable: false,
      index: 0,
      class: ELEMENTS_CLASS.CIRCUMFERENCE,
      style: { stroke: "grey", fill: "grey" }
    });
    SelectableDrawer.setSelectableIfToolChanged(circle);
    return circle;
  }

  update(aggregator, e) {
    if (!aggregator.visible) return;
    const center = aggregator.genericObject.center;
    aggregator.konvaObject.innerRadius(aggregator.genericObject.getRadius());
    aggregator.konvaObject.outerRadius(aggregator.genericObject.getRadius());
    aggregator.konvaObject.x(center.posX);
    aggregator.konvaObject.y(center.posY);
    super.batchDraw();
  }
}