/*Processing Interactive Drawing
CHRISTINA CHU
GEOMETRIC Mercurial the Spectre, DOTA 2
9/9/17
A lot of code experimenting went into this and seeing previous examples of this project from past years has really helped me create this.
*/
void setup() {
size(400, 400);
}
//Mouse press thing/////////////////////
//I wanted to do something awesome with the mousepress call, but I didn't want to change what I already had so I just made her say one of her in-game quotes.
void mousePressed() {
println("The Spectre gathers.");
}
void draw() {
frameRate(60);
background(0, 0, 0);
//BACKGROUND////////////////////////////////////////
fill(9, 9, 20, 255-mouseY/3);
ellipse(195, 224, 300, 500);
fill(12, 11, 33, 255-mouseY/3);
ellipse(195, 224, 200, 400);
fill(28, 26, 81, 255-mouseY/3);
ellipse(195, 224, 100, 300);
//Floating crystals that are pleasing to the eye//
//They fade in when Spectre is enraged (mouse movement down) and fade out when she's "okay" (mouse movement up)
fill(116, 37, 219, 0+mouseY/2);
quad(350, 82, 360, 62, 370, 82, 360, 105);
fill(32, 21, 94, 0+mouseY);
quad(340, 72, 350, 52, 360, 72, 350, 95); //right crystal
quad(49, 94, 59, 114, 49, 139, 38, 114);
fill(50, 21, 94, 0+mouseY/2);
quad(59, 104, 69, 124, 59, 149, 48, 124); //left crystal
fill(85, 26, 124, 0+mouseY);
triangle(133, 0, 145, 16, 156, 0); //top crystal
fill(71, 27, 79, 0+mouseY/4);
quad(258, 244, 270, 224, 282, 244, 270, 264);//bottom right crystal
fill(123, 71, 165, 0+mouseY/7);
quad(342, 341, 347, 349, 342, 360, 337, 347);//bottom-most right crystal (tiny)
fill(60, 36, 150, 0+mouseY/5);
quad(23, 310, 15, 326, 25, 345, 34, 328);//bottom left crystal
ellipseMode(CENTER);
//HEAD/////////////////////////////////////////////////
noStroke();
/*Ghostly trail
supposed to look like they are individual triangles since it gives it a geometric "ghostly" effect, especially when you stretch out the trail.
*/
//last triangle
fill(64, 21, 162, 200-mouseY/2);
triangle(305, 106+(cos(7+frameCount/4)), 341+mouseX/10, 155+(cos(20+frameCount/4))-mouseY/10, 264+(cos(4+frameCount/4)), 120+(cos(8+frameCount/4)));
fill(97, 39, 186, 220-mouseY/3);
triangle(254, 73+(cos(7+frameCount/4)), 321+mouseX/10, 101+(cos(60+frameCount/4))-mouseY/10, 215+(cos(4+frameCount/4)), 137+(cos(8+frameCount/4)));
//first triangle
fill(107, 39, 186, 250-mouseY/6);
triangle(165, 85+(cos(7+frameCount/4)), 260+mouseX/10, 64+(cos(40+frameCount/4))-mouseY/10, 212+(cos(4+frameCount/4)), 143+(cos(8+frameCount/4)));
//actual head
fill(123-mouseY/6, 22-mouseY/6, 163-mouseY/6, 255);
ellipse(170, 133, 90, 100);
//EYES//////////////////////////////////
fill(56, 255, 255);
triangle(172, 135, 197, 115, 200, 130);
fill(56, 255, 255);
triangle(150, 136, 134, 116, 133, 133);
//EYE GLOW///////////////////////////////
//Figuring out how to make them go in opposite directions took me forever to figure out, but it paid off in the end
fill(56, 255, 255, 100+mouseY/5);
quad(172, 135, 198, 106, (((mouseY)*(0.05)+222)+cos(5+frameCount/5)), 96, 200, 129);
quad(150, 136, 138, 108, (114-((mouseY/20))+cos(5+frameCount/5)), 102, 132, 131);
//DRESS//////////////////////////////////
//middle
fill(32-mouseY/6, 12-mouseY/6, 61-mouseY/6);
triangle(166, 186, 112-mouseY/20, 366, 248-mouseY/20, 366);
//right
fill(123-mouseY/6, 22-mouseY/6, 163-mouseY/6);
quad(166, 186, 210-mouseY/20+cos(20+frameCount/3), 371+cos(20+frameCount/3), 290-mouseY/20+cos(20+frameCount/3), 386+cos(20+frameCount/3), 189+cos(20+frameCount/3), 196+cos(20+frameCount/3));
//left
fill(123-mouseY/6, 22-mouseY/6, 163-mouseY/6);
quad(166, 186, 140-mouseY/20+cos(20+frameCount/3), 371+cos(20+frameCount/3), 86-mouseY/20+cos(20+frameCount/3), 386+cos(20+frameCount/3), 142+cos(5+frameCount/4), 198+cos(10+frameCount/5));
/*LIL' SPEC BACKGROUND PROP////////////////////////////////////////////////////////////
This lil' haunting spectre ghost follows the direction of the mouse cursor.
*/
noStroke();
//left arm
fill(47, 22, 68, 255-mouseX/2);
triangle(327+mouseX/6, 221+mouseY/6, 281+mouseX/6, 231+mouseY/6, 295+mouseX/6, 249+mouseY/6);
triangle(281+mouseX/6, 231+mouseY/6, 270+mouseX/6, 241+mouseY/6, 288+mouseX/6, 239+mouseY/6);
triangle(288+mouseX/6, 239+mouseY/6, 278+mouseX/6, 252+mouseY/6, 295+mouseX/6, 249+mouseY/6);
//ghostly head trail
fill(44, 12, 51, 255-mouseX/2);
triangle(368+mouseX/6, 175+mouseY/6, (((mouseX)*(0.05)+382)+cos(5+frameCount/5))+mouseX/6, 230+mouseY/6, 361+mouseX/6, 189+mouseY/6);
fill(47, 22, 68, 255-mouseX/2);
triangle(332+mouseX/6, 188+mouseY/6, 349+mouseX/6, 213+mouseY/6, (((mouseX)*(0.05)+372)+cos(5+frameCount/5))+mouseX/6, 169+mouseY/6);
fill(44, 21, 61, 255-mouseX/2);
triangle(379+mouseX/6, 172+mouseY/6, 383+mouseX/6, 179+mouseY/6, (((mouseX)*(0.05)+394)+cos(5+frameCount/5))+mouseX/6, 169+mouseY/6);
//body
fill(67, 25, 104, 255-mouseX/2);
quad(326+mouseX/6, 224+mouseY/6, 355+mouseX/6, 219+mouseY/6, 380+mouseX/6, 267+mouseY/6, 327+mouseX/6, 227+mouseY/6);
//head
quad(311+mouseX/6, 184+mouseY/6, 308+mouseX/6, 224+mouseY/6, 350+mouseX/6, 228+mouseY/6, 351+mouseX/6, 191+mouseY/6);
//eye glow
fill(56, 255, 255, 150-mouseX/2);
triangle(342+mouseX/6, 202+mouseY/6, (((mouseX)*(0.05)+364)+cos(5+frameCount/5)) +mouseX/6, 197+mouseY/6, 341+mouseX/6, 213+mouseY/6);
triangle(309+mouseX/6, 200+mouseY/6, 314+mouseX/6, 207+mouseY/6, (328-((mouseX/20))+cos(5+frameCount/5))+mouseX/6, 192+mouseY/6);
//eyes
fill(56, 255, 255, 255-mouseX/2);
//right eye
triangle(330+mouseX/6, 210+mouseY/6, 342+mouseX/6, 202+mouseY/6, 341+mouseX/6, 213+mouseY/6);
//left eye
triangle(316+mouseX/6, 207+mouseY/6, 310+mouseX/6, 199+mouseY/6, 309+mouseX/6, 209+mouseY/6);
//right arm
fill(47, 22, 68, 255-mouseX/2);
quad(351+mouseX/6, 224+mouseY/6, 357+mouseX/6, 216+mouseY/6, 383+mouseX/6, 232+mouseY/6, 374+mouseX/6, 241+mouseY/6);
triangle(383+mouseX/6, 232+mouseY/6, 390+mouseX/6, 238+mouseY/6, 379+mouseX/6, 236+mouseY/6);
triangle(379+mouseX/6, 236+mouseY/6, 374+mouseX/6, 240+mouseY/6, 380+mouseX/6, 244+mouseY/6);
//emblem
fill(96, 9, 67, 255-mouseX/2);
quad(324+mouseX/6, 222+mouseY/6, 321+mouseX/6, 231+mouseY/6, 332+mouseX/6, 234+mouseY/6, 334+mouseX/6, 226+mouseY/6);
/*WEAPON/////////////////////////////////////////////
The spectre's classic weapon of choice. It has the shape of a hula hoop and emits an ethereal glow.
Held in one hand when the mouse moves to the left. Held in both when the mouse moves to the right.
*/ //////////////////////////////////////////////////
stroke(255, 71, 193, 190);
strokeWeight(7);
noFill();
ellipse(225-mouseX/5, 301, 100, 100);
stroke(255, 71, 193, 100);
ellipse(225-mouseX/5, 301, 105, 105);
stroke(255, 71, 193, 150);
ellipse(225-mouseX/5, 301, 110, 110);
stroke(255, 71, 193, 150);
ellipse(225-mouseX/5, 301, 95+cos(20+frameCount/2), 95+cos(20+frameCount/2));
stroke(255, 71, 193, 100);
ellipse(225-mouseX/5, 301, 100+cos(20+frameCount/2), 100+cos(20+frameCount/2));
stroke(255, 71, 193, 50);
ellipse(225-mouseX/5, 301, 120+cos(20+frameCount/2), 120+cos(20+frameCount/2));
noStroke();
//ARM (X movement) ////////////////////////////////////////
//left
fill(123-mouseY/6, 22-mouseY/6, 163-mouseY/6, 255);
triangle(145, 197, 69+mouseX/6, 264, 41+mouseX/6, 243);
//right finger
triangle(71+mouseX/6, 263, 58+mouseX/6, 253, 52+mouseX/6, 275);
//left finger
triangle (42+mouseX/6, 242, 58+mouseX/6, 253, 35+mouseX/6, 270);
stroke(0, 0, 0, 50); //line to allow user to differentiate the arm from body
strokeWeight(1);
//arm line
line(145, 197, 69+mouseX/6, 264);
//line for right finger
line(71+mouseX/6, 263, 52+mouseX/6, 275);
//ARM (X movement) ////////////////////////////////////////
//right
noStroke();
fill(123-mouseY/6, 22-mouseY/6, 163-mouseY/6, 255);
triangle(186, 197, 282-mouseX/6, 249, 237-mouseX/6, 262);
//right finger
triangle(281-mouseX/6, 248, 284-mouseX/4, 279, 258-mouseX/6, 254);
//left finger
triangle(236-mouseX/6, 261, 254-mouseX/5, 281, 258-mouseX/6, 254);
stroke(0, 0, 0, 50); //line to allow user to differentiate the arm from body
strokeWeight(1);
line(186, 197, 236-mouseX/6, 261);
line(186, 197, 282-mouseX/6, 249);
//line for right finger
line(284-mouseX/4, 279, 258-mouseX/6, 254);
line(284-mouseX/4, 279, 281-mouseX/6, 248);
//line for left finger
line(258-mouseX/6, 254, 254-mouseX/5, 281);
/*/////////////////////////////////////////////////////////
These shoulder parts grow in size as the mouse cursor moves downwards.
*/ ////////////////////////////////////////////////////////
//FLOWY SHOULDER RIGHT
//top
noStroke();
fill(64+mouseY/10, 21, 162+mouseY/10, 150+mouseY/8);
quad(175, 186, 226, 146, ((mouseY)*(0.09)+284), ((135-mouseY/20)+cos(20+frameCount/3)), 225, (((mouseY)*(0.025)+172))+cos(5+frameCount/5));
fill(97+mouseY/10, 39, 186+mouseY/10, 150+mouseY/8);
quad(175, 186, 231, 182, ((mouseY)*(0.09)+293), ((167-mouseY/20)+cos(20+frameCount/3)), 234, (((mouseY)*(0.025)+200))+cos(5+frameCount/5));
fill(107+mouseY/10, 39, 186+mouseY/10, 150+mouseY/8);
quad(175, 186, 234, 211, ((mouseY)*(0.09)+267), ((234-mouseY/20)+cos(20+frameCount/3)), 205, (((mouseY)*(0.025)+218))+cos(5+frameCount/5));
//FLOWY SHOULDER LEFT/////////////////////////////////////////
//top
fill(64+mouseY/10, 21, 162+mouseY/10, 150+mouseY/8);
quad(160, 186, 113, 149, ((73-(mouseY/20)+cos(5+frameCount/5))), ((134-mouseY/20)+cos(20+frameCount/3)), 112, (((mouseY)*(0.025)+175))+cos(5+frameCount/5));
fill(97+mouseY/10, 39, 186+mouseY/10, 150+mouseY/8);
quad(160, 186, 112, 185, ((69-(mouseY/20)+cos(5+frameCount/5))), ((178-mouseY/20)+cos(20+frameCount/3)), 104, (((mouseY)*(0.025)+200))+cos(5+frameCount/5));
fill(107+mouseY/10, 39, 186+mouseY/10, 150+mouseY/8);
quad(160, 186, 108, 209, ((82-(mouseY/20)+cos(5+frameCount/5))), ((232-mouseY/20)+cos(20+frameCount/3)), 131, (((mouseY)*(0.025)+212))+cos(5+frameCount/5));
//CHEST EMBLEM///////////////////////////////////////////////////////
fill(150 +mouseY/5, 20, 119);
ellipse(165, 184, 25, 25);
/*LIL' SPEC HAUNT (FOREGROUND)//////////////////////////////////////////////////////////////////////////////
This lil' haunting spectre ghost manifests itself when the mouse cursor moves to the left. She fades out when the cursor goes to the right.
*/ /////////////////////////////////////////////////////////////////////////////////////////////////////////
//body back
fill(0, 0, 0, 255-mouseX);
quad(74+mouseX/6, 344, 82+mouseX/6, 365, 99+mouseX/6, 359, 89+mouseX/6, 342);
//chest
fill(114-mouseY/6, 9-mouseY/6, 107-mouseY/6, 255-mouseX);
quad(65+mouseX/6, 316, 54+mouseX/6, 345, 107+mouseX/6, 343, 108+mouseX/6, 318);
//body
quad(75+mouseX/6, 344, 87+mouseX/6, 381, 51+mouseX/6, 385, 54+mouseX/6, 344);
quad(89+mouseX/6, 343, 106+mouseX/6, 372, 139+mouseX/6, 356, 107+mouseX/6, 342);
//head
//back head ghostly trail
fill(64, 10, 50, 255-mouseX);
triangle(104+mouseX/6, 279, (((mouseX)*(0.2)+150)+cos(5+frameCount/5)) +mouseX/6, 274, 120+mouseX/6, 316);
fill(114-mouseY/6, 9-mouseY/6, 107-mouseY/6, 255-mouseX);
ellipseMode(CENTER);
ellipse(90+mouseX/6, 304, 80, 60);
//eyes
//right
fill(56, 255, 255, 255-mouseX);
triangle(85+mouseX/6, 301, 106+mouseX/6, 294, 109+mouseX/6, 305);
//left
triangle(72+mouseX/6, 299, 59+mouseX/6, 291, 56+mouseX/6, 301);
//eye glow
fill(56, 255, 255, 150-mouseX);
triangle(85+mouseX/6, 299, (((mouseX)*(0.2)+113)+cos(5+frameCount/5)) +mouseX/6, 287, 110+mouseX/6, 306);
triangle(72+mouseX/6, 299, (53-((mouseX/5))+cos(5+frameCount/5))+mouseX/6, 285, 56+mouseX/6, 301);
//emblem
fill(150 +mouseY/5, 20, 255, 255-mouseX);
ellipse(83+mouseX/6, 332, 16, 20);
//arms
fill(155, 0, 145, 255-mouseX);
//left arm
triangle(59+mouseX/6, 326, 42+mouseX/6, 339, 64+mouseX/6, 340);
triangle(42+mouseX/6, 339, 65+mouseX/6, 362, 81+mouseX/6, 342);
triangle(65+mouseX/6, 362, 81+mouseX/6, 362, 72+mouseX/6, 352);
triangle(81+mouseX/6, 341, 86+mouseX/6, 355, 72+mouseX/6, 352);
//right arm
triangle(108+mouseX/6, 330, 131+mouseX/6, 331, 123+mouseX/6, 342);
triangle(127+mouseX/6, 336, 135+mouseX/6, 338, 131+mouseX/6, 331);
triangle(127+mouseX/6, 336, 129+mouseX/6, 342, 122+mouseX/6, 342);
}