import Cookies from 'js-cookie';

const state = {
    sidebar: {
        opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
        withoutAnimation: false
    },
    device: 'desktop',
    width: document.documentElement.clientWidth,
    height: document.documentElement.clientHeight,
    windowSizeCount: 0,
    dialogMessage:'',
    transitionAnimationsCount: 0,
    animationsCloseCount: 0
};

const mutations = {
    TOGGLE_SIDEBAR: state => {
        state.sidebar.opened = !state.sidebar.opened;
        state.sidebar.withoutAnimation = false;
        if (state.sidebar.opened) {
            Cookies.set('sidebarStatus', 1);
        } else {
            Cookies.set('sidebarStatus', 0);
        }
    },
    CLOSE_SIDEBAR: (state, withoutAnimation) => {
        Cookies.set('sidebarStatus', 0);
        state.sidebar.opened = false;
        state.sidebar.withoutAnimation = withoutAnimation;
    },
    TOGGLE_DEVICE: (state, device) => {
        state.device = device;
    },
    SET_WIDTH: (state, width) => {
        state.width = width;
    },
    SET_HEIGHT: (state, height) => {
        state.height = height;
    },
    SET_DIALOG_MESSAGE:(state, dialogMessage)=>{
        state.dialogMessage = dialogMessage;
    },
    SET_TRANSITION_ANIMATIONS:(state) => {
        state.transitionAnimationsCount++;
    },
    SET_ANIMATIONS_CLOSE: (state) => {
        state.animationsCloseCount++;
    }
};

const actions = {
    toggleSideBar({ commit }) {
        commit('TOGGLE_SIDEBAR');
    },
    closeSideBar({ commit }, { withoutAnimation }) {
        commit('CLOSE_SIDEBAR', withoutAnimation);
    },
    toggleDevice({ commit }, device) {
        commit('TOGGLE_DEVICE', device);
    },
    resize({ state, commit }, opt) {
        if (opt.width) {
            commit('SET_WIDTH', opt.width);
        }
        if (opt.height) {
            commit('SET_HEIGHT', opt.height);
        }
        state.windowSizeCount += 1;
    },
    SET_DIALOG_MESSAGE({ commit }, dialogMessage) {
        commit('SET_DIALOG_MESSAGE', dialogMessage);
    },
    transitionAnimations({ commit }) {
        commit('SET_TRANSITION_ANIMATIONS');
    },
    animationsClose({ commit }) {
        commit('SET_ANIMATIONS_CLOSE');
    }
};

export default {
    namespaced: true,
    state,
    mutations,
    actions
};