src/components/Stage.js
// Renders the grid structer of matrix
Renders the grid structer of matrix
Renders the grid structer of matrix
function PlayerGrid (props) {
  const rowsArr = [];
  for (let row = 0; row < props.gridState.length; row++) {
    for (let col = 0; col < props.gridState[0].length; col++) {
      let boxId = row + "_" + col;
      rowsArr.push(
        <Box
          key={boxId}
          boxId={boxId}
          row={row}
          col={col}
          gridState={props.gridState}
          player={props.player}
        />
      );
    }
  }
  if (props.player === 'playerTwo') {
    return <div className="PlayerTwoGrid">{rowsArr}</div>;
  } else if (props.player === 'playerOne') {
    return <div className="PlayerOneGrid">{rowsArr}</div>;
  } else {
    return <div></div>
  }
}
function PlayerGrid ( props ) { const rowsArr = [ ] ; for ( let row = 0 ; row < props . gridState . length ; row ++ ) { for ( let col = 0 ; col < props . gridState [ 0 ] . length ; col ++ ) { let boxId = row + "_" + col ; rowsArr . push ( < Box key = { boxId } boxId = { boxId } row = { row } col = { col } gridState = { props . gridState } player = { props . player } / > ) ; } } if ( props . player === 'playerTwo' ) { return < div className = "PlayerTwoGrid" > { rowsArr } < / div > ; } else if ( props . player === 'playerOne' ) { return < div className = "PlayerOneGrid" > { rowsArr } < / div > ; } else { return < div > < / div > } }
Renders the grid structer of matrix
Renders the grid structer of matrix
// Pull each box from matrix // Create array of boxes // Renders stage based on player