added attacks and dynamic enemy spawning

Signed-off-by: Pascal Syma <pascal@syma.dev>

src/assets/map.json

@@ -131,7 +131,7 @@
           "type": "",
           "visible": true,
           "width": 0,
-          "x": 136.666666666667,
+          "x": 136.667,
           "y": 174
         },
         {
@@ -151,7 +151,22 @@
           "visible": true,
           "width": 0,
           "x": 258,
-          "y": 200.666666666667
+          "y": 200.667
+        },
+        {
+          "height": 19,
+          "id": 9,
+          "name": "text",
+          "rotation": 0,
+          "text": {
+            "text": "Hallo Welt",
+            "wrap": true
+          },
+          "type": "",
+          "visible": true,
+          "width": 72,
+          "x": 13,
+          "y": 166
         }
       ],
       "opacity": 1,
@@ -175,7 +190,7 @@
     }
   ],
   "nextlayerid": 20,
-  "nextobjectid": 9,
+  "nextobjectid": 10,
   "orientation": "orthogonal",
   "renderorder": "right-down",
   "tiledversion": "1.2.5",

src/assets/map.tmx

@@ -1,5 +1,5 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<map version="1.2" tiledversion="1.2.5" orientation="orthogonal" renderorder="right-down" width="48" height="17" tilewidth="16" tileheight="16" infinite="0" nextlayerid="20" nextobjectid="9">
+<map version="1.2" tiledversion="1.2.5" orientation="orthogonal" renderorder="right-down" width="48" height="17" tilewidth="16" tileheight="16" infinite="0" nextlayerid="20" nextobjectid="10">
  <tileset firstgid="1" name="tileset" tilewidth="16" tileheight="16" spacing="2" margin="1" tilecount="88" columns="8">
   <image source="tileset.png" trans="ff00ff" width="144" height="198"/>
   <tile id="0">
@@ -492,6 +492,9 @@
    </properties>
    <point/>
   </object>
+  <object id="9" name="text" x="13" y="166" width="72" height="19">
+   <text wrap="1">Hallo Welt</text>
+  </object>
  </objectgroup>
  <layer id="19" name="Front" width="48" height="17">
   <data encoding="base64">

src/entities/Attacks/AttackA.js

@@ -10,8 +10,8 @@ export default class AttackA extends Hitbox {
     constructor(player) {
         super(player, 5);
 
-        this.body.setSize(42, 32, true);
+        this.body.setSize(42, 20, true);
-        this.body.setOffset(1, -10);
+        this.body.setOffset(1, 8);
     }
 
     start() {

src/entities/Attacks/AttackB.js

@@ -0,0 +1,24 @@
+/*
+ * Copyright (c) 2020. Pascal Syma <pascal@syma.dev>
+ * All rights reserved.
+ */
+
+import Hitbox from "./Hitbox";
+
+export default class AttackA extends Hitbox {
+
+    constructor(player) {
+        super(player, 5);
+
+        this.body.setSize(42, 24, true);
+        this.body.setOffset(1, -16);
+    }
+
+    start() {
+        this.setData('active', true);
+        this.player.play('attack_b', true)
+            .once('animationcomplete', () => {
+                this.setData('active', false)
+            });
+    }
+}

src/entities/Enemys/Bat.js

@@ -18,11 +18,8 @@ export default class Bat extends FlyingEnemy {
         this.play('batIdle');
     }
 
-    fly(velocity) {
-        this.body.velocity.x = velocity;
-    }
-
     update(...args) {
+        super.update(args)
         this.setFlipX(this.body.velocity.x > 0);
     }
 

src/entities/Enemys/Enemy.js

@@ -9,5 +9,20 @@ export default class Enemy extends Entity {
 
     constructor(scene, spawnPoint, texture) {
         super(scene, spawnPoint.x, spawnPoint.y, texture);
+
+        this.spawnPoint = spawnPoint;
+        this.setActive(false)
+    }
+
+    turnedActive() {
+    }
+
+
+    update(...args) {
+        super.update(...args);
+        if (!this.active && this.scene.cameras.main.worldView.x + this.scene.cameras.main.worldView.width >= this.x - this.width) {
+            this.turnedActive();
+            this.setActive(true)
+        }
     }
 }

src/entities/Enemys/FlyingEnemy.js

@@ -12,4 +12,9 @@ export default class FlyingEnemy extends Enemy {
         this.body.setAllowGravity(false);
     }
 
+
+    turnedActive() {
+        super.turnedActive();
+        this.body.velocity.x = (this.spawnPoint.type === "" ? 90 : parseInt(this.spawnPoint.type));
+    }
 }

src/entities/Player.js

@@ -5,6 +5,7 @@
 
 import Entity from "./Entity";
 import AttackA from "./Attacks/AttackA";
+import AttackB from "./Attacks/AttackB";
 
 export default class Player extends Entity {
 
@@ -21,8 +22,10 @@ export default class Player extends Entity {
         this.play('idle');
 
         this.attackA = new AttackA(this);
+        this.attackB = new AttackB(this);
         this.attackHitbox = this.scene.add.group([
-            this.attackA
+            this.attackA,
+            this.attackB
         ]);
 
         this.items = [];
@@ -86,7 +89,10 @@ export default class Player extends Entity {
         } else if (this.scene.keySpace.isDown) {
             // const nextAttack = [this.attackA].sort(() => 0.5 - Math.random())[0];
             // nextAttack.start();
+            if (this.scene.upActive())
                 this.attackA.start();
+            else
+                this.attackB.start();
         } else if (this.body.blocked.down) {
             if (this.body.velocity.x !== 0) {
                 this.play('run', true);

src/scenes/Game.js

@@ -17,7 +17,7 @@ export default class Game extends Phaser.Scene {
                 default: 'arcade',
                 arcade: {
                     gravity: {y: 300},
-                    // debug: true
+                    debug: true
                 }
             }
         });
@@ -99,13 +99,13 @@ export default class Game extends Phaser.Scene {
         this.anims.create({
             key: 'attack_a',
             frames: this.anims.generateFrameNumbers('char', {start: 0, end: 13}),
-            frameRate: 15
+            frameRate: 30
         });
 
         this.anims.create({
             key: 'attack_b',
             frames: this.anims.generateFrameNumbers('char', {start: 14, end: 26}),
-            frameRate: 15
+            frameRate: 30
         });
 
         this.anims.create({
@@ -151,7 +151,6 @@ export default class Game extends Phaser.Scene {
 
         map.objects[0].objects.filter(obj => obj.name === "bat").forEach(s => {
             let bat = new Bat(this, s);
-            bat.fly(s.type === "" ? 90 : parseInt(s.type));
             this.enemys.add(bat)
         })