mnml/client/src/scenes/combat.animations.js

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.ANIMATION_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.ANIMATION_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: 25,
            quantity: 4,
            blendMode: 'ADD',
            lifespan,
        });
        this.add(particles);
        this.scene.time.delayedCall(lifespan, () => { emitter.stop(); }, [], this);
    }

    gravBomb(isAlly) {
        const lifespan = DELAYS.ANIMATION_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.ANIMATION_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.ANIMATION_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;