The “CHOICE” work I’ve done in week 3.
The “CHOICE” work I’ve done in week 3.
I organized the code of this sketch, and produce several self-defined function, including:
defineRain() drawNormal() raining() ifRainPressed()
And the variable “rainAmount” and “bgGreyscale” can be changed to alter different layout.
let bigRain = [];
let smallRain = [];
let bigPressed = false;
let smallPressed = false;
let hs1 = 300;
let hs2 = 100;
let rainAmount = 100;
let bgGreyscale = 220;
function setup() {
createCanvas(600, 600);
print("Decide by clicking the tip of the rain.");
defineRain(rainAmount);
}
function draw() {
//background, human and text
prepareBackground(bgGreyscale);
drawNormal();
raining(rainAmount);
ifRainPressed()
}
//*******************supplementary part********************
function mousePressed() {
for (let i = 0; i < 100; i++) {
bigRain[i].bigClicked();
smallRain[i].smallClicked();
}
}
//I also wanted to add "touchStarted", for mobile phone users, but failed to do so.-->ask in class
function defineRain(rainAmount) {
for (let i = 0; i < rainAmount; i++) {
bigRain[i] = new RAIN(
random(0, width),
random(-10000, 0),
random(1000, 1500),
random(1, 4)
);
smallRain[i] = new RAIN(
random(0, width),
random(-10000, 0),
random(50, 100),
random(1, 4)
);
}
}
function raining(rainAmount) {
//Raining
for (let i = 0; i < rainAmount; i++) {
bigRain[i].show();
bigRain[i].drop();
smallRain[i].show();
smallRain[i].drop();
}
}
function prepareBackground(greyScale) {
background(greyScale);
fill(0);
textFont("Courier New", 13);
text("Would you like to be seen as big or small?", width / 3, height / 2);
text("Let me know. Choose a drop size.", width / 3, height / 2 + 20);
}
function drawNormal() {
fill(0);
circle(width / 4, height / 2.2, 10);
curve(
width / 4 - 300,
height / 2.1 - 300,
width / 4,
height / 2.1,
width / 4,
height / 2.1,
width / 4 + 300,
height / 2.1 - 300
);
strokeWeight(4);
line(width / 4, height / 2, width / 4.2, height / 1.8);
line(width / 4, height / 2, width / 3.8, height / 1.8);
line(width / 4.18, height / 2.05, width / 4.2 - 15, height / 2.05 + 15);
line(width / 3.88, height / 2.05, width / 3.8 + 15, height / 2.05 + 15);
}
function ifRainPressed() {
//if "BIG" is selected.
if (bigPressed) {
let hw1 = width / 4;
let hh1 = height / 2.1;
curve(hw1 - hs1, hh1 - hs1, hw1, hh1, hw1, hh1, hw1 + hs1, hh1 - hs1);
hs1 += 500;
fill(220);
text("No one can see the whole you.", hw1 - 100, hh1 + 100);
print("IT'S LONELY EITHER WAY.");
}
//if "SMALL"is selected.
if (smallPressed) {
background(220);
let hw2 = width / 4;
let hh2 = height / 2.1;
if (abs(hs2) > 10) {
curve(hw2 - hs2, hh2 - hs2, hw2, hh2, hw2, hh2, hw2 + hs2, hh2 - hs2);
hs2 -= 100;
}
fill(0);
text("No one can see you.", hw2 - 100, hh2 + 100);
print("IT'S LONELY EITHER WAY.");
}
}
//*******************from now on is class********************
class RAIN {
constructor(x, y, size, speed) {
this.x = x;
this.y = y;
this.size = size;
this.speed = speed;
}