import 'particles.js/particles';

const { connect } = require('preact-redux');

const actions = require('../actions');

const Game = require('./game.component');
const config = require('./particles.config');

const particlesJS = window.particlesJS;

const addState = connect(
    function receiveState(state) {
        const { ws, game, account, activeSkill, activeIncoming } = state;

        function selectSkillTarget(targetCrypId) {
            if (activeSkill) {
                return ws.sendGameSkill(game.id, activeSkill.crypId, targetCrypId, activeSkill.skill);
            }
            return false;
        }

        // intercept self casting skills
        if (activeSkill && activeSkill.skill.self_targeting) {
            ws.sendGameSkill(game.id, activeSkill.crypId, null, activeSkill.skill.skill);
        }

        function selectIncomingTarget(crypId) {
            if (activeIncoming) {
                return ws.sendGameTarget(game.id, crypId, activeIncoming);
            }
            return false;
        }

        return { game, account, activeSkill, activeIncoming, selectSkillTarget, selectIncomingTarget };
    },

    function receiveDispatch(dispatch) {
        function setActiveSkill(crypId, skill) {
            dispatch(actions.setActiveSkill(crypId, skill));
            particlesJS(`particles-${crypId}`, config);
        }

        function setActiveIncoming(skillId) {
            dispatch(actions.setActiveIncoming(skillId));
        }

        function quit() {
            dispatch(actions.setGame(null));
        }

        return { setActiveSkill, setActiveIncoming, quit };
    }

);

module.exports = addState(Game);