xxxxxxxxxx
let flower1;
let flower2;
let flower3;
let water;
let garden;
// Set variables for growing the flowers.
let flowerY = 200;
let flowerSize = 20;
function preload() {
// Load the image files.
flower1 = loadImage("flower-1.png");
flower2 = loadImage("flower-2.png");
flower3 = loadImage("flower-3.png");
water = loadImage("Water.gif");
}
function setup() {
// Set a 400x400 px canvas.
createCanvas(400, 400);
// Create a p5.Graphics object
// to render the flowers.
garden = createGraphics(400, 400);
// Position images using
// center coordinates.
imageMode(CENTER);
// Resize the images.
flower1.resize(100, 100);
flower2.resize(100, 100);
flower3.resize(100, 100);
water.resize(50, 50);
// Pause the GIF.
water.pause();
}
function draw() {
background(255);
drawStems();
// growFlowers();
// Draw the graphics object.
image(garden, width / 2, height / 2);
// Draw the watering can GIF.
image(water, mouseX, mouseY);
// Draw the pointillism effect.
if (mouseIsPressed) {
paintFlower(flower1, 50, 100);
paintFlower(flower2, 150, 100);
paintFlower(flower3, 250, 100);
water.play();
}
}
function keyPressed() {
// Save the sketch as a GIF
// when the S key is pressed.
if (key === "s") {
saveGif('garden', 5);
}
// Reset the painting when
// any key is pressed.
garden.clear();
}
// Paint a flower using the
// pointillism effect.
function paintFlower(img, x, y) {
// Source a random pixel's color from the image.
let sourceX = random(0, img.width);
let sourceY = random(0, img.height);
let c = img.get(sourceX, sourceY);
// Set the point's coordinates.
let px = x + sourceX;
let py = y + sourceY;
// Draw the points onto our graphics object.
garden.stroke(c);
garden.strokeWeight(random(5, 10));
garden.point(px, py);
}
function mouseReleased() {
// Resets and pauses the GIF when
// mouse is not being pressed.
water.reset();
water.pause();
}
function drawStems() {
// Draw individual stems.
stroke("brown");
strokeWeight(3);
line(100, 400, 100, flowerY);
line(200, 400, 200, flowerY);
line(300, 400, 300, flowerY);
}
function growFlowers() {
// Draw the flower images.
image(flower1, 100, flowerY, flowerSize, flowerSize);
image(flower2, 200, flowerY, flowerSize, flowerSize);
image(flower3, 300, flowerY, flowerSize, flowerSize);
// Grow flowers while the mouse is pressed.
if (mouseIsPressed) {
flowerY -= 1;
flowerSize += 1;
}
// Limit flower size growth.
if (flowerSize > 100) {
flowerSize = 100;
}
// Reset growth if flower
// reaches a certain height.
if (flowerY < 100) {
flowerY = 350;
flowerSize = 20;
}
}