Add Naive Game Rules (#11)

* Add components for tracking points

* Add methods to create new entities

* Adds nodes for points

* Add system to detect points

* Adds system to detect a winner

* Add system to render points and winner

* Add points required to win to config

* Add it all to the engine

* Add mention of points to changelog

1 files changed, 114 insertions, 0 deletions

diff --git a/lib/systems/render_points.js b/lib/systems/render_points.js
new file mode 100644
index 0000000..f7fd410
--- /dev/null
+++ b/lib/systems/render_points.js
@@ -0,0 +1,114 @@
+import { System } from '@serpentity/serpentity';
+import { Graphics } from 'pixi.js';
+
+import Config from '../config';
+import PointsNode from '../nodes/points';
+
+const internals = {
+  kNoPixiError: 'No pixi application passed to render system. Make sure you set the `application` key in the config object when initializing.',
+  redBar: new Graphics(),
+  blueBar: new Graphics()
+};
+
+/**
+ * Renders points assuming there exist a "red" and a "blue" score
+ *
+ * @extends {external:Serpentity.System}
+ * @class RenderPointsSystem
+ * @param {object} config a configuration object to extend.
+ */
+export default class RenderPointsSystem extends System {
+
+  constructor(config = {}) {
+
+    super();
+
+    /**
+     * The node collection of points keepers
+     *
+     * @property {external:Serpentity.NodeCollection} pointsKeepers
+     * @instance
+     * @memberof RenderPointsSystem
+     */
+    this.pointsKeepers = null;
+
+    /**
+     * The pixi engine we will use to render
+     *
+     * @property {external:PixiJs.Application} application
+     * @instance
+     * @memberof RenderPointsSystem
+     */
+    this.application = config.application;
+
+    if (!this.application) {
+      throw new Error(internals.kNoPixiError);
+    }
+  }
+
+  /**
+   * Initializes system when added. Requests renderable nodes and
+   * attaches to event listeners to add / remove them to pixi stage
+   *
+   * @function added
+   * @memberof RenderPointsSystem
+   * @instance
+   * @param {external:Serpentity.Engine} engine the serpentity engine to
+   * which we are getting added
+   */
+  added(engine) {
+
+    this.pointsKeepers = engine.getNodes(PointsNode);
+    this.application.stage.addChild(internals.blueBar);
+    this.application.stage.addChild(internals.redBar);
+  }
+
+  /**
+   * Clears system resources when removed.
+   *
+   * @function removed
+   * @instance
+   * @memberof RenderPointsSystem
+   */
+  removed() {
+
+    this.pointsKeepers = null;
+    this.application.stage.removeChild(internals.blueBar);
+    this.application.stage.removeChild(internals.redBar);
+  }
+
+  /**
+   * Runs on every update of the loop. Updates the bars
+   *
+   * @function update
+   * @instance
+   * @param {Number} currentFrameDuration the duration of the current
+   * frame
+   * @memberof RenderPointsSystem
+   */
+  update(currentFrameDuration) {
+
+    for (const pointsKeeper of this.pointsKeepers) {
+
+      const redPoints = pointsKeeper.points.red;
+      const bluePoints = pointsKeeper.points.blue;
+
+      const redBarHeight = redPoints * Config.verticalResolution / Config.maxPoints;
+      const blueBarHeight = bluePoints * Config.verticalResolution / Config.maxPoints;
+
+      internals.redBar.removeChildren();
+      const redBar = new Graphics();
+      redBar.lineStyle(20, 0xeaacac, 0.75)
+        .moveTo(Config.horizontalResolution, 0)
+        .lineTo(Config.horizontalResolution, redBarHeight);
+      internals.redBar.addChild(redBar);
+
+      internals.blueBar.removeChildren();
+      const blueBar = new Graphics();
+      blueBar.lineStyle(20, 0x87c5ea, 0.75)
+        .moveTo(0, 0)
+        .lineTo(0, blueBarHeight);
+      internals.blueBar.addChild(blueBar);
+    }
+  }
+};