1 files changed, 73 insertions, 0 deletions
diff --git a/lib/systems/attributes_to_renderable.js b/lib/systems/attributes_to_renderable.js
new file mode 100644
index 0000000..e5c66a0
--- /dev/null
+++ b/lib/systems/attributes_to_renderable.js
@@ -0,0 +1,73 @@
+import { System } from '@serpentity/serpentity';
+
+import RenderableWithAttributesNode from '../nodes/renderable_with_attributes';
+
+/**
+ * Updates the renderables based on their attribuets
+ *
+ * @extends {external:Serpentity.System}
+ * @class AttributesToRenderableSystem
+ * @param {object} config a configuration object to extend.
+ */
+export default class AttributesToRenderableSystem extends System {
+
+  constructor(config = {}) {
+
+    super();
+
+    /**
+     * The node collection of renderable entities
+     *
+     * @property {external:Serpentity.NodeCollection} renderables
+     * @instance
+     * @memberof AttributesToRenderableSystem
+     */
+    this.renderables = null;
+  }
+
+  /**
+   * Initializes system when added. Requests renderable nodes and
+   * attaches to event listeners to add / remove them to pixi stage
+   *
+   * @function added
+   * @memberof AttributesToRenderableSystem
+   * @instance
+   * @param {external:Serpentity.Engine} engine the serpentity engine to
+   * which we are getting added
+   */
+  added(engine) {
+
+    this.renderables = engine.getNodes(RenderableWithAttributesNode);
+  }
+
+  /**
+   * Clears system resources when removed.
+   *
+   * @function removed
+   * @instance
+   * @memberof AttributesToRenderableSystem
+   */
+  removed() {
+
+    this.renderables = null;
+  }
+
+  /**
+   * Runs on every update of the loop. Updates the graphics so they're
+   * rendered correctly
+   *
+   * @function update
+   * @instance
+   * @param {Number} currentFrameDuration the duration of the current
+   * frame
+   * @memberof AttributesToRenderableSystem
+   */
+  update(currentFrameDuration) {
+
+    for (const renderable of this.renderables) {
+      renderable.container.container.position.x = renderable.position.x;
+      renderable.container.container.position.y = renderable.position.y;
+      renderable.container.container.rotation = renderable.angle.angle;
+    }
+  }
+};