/* /////////"Reaching New Heights" /////////First interactive drawing for Intro to Computation Class /////////by Caitlin Hopwood /////////September 16th, 2016; You take control of a mysterious little star as your cursor, intriguing the little red character as his eye follows your location. Clicking causes the little star to flash! */ void setup () { //set up the canvas size size (400, 400); //set the mode to use for rect() and ellipse() functions ellipseMode(CORNERS); rectMode(CORNERS); //Text at the bottom when drawing starts! println("What could that be?"); } void draw () { //Set the framerate for its default amount of frames refreshed frameRate(60); //make the background dark purple when mouse is at top //fade to red when mouse is at bottom background(mouseY*.2+50, 0, -mouseY*.5+100); //â–ˆ Background 'sky' noStroke(); /*layered rectangles on sky to make it appear darker the further up it goes*/ fill(mouseY*.2+1, 0, -mouseY*.2+20); rect(0, 0, 400, 120); fill(mouseY*.2+1, 0, -mouseY*.2+20, 180); rect(0, 120, 400, 200); fill(mouseY*.2+1, 0, -mouseY*.2+20, 100); rect(0, 200, 400, 260); //layered ellipses behind to make moon "shine" //When mouse moves down, turns more red fill (252, 255, -mouseY*.2+232, 58); ellipse (250, 0, 390, 130); ellipse (240, -10, 400, 140); //â–ˆ Moon //When mouse moves down, turns more red fill (240, 238, -mouseY*.2+227); ellipse (260, 10, 380, 120); //craters //When mouse moves down, turns more red fill (211, 206, -mouseY*.2+192); ellipse (280, 40, 300, 60); ellipse (310, 60, 340, 80); ellipse (340, 30, 350, 40); ellipse (350, 80, 360, 90); //â–ˆ Stars stroke(255, 255, 255); strokeWeight(1); point(50, 30); point(170, 20); point(190, 40); point(210, 30); point(110, 110); point(190, 130); point(240, 140); point(10, 165); point(40, 140); point(300, 160); point(320, 140); point(360, 150); point(380, 180); noStroke(); //â–ˆ Clouds //When mouse moves down, turns more red fill(109, 83, -mouseY*.12+139); //Mouse movement causes clouds to move slightly ellipse(-mouseX*.009+20, -mouseY*.007+60, -mouseX*.009+80, -mouseY*.007+90); ellipse(-mouseX*.009+40, -mouseY*.007+50, -mouseX*.009+120, -mouseY*.007+80); ellipse(-mouseX*.009+90, -mouseY*.007+65, -mouseX*.009+140, -mouseY*.007+80); ellipse(-mouseX*.009+10, -mouseY*.007+270, -mouseX*.009+100, -mouseY*.007+300); ellipse(-mouseX*.009+40, -mouseY*.007+240, -mouseX*.009+100, -mouseY*.007+280); ellipse(-mouseX*.009+80, -mouseY*.007+270, -mouseX*.009+120, -mouseY*.007+300); ellipse(-mouseX*.009+220, -mouseY*.007+95, -mouseX*.009+250, -mouseY*.007+115); ellipse(-mouseX*.009+240, -mouseY*.007+90, -mouseX*.009+280, -mouseY*.007+110); //â–ˆ Background platforms fill(93, 69, -mouseY*.09+88); //Mouse movement causes platforms to move slightly triangle(-mouseX*.03+50, -mouseY*.009+150, -mouseX*.03+70, -mouseY*.009+150, -mouseX*.03+70, -mouseY*.009+170); triangle(-mouseX*.03+70, -mouseY*.009+150, -mouseX*.03+90, -mouseY*.009+150, -mouseX*.03+85, -mouseY*.009+150); triangle(-mouseX*.03+50, -mouseY*.009+150, -mouseX*.03+80, -mouseY*.009+145, -mouseX*.03+80, -mouseY*.009+150); triangle(-mouseX*.03+80, -mouseY*.009+145, -mouseX*.03+80, -mouseY*.009+160, -mouseX*.03+100, -mouseY*.009+145); triangle(-mouseX*.03+70, -mouseY*.009+150, -mouseX*.03+90, -mouseY*.009+150, -mouseX*.03+85, -mouseY*.009+170); triangle(-mouseX*.03+90, -mouseY*.009+145, -mouseX*.03+100, -mouseY*.009+145, -mouseX*.03+100, -mouseY*.009+155); triangle(-mouseX*.03+280, -mouseY*.009+220, -mouseX*.03+300, -mouseY*.009+240, -mouseX*.03+310, -mouseY*.009+220); triangle(-mouseX*.03+280, -mouseY*.009+220, -mouseX*.03+330, -mouseY*.009+200, -mouseX*.03+325, -mouseY*.009+220); triangle(-mouseX*.03+320, -mouseY*.009+210, -mouseX*.03+330, -mouseY*.009+210, -mouseX*.03+340, -mouseY*.009+230); triangle(-mouseX*.03+310, -mouseY*.009+220, -mouseX*.03+325, -mouseY*.009+220, -mouseX*.03+320, -mouseY*.009+230); triangle(-mouseX*.03+330, -mouseY*.009+200, -mouseX*.03+350, -mouseY*.009+210, -mouseX*.03+325, -mouseY*.009+220); //â–ˆ Platform under Gregory [this gave me so much trouble] triangle(80, 322, 200, 310, 300, 322); triangle(80, 322, 100, 380, 110, 370); triangle(90, 350, 140, 400, 220, 340); triangle(200, 360, 210, 380, 220, 360); triangle(80, 322, 300, 322, 100, 360); triangle(90, 350, 300, 320, 290, 350); triangle(140, 360, 290, 360, 290, 330); triangle(220, 360, 290, 380, 290, 350); //Shadow under Gregory fill(58, 47, -mouseY*.03+59, 100); ellipse(130, 335, 260, 355); //â–ˆ DRAW GREGORY!! //draw gregory's wings fill(255, 193, 193); ellipse(180, 240, 240, 260); ellipse(180, 250, 230, 270); //draw gregory's body fill(222, 63, 63); triangle(170, 220, 170, 340, 260, 340); //draw Gregory's belly scales fill(255, 193, 193); rect(164, 240, 185, 265, 3); rect(164, 265, 190, 295, 3); rect(164, 295, 200, 340, 3); //draw gregory's head fill(222, 63, 63); ellipse(130, 170, 200, 240); //gregory's eye fill(255, 255, 255); ellipse(145, 190, 180, 225); fill(222, 63, 63); //iris! Changes from purple to red based on vertical mouse movement fill(207, 98, -mouseY+255); //iris moves, contained within eye ellipse ellipse(150+mouseX*.03, 190+mouseY*.05, 164+mouseX*.03, 205+mouseY*.05); //iris white dot [to make him look alive!] fill(255, 255, 255); ellipse(160+mouseX*.03, 195+mouseY*.05, 165+mouseX*.03, 200+mouseY*.05); //hidden eyelid fill(222, 63, 63); //moves down on gregory's face based on mouse location quad(145, mouseY*.03+190, 155, 180, 180, 180, 180, mouseY*.03+185); //â–ˆ Star mouse cursor! fill(237, 247, 250, 100); //shine behind it~ pmouse for the shine to drag behind a bit ellipse(pmouseX-7, pmouseY-7, pmouseX+7, pmouseY+14); //switch fill back to complete opacity for cursor itself fill(237, 247, 250); triangle(mouseX, mouseY, mouseX, mouseY-10, mouseX-5, mouseY); triangle(mouseX, mouseY, mouseX, mouseY-10, mouseX+5, mouseY); triangle(mouseX-5, mouseY, mouseX+5, mouseY, mouseX, mouseY+20); triangle(mouseX-10, mouseY, mouseX+10, mouseY, mouseX, mouseY+10); } //â–ˆ Next code to make cursor flash on click! //Framerate lowered to make flash last longer void mousePressed() { frameRate(5); fill(255, 255, 255, 60); //Layered ellipses to create "flash" effect at 60/255 opacity ellipse(mouseX-200, mouseY-200, mouseX+200, mouseY+200); fill(255, 255, 255, 60); ellipse(mouseX-150, mouseY-150, mouseX+150, mouseY+150); fill(255, 255, 255, 60); ellipse(mouseX-100, mouseY-100, mouseX+100, mouseY+100); fill(255, 255, 255, 60); ellipse(mouseX-50, mouseY-50, mouseX+50, mouseY+50); //text that displays when mouse is clicked println("SHINE!"); }