point-drawer.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. import { ELEMENTS_CLASS } from "../../../core/enums/elements-class-enum";
  2. import { label as Label } from "../../../component-registry/label";
  3. import { app as App } from "../../../app";
  4. import { PointModel } from "../models/point-model";
  5. import { DrawerAggregator } from "../../../core/drawers/drawer-aggregator";
  6. import { objects } from "../../../core/application/objects";
  7. import { SelectableDrawer } from "../../../core/drawers/selectable-drawer";
  8. const STYLE = {
  9. fill: "#9bc364",
  10. fill2: "#828783",
  11. strokeWidth: 1,
  12. stroke: "#9bc364"
  13. };
  14. export class PointDrawer extends SelectableDrawer {
  15. constructor() {
  16. super();
  17. this.point;
  18. this.label;
  19. this.text;
  20. this.states = ["center"];
  21. super.setElementClass(ELEMENTS_CLASS.POINT);
  22. }
  23. draw(e) {
  24. if (this.state == undefined) {
  25. super.setState(this.states[0]);
  26. App.setStatus("Selecione o centro do Ponto");
  27. }
  28. if (this.state == this.states[0]) {
  29. App.setStatus("Selecione o centro do Ponto");
  30. const aggregator = this.drawPoint();
  31. super.setState(this.states[0]);
  32. return aggregator;
  33. }
  34. }
  35. drawPoint() {
  36. const pos = App.pos();
  37. if (pos == undefined) return;
  38. const drawResult = PointDrawer.drawAndGetPoint(pos.x, pos.y, true);
  39. this.point = drawResult.geometricObject;
  40. super.setKonvaObject(drawResult.konvaObject);
  41. const aggregator = new DrawerAggregator(
  42. this,
  43. this.point,
  44. this.konvaObject,
  45. ELEMENTS_CLASS.POINT
  46. );
  47. super.addAggregator(aggregator);
  48. this.konvaObject.on("dragmove", aggregator.update.bind(aggregator));
  49. return aggregator;
  50. }
  51. update(aggregator, event) {
  52. aggregator.konvaObject.children.forEach(function(element) {
  53. if (element.attrs.class == ELEMENTS_CLASS.POINT) {
  54. aggregator.genericObject.update(element, event);
  55. }
  56. });
  57. }
  58. inserPointInLineSegment(konvaObject) {
  59. const drawerAggregators = objects.getByKonvaObject(konvaObject);
  60. if (drawerAggregators == undefined || drawerAggregators.length == 0) return;
  61. const drawerAggregator = drawerAggregators[0];
  62. drawerAggregator.drawer.insertPoint(drawerAggregator);
  63. }
  64. static drawAndGetPoint(x, y, useLabel) {
  65. return PointDrawer.drawPoint(new PointModel(x, y), useLabel);
  66. }
  67. static drawPoint(point, useLabel, draggable, selectable) {
  68. const group = SelectableDrawer.getKonvaGroup(draggable);
  69. const circle = PointDrawer.getKonvaCircle(point, draggable, selectable);
  70. if (useLabel != undefined && useLabel) {
  71. const label = Label.draw();
  72. point.setLabel(label);
  73. const text = PointDrawer.getKonvaText(point, label);
  74. group.add(text);
  75. } else {
  76. if (point.label != undefined) {
  77. const text = PointDrawer.getKonvaText(point, point.label);
  78. group.add(text);
  79. }
  80. }
  81. if (selectable == undefined || selectable)
  82. SelectableDrawer.setSelectable(circle);
  83. if (useLabel) {
  84. group.add(circle);
  85. SelectableDrawer.drawObject(group);
  86. SelectableDrawer.setMaxIndex(group);
  87. return { geometricObject: point, konvaObject: group };
  88. } else {
  89. SelectableDrawer.drawObject(circle);
  90. SelectableDrawer.setMaxIndex(circle);
  91. return { geometricObject: point, konvaObject: circle };
  92. }
  93. }
  94. static getKonvaCircle(point, draggable, selectable) {
  95. const fill = draggable == undefined || draggable ? STYLE.fill : STYLE.fill2;
  96. const stroke =
  97. draggable == undefined || draggable ? STYLE.stroke : STYLE.fill2;
  98. return new Konva.Circle({
  99. x: point.posX,
  100. y: point.posY,
  101. radius: 5,
  102. fill: fill,
  103. stroke: fill,
  104. strokeWidth: 1,
  105. strokeScaleEnabled: false,
  106. draggable: false,
  107. resizeEnabled: false,
  108. transformEnabled: false,
  109. style: { fill: fill, stroke: stroke },
  110. class: ELEMENTS_CLASS.POINT,
  111. connections: [],
  112. startPosX: point.posX,
  113. startPosY: point.posY,
  114. listening: true,
  115. selectable: selectable
  116. });
  117. }
  118. static getKonvaText(point, label) {
  119. return new Konva.Text({
  120. x: point.posX + 10,
  121. y: point.posY - 10,
  122. text: label,
  123. fontSize: 14,
  124. fontFamily: "Calibri",
  125. fill: "#434a45",
  126. stroke: "#ffffff",
  127. strokeWidth: 0.2,
  128. draggable: false,
  129. resizeEnabled: false,
  130. transformEnabled: false,
  131. selectable: false,
  132. fontStyle: "bold"
  133. });
  134. }
  135. }