export default {
  name: "vLayout",

  getReducer: () => {
    const initialData = {
      height: window.innerHeight - 20,
      hNorth: 1,
      hSouth: 0,
      _shouldUpdateMap: false,
    };

    return (state = initialData, { type, payload }) => {
      switch (type) {
        case "VLAYOUT_UPDATE_HEIGHT":
        case "VLAYOUT_MAP_UPDATE_START":
          return Object.assign({}, state, payload);
        case "SOUTH_REGION_OPENED":
          return Object.assign({}, state, {
            hNorth: 0.5,
            hSouth: 0.5,
            _shouldUpdateMap: true,
          });
        case "SOUTH_REGION_CLOSED":
          return Object.assign({}, state, {
            hNorth: 1,
            hSouth: 0,
            _shouldUpdateMap: true,
          });
        default:
          return state;
      }
    };
  },

  doVLayoutResize:
    (hNorth, hSouth) =>
    ({ dispatch }) => {
      dispatch({
        type: "VLAYOUT_UPDATE_HEIGHT",
        payload: {
          hNorth: hNorth,
          hSouth: hSouth,
          _shouldUpdateMap: true,
        },
      });
    },

  doVLayoutSetHeight:
    (height) =>
    ({ dispatch }) => {
      dispatch({
        type: "VLAYOUT_UPDATE_HEIGHT",
        payload: {
          height: height,
        },
      });
    },

  doVLayoutUpdateMap:
    () =>
    ({ dispatch, store }) => {
      dispatch({
        type: "VLAYOUT_MAP_UPDATE_START",
        payload: {
          _shouldUpdateMap: false,
        },
      });
      const map = store.selectMap();
      map.updateSize();
    },

  selectVLayoutHeight: (state) => {
    return state.vLayout.height;
  },

  selectNorthHeight: (state) => {
    return state.vLayout.height * state.vLayout.hNorth;
  },

  selectSouthHeight: (state) => {
    return state.vLayout.height * state.vLayout.hSouth;
  },

  reactVLayoutShouldUpdateMap: (state) => {
    if (state.vLayout._shouldUpdateMap)
      return { actionCreator: "doVLayoutUpdateMap" };
  },
};
