Random colour square
by Lloyd Atkinson
HTML
<canvas id="canvas" style="width: 100%" height="8"></canvas>
JavaScript
const canvas = document.getElementById('canvas');
const context = canvas.getContext('2d');
const getRandomNumber = (minimum, maximum) =>
Math.floor(Math.random() * (maximum - minimum + 1)) + minimum;
const shouldMakeExtraLargeShape = () => {
if (getRandomNumber(1, 1000) == 1) return true;
return false;
}
const getRandomColour = () => {
switch(getRandomNumber(0, 2)) {
case 0: return 'red';
case 1: return 'green';
/* case 2: return 'lime';
case 3: return 'yellow';
case 4: return 'black';
case 5: return 'orange';
case 6: return 'cyan'; */
}
};
const generateShape = () => {
};
const update = () => {
context.fillStyle = getRandomColour();
let randomSize = getRandomNumber(1,5);
/* if (shouldMakeExtraLargeShape()) {
context.fillStyle = 'white';
randomSize = 100;
} */
for(let i = 0; i < 100; i++) {
context.fillRect(
getRandomNumber(0, 500),
getRandomNumber(0, 500),
randomSize,
randomSize);
}
requestAnimationFrame(update);
};
requestAnimationFrame(update);