xxxxxxxxxx321
//Translate, Scale and Rotating Patrol Car #3 for Lab 7let darkness = false;let patrolCar, patrolCar2, patrolKitty, patrolCar3;let bigBrotherPupil;let backgroundImg;let deg = 0;let colorMaps = [ { //Red Color r: 255, g: 0, b: 0, }, { //White Color r: 255, g: 255, b: 255, }, { //Skin Color r: 255, g: 170, b: 130, }, { //Brick Color r: 200, g: 200, b: 200, },];function preload() { backgroundImg = loadImage('brick.jpeg');}// Brick wall replaced with background imagefunction drawGrid() { image(backgroundImg, 0, 0, width, height); // Display the background image}function setup() { createCanvas(600, 400); bigBrotherPupil = new Pupil(300, 200, "black", -1, 0.2); patrolCar = new movingPatrol(50, 300, colorMaps[0], 8, 19, "car"); patrolCar2 = new movingPatrol(50, 300, colorMaps[3], 1, 4, "car"); patrolKitty = new movingPatrol(80, 200, colorMaps[1], 3, -2, "cat"); patrolCar3 = new movingPatrol(0, 0, colorMaps[0], 5, 3, 'car');}function draw() { background(colorMaps[3].r, colorMaps[3].g, colorMaps[3].b); if (!darkness) {drawGrid();} // call obj and movement functions BigBrother(bigBrotherFace); /* initializing moving pupil pair through pupil class, as well as other objects */ bigBrotherPupil.display(); patrolCar.display(); patrolCar2.display(); patrolKitty.display(); // Kitty always moves patrolKitty.move(); patrolKitty.bounce(); /* Patrol car 2 moves in day, so big brother lurks at night, thus patrol car 1 suddenly moves making kitty panic */ if (darkness) { bigBrotherPupil.move(); bigBrotherPupil.bounce(); patrolCar.move(); patrolCar.bounce(); // Alternate colors during dark if (random() > 0.6) { updateColor(0); } else { randomizeColor(1); } // Third patrol car with scaling, rotating, and translating push(); translate(width / 2, height / 2); // Translate to the center rotate(radians(deg)); // Rotate based on deg let scaleFactor = map(mouseX, 0, width, 0.5, 2); // Scale based on mouse position scale(scaleFactor); patrolCar3.display(); // Display the third patrol car pop(); } else { // Car 2 camouflages in dark patrolCar2.move(); patrolCar2.bounce(); } // Update degree for rotation and circular motion deg++;}// Pupil class, new obj produces a pair of pupils to keep the movement in syncclass Pupil { constructor(x, y, color, xspeed, yspeed) { this.x = x; this.y = y; this.color = color; this.xspeed = xspeed; this.yspeed = yspeed; } display() { noStroke(); fill(this.color); // Draw left and right eyes ellipse(this.x - 70, this.y - 50, 20, 20); ellipse(this.x + 70, this.y - 50, 20, 20); } move() { this.x += this.xspeed; this.y += this.yspeed; } bounce() { if (this.x < 278 || this.x > 324) { this.xspeed = -this.xspeed; } if (this.y < 178 || this.y > 228) { this.yspeed = -this.yspeed; } }}// Patrol Object Classclass movingPatrol { constructor(x, y, color, xspeed, yspeed, characterType) { this.x = x; this.y = y; this.color = color; this.xspeed = xspeed; this.yspeed = yspeed; this.type = characterType; } display() { noStroke(); fill(this.color.r, this.color.g, this.color.b); if (this.type == "car") { rect(this.x, this.y, 60, 20); rect(this.x + 20, this.y - 10, 40, 10); fill(0); ellipse(this.x + 10, this.y + 20, 15, 15); ellipse(this.x + 50, this.y + 20, 15, 15); } else if (this.type == "cat") { //// Head ellipse(this.x, this.y - 50, 42, 40); //// Ears fill(this.color.r, this.color.g, this.color.b); // Left ear triangle( this.x - 20, this.y - 70, this.x - 10, this.y - 50, this.x, this.y - 60 ); // Right ear triangle( this.x + 20, this.y - 70, this.x + 10, this.y - 50, this.x, this.y - 60 ); //// Eyes fill(0); ellipse(this.x - 10, this.y - 50, 5, 5); // Left eye ellipse(this.x + 10, this.y - 50, 5, 5); // Right eye // Nose fill(255, 0, 0); ellipse(this.x, this.y - 46, 5, 5); // Mouth stroke(0); strokeWeight(1); noFill(); arc(this.x, this.y - 42, 10, 10, 0, PI); //Smile Curve } } move() { this.x += this.xspeed; this.y += this.yspeed; } bounce() { if (this.x < 0 || this.x > width) { this.xspeed = -this.xspeed; } if (this.y < 0 || this.y > height) { this.yspeed = -this.yspeed; } }}///////////////////////////////////////////////////////////////////// Unchanged functions from Lab 5 below ////////////////////////////////////////////////////////////////////////change bgfunction mousePressed() { if (!darkness) { colorMaps[3].r = 0; colorMaps[3].g = 0; colorMaps[3].b = 0; darkness = true; } else { colorMaps[3].r = 200; colorMaps[3].g = 200; colorMaps[3].b = 200; darkness = false; } draw();}//Big brother is watchinglet bigBrotherFace = { x: 300, y: 200, col: colorMaps[2], xspeed: 6, yspeed: -4,};let bigBrotherPupil1 = { x: 300, y: 200, col: "black", // pupil color xspeed: -1, yspeed: 0.2,};//for checking gradient valueslet direction = [{ towardsWhite: true }, { towardsWhite: false }];function updateColor(index) { let color = colorMaps[index]; let dir = direction[index]; if (dir.towardsWhite) { color.g = min(color.g + 10, 255); color.b = min(color.b + 10, 255); // Check if the color is white if (color.g >= 255 && color.b >= 255) { dir.towardsWhite = false; // Change to red } } else { color.g = max(color.g - 10, 0); color.b = max(color.b - 10, 0); // Check if the color has is red if (color.g <= 0 && color.b <= 0) { dir.towardsWhite = true; // Change to white } }}function randomizeColor(index) { let color = colorMaps[index]; // Assign random values within the 0-255 range color.r = Math.floor(Math.random() * 256); color.g = Math.floor(Math.random() * 256); color.b = Math.floor(Math.random() * 256);}// Big Brother Face Object (non animated drawing)function BigBrother(obj) { noStroke(); // face fill(obj.col.r, obj.col.g, obj.col.b); ellipse(obj.x, obj.y, 350, 350); // eyes fill(255); ellipse(obj.x - 70, obj.y - 50, 70, 100); // Left eye ellipse(obj.x + 70, obj.y - 50, 70, 100); // Right eye // mouth fill(65, 0, 0); rect(obj.x - 40, obj.y + 80, 80, 10);}