muntadas-app/src/store/modules/projects.js

import { REST } from 'api/rest-axios'

export default {
  namespaced: true,

  // initial state
  state: {
    projects: []
  },

  // getters
  getters: {
    getGridPos: (state) => (index) => {
      let popped = state.projects[index].grid.pop()
      console.log('getGridPos: popped', popped)
      return popped
    }
  },

  // mutations
  mutations: {
    setProjects (state, projects) {
      // record the retrieved data
      state.projects = projects

      // randomly define building sizes
      let totalW = 0
      for (var i = 0; i < state.projects.length; i++) {
        let w = Math.round(21 + Math.random() * 15)
        totalW += w
        state.projects[i].size = {
          x: w,
          y: Math.round(100 + Math.random() * 250),
          z: Math.round(10 + Math.random() * 30)
        }
      }

      // positioning buildings on x regarding the widths
      // & setting up the window sizing
      // & setting up the content grid
      let margin = 5
      totalW += margin * (state.projects.length - 1)
      let wall, a
      let grid
      // fro each PROJECTS
      for (var j = 0; j < state.projects.length; j++) {
        // X POS
        let x = -1 * totalW / 2// + state.projects[0].size.x / 2
        for (var k = 0; k < j; k++) {
          x += state.projects[k].size.x
        }
        x += margin * j
        x += state.projects[j].size.x / 2
        state.projects[j].position = {
          x: x,
          y: -1 * state.projects[j].size.y / 2 + 10 + Math.random() * 30, // -10 + Math.random() * this.size.y / 2
          z: -10 + Math.random() * 10
        }

        // WINDOWS
        wall = {
          wallW: 0.001,
          // dig windows on face and back
          winW: 2 + Math.random() * 2,
          winH: 4 + Math.random() * 4,
          margin: 2,
          nbrWinX: 0,
          paddingX: 0,
          nbrWinY: 0,
          paddingY: 0,
          nbrWinZ: 0,
          paddingZ: 0
        }
        // removing windows on X until padding is enough
        a = 0
        wall.nbrWinX = Math.floor((state.projects[j].size.x - 2 * wall.margin) / wall.winW)
        while (wall.paddingX < 0.4) {
          wall.nbrWinX -= a
          wall.paddingX = (state.projects[j].size.x - 2 * wall.margin - wall.winW * wall.nbrWinX) / (wall.nbrWinX - 1)
          a++
        }
        // removing windows on Y until padding is enough
        a = 0
        wall.nbrWinY = Math.floor((state.projects[j].size.y - 2 * wall.margin) / wall.winH)
        while (wall.paddingY < 0.4) {
          wall.nbrWinY -= a
          wall.paddingY = (state.projects[j].size.y - 2 * wall.margin - wall.winH * wall.nbrWinY) / (wall.nbrWinY - 1)
          a++
        }
        state.projects[j].wall = { ...wall }

        // CONTENTS GRID
        a = 0
        wall.nbrWinZ = Math.floor((state.projects[j].size.z - 2 * wall.margin) / wall.winW)
        while (wall.paddingZ < 0.4) {
          wall.nbrWinZ -= a
          wall.paddingZ = (state.projects[j].size.z - 2 * wall.margin - wall.winW * wall.nbrWinZ) / (wall.nbrWinZ - 1)
          a++
        }

        grid = []
        for (var l = 0; l < wall.nbrWinZ * 2; l++) { // cols
          for (var m = 0; m < wall.nbrWinY * 2; m++) { // rows
            grid.push({
              z: margin + wall.winW / 2 * l,
              y: margin + wall.winH / 2 * m
            })
          }
        }
        // shuffle the grid
        for (let n = grid.length - 1; n > 0; n--) {
          const o = Math.floor(Math.random() * n)
          const temp = grid[n]
          grid[n] = grid[o]
          grid[o] = temp
        }
        state.projects[j].grid = [ ...grid ]
      }
    }
  },

  // actions
  actions: {
    // async get authors
    getProjects ({ dispatch, commit, state }) {
      REST.get(`projects`, {})
        .then(({ data }) => {
          console.log('projects getProjects REST: data', data)
          commit('setProjects', data)
        })
        .catch((error) => {
          console.warn('Issue with getProjects', error)
          Promise.reject(error)
        })
    }
  }

}