Color Changing Characters

This code is a simple extensions of a previous assignment. When the user clicks the mouse, the characters or elements must change color. I took my previous bird sketch and implemented this. Overtime the mouse is clicked, the birds change color to random red blue green values.

 


function setup() 
{
 createCanvas(1000,1000); 
 bird0 = new Bird();
 bird1 = new Bird();
 bird2 = new Bird();
 bird3 = new Bird();
}

function draw() 
{
 noStroke();
 background(200,200,200);
 bird0.display();
 bird1.display();
 bird2.display();
 bird3.display();
 changec = false;
 
 
}

function Bird()
{
 this.mycol = color(random(0,255), random(0,255), random(0,255)); //Color of the bird
 this.x = random(0, width); //X and Y location of Bird
 this.y = random(0, height); 
 this.speedx = random(3); //Speed for X and Y planes
 this.speedy = random(3);
 this.direction = 1; //Defines direction for the bird
 this.size = random(10,80); //How big the bird will be in pixels (scaled so may not be accurate measurement)
 this.wingstate = 0; //Indicates if the wing is going up or down.
 this.wingmax = size; //Indicates the maximum distance the wing tip should be from the body
 this.down = true; // boolean value to indicate if the wing is currently going up or down.
 
 this.display = function()
 {
 fill(this.mycol);
 
 ///////////Sets direction of bird relative to mouse location
 if(mouseX > this.x)
 this.x = this.x+ this.speedx;
 else
 this.x = this.x - this.speedx;
 
 if(mouseY > this.y)
 this.y = this.y + this.speedy;
 else
 this.y = this.y - this.speedy;
 
 
 ///////////Draws the Birds

 ellipse(this.x, this.y, this.size*2, this.size*0.5);
 
 triangle(this.x+this.size/2*this.direction, this.y+this.size/6, this.x+(this.size+(this.size/3))*this.direction,this.y + this.size/4, this.x+this.size/1.5*this.direction, this.y-this.size/4.8);
 triangle(this.x, this.y+this.size/6, this.x+(this.size+(this.size/2))*-this.direction, this.y + this.size/2, this.x+this.size/2*-this.direction, this.y-this.size/4.5);
 
 /////////// Adjust wing position over time
 if(this.down)
 this.wingstate = this.wingstate + 2;
 else
 this.wingstate = this.wingstate-2;
 
 if(this.wingstate > this.size)
 this.down = false;
 if(this.wingstate < this.size *-1)
 this.down = true;
 
 if(this.x> mouseX)
 this.direction = -1;
 if(this.x < mouseX)
 this.direction = 1;
 
 triangle(this.x - (this.size/2), this.y, this.x+(this.size/2), this.y, this.x-(this.direction*50), this.y+this.wingstate);
 }
 
 /////////// When called, the bird object will change the color to something random for RGB values
 this.changecolor = function()
 {
 this.mycol = color(random(0,255), random(0,255), random(0,255));
 }
}

function mouseReleased()
{
 bird0.changecolor();
 bird1.changecolor();
 bird2.changecolor();
 bird3.changecolor();
}

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s