Physics Engine (#4)

* Add matter-js as a dependency

* Add body component

* Fix renderable node doc

* Add the physics node type

* Correct typo in physics enabled node types

* Update docs on render system

* Add physics system

* Update changelog

* Add physics engine to main app

* Tweak the gravity of the world

* Add body to sumo factory

* Add angle component

* Add angle to entity

* Add angle to the nodes

* Pass angle between systems

* Set default angle to 0

* Split systems and nodes

* Fix indentaion in physics world control

* Add third sumo entity

* Adjust values for constriants and physics

* Correct docs in new nodes

* Update built-in docs

1 files changed, 50 insertions, 2 deletions

diff --git a/lib/sumo.js b/lib/sumo.js
index 81f948f..d79826f 100644
--- a/lib/sumo.js
+++ b/lib/sumo.js
@@ -1,7 +1,12 @@
+import PhysicsWorldControlSystem from './systems/physics_world_control';
+import PhysicsToAttributesSystem from './systems/physics_to_attributes';
+import CreateCouplingLineSystem from './systems/create_coupling_line';
 import RenderSystem from './systems/render';
+import AttributesToRenderableSystem from './systems/attributes_to_renderable';
 import SumoFactory from './factories/sumo';
 import Serpentity from '@serpentity/serpentity';
 import { Application } from 'pixi.js';
+import { Engine } from 'matter-js';
 
 /* global window document */
 
@@ -60,6 +65,7 @@ internals.Sumo = class Sumo {
 
     // Initialization functions
     this._initializeCanvas();
+    this._initializeMatter();
     this._initializePixi();
     this._initializeSystems();
     this._initializeEntities();
@@ -124,6 +130,15 @@ internals.Sumo = class Sumo {
     window.addEventListener('resize', this._resizeCanvas.bind(this));
   }
 
+  // Initialize MatterJs
+
+  _initializeMatter() {
+
+    this._matterJs = Engine.create();
+
+    this._matterJs.world.gravity.y = 0;
+  }
+
   // Initialize Pixi
 
   _initializePixi() {
@@ -160,6 +175,16 @@ internals.Sumo = class Sumo {
 
   _initializeSystems() {
 
+    this._engine.addSystem(new PhysicsWorldControlSystem({
+      engine: this._matterJs
+    }));
+
+    this._engine.addSystem(new PhysicsToAttributesSystem());
+
+    this._engine.addSystem(new AttributesToRenderableSystem());
+
+    this._engine.addSystem(new CreateCouplingLineSystem());
+
     this._engine.addSystem(new RenderSystem({
       application: this._pixi
     }));
@@ -169,19 +194,42 @@ internals.Sumo = class Sumo {
 
   _initializeEntities() {
 
-    SumoFactory.createSumo(this._engine, {
+    const entityA = SumoFactory.createSumo(null, {
       position: {
         x: 50,
         y: 50
       }
     });
 
-    SumoFactory.createSumo(this._engine, {
+    const entityB = SumoFactory.createSumo(null, {
       position: {
         x: 309,
         y: 112
       }
     });
+
+    const entityC = SumoFactory.createSumo(null, {
+      position: {
+        x: 500,
+        y: 78
+      }
+    });
+
+    SumoFactory.createRubberBand(this._engine, {
+      entityA,
+      entityB
+    });
+
+    SumoFactory.createRubberBand(this._engine, {
+      entityA: entityC,
+      entityB
+    });
+
+    // To keep the coupling behind, we'll manually add the sumos later
+
+    this._engine.addEntity(entityA);
+    this._engine.addEntity(entityB);
+    this._engine.addEntity(entityC);
   }
 };