feat(*): create phaser skeleton game

games/phaser/package.json

@@ -6,7 +6,9 @@
     "lint": "prettier . --check && eslint .",
     "lint:fix": "prettier . --write && eslint . --fix"
   },
-  "dependencies": {},
+  "dependencies": {
+    "phaser": "^3.85.2"
+  },
   "devDependencies": {
     "@wds/tools.prettier": "*",
     "@wds/tools.eslint": "*",

games/phaser/src/index.css

@@ -2,3 +2,8 @@ body {
   margin: 0;
   padding: 0;
 }
+
+canvas {
+  width: 100%;
+  height: 100%;
+}

games/phaser/src/index.ts

@@ -1,3 +1,44 @@
+import { AUTO, Game, Scene } from "phaser";
+
 import "./index.css";
 
-console.debug("working");
+class ExampleScene extends Scene {
+  preload() {
+    this.load.setBaseURL("/assets");
+
+    this.load.image("sky", "skies/space3.png");
+    this.load.image("logo", "sprites/phaser3-logo.png");
+    this.load.image("red", "particles/red.png");
+  }
+
+  create() {
+    this.add.image(400, 300, "sky");
+
+    const particles = this.add.particles(0, 0, "red", {
+      speed: 100,
+      scale: { start: 1, end: 0 },
+      blendMode: "ADD",
+    });
+
+    const logo = this.physics.add.image(400, 100, "logo");
+
+    logo.setVelocity(100, 200);
+    logo.setBounce(1, 1);
+    logo.setCollideWorldBounds(true);
+
+    particles.startFollow(logo);
+  }
+}
+
+new Game({
+  type: AUTO,
+  scene: ExampleScene,
+  width: 800,
+  height: 600,
+  physics: {
+    default: "arcade",
+    arcade: {
+      gravity: { y: 200, x: 0 },
+    },
+  },
+});