Your browser does not support the canvas tag.

previous        Show / Hide Source        Download        next
/*

"Shining Blade"
By: Michael Downey
Date: Sep. 21 2016
Interactivity: As the user moves the mouse downwards, the background darkens and light
beams begin to manifest from the tip of the blade. Said light beams move in various directions
as the mouse moves around the drawing, used altered sin/cos equations to create a less uniform
movement style. When the mouse is pressed, a pillar of light erupts around the knight, with
the moving light beams vanishing.

*/


void setup() {
  size(400,400);
  rectMode(CORNERS);
  ellipseMode(CENTER);
}

void draw() {
  background(0);
  frameRate(60);
  
  // Background Color
  noStroke();
  fill(0,185,255,(255-mouseY/2)); //Light-Dark Blue Fill
  rect(0,0,400,400); //Draws Blue BG
  
  // Ground
  fill(6,90,0); //Set fill to Green
  ellipse(200,400,400,200); //Ground
  
  // Knight
  
  // Back Arm
  fill(84,125,193); //Dark Blue fill
  quad(180,260,172,252,164,260,172,268); //Shoulder
  quad(180,265,170,262,165,290,175,293); //Upper Arm
  ellipse(167,293,15,15); //Elbow
  quad(171,289,163,299,142,291,150,281); //Lower Arm
  fill(73,108,167); //Darkest Blue fill
  ellipse(146,285,15,15); //Glove
  
  // Back Leg
  fill(84,125,193); //Dark Blue fill
  quad(172,300,188,303,180,328,164,325); //Upper Leg
  ellipse (172,325,16,20); //Knee Joint
  rect(180,328,164,350); //Lower Leg
  fill(92,136,206); //Sets fill to a less dark blue
  rect(180,350,155,358); //Foot
  
  // Body
  fill(97,145,224); //Blue Fill
  rect(172,260,200,307); //Body
  fill(255,223,152); //Peach Fill
  ellipse(186,248,22,26); //Head
  fill(104,157,240); //Lighter Blue Fill
  rect(172,293,200,300); //Belt
  
  // Front Leg
  fill(111,165,255); //Light Blue fill
  quad(200,302,190,302,187,325,203,325); //Upper Leg
  rect(187,325,203,352); //Lower Leg
  fill(139,184,255); //set fill color to lightest blue
  rect(187,352,208,360); //foot
  
  // Front Arm
  fill(111,165,255); //Light Blue fill
  quad(208,260,200,252,192,260,200,268); //Shoulder
  quad(202,236,210,240,205,260,197,256); //Lower Arm
  ellipse(207,237,9,12); //Elbow
  quad(202,236,210,234,207,218,199,220); //Upper Arm
  
  // Sword
  fill(200); //Set fill color to lighter grey
  triangle(200,140,195,150,205,150); //Sword Tip
  fill(185); //Set fill color to light grey
  rect(195,150,205,200); //Sword Blade
  fill(206,0,0); //Set fill color to red
  rect(180,200,220,205); //Sword Guard
  fill(144,83,0); //set fill color to brown
  rect(198,205,202,225); //Sword Hilt
  fill(139,184,255); //set fill color to lightest blue
  ellipse(200,215,15,15);
  
  // Light Beams, Suggested by Iya Ilene/Diane Downey
  stroke(255,255,255,(mouseY+5)); //White Stroke
  strokeWeight(10); //Sets first beam width
  line( 200,140,(200+100*sin(mouseX)),(140+100*cos(mouseX))); //Beam 1
  strokeWeight(3); //Sets second beam width
  line( 200,140,(200+120*sin(mouseY)),(140+120*cos(mouseY))); //Beam 2
  strokeWeight(8); //Sets third beam width
  line( 200,140,(200+160*sin(pmouseX)),(140+160*cos(pmouseY))); //Beam 3
  strokeWeight(5); //Sets fourth beam width
  line( 200,140,(200+50*sin(pmouseY)),(140+50*cos(pmouseX))); //Beam 4
  /*(origin + line length * sin(mouse value)), followed by (origin + line length * cos(mouse value))
  is the nature of the trigonomic functions used to create the spinning light effect present in the
  drawing. It's performed by just leaving out the Radians.*/
  
}

//Click the mouse to create a large light pillar
void mousePressed() {
  frameRate(5);
  noStroke();
  
  fill(0,94,127); //sets fill to dark blue
  rect(0,0,400,400); //Draws Blue BG
  
  // Ground redrawn
  fill(6,90,0); //Set fill to Green
  ellipse(200,400,400,200); //Ground
  
  // Light Pillar
  fill(255); //sets fill to white
  ellipse(200,340,280,80);
  rect(60,0,340,340);
  
  // Knight redrawn
  
  // Back Arm
  fill(96,143,216); //Dark Blue fill
  quad(180,260,172,252,164,260,172,268); //Shoulder
  quad(180,265,170,262,165,290,175,293); //Upper Arm
  ellipse(167,293,15,15); //Elbow
  quad(171,289,163,299,142,291,150,281); //Lower Arm
  fill(85,124,191); //Darkest Blue fill
  ellipse(146,285,15,15); //Glove
  
  // Back Leg
  fill(96,143,216); //Dark Blue fill
  quad(172,300,188,303,180,328,164,325); //Upper Leg
  ellipse (172,325,16,20); //Knee Joint
  rect(180,328,164,350); //Lower Leg
  fill(104,153,229); //Sets fill to a less dark blue
  rect(180,350,155,358); //Foot
  
  // Body
  fill(107,162,247); //Blue Fill
  rect(172,260,200,307); //Body
  fill(255,231,180); //Peach Fill
  ellipse(186,248,22,26); //Head
  fill(121,173,255); //Lighter Blue Fill
  rect(172,293,200,300); //Belt
  
  // Front Leg
  fill(139,184,255); //Light Blue fill
  quad(200,302,190,302,187,325,203,325); //Upper Leg
  rect(187,325,203,352); //Lower Leg
  fill(165,200,255); //set fill color to lightest blue
  rect(187,352,208,360); //foot
  
  // Front Arm
  fill(139,184,255); //Light Blue fill
  quad(208,260,200,252,192,260,200,268); //Shoulder
  quad(202,236,210,240,205,260,197,256); //Lower Arm
  ellipse(207,237,9,12); //Elbow
  quad(202,236,210,234,207,218,199,220); //Upper Arm
  
  // Sword
  fill(209); //Set fill color to light grey
  triangle(200,140,195,150,205,150); //Sword Tip
  fill(209); //Set fill color to light grey
  rect(195,150,205,200); //Sword Blade
  fill(229,0,0); //Set fill color to red
  rect(180,200,220,205); //Sword Guard
  fill(167,95,0); //set fill color to brown
  rect(198,205,202,225); //Sword Hilt
  fill(165,200,255); //set fill color to lightest blue
  ellipse(200,215,15,15);
  
}