From 0616b3f00653c66b5e34814653e33413b9ec034e Mon Sep 17 00:00:00 2001
From: Rubén Beltrán del Río <ben@nsovocal.com>
Date: Sat, 21 Apr 2018 03:48:01 -0500
Subject: Render Sumo (#3)

* Use corrected components

* Add renderable node

* Add render system

* Add sumo factory

* Add systems and entities to app

* Remove reference to weight / accel component

* Update dependencies, add pixi and babel-polyfill

* Use babel polyfill

* Add component to store pixi containers

* Add pixi container to the renderable support

* Update factories to produce renderables

* Update the renderable to use pixi

It also uses the new event emitters in serpentity 2.1.0

* Initialize pixi and pass it to renderable system
---
 lib/factories/pixi.js | 66 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 66 insertions(+)
 create mode 100644 lib/factories/pixi.js

(limited to 'lib/factories/pixi.js')

diff --git a/lib/factories/pixi.js b/lib/factories/pixi.js
new file mode 100644
index 0000000..e3c1b5a
--- /dev/null
+++ b/lib/factories/pixi.js
@@ -0,0 +1,66 @@
+import { Graphics } from 'pixi.js';
+
+/**
+ * Factory object that contains many methods to create prefab pixi
+ * objects
+ *
+ * @type object
+ * @name PixiFactory
+ */
+export default {
+
+  /**
+   * Creates a sumo container
+   *
+   * @function createSumo
+   * @memberof PixiFactory
+   * @return {external:CreateJs.Container} the created container
+   */
+  createSumo() {
+
+    const radius = 25;
+
+    // The body
+    const body = new Graphics();
+    body.beginFill(0x87c5ea)
+      .drawCircle(0, 0, radius)
+      .endFill();
+
+    // The mouth
+    const mouth = new Graphics();
+    mouth.lineStyle(10, 0xff0080, 1)
+      .arc(
+        0, 0, // center
+        radius * 0.6,
+        Math.PI / 6,
+        5 * Math.PI / 6
+      );
+
+    const leftEye = new Graphics();
+    leftEye.beginFill(0xffffff)
+      .drawCircle(-radius / 3 - radius / 8, -radius / 4, radius / 5)
+      .endFill();
+
+    const rightEye = new Graphics();
+    rightEye.beginFill(0xffffff)
+      .drawCircle(radius / 3 + radius / 8, -radius / 4, radius / 5);
+
+    const leftPupil = new Graphics();
+    leftPupil.beginFill(0x11)
+      .drawCircle(-radius / 3 - radius / 8, -radius / 4, radius / 10);
+
+    const rightPupil = new Graphics();
+    leftPupil.beginFill(0x11)
+      .drawCircle(radius / 3 + radius / 8, -radius / 4, radius / 10);
+
+    // The group
+    body.addChild(mouth);
+    body.addChild(leftEye);
+    body.addChild(rightEye);
+    body.addChild(leftPupil);
+    body.addChild(rightPupil);
+
+    return body;
+  }
+};
+
-- 
cgit