import { createApp } from "vue";
import { createStore } from "vuex";
import App from "./App.vue";
import axios from "axios";
import VueAxios from "vue-axios";

const store = createStore({
    state() {
        return {
            currentGame: "",
            currentTrack: ``,
            currentTrackHidden: false,
            currentlyLoadingTrack: "",
            specialTrackIsPlaying: false,
            someoneHasWon: false,
            winningScore: 20,
            roundStarted: false,
            reloadGamesList: false,
            listOfPlayers: [],
            localPlaylist: [],
            playlistHistory: [
                {
                    SongNo: "",
                    Game: "",
                    Song: "",
                },
            ],
            /* Stats */
            howManyGames: 0,
            /* Options */
            stopAfterCurrent: true,
            hideNextTrack: true,
            lowPlayed: false,
        };
    },
    mutations: {
        setCurrentGame(state, payload) {
            state.currentGame = payload;
        },
        setCurrentTrack(state, payload) {
            state.currentTrack = payload;
        },
        setCurrentTrackHidden(state, payload) {
            state.currentTrackHidden = payload;
        },
        setCurrentlyLoadingTrack(state, payload) {
            state.currentlyLoadingTrack = payload;
        },
        setSpecialTrackIsPlaying(state, payload) {
            state.specialTrackIsPlaying = payload;
        },
        setSomeoneHasWon(state, payload) {
            state.someoneHasWon = payload;
        },
        setWinningScore(state, payload) {
            state.winningScore += payload;
        },
        setRoundStarted(state, payload) {
            state.roundStarted = payload;
        },
        updateListOfPlayers(state, payload) {
            state.listOfPlayers = payload;
        },
        changePlayerScore(state, payload) {
            state.listOfPlayers[payload.indexOfPlayer].score += payload.scoreToChange;
        },
        changePlayerWelcomed(state, payload) {
            state.listOfPlayers[payload.indexOfPlayer].welcomed = payload.playerWelcomeTrueOrFalse;
        },
        changePlayerProfile(state, payload) {
            state.listOfPlayers[payload.indexOfPlayer].profile = payload.profileSrc;
        },
        resetPlayerScore(state, payload) {
            state.listOfPlayers = payload;
        },
        resetPlayerWelcomed(state, payload) {
            state.listOfPlayers = payload;
        },
        updateLocalPlaylist(state, payload) {
            state.localPlaylist.push(payload);
        },
        updatePlaylistHistory(state, payload) {
            state.playlistHistory = payload;
        },
        updateHowManyGames(state, payload) {
            state.howManyGames = payload;
        },
        reloadGamesList(state, payload) {
            state.reloadGamesList = payload;
        },
        updateStopAfterCurrent(state, payload) {
            state.stopAfterCurrent = payload;
        },
        updateHideNextTitle(state, payload) {
            state.hideNextTrack = payload;
        },
        updateLowPlayed(state, payload) {
            state.lowPlayed = payload;
        },
    },
    actions: {
        setCurrentGame(context, payload) {
            context.commit("setCurrentGame", payload);
        },
        setCurrentTrack(context, payload) {
            context.commit("setCurrentTrack", payload);
        },
        setCurrentTrackHidden(context, payload) {
            context.commit("setCurrentTrackHidden", payload);
        },
        setCurrentlyLoadingTrack(context, payload) {
            context.commit("setCurrentlyLoadingTrack", payload);
        },
        setSpecialTrackIsPlaying(context, payload) {
            context.commit("setSpecialTrackIsPlaying", payload);
        },
        setSomeoneHasWon(context, payload) {
            context.commit("someoneHasWon", payload);
        },
        setWinningScore(context, payload) {
            context.commit("setWinningScore", payload);
        },
        setRoundStarted(context, payload) {
            context.commit("setRoundStarted", payload);
        },
        removePlayer(context, payload) {
            let newPlayerList = this.state.listOfPlayers.filter(
                (player) => player.playerName != payload
            );
            context.commit("updateListOfPlayers", newPlayerList);
        },
        addNewPlayer(context, payload) {
            let newPlayerList = this.state.listOfPlayers;
            let newPlayer = {
                playerName: payload,
                score: 0,
                welcomed: false,
                profile: "characters/noCharacter.png",
            };
            newPlayerList.push(newPlayer);
            context.commit("updateListOfPlayers", newPlayerList);
        },
        changePlayerScore(context, payload) {
            let copyOfPlayerList = this.state.listOfPlayers;
            let indexOfPlayer = copyOfPlayerList.findIndex(
                (player) => player.playerName === payload.playerName
            );
            let scoreToChange = payload.score;
            context.commit("changePlayerScore", {
                indexOfPlayer,
                scoreToChange,
            });
        },
        changePlayerWelcomed(context, payload) {
            let copyOfPlayerList = this.state.listOfPlayers;
            let indexOfPlayer = copyOfPlayerList.findIndex(
                (player) => player.playerName === payload.playerName
            );
            let playerWelcomeTrueOrFalse = payload.welcomeSet;
            context.commit("changePlayerWelcomed", {
                indexOfPlayer,
                playerWelcomeTrueOrFalse,
            });
        },
        changePlayerProfile(context, payload) {
            let copyOfPlayerList = this.state.listOfPlayers;
            let indexOfPlayer = copyOfPlayerList.findIndex(
                (player) => player.playerName === payload.playerName
            );
            let profileSrc = payload.profile;
            context.commit("changePlayerProfile", {
                indexOfPlayer,
                profileSrc,
            });
        },
        resetPlayerScore(context) {
            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
            for (let i = 0; i < copyOfPlayerList.length; i++) {
                copyOfPlayerList[i].score = 0;
            }
            context.commit("resetPlayerScore", copyOfPlayerList);
        },
        resetPlayerWelcomed(context) {
            /* The JSON.parse and JSON.stringify parts are used to make a copy that doesn't affect the original */
            let copyOfPlayerList = JSON.parse(JSON.stringify(this.state.listOfPlayers));
            for (let i = 0; i < copyOfPlayerList.length; i++) {
                copyOfPlayerList[i].welcomed = false;
            }
            context.commit("resetPlayerWelcomed", copyOfPlayerList);
        },
        updateLocalPlaylist(context, payload) {
            context.commit("updateLocalPlaylist", payload);
        },
        updatePlaylistHistory(context, payload) {
            context.commit("updatePlaylistHistory", payload);
        },
        updateHowManyGames(context, payload) {
            context.commit("updateHowManyGames", payload);
        },
        reloadGamesList(context, payload) {
            context.commit("reloadGamesList", payload);
        },
        updateStopAfterCurrent(context, payload) {
            context.commit("updateStopAfterCurrent", payload);
        },
        updateHideNextTitle(context, payload) {
            context.commit("updateHideNextTitle", payload);
        },
        updateLowPlayed(context, payload) {
            context.commit("updateLowPlayed", payload);
        },
    },

    getters: {
        /* Empty ATM */
        /* getListOfPlayers: (state) => {
           return state.listOfPlayers;
        }, */
    },
});

const app = createApp(App);

app.use(store);
app.use(VueAxios, axios);

app.mount("#app");