rename skills -> animations

client/src/scenes/combat.animations.js

@@ -0,0 +1,156 @@
+const Phaser = require('phaser');
+const { POSITIONS: { COMBAT }, DELAYS } = require('./constants');
+
+const randomColour = () => {
+    const colours = ['green', 'blue', 'red', 'white', 'yellow'];
+    return colours[Math.floor(Math.random() * 5)];
+};
+
+const animationParams = (isAlly) => {
+    const spawnLocation = isAlly ? COMBAT.width() * 0.35 : COMBAT.width() * 0.65;
+    const speed = isAlly ? 250 : -250;
+    const img = randomColour();
+    const angleMin = isAlly ? 320 : 180;
+    const angleMax = isAlly ? 360 : 220;
+    return { spawnLocation, speed, img, angleMin, angleMax };
+};
+
+class CombatSkills extends Phaser.GameObjects.Group {
+    constructor(scene) {
+        super(scene);
+        this.scene = scene;
+    }
+
+    wall(isAlly) {
+        const lifespan = DELAYS.EFFECT_DURATION;
+        const { spawnLocation, speed, img } = animationParams(isAlly);
+        const particles = this.scene.add.particles(img);
+        const emitter = particles.createEmitter({
+            x: spawnLocation,
+            y: { min: COMBAT.height() * 0.2, max: COMBAT.height() * 0.5 },
+            speedX: { min: speed, max: speed * 2 },
+            scale: { start: 0.4, end: 0 },
+            quantity: 4,
+            blendMode: 'ADD',
+            lifespan,
+        });
+        this.add(particles);
+        this.scene.time.delayedCall(lifespan, () => { emitter.stop(); }, [], this.scene);
+    }
+
+    spit(isAlly) {
+        const lifespan = DELAYS.EFFECT_DURATION;
+        const { spawnLocation, speed, img, angleMin, angleMax } = animationParams(isAlly);
+        const particles = this.scene.add.particles(img);
+        const emitter = particles.createEmitter({
+            x: spawnLocation,
+            y: COMBAT.height() * 0.35,
+            angle: { min: angleMin, max: angleMax },
+            speed: speed * 2,
+            scale: { start: 0.4, end: 1 },
+            gravityY: 250,
+            quantity: 4,
+            blendMode: 'ADD',
+            lifespan,
+        });
+        this.add(particles);
+        this.scene.time.delayedCall(lifespan, () => { emitter.stop(); }, [], this);
+    }
+
+    gravBomb(isAlly) {
+        const lifespan = DELAYS.EFFECT_DURATION;
+
+        const { spawnLocation, img } = animationParams(isAlly);
+        const particles = this.scene.add.particles(img);
+        const location = isAlly ? COMBAT.width() * 0.35 : COMBAT.width() * 0.65;
+        const well = particles.createGravityWell({
+            x: location,
+            y: COMBAT.height() * 0.25,
+            power: 4,
+            gravity: 500,
+        });
+        this.emitter = particles.createEmitter({
+            x: spawnLocation,
+            y: COMBAT.height() * 0.25,
+            speed: 1000,
+            scale: { start: 0.7, end: 1 },
+            blendMode: 'ADD',
+            lifespan,
+        });
+        this.add(particles);
+        this.scene.time.delayedCall(lifespan, () => { this.emitter.stop(); well.active = false; }, [], this.scene);
+    }
+
+    gravBlast(isAlly) {
+        const lifespan = DELAYS.EFFECT_DURATION;
+        const WELL_END = lifespan / 2;
+
+        const img = randomColour();
+        const spawnLocation = isAlly ? COMBAT.width() * 0.35 : COMBAT.width() * 0.65;
+        const isEnemyLocation = isAlly ? COMBAT.width() * 0.7 : COMBAT.width() * 0.3;
+        const particles = this.scene.add.particles(img);
+        const bounds = isAlly
+            ? { x: COMBAT.width() * 0.3, y: COMBAT.height() * 0.2, w: COMBAT.width() * 0.5, h: COMBAT.height() * 0.2 }
+            : { x: 0.2 * COMBAT.width(), y: COMBAT.height() * 0.2, w: COMBAT.width() * 0.5, h: COMBAT.height() * 0.2 };
+        const well = particles.createGravityWell({
+            x: spawnLocation,
+            y: COMBAT.height() * 0.35,
+            power: 4,
+            gravity: 500,
+        });
+        const emitter = particles.createEmitter({
+            x: spawnLocation,
+            y: COMBAT.height() * 0.35,
+            speed: 1000,
+            scale: { start: 0.7, end: 1 },
+            blendMode: 'ADD',
+            bounds,
+            lifespan,
+        });
+        this.add(particles);
+        this.scene.time.delayedCall(WELL_END, () => { emitter.stop(); well.x = isEnemyLocation; }, [], this.scene);
+        this.scene.time.delayedCall(lifespan, () => { well.active = false; }, [], this.scene);
+    }
+
+    chargeBall(isAlly) {
+        const lifespan = DELAYS.EFFECT_DURATION;
+        const CHARGE_LIFESPAN = lifespan / 2;
+
+        const { img, spawnLocation } = animationParams(isAlly);
+        const targetLocation = isAlly ? 0.7 * COMBAT.width() : 0.25 * COMBAT.width();
+        const particles = this.scene.add.particles(img);
+        const emitter = particles.createEmitter({
+            x: 0,
+            y: 0,
+            moveToX: spawnLocation,
+            moveToY: COMBAT.height() * 0.1,
+            scale: 0.75,
+            quantity: 4,
+            _frequency: 20,
+            blendMode: 'ADD',
+            emitZone: { source: new Phaser.Geom.Rectangle(0, 0, COMBAT.width(), COMBAT.height()) },
+            lifespan: CHARGE_LIFESPAN,
+        });
+        const emitter2 = particles.createEmitter({
+            radial: false,
+            x: { min: spawnLocation, max: targetLocation, steps: 256 },
+            y: { min: COMBAT.height() * 0.1, max: COMBAT.height() * 0.4, steps: 256 },
+            quantity: 4,
+            gravityY: 0,
+            scale: { start: 1.5, end: 0, ease: 'Power3' },
+            blendMode: 'ADD',
+            active: false,
+            lifespan,
+        });
+        this.add(particles);
+        this.scene.time.delayedCall(CHARGE_LIFESPAN, () => { emitter.stop(); }, [], this.scene);
+        this.scene.time.delayedCall(CHARGE_LIFESPAN, () => { emitter2.active = true; }, [], this.scene);
+        this.scene.time.delayedCall(lifespan, () => { emitter2.stop(); }, [], this.scene);
+    }
+
+    cleanup() {
+        this.children.entries.forEach(obj => obj.destroy());
+    }
+}
+
+module.exports = CombatSkills;