xxxxxxxxxx
186
let paddle;
let ball;
let bricks = [];
let rows = 10;
let cols = 10;
let brickSize;
let brickGap = 5;
let scoreA = 0;
let scoreB = 0;
function setup() {
createCanvas(600, 600);
paddle = new Paddle();
ball = new Ball();
brickSize = width / (cols) - brickGap;
createBricks();
// Initialize score A
scoreA = bricks.length;
}
function createBricks() {
for (let i = 0; i < rows; i++) {
for (let j = 0; j < cols; j++) {
let x = j * (brickSize + brickGap) + brickGap / 2;
let y = i * (brickSize + brickGap) + brickGap / 2;
bricks.push(new Brick(x, y, brickSize));
}
}
}
function keyPressed() {
if (keyCode === RIGHT_ARROW) {
paddle.setDir(1);
} else if (keyCode === LEFT_ARROW) {
paddle.setDir(-1);
}
}
function keyReleased() {
if (keyCode === RIGHT_ARROW || keyCode === LEFT_ARROW) {
paddle.setDir(0);
}
}
class Paddle {
constructor() {
this.width = 100;
this.height = 20;
this.x = width / 2 - this.width / 2;
this.y = height - 30;
this.speed = 5;
this.direction = 0;
}
display() {
fill(255);
rect(this.x, this.y, this.width, this.height);
}
update() {
this.x += this.speed * this.direction;
this.x = constrain(this.x, 0, width - this.width);
}
setDir(dir) {
this.direction = dir;
}
}
class Ball {
constructor() {
this.x = width / 2;
this.y = height / 2;
this.diameter = 20;
this.speedX = random(-5, 5);
this.speedY = -5;
}
display() {
fill(255);
strokeWeight(0);
ellipse(this.x, this.y, this.diameter);
// Draw GBP sign in the middle of the ball
textSize(20); // Adjust text size as needed
textAlign(CENTER, CENTER);
fill(0); // Set text color to black
stroke(0, 0, 0); // Red border color
strokeWeight(3);
text('£', this.x, this.y + 5); // Draw GBP sign at the center of the ball
}
update() {
this.x += this.speedX;
this.y += this.speedY;
if (this.x <= 0 || this.x >= width) {
this.speedX *= -1;
}
if (this.y <= 0 || (this.y + this.diameter / 2 >= paddle.y && this.x >= paddle.x && this.x <= paddle.x + paddle.width)) {
this.speedY *= -1;
}
if (this.y > height) {
// Game Over
textSize(32);
textAlign(CENTER, CENTER);
fill(255);
text("Game Over!", width / 2, height / 2);
noLoop();
}
}
reverse(axis) {
if (axis === 'x') {
this.speedX *= -1;
} else if (axis === 'y') {
this.speedY *= -1;
}
}
hits(brick) {
let closestX = constrain(this.x, brick.x, brick.x + brick.size);
let closestY = constrain(this.y, brick.y, brick.y + brick.size);
let distanceX = this.x - closestX;
let distanceY = this.y - closestY;
let distanceSquared = distanceX * distanceX + distanceY * distanceY;
return distanceSquared < (this.diameter / 2) * (this.diameter / 2);
}
}
class Brick {
constructor(x, y, size) {
this.x = x;
this.y = y;
this.size = size;
}
display() {
fill(255, 0, 0);
stroke(255, 0, 0); // Red border color
strokeWeight(3);
ellipse(this.x + this.size / 2, this.y + this.size / 2, this.size);
}
}
function draw() {
background(200);
paddle.display(); // Display paddle before updating
paddle.update();
ball.display(); // Display ball before updating
ball.update();
for (let i = bricks.length - 1; i >= 0; i--) {
bricks[i].display();
if (ball.hits(bricks[i])) {
bricks.splice(i, 1);
ball.reverse('y');
scoreA--; // Decrease score A when a brick is hit and removed
scoreB++; // Increase score B when a brick is hit and removed
}
}
// Display score counters
fill(255, 0, 0); // Set fill color to red
textSize(100);
textAlign(CENTER);
stroke(0, 0, 0); // Red border color
strokeWeight(4);
textFont('times');
text(`Critical: ${scoreA}`, width - 280, 320); // Draw "Critical" text in red
fill(255); // Reset fill color to white
stroke(255, 0, 0); // Red border color
strokeWeight(3);
textSize(60);
textFont('Zapfino');
text(`Performative: ${scoreB}`, width - 320, 400);
}