/*
Dedicated to the thousands of teas I've drank in my lifetime... and the 6 I drank while coding this sketch. May you RIP.
"Tea Time"
MADE BY: Jensen Verlaan
It's TEA TiME, so take a seat and JOIN IN! Participate by doing the following:
-> Open youtube.com and search "Tea Time Music." Play it to become fully immersed in the wonders of Tea Time.
-> Move the mouse up and down to lower and raise your tea bag into and out of your mug.
-> STEEP YOUR TEA! The closer your tea bag is to your mug, the more steeped the tea within will become.
-> When the mouse is clicked, the game title, "TEA TiME," is printed on the bottom left hand side of the sketch.
-> When the 'ENTER' key is pressed, the colour of various static objects are swapped. TEA TiME comes in many colours!
*/
void setup() {
// Set sketch size to 400 x 400 pixels
size(400, 400);
// Remove the cursor
noCursor();
}
void draw() {
// Set the kitchen wall colour to a soft blue
background(172, 195, 232);
// Adjust the frame rate to 60FPS
frameRate(60);
// Remove stroke for that soft, line-less asthetic
noStroke();
// Make the BACKGROUND. //
/* SHELVES */
// Shadowed shelves
fill(133, 97, 64);
rect(0, -5, 120, 125, 7);
rect(360, -5, 40, 125, 7);
// Under shelf rectangle
fill(171, 125, 83);
rect(110, 0, 260, 70, 7);
// Shelving front
fill(255, 187, 124);
rect(-5, -5, 105, 125, 7);
rect(380, -5, 410, 125, 7);
rect(100, -5, 280, 65, 7);
// Shelf doors
fill(227, 166, 110);
rect(-5, -5, 95, 115, 7);
rect(390, -5, 20, 115, 7);
rect(110, -5, 120, 55, 7);
rect(250, -5, 120, 55, 7);
// Shelf handles
// Set ellipse mode to CENTER
ellipseMode(CENTER);
fill(68, 77, 92);
ellipse(70, 20, 10, 10);
ellipse(210, 20, 10, 10);
ellipse(270, 20, 10, 10);
/* DISTANT COUNTER TOP */
// Counter Tops
fill(173, 127, 84);
rect(170, 200, 245, 70, 7);
rect(-5, 200, 40, 70, 7);
fill(68, 77, 92);
rect(170, 160, 245, 65, 7);
rect(-5, 160, 40, 65, 7);
fill(115, 131, 156);
rect(170, 160, 245, 60, 7);
rect(-5, 160, 40, 60, 7);
// Cutting Board
fill(148, 167, 199);
rect(200, 165, 90, 40, 7);
//Counter Drawers
fill(156, 114, 76);
rect(180, 230, 80, 20, 7);
rect(270, 230, 80, 20, 7);
rect(360, 230, 80, 20, 7);
rect(-5, 230, 30, 20, 7);
// Drawer Handles
fill(68, 77, 92);
ellipse(220, 240, 10, 10);
ellipse(310, 240, 10, 10);
ellipse(400, 240, 10, 10);
/* OVEN */
// Body
fill(210, 222, 255);
rect(35, 200, 135, 70, 7);
fill(239, 255, 255);
rect(35, 160, 135, 60, 7);
// Oven Burners
fill(68, 77, 92);
// Set ellipse mode to CORNER
ellipseMode(CORNER);
ellipse(110, 170, 40, 10);
ellipse(109, 190, 42, 12);
ellipse(50, 170, 40, 10);
ellipse(49, 190, 42, 12);
// Oven Handle
fill(68, 77, 92);
rect(45, 230, 115, 10, 7);
// Oven Glass
fill(115, 131, 156);
rect(55, 250, 100, 40, 7);
// Dish Rags
fill(161, 178, 100);
rect(55, 225, 20, 40, 7);
fill(102, 185, 204);
rect(85, 225, 20, 40, 7);
// Make ITEMS. //
/* JARS */
// Glass Body
fill(239, 255, 255, 230);
rect(370, 140, 20, 30, 7);
rect(390, 140, 20, 30, 7);
rect(380, 170, 20, 20, 7);
// Filling
fill(255, 113, 138, 150);
rect(380, 180, 20, 10, 7);
rect(370, 150, 20, 20, 7);
// Lids
fill(68, 77, 92);
rect(370, 130, 20, 10, 7);
rect(390, 140, 20, 10, 7);
rect(380, 160, 20, 10, 7);
/* KETTLE */
// Body
// Set ellipse mode to CENTER
ellipseMode(CENTER);
fill(209, 92, 113);
ellipse(130, 157, 40, 40);
// Spout
quad(130, 157, 110, 157, 80, 137, 90, 137);
fill(133, 59, 72);
ellipse(85, 137, 10, 5);
// Handle
noFill();
stroke(209, 92, 113);
strokeWeight(5);
ellipse(150, 157, 20, 20);
// Lid
noStroke();
fill(250, 110, 135);
ellipse(130, 147, 40, 20);
fill(133, 59, 72);
ellipse(130, 137, 10, 10);
/* KNIFE RACK */
// Rack
fill(227, 166, 110);
rect(200, 100, 90, 10, 7);
// Knife Blades
fill(239, 255, 255);
triangle(220, 80, 210, 120, 220, 120);
triangle(230, 90, 230, 120, 240, 120);
triangle(270, 90, 270, 120, 280, 120);
rect(250, 80, 10, 40, 7, 0, 0, 0);
// Knife Handles
fill(68, 77, 92);
rect(215, 120, 5, 20, 7);
rect(235, 120, 5, 10, 7);
rect(250, 120, 10, 20, 7);
rect(275, 120, 5, 5, 7);
// Knife Handle Screws
fill(200);
ellipse(255, 125, 3, 3);
ellipse(255, 135, 3, 3);
// Make the MIDGROUND. //
// Counter Top Gradients
fill(255, 187, 124);
rect(0, 260, width, 10);
fill(242, 178, 118);
rect(0, 270, width, 10);
fill(235, 172, 114);
rect(0, 280, width, 10);
fill(219, 161, 107);
rect(0, 290, width, 10);
fill(204, 150, 99);
rect(0, 300, width, 15);
fill(186, 137, 91);
rect(0, 315, width, 20);
// Make the BACK LAYER OF MUG (that will be behind the tea bag when it is lowered into the mug). //
// Body
fill(191, 212, 119);
rect(220, 190, 120, 150);
ellipse(280, 340, 120, 40);
fill(131, 145, 81);
ellipse(280, 190, 120, 40);
// Handle
fill(191, 212, 119);
rect(330, 230, 50, 20, 7);
rect(360, 230, 20, 90, 7);
rect(330, 300, 50, 20, 7);
// Handle Highlights
fill(224, 247, 139);
rect(330, 230, 50, 10, 7);
rect(330, 300, 30, 10, 7);
// Tea
// transparency is set to change with the mouse's vertical location so the tea appears darker when the teabag is closer and lighter when it is farther away
fill(92, 48, 6, mouseY);
ellipse(280, 195, 100, 30);
// Lip of Mug
noFill();
stroke(205, 227, 127);
strokeWeight(7);
ellipse(280, 190, 120, 40);
// Make MOVING STEAM. //
/* Semi-transparent ellipses use the frame count to change size as time passes, giving illusion of steam rising */
// Mug Steam
noStroke();
fill(255, 50);
ellipse(290, 135, 100 + ((float) Math.sin(frameCount * 0.05) * 12), 100 + ((float) Math.sin(frameCount * 0.05) * 12));
ellipse(250, 100, 80 + ((float) Math.sin(frameCount * 0.05) * 12), 80 + ((float) Math.sin(frameCount * 0.05) * 12));
ellipse(265, 50, 50 + ((float) Math.sin(frameCount * 0.05) * 12), 50 + ((float) Math.sin(frameCount * 0.05) * 12));
ellipse(250, 170, 40 + ((float) Math.sin(frameCount * 0.05) * 12), 40 + ((float) Math.sin(frameCount * 0.05) * 12));
ellipse(300, 125, 30 + ((float) Math.sin(frameCount * 0.05) * 12), 30 + ((float) Math.sin(frameCount * 0.05) * 12));
ellipse(295, 0, 25 + ((float) Math.sin(frameCount * 0.05) * 12), 25 + ((float) Math.sin(frameCount * 0.05) * 12));
// Kettle Steam
fill(255, 45);
ellipse(80, 125, 10 + ((float) Math.sin(frameCount * 0.03) * 12), 10 + ((float) Math.sin(frameCount * 0.03) * 12));
// Make the TEA BAG. //
/* Tea Bag will move up and down the y-axis following the vertical movement of the mouse */
// Fabric Body
noStroke();
fill(255, 175);
rect(255, mouseY, 50, 50, 7);
rect(270, mouseY - 5, 20, 10, 7);
// Tea Leaves
fill(133, 102, 70);
rect(260, mouseY + 25, 40, 20, 7);
// String
stroke(255, 113, 138);
strokeWeight(3);
line(280, 0, 280, mouseY);
// Make the FRONT LAYER OF MUG (that will be in front of the tea bag when it is lowered into mug). //
// Counter Top
noStroke();
fill(173, 127, 84);
rect(0, 335, width, 20);
fill(163, 120, 79);
rect(0, 355, width, 20);
fill(145, 107, 71);
rect(0, 375, width, 25);
// Mug Shadow
fill(68, 77, 92, 100);
ellipse(300, 365, 180, 100);
// Body
fill(191, 212, 119);
rect(220, 212, 120, 130);
ellipse(280, 340, 120, 40);
// Lip of Mug
stroke(224, 247, 139);
strokeWeight(7);
noFill();
arc(280, 190, 120, 40, 0, PI);
}
void mousePressed() {
// Adjust frame rate so image appears for a longer period of time once mouse is clicked
frameRate(1);
// Remove lines for asthetic purposes
noStroke();
/* Make the words "TEA TiME" appear on screen in bottom left corner of sketch when mouse is pressed */
// Ellipse Behind Letters
fill(254, 158, 157, 175);
ellipse(110, 330, 200, 120);
// T
fill(189, 234, 242);
rect(40, 280, 40, 10, 7);
rect(55, 280, 10, 40, 7);
// E
rect(90, 280, 30, 10, 7);
rect(90, 280, 10, 40, 7);
rect(90, 295, 20, 10, 7);
rect(90, 310, 30, 10, 7);
// A
rect(130, 300, 10, 20, 7);
rect(140, 280, 20, 30, 7);
rect(130, 300, 40, 10, 7);
rect(160, 300, 10, 20, 7);
// Include hole in 'A' that matches the background colour
fill(219, 161, 107);
rect(145, 290, 10, 10, 7);
// T
fill(189, 234, 242);
rect(30, 340, 40, 10, 7);
rect(45, 340, 10, 40, 7);
// I
// Use two lines to make the dot of 'i' look like a heart
stroke(189, 234, 242);
strokeWeight(9);
line(80, 340, 85, 350);
line(90, 340, 85, 350);
noStroke();
rect(80, 360, 10, 20, 7);
// M
rect(105, 340, 10, 40, 7);
rect(105, 340, 20, 10, 7);
rect(120, 340, 10, 20, 7);
rect(125, 340, 20, 10, 7);
rect(135, 340, 10, 40, 7);
// E
rect(160, 340, 30, 10, 7);
rect(160, 340, 10, 40, 7);
rect(160, 370, 30, 10, 7);
rect(160, 355, 20, 10, 7);
}
void keyPressed() {
// Adjust frame rate so image appears for a longer period of time once mouse is clicked
frameRate(1);
// Remove lines for asthetic purposes
noStroke();
/*
When the 'ENTER' key is pressed, many static sketch components will swap colours.
Many sketch components that do not change colour must be included in the keyPressed
block of code as well to ensure that forms do not overlap one another when key is pressed.
Moving forward, all affected 'fill' have been altered and swapped from what they were in their draw() counterparts
*/
// DISH RAGS //
// Dish Rags
fill(189, 83, 102);
rect(55, 225, 20, 40, 7);
fill(233, 242, 162);
rect(85, 225, 20, 40, 7);
// COUNTERTOP //
fill(255, 187, 124);
rect(0, 260, width, 10);
// MUG BEHIND TEA BAG //
// Body
fill(209, 92, 113);
rect(220, 190, 120, 150);
ellipse(280, 340, 120, 40);
fill(171, 58, 58);
ellipse(280, 190, 120, 40);
// Handle
fill(209, 92, 113);
rect(330, 230, 50, 20, 7);
rect(360, 230, 20, 90, 7);
rect(330, 300, 50, 20, 7);
// Handle Highlights
fill(250, 110, 135);
rect(330, 230, 50, 10, 7);
rect(330, 300, 30, 10, 7);
// Tea
fill(92, 48, 6, mouseY);
ellipse(280, 195, 100, 30);
// Lip of Mug
noFill();
stroke(250, 110, 135);
strokeWeight(7);
ellipse(280, 190, 120, 40);
/* STEAM */
// Mug Steam
noStroke();
fill(255, 50);
ellipse(290, 135, 100, 100);
ellipse(250, 100, 80, 80);
ellipse(265, 50, 50, 50);
ellipse(250, 170, 40, 40);
ellipse(300, 125, 30, 30);
ellipse(295, 0, 25, 25);
// Kettle Steam
fill(255, 35);
ellipse(85, 130, 10, 10);
/* TEA BAG */
// Fabric Body
noStroke();
fill(255, 175);
rect(255, mouseY, 50, 50, 7);
rect(270, mouseY - 5, 20, 10, 7);
// Tea Leaves
fill(133, 102, 70);
rect(260, mouseY + 25, 40, 20, 7);
// String
stroke(191, 212, 119);
strokeWeight(3);
line(280, 0, 280, mouseY);
/* MUG IN FRONT OF TEA BAG */
// Counter Top
noStroke();
fill(173, 127, 84);
rect(0, 335, width, 20);
fill(163, 120, 79);
rect(0, 355, width, 20);
fill(145, 107, 71);
rect(0, 375, width, 25);
// Mug Shadow
fill(68, 77, 92, 100);
ellipse(300, 365, 180, 100);
// Body
noStroke();
fill(209, 92, 113);
rect(220, 212, 120, 130);
ellipse(280, 340, 120, 40);
// Lip of Mug
stroke(250, 110, 135);
strokeWeight(7);
noFill();
arc(280, 190, 120, 40, 0, PI);
/* KETTLE */
// Body
noStroke();
ellipseMode(CENTER);
fill(191, 212, 119);
ellipse(130, 157, 40, 40);
// Spout
quad(130, 157, 110, 157, 80, 137, 90, 137);
fill(133, 59, 72);
ellipse(85, 137, 10, 5);
// Handle
noFill();
stroke(191, 212, 119);
strokeWeight(5);
ellipse(150, 157, 20, 20);
// Lid
noStroke();
fill(224, 247, 139);
ellipse(130, 147, 40, 20);
fill(133, 59, 72);
ellipse(130, 137, 10, 10);
/* JARS */
// Filling
fill(205, 227, 127, 150);
rect(380, 180, 20, 10, 7);
rect(370, 150, 20, 20, 7);
// Lids
fill(68, 77, 92);
rect(370, 130, 20, 10, 7);
rect(390, 140, 20, 10, 7);
rect(380, 160, 20, 10, 7);
}
