X-Git-Url: https://git.r.bdr.sh/rbdr/sumo/blobdiff_plain/11be5ebabcdab8272d938f7b90ef0ea9be29a421..493ec31cb19b4211c703762d14a4e6232c4c2143:/lib/sumo.js?ds=sidebyside diff --git a/lib/sumo.js b/lib/sumo.js index da72991..d79826f 100644 --- a/lib/sumo.js +++ b/lib/sumo.js @@ -1,8 +1,17 @@ +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 */ const internals = { + kBackgroundColor: 0xd8c590, kNoElementError: 'No element found. Cannot render.', // Handler for the window load event. Initializes and runs the app. @@ -56,6 +65,8 @@ internals.Sumo = class Sumo { // Initialization functions this._initializeCanvas(); + this._initializeMatter(); + this._initializePixi(); this._initializeSystems(); this._initializeEntities(); } @@ -119,6 +130,27 @@ 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() { + + this._pixi = new Application({ + backgroundColor: internals.kBackgroundColor, + view: this._canvas, + width: this._canvas.width, + height: this._canvas.height + }); + } + // Resizes the canvas to a square the size of the smallest magnitude // of the window. @@ -143,12 +175,61 @@ 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 + })); } // Initializes the serpentity entities _initializeEntities() { + const entityA = SumoFactory.createSumo(null, { + position: { + x: 50, + y: 50 + } + }); + + 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); } };