Class: Grid

Grid()

new Grid()

Class for grid.
Source:

Methods

calculateInsideArea()

A method to calculate all of the boxes that are currently inside the filled area. This needs to be explicitly calculated separetely to the filling algorithm because if there are boxes which are adjacent to the fill area with the correct color this fill algorithm will ignore them to prevent visiting unecessary boxes.
Source:

colourAt(xPos, yPos) → {Integer}

Finds the colour of the tile at the given position in pixels.
Parameters:
Name Type Description
xPos Integer The x position in pixels
yPos Integer The y position in pixels
Source:
Returns:
Number representing the colour of the tile.
Type
Integer

draw()

Method that draws the grid in the given position at the given dimensions
Source:

drawLineDown(xPos, yPos)

Method that draws a line below the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineLeft(xPos, yPos)

Method that draws a line to the left of the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineRight(xPos, yPos)

Method that draws a line to the right of the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineUp(xPos, yPos)

Method that draws a line above the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawOutline()

Method that draws a boundary line around all of the boxes within the filled area
Source:

fill(selectedColour) → {Integer}

Implements the flood fill algorithm
Parameters:
Name Type Description
selectedColour Integer Number representing the selected colour
Source:
Returns:
Integer indicating the success condition of the function. The only error condition resulting in -1 occurs when the selected colour is equal to the colour of the top left tile (this.grid[0][0]). All other condition result in success and return 0.
Type
Integer

getNeighbours(gridIndex) → {Array}

Finds the Manhattan neighbours of a given tile in the grid
Parameters:
Name Type Description
gridIndex Array The grid index values in an array. The first value of each index is the row index and the second value is the column index.
Source:
Returns:
The index values of all the neighbours as a 2D array
Type
Array

isBoxInsideArea(row, col)

Check if a box is inside the filled area
Parameters:
Name Type Description
row Integer the row of the box
col Integer the col of the box
Source:

notBeenNeighbour(tileIndex) → {boolean}

Determines if the given tile is already a neighbour encountered in the previous steps of the flood fill algorithm. This is done my comparing the given index to an array of indices of previously traversed tiles in the grid. This array is updated as each tile is encountered as a neighbour to an explored tile and is reset to [] every time the mouse is pressed at the beginning of this.fill.
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • fill
  • notBeenVisited
Returns:
{ description_of_the_return_value }
Type
boolean

notBeenVisited(tileIndex) → {boolean}

Determines if the given tile has been previously visited during the flood fill algorithm. This is done my comparing the given index to an array of indices of previously traversed tiles in the grid. This array is updated as each tile is "explored" and is reset to [] every time the mouse is pressed at the beginning of this.fill.
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • fill
  • notBeenNeighbour
Returns:
{ description_of_the_return_value }
Type
boolean

randomiseGrid()

Method that randomly selects colours for each tile in the grid
Source:

tileHasColour(tileIndex) → {boolean}

Determines if the given tile is the colour of any of the values in the wanted colour list stored in the object. This wanted colour list is determined when the mouse is clicked and is given by the colour value of the tile at the cursor location as well as the colour value of the tile at the top left position (this.grid[0][0]).
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • colourAt
Returns:
true when the given tile is one of the colours in the this.wantedColours array.
Type
boolean

toggleShowGrid()

Toggle the state of the show internal lines flag
Source:

toggleShowNumbers()

Toggle the internal state of the show numbers flag
Source:

toggleShowOutline()

Toggle the state of the show external outline flag
Source:

winState() → {boolean}

Determines if all of the grid has the same colour.
Source:
Returns:
true when the whole grid is the same colour
Type
boolean

Grid(gridSize, numColours, x, y, sizePixels, randomiseopt, showNumbersopt)

new Grid(gridSize, numColours, x, y, sizePixels, randomiseopt, showNumbersopt)

Constructs for the Grid object.
Parameters:
Name Type Attributes Default Description
gridSize Integer The number of rows and columns
numColours Integer The number of possible colours
x Float Horizontal position of the grid in pixels
y Float Vertical position of the grid in pixels
sizePixels Float Size of the grid in pixels
randomise boolean <optional>
 false If the grid should be given a random initial value
showNumbers boolean <optional>
 true The show numbers flag
Source:

Methods

calculateInsideArea()

A method to calculate all of the boxes that are currently inside the filled area. This needs to be explicitly calculated separetely to the filling algorithm because if there are boxes which are adjacent to the fill area with the correct color this fill algorithm will ignore them to prevent visiting unecessary boxes.
Source:

colourAt(xPos, yPos) → {Integer}

Finds the colour of the tile at the given position in pixels.
Parameters:
Name Type Description
xPos Integer The x position in pixels
yPos Integer The y position in pixels
Source:
Returns:
Number representing the colour of the tile.
Type
Integer

draw()

Method that draws the grid in the given position at the given dimensions
Source:

drawLineDown(xPos, yPos)

Method that draws a line below the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineLeft(xPos, yPos)

Method that draws a line to the left of the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineRight(xPos, yPos)

Method that draws a line to the right of the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawLineUp(xPos, yPos)

Method that draws a line above the given box coordinates
Parameters:
Name Type Description
xPos Float x pixel coordinate of the top left of the box
yPos Float y pixel coordinate of the top left of the box
Source:

drawOutline()

Method that draws a boundary line around all of the boxes within the filled area
Source:

fill(selectedColour) → {Integer}

Implements the flood fill algorithm
Parameters:
Name Type Description
selectedColour Integer Number representing the selected colour
Source:
Returns:
Integer indicating the success condition of the function. The only error condition resulting in -1 occurs when the selected colour is equal to the colour of the top left tile (this.grid[0][0]). All other condition result in success and return 0.
Type
Integer

getNeighbours(gridIndex) → {Array}

Finds the Manhattan neighbours of a given tile in the grid
Parameters:
Name Type Description
gridIndex Array The grid index values in an array. The first value of each index is the row index and the second value is the column index.
Source:
Returns:
The index values of all the neighbours as a 2D array
Type
Array

isBoxInsideArea(row, col)

Check if a box is inside the filled area
Parameters:
Name Type Description
row Integer the row of the box
col Integer the col of the box
Source:

notBeenNeighbour(tileIndex) → {boolean}

Determines if the given tile is already a neighbour encountered in the previous steps of the flood fill algorithm. This is done my comparing the given index to an array of indices of previously traversed tiles in the grid. This array is updated as each tile is encountered as a neighbour to an explored tile and is reset to [] every time the mouse is pressed at the beginning of this.fill.
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • fill
  • notBeenVisited
Returns:
{ description_of_the_return_value }
Type
boolean

notBeenVisited(tileIndex) → {boolean}

Determines if the given tile has been previously visited during the flood fill algorithm. This is done my comparing the given index to an array of indices of previously traversed tiles in the grid. This array is updated as each tile is "explored" and is reset to [] every time the mouse is pressed at the beginning of this.fill.
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • fill
  • notBeenNeighbour
Returns:
{ description_of_the_return_value }
Type
boolean

randomiseGrid()

Method that randomly selects colours for each tile in the grid
Source:

tileHasColour(tileIndex) → {boolean}

Determines if the given tile is the colour of any of the values in the wanted colour list stored in the object. This wanted colour list is determined when the mouse is clicked and is given by the colour value of the tile at the cursor location as well as the colour value of the tile at the top left position (this.grid[0][0]).
Parameters:
Name Type Description
tileIndex Array The tile index with the first value being the row index and the second value being the column index
Source:
See:
  • colourAt
Returns:
true when the given tile is one of the colours in the this.wantedColours array.
Type
boolean

toggleShowGrid()

Toggle the state of the show internal lines flag
Source:

toggleShowNumbers()

Toggle the internal state of the show numbers flag
Source:

toggleShowOutline()

Toggle the state of the show external outline flag
Source:

winState() → {boolean}

Determines if all of the grid has the same colour.
Source:
Returns:
true when the whole grid is the same colour
Type
boolean

Documentation generated by JSDoc 4.0.2 on Sun Oct 25 2026 14:49:11 GMT-0700 (Pacific Daylight Time)