Added phaser

client/src/components/phaser.combat.js

@@ -0,0 +1,37 @@
+const Phaser = require('phaser');
+
+class PhaserCombat extends Phaser.Scene {
+    preload() {
+        this.load.setBaseURL('http://labs.phaser.io');
+        this.load.image('sky', 'assets/skies/space3.png');
+        this.load.image('logo', 'assets/sprites/bullet.png');
+        this.load.image('red', 'assets/particles/red.png');
+    }
+
+    create() {
+        this.add.image(400, 300, 'sky');
+        const particles = this.add.particles('red');
+        const emitter = particles.createEmitter({
+            speed: 100,
+            scale: { start: 1, end: 0 },
+            blendMode: 'ADD',
+        });
+        this.logo = this.physics.add.image(400, 100, 'logo');
+        this.logo.x = -100;
+        this.direction = true;
+        emitter.startFollow(this.logo);
+    }
+
+    shootRight() {
+        this.logo.x = -1;
+        this.logo.setVelocity(500, 0);
+    }
+
+    shootLeft() {
+        this.logo.x = 610;
+        this.logo.setVelocity(-500, 0);
+    }
+}
+
+
+module.exports = PhaserCombat;

client/src/components/phaser.container.jsx

@@ -0,0 +1,53 @@
+const preact = require('preact');
+const { connect } = require('preact-redux');
+const Phaser = require('phaser');
+const PhaserCombat = require('./phaser.combat');
+
+const addState = connect(
+    function receiveState(state) {
+        const { game, activeSkill, activeIncoming } = state;
+        return {game, activeSkill, activeIncoming };
+    }    
+);
+
+class PhaserInstance extends preact.Component {
+    constructor(props) {
+        super(props);
+        this.props = props;
+    }
+
+    componentWillReceiveProps(nextProps) {
+        if (nextProps.activeIncoming != null) {
+            this.PhaserCombat.shootLeft();
+        } else {
+            this.PhaserCombat.shootRight();
+        }
+    }
+
+    componentDidMount() {
+    // now mounted, can freely modify the DOM:
+        this.PhaserCombat = new PhaserCombat();
+        const config = {
+            type: Phaser.AUTO,
+            width: 600,
+            height: 400,
+            parent: 'phaser-example',
+            physics: {
+                default: 'arcade',
+                arcade: {
+                    gravity: { y: 0 },
+                },
+            },
+            scene: this.PhaserCombat,
+        };
+        const game = new Phaser.Game(config);
+    }
+
+    render() {
+        return (
+            <div id="phaser-example" style="overflow: hidden;">
+            </div>
+        );
+    }
+}
+module.exports = addState(PhaserInstance);