import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {
    messages: [],
    playerName: "",
    inputText: ""
  },

  getters: {
    playerName: (state) => state.playerName,
    messages: (state) => state.messages,
    inputText: (state) => state.inputText
  },

  actions: {
    setPlayerName({ commit }, name) {
      commit("SET_PLAYER_NAME", name);
    },
    addMessage({ commit }, data) {
      commit("ADD_MESSAGE", data);
      // Have to wait for DOM to be updated before scrolling
      Vue.nextTick(() => {
        document.getElementById("output").lastChild.scrollIntoView();
      });
    },
    setInputText({ commit }, text) {
      commit("SET_INPUT_TEXT", text);
    }
  },

  mutations: {
    SET_PLAYER_NAME(state, name) {
      state.playerName = name;
    },
    ADD_MESSAGE(state, data) {
      state.messages.push({
        entity: data.entity,
        message: data.message
      });
    },
    SET_INPUT_TEXT(state, text) {
      state.inputText = text;
    }
  }
});

export default store;

@@ -484,169 +484,222 @@
     
-  // Have to wait for DOM to be updated before scrolling%0A      Vue.nextTick(() =%3E %7B%0A        document.getElementById(%22output%22).lastChild.scrollIntoView();%0A      %7D
+%7D,%0A    enterCommand(%7B commit, state %7D, text) %7B%0A      commit(%22ADD_MESSAGE%22, %7B%0A        entity: state.playerName,%0A        message: text%0A      %7D);%0A      commit(%22SET_INPUT_TEXT%22, %22%22);%0A      console.log(%60Parsing $%7Btext%7D%60
 );%0A 

Add command action for player's commands and refactor