igeom/src/app/core/drawers/stage.js

import { app as App } from "../../app";
import { Layer } from "../drawers/layer";
import { APP_STATE } from "../enums/app-state-enum";
import { ELEMENTS_CLASS } from "../enums/elements-class-enum";
export class Stage {
  constructor() {
    this.layers = [];
    this.layer;
    this.konvaStage;
    this._bootstrap();
  }
  addAggregator(aggregator) {
    this.layer.addAggregator(aggregator);
  }
  setKonvaStage(stage) {
    this.konvaStage = stage;
    this.configureStageEvents(this.konvaStage);
  }
  createLayer() {
    let sequence = 0;
    if (this.layers == null || this.layers.length == 0) {
      sequence++;
    } else {
      sequence = this.layers.length + 1;
    }
    const layer = new Layer(sequence, new Konva.Layer());
    this.layers.push(layer);
    if (this.getCurrentLayer() == undefined && this.layers.length == 0) {
      this.layers = [];
      this.layers.push(layer);
    }
    this.layer = layer;
    this.konvaStage.add(this.layer.konvaLayer);
    return layer;
  }
  setCurrentLayer(layer) {
    this.layer = layer;
  }
  getCurrentLayer() {
    return this.layer;
  }
  getCurrentKonvaLayer() {
    return this.layer.getKonvaLayer();
  }
  draw(object) {
    if (object == undefined) this.konvaStage.draw();
    else {
      var layer = this.layer.getKonvaLayer();
      this.layer.getKonvaGroup().add(object);
      console.info(" this.layer", layer);
      console.info(" this.konvaStage", this.konvaStage);
      layer.draw();
      this.konvaStage.draw(layer);
      this.konvaStage.draw();
    }
  }
  _setState(state) {
    App.setState(state);
  }
  configureStageEvents(stage) {
    stage.on("mousedown ", this._mouseDown.bind(this));
    stage.on("click", this._clickTap.bind(this));
  }

  _mouseDown(e) {
    if (e.target === this.konvaStage) {
      this._setState(APP_STATE.NONE);
      return;
    }
    if (e.target.id != undefined) {
      if (
        e.target.attrs != undefined &&
        e.target.attrs.class != ELEMENTS_CLASS.CIRCUMFERENCE
      ) {
        this._setState(APP_STATE.OBJECT_SELECTED);
      } else {
        this._setState(APP_STATE.NONE);
      }
      return;
    }
  }

  _clickTap(e) {
    const tool = App.getSelectedTool();
    if (tool != undefined) {
      tool.draw.bind(tool)(e);
      return;
    }
    if (e.target === this.konvaStage) {
      this._setState(APP_STATE.NONE);
      return;
    }
  }

  _bootstrap() {}
}