Method requestSolution

src/MAPFVisualizer.jsx:140–217

(e)

  }

  async requestSolution(e) {
    e.preventDefault();

    if (this.state.agents.length === 0) {
      this.setState({ isDialogOpen: true });
      return;
    }

    if (this.state.goalToAdd) return;

    this.setState({ isPlanning: true });

    // change agents to border
    this.state.agents.forEach((agent) => {
      var color = agent.color;
      document.getElementById(`grid-${agent.SR}-${agent.SC}`).style.border = `4px solid ${color}`;
      document.getElementById(`grid-${agent.GR}-${agent.GC}`).style.border = `4px solid ${color}`;
    });

    // delay 1s before showing animation
    await new Promise((resolve) => setTimeout(resolve, 1000));

    var walls = [];
    var agents = [];
    this.state.map.forEach((row, rowId) => {
      row.forEach((grid, gridId) => {
        if (grid.isWall) {
          walls.push(this.linearizeLocation(rowId, gridId));
        }
      });
    });
    this.state.agents.forEach((agent) => {
      agents.push({
        startLoc: this.linearizeLocation(agent.SR, agent.SC),
        goalLoc: this.linearizeLocation(agent.GR, agent.GC),
      });
    });

    var data = { row: this.state.numRow, col: this.state.numCol, walls: walls, agents: agents };
    let options = this.state.options;
    for (let key in options) {
      data[key] =
        typeof options[key].options[0] === "number"
          ? options[key].value
          : options[key].options[options[key].value];
    }
    const req = {
      method: "POST",
      headers: {
        // Accept: "application/json",
        "Content-Type": "application/json",
      },
      //   mode: 'no-cors',
      //   credentials: 'include',
      body: JSON.stringify(data),
      // url: `http://localhost:8080`
    };
    // fetch("http://52.53.223.36:8080/"+ this.state.name, req)