La venganza de las botonetas

Elige el fondo.

Haz un sprite que comience en un punto aleatorio en el borde izquierdo de la pantalla.

Para este programa necesitaremos más de un círculo. ¡Necesitaremos muchísimos círculos! Haz que se cree un círculo nuevo cada 0.5 segundos.

Este paso es algo que probablemente no hayas hecho antes. Para que podamos controlar TODOS los círculos debemos crear una LISTA que contenga todos los círculos que se crean.

La lista será una nueva variable que se escribe así:
var listacirculos = []

Para eso tenemos que poner este código justo después de crear el nuevo círculo:
listacirculos.push(circulo)

Para hablar con todos los círculos (clones) de la lista, utilizamos la función forEach()

listacirculos.forEach(circulo => {
/* Instrucciones de qué queremos qeu haga*/
})

Cada vez que queremos decirle a nuestros círculos qué hacer, las instrucciones DEBEN estar en una función forEach(). Para este paso podemos usar el mismo forEach() que habíamos creado en el paso anterior para moverlos.

Cuando los círculos pasen por el límite derecho de la pantalla, elimínalos de la pantalla y de la lista.

Si tocamos un círculo con el mouse, eliminemos el círculo de la pantalla y de la lista. Todavía estamos hablando con los círculos usando la función forEach().

OJO: Debes tener cuidado con dónde se abre y cierra cada función.

Crea una variable que lleve los puntos. Haz que en la pantalla aparezcan los puntos y que se sume 1 cada vez que tocas un círculo con el puntero del ratón.