mnml/client/src/events.js

const toast = require('izitoast');

function registerEvents(registry, events) {
    function setCryps(cryps) {
        console.log('setting cryps');
        registry.set('cryps', cryps);
    }

    function setWs(ws) {
        registry.set('ws', ws);
    }

    function setGame(game) {
        registry.set('game', game);
    }

    function setAccount(account) {
        registry.set('account', account);
        events.emit('ACCOUNT', account);
    }

    function setActiveSkill(skill) {
        registry.set('activeSkill', skill);
    }

    function setItems(items) {
        registry.set('items', items);
    }

    function setGameList(gameList) {
        registry.set('gameList', gameList);
    }

    function setCrypStatusUpdate(id, skill, target) {
        registry.set('crypStatusUpdate', { id, skill, target });
    }

    events.on('SEND_SKILL', function skillActive(gameId, crypId, targetTeamId, skill) {
        const ws = registry.get('ws');
        ws.sendGameSkill(gameId, crypId, targetTeamId, skill);
        setCrypStatusUpdate(crypId, skill, targetTeamId);
    });

    events.on('SEND_TARGET', function skillActive(gameId, crypId, skill) {
        const ws = registry.get('ws');
        ws.sendGameTarget(gameId, crypId, skill.id);
        setCrypStatusUpdate(crypId, skill, null);
    });

    events.on('CRYP_ACTIVE', function crypActiveCb(cryp) {
        const cryps = registry.get('cryps');

        cryps.forEach((c) => {
            if (c.id === cryp.id) {
                if (c.active) return c.active = false;
                return c.active = true;
            }
            return false;
        });

        return setCryps(cryps);
    });

    function loginPrompt() {
        const USER_INPUT = '<input className="input" type="email" placeholder="username" />';
        const PASSWORD_INPUT = '<input className="input" type="password" placeholder="password" />';
        const LOGIN_BUTTON = '<button type="submit">Login</button>';
        const REGISTER_BUTTON = '<button type="submit">Register</button>';

        const ws = registry.get('ws');

        function submitLogin(instance, thisToast, button, e, inputs) {
            const USERNAME = inputs[0].value;
            const PASSWORD = inputs[1].value;
            ws.sendAccountLogin(USERNAME, PASSWORD);
        }

        function submitRegister(instance, thisToast, button, e, inputs) {
            const USERNAME = inputs[0].value;
            const PASSWORD = inputs[1].value;
            ws.sendAccountCreate(USERNAME, PASSWORD);
        }

        const existing = document.querySelector('#login'); // Selector of your toast
        if (existing) toast.hide({}, existing, 'reconnect');

        toast.question({
            id: 'login',
            theme: 'dark',
            color: 'black',
            timeout: false,
            // overlay: true,
            drag: false,
            close: false,
            title: 'LOGIN',
            position: 'center',
            inputs: [
                [USER_INPUT, 'change', null, true], // true to focus
                [PASSWORD_INPUT, 'change', null],
            ],
            buttons: [
                [LOGIN_BUTTON, submitLogin], // true to focus
                [REGISTER_BUTTON, submitRegister], // true to focus
            ],
        });

        events.once('ACCOUNT', function closeLoginCb() {
            const prompt = document.querySelector('#login'); // Selector of your toast
            if (prompt) toast.hide({ transitionOut: 'fadeOut' }, prompt, 'event');
        });
    }

    events.on('CRYP_SPAWN', function spawnPrompt() {
        const NAME_INPUT = '<input className="input" type="email" placeholder="name" />';
        const SPAWN_BUTTON = '<button type="submit">SPAWN</button>';

        const ws = registry.get('ws');

        function submitSpawn(instance, thisToast, button, e, inputs) {
            const NAME = inputs[0].value;
            ws.sendCrypSpawn(NAME);
            instance.hide({ transitionOut: 'fadeOut' }, thisToast, 'button');
        }

        toast.question({
            theme: 'dark',
            color: 'black',
            timeout: false,
            // overlay: true,
            drag: false,
            close: true,
            title: 'SPAWN CRYP',
            position: 'center',
            inputs: [
                [NAME_INPUT, 'change', null, true], // true to focus
            ],
            buttons: [
                [SPAWN_BUTTON, submitSpawn], // true to focus
            ],
        });
    });

    return {
        loginPrompt,
        setAccount,
        setActiveSkill,
        setCryps,
        setGame,
        setItems,
        setWs,
        setGameList,
    };
}

module.exports = registerEvents;