var S=360

var L=50

var chS=1.5  

var xs

var ys

var count =10

var offset=25

var bubble = {

 x:0,

 y:0,

size:25,

}

​

function colorSwitch(){

if (H>=360){

H=0

} else {

H+=chS

}

}

​

function setup() {

  createCanvas(600, 450);

colorMode(HSL)

xs=random(-2,2)

ys=random(-2,2)

bubble.x=random(0,width-bubble.size)

bubble.y=random(0,height-bubble.size)

}

​

function draw() {

  background(0);

  colorSwitch()

  bounce()

  move()

  display()

}

​

function display(){

stroke(H,S,L)

  strokeWeight(1.5)

  noFill()

  circle(bubble.x,bubble.y,bubble.size)

  }

​

​

function move(){

bubble.x+=xs

bubble.y+=ys

}

​

function bounce(){

if (bubble.x-bubble.size/2>width-offset){

xs=random(-1,-2)

}

  if (bubble.x-bubble.size/2<0){

xs=random(1,2)

}

 if (bubble.y-bubble.size/2>height-offset){

ys=random(-1,-2)

}

if (bubble.y-bubble.size/2<0){

ys=random(1,2)

} 

}