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(); } }