add new models

src/app/app.js

@@ -1,9 +1,9 @@
 import { APP_STATE } from "./core/enums/app-state-enum";
-import { stages as Stages } from "./core/components/stages";
-import { objects as Objects } from "./core/components/objects";
-import { state as State } from "./core/components/state";
-import { selector as Selector } from "./core/components/selector";
-import { menu as Menu } from "./core/components/menu";
+import { stages as Stages } from "./core/application/stages";
+import { objects as Objects } from "./core/application/objects";
+import { state as State } from "./core/application/state";
+import { selector as Selector } from "./core/application/selector";
+import { menu as Menu } from "./core/application/menu";
 export const app = (function() {
   let _selectedTool = [];
   let _stage = _createStage();

src/app/components/circumference.js

@@ -1,5 +1,5 @@
 import { app as App } from "../app";
-import { menu as Menu } from "../core/components/menu";
+import { menu as Menu } from "../core/application/menu";
 export const circumference = (function() {
   let _tool = {};
   let _states = ["center", "radius"];

src/app/components/line-segment.js

@@ -1,17 +1,16 @@
 import { app as App } from "../app";
-import { menu as Menu } from "../core/components/menu";
+import { menu as Menu } from "../core/application/menu";
 import { point as Point } from "./point";
-import { selector as Selector } from "../core/components/selector";
+import { selector as Selector } from "../core/application/selector";
 import { ELEMENTS_CLASS } from "../core/enums/elements-class-enum";
 export class LineSegment {
-
-  static get STATE_PRIMEIRO_PONTO () {
+  static get STATE_PRIMEIRO_PONTO() {
     return "primeiro_ponto";
   }
-  static get STATE_SEGUNDO_PONTO () {
+  static get STATE_SEGUNDO_PONTO() {
     return "segundo_ponto";
   }
-  
+
   constructor() {
     this._state = undefined;
     this._points = new Set();
@@ -27,24 +26,24 @@ export class LineSegment {
     this.bootstrap();
   }
 
-  draw (event) {
+  draw(event) {
     console.log("chamou o método draw()");
     console.log("evento: ", event);
     let _this = this;
-    if(event != null) {
+    if (event != null) {
       _this = event;
     }
-    if(_this._state == null) {
+    if (_this._state == null) {
       _this._state = LineSegment.STATE_PRIMEIRO_PONTO;
       _this._points.clear();
       App.setStatus("Selecione o primeiro ponto no canvas");
     } else if (_this._state === LineSegment.STATE_PRIMEIRO_PONTO) {
       const pos = App.pos();
-      _this._points.add({x: pos.x, y: pos.y});
+      _this._points.add({ x: pos.x, y: pos.y });
       _this._state = LineSegment.STATE_SEGUNDO_PONTO;
     } else if (_this._state === LineSegment.STATE_SEGUNDO_PONTO) {
       const pos = App.pos();
-      _this._points.add({x: pos.x, y: pos.y});
+      _this._points.add({ x: pos.x, y: pos.y });
       _this.drawPoint(_this._points);
       _this._points.clear();
       _this._state = LineSegment.STATE_PRIMEIRO_PONTO;
@@ -77,8 +76,10 @@ export class LineSegment {
     if (e == undefined) {
       _this = this;
     }
-    if (_this._state == LineSegment.STATE_PRIMEIRO_PONTO ||
-      _this._state == LineSegment.STATE_SEGUNDO_PONTO) {
+    if (
+      _this._state == LineSegment.STATE_PRIMEIRO_PONTO ||
+      _this._state == LineSegment.STATE_SEGUNDO_PONTO
+    ) {
       App.clearSelectedTool();
       _this.clearState();
       return;
@@ -91,7 +92,10 @@ export class LineSegment {
     ) {
       const layer = App.currentLayer();
       const point_groups = new Set(objects.map(object => object.parent));
-      const points_xy = objects.reduce((prev, next) => prev.concat([next.x(), next.y()]), []);
+      const points_xy = objects.reduce(
+        (prev, next) => prev.concat([next.x(), next.y()]),
+        []
+      );
       let ln = _this.createLine(points_xy);
       _this.attachPoints(ln, point_groups);
       layer.add(ln);
@@ -110,25 +114,26 @@ export class LineSegment {
     this._points.clear();
   }
 
-  drawPoint (p) {
+  drawPoint(p) {
     const points = Array.from(p).map(xy => {
       return Point.drawPoint(xy.x, xy.y, true);
     });
-    const points_xy = points.map( group => this.getPoint(group))
+    const points_xy = points
+      .map(group => this.getPoint(group))
       .reduce((prev, next) => prev.concat([next.x(), next.y()]), []);
     let ln = this.createLine(points_xy);
     let layer = App.currentLayer();
     this.attachPoints(ln, points);
     layer.add(ln);
     App.stage.draw();
-    
+
     //this.clearState();
     //App.clearSelectedTool();
     //App.setStatus("");
     return ln;
   }
 
-  createLine (points) {
+  createLine(points) {
     return new Konva.Line({
       points: points,
       stroke: "grey",
@@ -141,31 +146,31 @@ export class LineSegment {
     });
   }
 
-  getPoint (group) {
+  getPoint(group) {
     const point_collection = group.find(node => {
-      return node.getClassName() === 'Circle';
+      return node.getClassName() === "Circle";
     });
     return point_collection.toArray()[0];
   }
 
-  attachPoints (line, points) {
-    line._parents = []
-    points.forEach( (p, idx)=> {
+  attachPoints(line, points) {
+    line._parents = [];
+    points.forEach((p, idx) => {
       line._parents.push(p);
       const point = this.getPoint(p);
       point._name = idx;
-      if(!p._parents) {
+      if (!p._parents) {
         p._children = [];
       }
       p._children.push(line);
-      p.on('dragmove', () => {
+      p.on("dragmove", () => {
         App.clearSelectedTool();
         this.clearState();
         const current_points = line.points();
         const new_point = this.getPoint(p);
         const new_x = new_point.x() + p.x();
         const new_y = new_point.y() + p.y();
-        if(new_point._name == 0) {
+        if (new_point._name == 0) {
           // pos 0 ,1
           current_points[0] = new_x;
           current_points[1] = new_y;
@@ -176,7 +181,7 @@ export class LineSegment {
         line.points(current_points);
         //App.stage.draw();
       });
-    })
+    });
   }
 
   bootstrap() {

src/app/components/point.js

@@ -1,6 +1,6 @@
 import { app as App } from "../app";
-import { label as Label } from "../components/label";
-import { menu as Menu } from "../core/components/menu";
+import { label as Label } from "./label";
+import { menu as Menu } from "../core/application/menu";
 import { ELEMENTS_CLASS } from "../core/enums/elements-class-enum";
 
 const HOVER_STYLE = {
@@ -62,12 +62,12 @@ export const point = (function() {
       listening: true
     });
     // mouse over event
-    circle.on('mouseover', function () {
+    circle.on("mouseover", function() {
       this.strokeWidth(HOVER_STYLE.strokeWidth);
       this.stroke(HOVER_STYLE.stroke);
       App.stage.draw();
     });
-    circle.on('mouseout', function () {
+    circle.on("mouseout", function() {
       this.strokeWidth(style.strokeWidth);
       this.stroke(style.stroke);
       App.stage.draw();
@@ -95,7 +95,7 @@ export const point = (function() {
 
     App.pushObject(group);
 
-   return group;
+    return group;
   }
 
   function _click(e) {

src/app/core/components/selector.js

@@ -1,7 +1,7 @@
 import { APP_STATE } from "../enums/app-state-enum";
-import { stages as Stages } from "../components/stages";
-import { state as State } from "../components/state";
-import { objects as Objects } from "../components/objects";
+import { stages as Stages } from "../application/stages";
+import { state as State } from "../application/state";
+import { objects as Objects } from "../application/objects";
 import { ELEMENTS_CLASS } from "../enums/elements-class-enum";
 export class Selector {
   constructor() {

src/app/core/models/components/component-options.js

@@ -0,0 +1,8 @@
+export class ComponentOptions {
+  constructor(id) {
+    this.id = id;
+    this.title;
+    this.description;
+    this.icon;
+  }
+}

src/app/core/models/components/component.js

@@ -0,0 +1,11 @@
+export class Component {
+  constructor(options) {
+    this.options = options;
+    this.geometricObject;
+    this.states;
+    this.drawer;
+  }
+  draw() {
+    this.drawe.draw();
+  }
+}

src/app/core/models/drawers/drawer-aggregator.js

@@ -0,0 +1,12 @@
+export class DrawerAggragator {
+  constructor() {
+    this.geometricObject;
+    this.konvaObject;
+  }
+  setGeometricObject(geometricObject) {
+    this.geometricObject = geometricObject;
+  }
+  setKonvaObject(konvaObject) {
+    this.konvaObject = konvaObject;
+  }
+}

src/app/core/models/geometrics/generic-object.js

@@ -0,0 +1 @@
+export class GenericObject {}

src/app/core/models/geometrics/geometric-object.js

@@ -0,0 +1,23 @@
+import { GenericObject } from "./generic-object";
+
+export class GeometricObject extends GenericObject {
+  constructor() {
+    this.borderColor;
+    this.backgroundColor;
+    this.edgeThinckness;
+    this.label;
+    this.dependencies = [];
+  }
+  setBorderColor(color) {
+    this.borderColor = color;
+  }
+  setBackgroundColor(color) {
+    this.backgroundColor = color;
+  }
+  setEdgeThinckness(edgeThinckness) {
+    this.edgeThinckness = edgeThinckness;
+  }
+  update() {
+    throw "not implemented exception";
+  }
+}

src/app/models/point-model.js

@@ -1 +0,0 @@
-export class Point {}