Projeto Colisão de Bolinha nas bordas (p5.js)

Primeira etapa concluída , 1 criando background , 2 criando bolinha, 3 criando movimento da bolinha, 4 criando colisão da bolinha com as bordas.

//variaveis da Bolinha let xBolinha = 400; let yBolinha = 200; let diametro = 20; let raio = diametro / 2;

//variaveis da velocidade da Bolinha let velocidadeXBolinha = 6; let velocidadeYBolinha = 6;

function setup() { createCanvas(800, 400); }

function draw() { background(0); criarBolinha(); movimentoBolinha(); bolinhaNaBorda();

}

function criarBolinha(){ circle(xBolinha,yBolinha,diametro);}

function movimentoBolinha(){ xBolinha += velocidadeXBolinha; yBolinha += velocidadeYBolinha; }

function bolinhaNaBorda(){ if (xBolinha + raio > width || xBolinha - raio < 0){ velocidadeXBolinha *= -1; }

if (yBolinha + raio > height || yBolinha - raio < 0){ velocidadeYBolinha *= -1;

}

}