or(q1, q2, row, col)

Returns a new quadrille containing all the filled cells from the q1 quadrille or q2 quadrille, or both, with q1 cells taking precedence.

Example

(to move q2 drag mouse or press a, s, w, z keys)

code

const COLS = 11, ROWS = 16;
// q0 is defined as reference quadrille
let q0, q1, q2;
const col1 = 2, row1 = 3;
let col2 = 6, row2 = 3;
const col3 = 2, row3 = 10;

function setup() {
  Quadrille.cellLength = 30;
  createCanvas(COLS * Quadrille.cellLength, ROWS * Quadrille.cellLength);
  q0 = createQuadrille(COLS, ROWS, COLS * ROWS, color('darkkhaki'));
  q1 = createQuadrille(2, 3, 4, '👻');
  q2 = createQuadrille(3, 2, 4, '✈️');
}

function draw() {
  drawQuadrille(q0, { outlineWeight: 0.5 });
  drawQuadrille(q1, { col: col1, row: row1, outline: 'yellow' });
  drawQuadrille(q2, { col: col2, row: row2, outline: 'magenta' });
  const q3 = Quadrille.or(q1, q2);
  drawQuadrille(q3, { col: col3, row: row3, outline: 'green' });
  text('(row2: ' + row2 + ', col2: ' + col2 + ')', 10, 25);
}

function mouseDragged() {
  row2 = q0.mouseRow;
  col2 = q0.mouseCol;
  return false; // prevent scrolling
}

function keyPressed() {
  row2 = key === 'w' ? row2 - 1 : key === 'z' ? row2 + 1 : row2;
  col2 = key === 'a' ? col2 - 1 : key === 's' ? col2 + 1 : col2;
}

ℹ️

Observe that the dimensions of the resulting q3 quadrille span the minimum area required to cover both q1 and q2. See merge.

Syntax

Quadrille.or(q1, q2, [row], [col])

Parameters

Param	Description
`q1`	Quadrille: first quadrille to merge
`q2`	Quadrille: second quadrille to merge
`row`	Number: The vertical displacement of `q2` relative to `q1`¹. Negative values are allowed
`col`	Number: The horizontal displacement of `q2` relative to `q1`². Negative values are allowed

Default is row2 - row1 if both q1 and q2 are drawn, or 0 otherwise. ↩︎
Default is col2 - col1 if both q1 and q2 are drawn, or 0 otherwise. ↩︎

neg(q, value)xor(q1, q2, row, col)