point-drawer.js 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  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 (e != undefined && e.attrs != undefined && e.attrs.genericObject != undefined) {
  25. const aggregator = this.drawPoint(e.attrs.genericObject);
  26. return aggregator;
  27. }
  28. if (this.state == undefined) {
  29. super.setState(this.states[0]);
  30. App.setStatus("Selecione o centro do Ponto");
  31. }
  32. if (this.state == this.states[0]) {
  33. App.setStatus("Selecione o centro do Ponto");
  34. const aggregator = this.drawPoint();
  35. super.setState(this.states[0]);
  36. return aggregator;
  37. }
  38. }
  39. drawPoint(point) {
  40. const pos = App.pos();
  41. let drawResult;
  42. if (point == undefined) {
  43. if (pos == undefined) return;
  44. drawResult = PointDrawer.drawAndGetPoint(pos.x, pos.y, true);
  45. } else
  46. drawResult = PointDrawer.drawPoint(point, true, point.draggable);
  47. this.point = drawResult.geometricObject;
  48. super.setKonvaObject(drawResult.konvaObject);
  49. const aggregator = new DrawerAggregator(
  50. this,
  51. this.point,
  52. this.konvaObject,
  53. ELEMENTS_CLASS.POINT
  54. );
  55. super.addAggregator(aggregator);
  56. this.konvaObject.on("dragmove", aggregator.update.bind(aggregator));
  57. return aggregator;
  58. }
  59. update(aggregator, event) {
  60. aggregator.konvaObject.children.forEach(function (element) {
  61. if (element.attrs.class == ELEMENTS_CLASS.POINT) {
  62. aggregator.genericObject.update(element, event);
  63. }
  64. });
  65. }
  66. inserPointInLineSegment(konvaObject) {
  67. const drawerAggregators = objects.getByKonvaObject(konvaObject);
  68. if (drawerAggregators == undefined || drawerAggregators.length == 0) return;
  69. const drawerAggregator = drawerAggregators[0];
  70. drawerAggregator.drawer.insertPoint(drawerAggregator);
  71. }
  72. static drawAndGetPoint(x, y, useLabel) {
  73. return PointDrawer.drawPoint(new PointModel(x, y), useLabel);
  74. }
  75. static drawPoint(point, useLabel, draggable, selectable) {
  76. const group = SelectableDrawer.getKonvaGroup(draggable);
  77. const circle = PointDrawer.getKonvaCircle(point, draggable, selectable);
  78. if (useLabel != undefined && useLabel) {
  79. let label = (point != undefined && point.label != undefined && point.label != '') ? point.label : Label.draw();
  80. point.setLabel(label);
  81. const text = PointDrawer.getKonvaText(point, label);
  82. group.add(text);
  83. }
  84. if (selectable == undefined || selectable)
  85. SelectableDrawer.setSelectableIfSelectorChanged(circle);
  86. if (useLabel) {
  87. group.add(circle);
  88. SelectableDrawer.drawObject(group);
  89. SelectableDrawer.setMaxIndex(group);
  90. return { geometricObject: point, konvaObject: group };
  91. } else {
  92. SelectableDrawer.drawObject(circle);
  93. SelectableDrawer.setMaxIndex(circle);
  94. return { geometricObject: point, konvaObject: circle };
  95. }
  96. }
  97. static getKonvaCircle(point, draggable, selectable) {
  98. let fill = draggable == undefined || draggable ? STYLE.fill : STYLE.fill2;
  99. let stroke = draggable == undefined || draggable ? STYLE.stroke : STYLE.fill2;
  100. if (point.backgroundColor != undefined) {
  101. fill = point.backgroundColor;
  102. stroke = point.backgroundColor;
  103. }
  104. return new Konva.Circle({
  105. x: point.posX,
  106. y: point.posY,
  107. radius: 5,
  108. fill: fill,
  109. stroke: fill,
  110. strokeWidth: 1,
  111. strokeScaleEnabled: false,
  112. draggable: false,
  113. resizeEnabled: false,
  114. transformEnabled: false,
  115. style: { fill: fill, stroke: stroke },
  116. class: ELEMENTS_CLASS.POINT,
  117. connections: [],
  118. startPosX: point.posX,
  119. startPosY: point.posY,
  120. listening: true,
  121. selectable: selectable
  122. });
  123. }
  124. static getKonvaText(point, label) {
  125. return new Konva.Text({
  126. x: point.posX + 10,
  127. y: point.posY - 10,
  128. text: label,
  129. fontSize: 14,
  130. fontFamily: "Calibri",
  131. fill: "#434a45",
  132. stroke: "#ffffff",
  133. strokeWidth: 0.2,
  134. draggable: false,
  135. resizeEnabled: false,
  136. transformEnabled: false,
  137. selectable: false
  138. });
  139. }
  140. }