const ROWS = 7;

​

const w = 50;

​

let board;

​

const PLAYER = {

  none: 0,

  red: 1,

  yellow: 2

};

​

function createBoard() {

  return Array(COLS).fill(0).map(_ => Array(ROWS).fill(PLAYER.none));

}

​

function setup() {

  createCanvas(COLS * w + 200, ROWS * w);

  board = createBoard();

}

​

function draw() {

  background(0);

  noStroke();

  for (let i = 0; i < COLS; i++) {

    for (let j = 0; j < ROWS; j++) {

      switch (winner) {

        case PLAYER.none:

          fill(50);

          break;

        case PLAYER.red:

          fill(127, 0, 0);

          break;

        case PLAYER.yellow:

          fill(127, 127, 0);

          break;

      }

      square(100 + i * w, j * w, w);

      switch (board[i][j]) {

        case PLAYER.none:

          fill(0);

          break;

        case PLAYER.red:

          fill(255, 0, 0);

          break;

        case PLAYER.yellow:

          fill(255, 255, 0);

          break;

      }

      circle(100 + i * w + w/2, j * w + w/2, w - 5);

    }

  }

  noFill();

  stroke(255);

  arc(50, height / 2, 50, 50, -PI, 0);

  line(25, height / 2, 15, height / 2 - 10);

  line(25, height / 2, 35, height / 2 - 10);

  arc(width - 50, height / 2, 50, 50, -PI, 0);

  line(width - 25, height / 2, width - 15, height / 2 - 10);

  line(width - 25, height / 2, width - 35, height / 2 - 10);

}

​

let currentTurn = PLAYER.red;

let winner = PLAYER.none;

​

let allowClicks = true;

function mousePressed() {

  if (!allowClicks) return;

  allowClicks = false;

  setTimeout(_ => (allowClicks = true), 100);

  if (winner != PLAYER.none) return;

  if (mouseX > width - 100) {

    rotateBoard();

    nextTurn();

    return;

  } else if (mouseX < 100) {

    rotateBoard();

    rotateBoard();

    rotateBoard();

    nextTurn();

    return;

  }

  colNum = floor((mouseX - 100) / w);

  if (colNum < 0 || colNum >= COLS) return;

  col = board[colNum]

  let rowNum = ROWS - 1;

  for (let i = 0; i < ROWS; i++) {

    if (col[i] != PLAYER.none) {

      rowNum = i - 1;

      break;

    }

  }

  if (rowNum != -1) {

    board[colNum][rowNum] = currentTurn;

    nextTurn();

  }

  if (checkWin(PLAYER.red)) {

    console.log("RED VICTORY")

    winner = PLAYER.red;

  } else if (checkWin(PLAYER.yellow)) {

    console.log("YELLOW VICTORY")

    winner = PLAYER.yellow;

  }

}

​

function nextTurn() {

  currentTurn = currentTurn == PLAYER.red ? PLAYER.yellow : PLAYER.red;

}

​

function rotateBoard() {

  let newBoard = createBoard();

  for (let i = 0; i < COLS; i++) {

    for (let j = 0; j < ROWS; j++) {

      newBoard[COLS - j - 1][i] = board[i][j]

    }

  }

  board = newBoard;

}

​

​

function checkWin(player) {

  for (let i = 0; i < COLS; i++) {

    for (let j = 0; j < COLS; j++) {

      if (board[i][j] == player && checkAllDirs(player, i, j)) {

        return true;

      }

    }

  }

  return false;

}

​

function checkAllDirs(player, i, j) {

  for (let di = -1; di <= 1; di++) {

    for (let dj = -1; dj <= 1; dj++) {

      if (di == 0 && dj == 0) continue;

      if (checkDir(player, i, j, di, dj)) return true;

    }

  }

  return false;

}

​

function checkDir(player, i, j, di, dj) {

  let connectedLength = 0;

  while (i >= 0 && i < COLS && j >= 0 && j < ROWS && board[i][j] == player) {

    connectedLength++;

    if (connectedLength >= 4) return true;

    i += di;

    j += dj;

  }

  return false;

}

​

​

​

​

​

​

​

​