adding board class, starting to draw board state on canvas

mancala/src/board.js

@@ -0,0 +1,66 @@
+// The data structure representing the board
+
+const {range,ERR,dbg} = require("./util.js");
+
+const INITIAL_STONE_COUNT = 4; //per player cell
+
+/*
+    the whole board is simply an array on integers.
+    Each cell in the array represents a cell on the board. The value of board[i] is the number of stones in cell i.
+    i = 0 => player 1 home
+    i = CELL_COUNT/2 => player 2 home
+    i = 1,2,.., CELL_COUNT/2 - 1 => player 1 cells (the top row)
+    i = CELL_COUNT / 2+1, ... CELL_COUNT-1 => player 2 cells (bottom row)
+ */
+
+
+class Board
+{
+    constructor(_cellCount)
+    {
+        this.cellCount = _cellCount;
+        this.board = [];
+        range(1,this.cellCount).forEach(_ => this.board.push(0))
+        this.forAllPlayer1Cells(cellInd => this.setCellStoneCount(cellInd,INITIAL_STONE_COUNT))
+        this.forAllPlayer2Cells(cellInd => this.setCellStoneCount(cellInd,INITIAL_STONE_COUNT))
+        dbg("Board initialized")
+    }
+
+
+    forAllPlayer2Cells(f)
+    {
+        if (f)
+            range(this.cellCount/2+1,this.cellCount-1).forEach(f)
+        else ERR("Invalid function for player 2 cells")
+    }
+
+    forAllPlayer1Cells(f)
+    {
+        if (f)
+            range(1,this.cellCount/2-1).forEach(f);
+        else
+            ERR("Invalid function for player 1 cells")
+    }
+
+    setCellStoneCount(boardCell,cnt) { this.board[boardCell] = cnt }
+    stonesIn(boardCell) { return this.board[boardCell]}
+
+    forAllCells(f)
+    {
+        if (f) range(0,this.cellCount-1).forEach(boardCell => f(boardCell))
+        else ERR("Invalid function for all cells")
+    }
+
+    isPlayer1Cell(boardCell) { return boardCell >= 1 && boardCell <= this.cellCount/2-1; }
+    isPlayer2Cell(boardCell) { return boardCell >= this.cellCount/2+1 && boardCell <= this.cellCount-1; }
+
+    isPlayer1Home(boardCell) { return boardCell == 0; }
+    isPlayer2Home(boardCell) { return boardCell == this.cellCount/2; }
+
+    totalCellCount() { return this.cellCount; }
+}
+
+
+module.exports = {
+    Board
+  }

mancala/src/drawing.js

@@ -1,5 +1,5 @@
 const {fabric} = require("fabric")
-const {range} = require("./util.js")
+const {range,dbg, ERR} = require("./util.js")
 
 function initCanvas(canvasEl)
 {
@@ -22,37 +22,45 @@ function drawLineOn(cnvs,x1,y1,x2,y2,color)
 
 }
 
-function drawBoard(cnvs)
-{
-    let CELL_SIZE = 50;
-    let CELL_COUNT = 14;
+let CELL_SIZE = 50;
+
+let TOP_LEFT = { x : 50, y : 50};
 
-    let TOP_LEFT = { x : 50, y : 50};
+function boardWidthInCells(cellCount) { 
+  let playerCellCount = cellCount/2-1;
+  return playerCellCount+2; // +2 for player home cells
+} 
 
-    let playerCellCount = CELL_COUNT/2-1;
-    let boardWidthInCells = playerCellCount+2 //for the side cells (player homes)
-    let boardHeightInCells = 3;
+
+/**
+ * 
+ * @param {fabric.Canvas} cnvs The canvas to draw on, as returned from { initCanvas }
+ */
+function drawBoard(cnvs,cellCount)
+{
+  let _boardWidthInCells = boardWidthInCells(cellCount)
+  let boardHeightInCells = 3;
 
     //frame
-    horizLine(TOP_LEFT.x,TOP_LEFT.y,boardWidthInCells * CELL_SIZE); //top left to top right
+    horizLine(TOP_LEFT.x,TOP_LEFT.y,_boardWidthInCells * CELL_SIZE); //top left to top right
     verticalLine(TOP_LEFT.x,TOP_LEFT.y,CELL_SIZE*boardHeightInCells); //top left to bottom left
-    horizLine(TOP_LEFT.x,TOP_LEFT.y + CELL_SIZE*boardHeightInCells,boardWidthInCells * CELL_SIZE); // bottom left to bottom right
-    verticalLine(TOP_LEFT.x + boardWidthInCells * CELL_SIZE,TOP_LEFT.y,CELL_SIZE * boardHeightInCells); //top right to bottom right
+    horizLine(TOP_LEFT.x,TOP_LEFT.y + CELL_SIZE*boardHeightInCells,_boardWidthInCells * CELL_SIZE); // bottom left to bottom right
+    verticalLine(TOP_LEFT.x + _boardWidthInCells * CELL_SIZE,TOP_LEFT.y,CELL_SIZE * boardHeightInCells); //top right to bottom right
 
     //home cells
     verticalLine(TOP_LEFT.x + CELL_SIZE,TOP_LEFT.y,CELL_SIZE*boardHeightInCells)
-    verticalLine(TOP_LEFT.x + CELL_SIZE*(boardWidthInCells-1),TOP_LEFT.y,CELL_SIZE*boardHeightInCells)
+    verticalLine(TOP_LEFT.x + CELL_SIZE*(_boardWidthInCells-1),TOP_LEFT.y,CELL_SIZE*boardHeightInCells)
 
     //cell horizontal lines
     let upperCellY = TOP_LEFT.y + CELL_SIZE;
     let lowerCellY = TOP_LEFT.y + CELL_SIZE*2;
-    let lineLen = (boardWidthInCells-2)*CELL_SIZE;
+    let lineLen = (_boardWidthInCells-2)*CELL_SIZE;
 
     horizLine(TOP_LEFT.x + CELL_SIZE,upperCellY,lineLen)
     horizLine(TOP_LEFT.x + CELL_SIZE,lowerCellY,lineLen)
 
     //cell borders
-    range(2,CELL_COUNT/2).map(cellNum => { 
+    range(2,cellCount/2).map(cellNum => { 
         verticalLine(TOP_LEFT.x + cellNum*CELL_SIZE,TOP_LEFT.y,CELL_SIZE)
         verticalLine(TOP_LEFT.x + cellNum*CELL_SIZE,TOP_LEFT.y+CELL_SIZE*(boardHeightInCells-1),CELL_SIZE)
       } )
@@ -63,8 +71,47 @@ function drawBoard(cnvs)
 
 }
 
+function drawBoardState(cnvs,board)
+{
+  dbg("drawing board state")
+  board.forAllCells(boardCell => {
+    let stonesInCell = board.stonesIn(boardCell);
+    switch (true)
+    {
+      case board.isPlayer1Home(boardCell) : drawPlayer1Home(stonesInCell); break;
+      case board.isPlayer2Home(boardCell) : drawPlayer2Home(stonesInCell); break;
+      case board.isPlayer1Cell(boardCell) || board.isPlayer2Cell(boardCell): drawCell(boardCell,stonesInCell); break;
+      default : ERR ("Invalid board cell when drawing state: " + boardCell); break;
+    }
+  })
+
+  function drawPlayer1Home(stoneCount)
+  {
+    dbg("drawing player 1 home: " + stoneCount)
+    drawText(stoneCount,TOP_LEFT.x + CELL_SIZE / 2 - 10,TOP_LEFT.y + CELL_SIZE * 1.5 - 10)
+  }
+
+  function drawPlayer2Home(stoneCount)
+  {
+    dbg("drawing player 2 home: " + stoneCount)
+    drawText(stoneCount,TOP_LEFT.x + boardWidthInCells(board.totalCellCount()) * CELL_SIZE - CELL_SIZE/2 - 10,TOP_LEFT.y + CELL_SIZE*1.5-10)
+  }
+
+  function drawCell(boardCell,stoneCount)
+  {
+    //dbg("drawing " + stoneCount + " in " + boardCell);
+  }
+
+  function drawText(txt,left,top)
+  {
+    dbg("drawing " + txt + " at " + top + "," + left);
+    cnvs.add(new fabric.Text(txt+'',{fontSize : 20, left : left, top : top}))
+  }
+}
+
 module.exports = {
     drawLineOn : drawLineOn
     , drawBoard : drawBoard
     , initCanvas : initCanvas
+    , drawBoardState : drawBoardState
   }

mancala/src/game.js

@@ -1,12 +1,17 @@
 
 
-const {initCanvas,drawBoard} = require("./drawing.js")
+const {initCanvas,drawBoard,drawBoardState} = require("./drawing.js")
+const {Board} = require("./board.js")
 
+const CELL_COUNT = 14;
+
+let board = new Board(CELL_COUNT)
 
 function initGame(cnvsELID)
 {
-
-  drawBoard(initCanvas(cnvsELID));
+  let cnvs = initCanvas(cnvsELID) 
+  drawBoard(cnvs,CELL_COUNT);
+  drawBoardState(cnvs,board);
 }
 
 module.exports = {

mancala/src/util.js

@@ -6,6 +6,12 @@ function range(start,finish)
   return ret;
 }
 
+function ERR(msg) { throw new Error(msg); }
+
+function dbg(msg) { console.log(msg || 'MISSING DBG MSG') }
+
 module.exports = {
     range : range
+    , ERR : ERR
+    , dbg : dbg
   }