document.addEventListener("alpine:init", () => {
    Alpine.store("main", {
        attack: true,
        midfield: true,
        defence: true,
        goalkeeper: true,
        players: [],
        groups: [],
        toggleAttack() {
            this.attack = !this.attack;
            // Loop through them and add Tailwind's invisible class
            elements.forEach((el) => el.classList.add("invisible"));
        },
        console(index) {
            console.log(this.players[index].player_id);
            var p = this.players[index].player_id;
        },
        loadPlayer(data) {
            this.players = data;
        },
        setPosGroup(group) {
            this.groups = group;
            console.log(this.groups, group);
        },
        hasVisible(type) {
            console.log(type);
            return true;
        },
        toggleType(toggleStates) {
            var toggleState = toggleStates;
            // var toggleState = JSON.parse(mode);
            // this.visa = toggleState[0].data.status;
            // console.log(this.visabilities);
        },
        findByPlayerId(player_id) {
            const index = this.items.findIndex(
                (item) => item.player_id === player_id,
            );
            if (index > -1) {
                return item;
            }
        },
    });
});