stage.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. import { app as App } from "../../app";
  2. import { Layer } from "../drawers/layer";
  3. import { APP_STATE } from "../enums/app-state-enum";
  4. export class Stage {
  5. constructor() {
  6. this.layers = [];
  7. this.layer;
  8. this.konvaStage;
  9. this._bootstrap();
  10. }
  11. addAggregator(aggregator) {
  12. this.layer.addAggregator(aggregator);
  13. }
  14. setKonvaStage(stage) {
  15. this.konvaStage = stage;
  16. this.configureStageEvents(this.konvaStage);
  17. }
  18. createLayer() {
  19. let sequence = 0;
  20. if (this.layers == null || this.layers.length == 0) {
  21. sequence++;
  22. } else {
  23. sequence = this.layers.length + 1;
  24. }
  25. const layer = new Layer(sequence, new Konva.Layer());
  26. this.layers.push(layer);
  27. if (this.getCurrentLayer() == undefined && this.layers.length == 0) {
  28. this.layers = [];
  29. this.layers.push(layer);
  30. }
  31. this.layer = layer;
  32. this.konvaStage.add(this.layer.konvaLayer);
  33. return layer;
  34. }
  35. setCurrentLayer(layer) {
  36. this.layer = layer;
  37. }
  38. getCurrentLayer() {
  39. return this.layer;
  40. }
  41. getCurrentKonvaLayer() {
  42. return this.layer.getKonvaLayer();
  43. }
  44. draw(object) {
  45. if (object == undefined) this.konvaStage.draw();
  46. else {
  47. var layer = this.layer.getKonvaLayer();
  48. this.layer.getKonvaGroup().add(object);
  49. this.konvaStage.draw(layer);
  50. }
  51. }
  52. _setState(state) {
  53. App.setState(state);
  54. }
  55. configureStageEvents(stage) {
  56. stage.on("mousedown ", this._mouseDown.bind(this));
  57. stage.on("click", this._clickTap.bind(this));
  58. }
  59. _mouseDown(e) {
  60. if (e.target === this.konvaStage) {
  61. this._setState(APP_STATE.NONE);
  62. return;
  63. }
  64. if (e.target.id != undefined) {
  65. this._setState(APP_STATE.OBJECT_SELECTED);
  66. return;
  67. }
  68. }
  69. _clickTap(e) {
  70. const tool = App.getSelectedTool();
  71. if (tool != undefined) {
  72. tool.draw.bind(tool)(e);
  73. return;
  74. }
  75. if (e.target === this.konvaStage) {
  76. this._setState(APP_STATE.NONE);
  77. return;
  78. }
  79. }
  80. _bootstrap() {}
  81. }