BoardView

BoardView

CSS-grid board renderer.

Manages the 40×25 grid of .cell elements inside #board. The DOM order is row-major — element index i corresponds to x = i % COLUMNS, y = Math.floor(i / COLUMNS) which means we fill left-to-right, top-to-bottom as CSS grid expects.

Each cell span is kept in a flat array _els[y * COLUMNS + x] so we can index by (x, y) without a 2D array.

Constructor

new BoardView(boardEl)

Source:
Parameters:
Name Type Description
boardEl HTMLElement

The #board container element.

Classes

BoardView

Methods

_buildDom()

Description:

  • (Re)build the grid of span elements.

Source:

_renderAll()

Description:

  • Re-render every cell on the board (called after attach or board swap).

Source:

_updateCell(cell)

Description:

  • Update the span for a single cell.

Source:
Parameters:
Name Type Description
cell Cell

attach(board)

Description:

  • Attach the view to a board: build DOM elements, subscribe to changes, and render the initial state.

Source:
Parameters:
Name Type Description
board Board

detach()

Description:

  • Detach from the current board (on board-to-board navigation).

Source:

moveCursorTo(x, y)

Description:

  • Highlight the cell at (x, y) as the cursor location (removes the previous highlight automatically on the next cell update cycle).

Source:
Parameters:
Name Type Description
x number
y number

rerender()

Description:

  • Force a full re-render (e.g. after the outside/inside flag changes).

Source: