const Phaser = require('phaser');
const { POSITIONS: { COMBAT }, TEXT } = require('./constants');

class CombatLog extends Phaser.Scene {
    constructor() {
        super({ key: 'CombatLog' });
    }

    create(game) {
        this.registry.events.on('changedata', this.updateData, this);
        this.cameras.main.setViewport(COMBAT.LOG.x(), COMBAT.LOG.y(), COMBAT.LOG.width(), COMBAT.LOG.height());
        this.log = this.add.text(0, 0, '', TEXT.NORMAL);
        this.logIndex = game.log.length;
        this.logData = game.log;
        this.log.setWordWrapWidth(COMBAT.LOG.width());
        this.log.setText(Array.from(game.log).reverse());
    }

    updateData(parent, key, data) {
        const UPDATE_KEYS = ['game', 'gameLog'];
        if (UPDATE_KEYS.includes(key) && data) {
            if (key === 'game') {
                this.logData = data.log;
            }
            if (key === 'gameLog') {
                this.logIndex = data;
            }
            this.updateLog();
        }
        return true;
    }

    updateLog() {
        // shallow copy because reverse mutates
        if (this.logData.length > this.logIndex + 1
            && Array.from(this.logData)[this.logIndex].slice(-2) === 'KO') {
            this.logIndex += 1;
            this.registry.set('gameLog', this.logIndex);
        }
        // }
        this.log.setText(Array.from(this.logData).slice(0, this.logIndex).reverse());
    }

    cleanUp() {
        this.registry.events.off('changedata', this.updateData);
        this.scene.remove();
    }
}

module.exports = CombatLog;