Genera un juego de Arkanoid en p5.js
De Wikiprompt, la enciclopedia libre de prompts
18 mar 2023
Genera un juego de Arkanoid en p5.js Un prompt simple de una sola toma para generar un juego Arkanoid jugable en p5.js, con el ratón controlando la paleta. Incluye instrucciones de seguimiento para completarlo y corregir errores.
Contenido del PromptGuardar
🌐
let paddle;
let ball;
let bricks = [];
let brickRows = 5;
let brickCols = 8;
let brickWidth = 60;
let brickHeight = 20;
let brickPadding = 10;
let brickOffsetTop = 30;
let brickOffsetLeft = 30;
let score = 0;
let gameOver = false;
let gameWin = false;
function setup() {
createCanvas(800, 600);
paddle = new Paddle();
ball = new Ball();
initBricks();
}
function initBricks() {
bricks = [];
for (let i = 0; i < brickRows; i++) {
for (let j = 0; j < brickCols; j++) {
let x = brickOffsetLeft + j * (brickWidth + brickPadding);
let y = brickOffsetTop + i * (brickHeight + brickPadding);
bricks.push(new Brick(x, y, brickWidth, brickHeight));
}
}
}
function draw() {
background(0);
if (gameOver) {
textSize(32);
fill(255);
text("Game Over - Click to restart", width/2 - 150, height/2);
if (mouseIsPressed) {
resetGame();
}
return;
}
if (gameWin) {
textSize(32);
fill(255);
text("You Win! - Click to restart", width/2 - 150, height/2);
if (mouseIsPressed) {
resetGame();
}
return;
}
paddle.update();
paddle.show();
ball.update();
ball.show();
ball.checkPaddle(paddle);
ball.checkWalls();
// Check brick collisions
for (let i = bricks.length - 1; i >= 0; i--) {
if (bricks[i].collide(ball)) {
bricks.splice(i, 1);
score += 10;
ball.bounce();
if (bricks.length === 0) {
gameWin = true;
}
}
}
// Display bricks
for (let brick of bricks) {
brick.show();
}
// Display score
fill(255);
textSize(16);
text("Score: " + score, 10, height - 10);
}
function resetGame() {
score = 0;
gameOver = false;
gameWin = false;
ball.reset();
initBricks();
}
class Paddle {
constructor() {
this.width = 100;
this.height = 15;
this.x = width/2 - this.width/2;
this.y = height - 30;
}
update() {
this.x = mouseX - this.width/2;
this.x = constrain(this.x, 0, width - this.width);
}
show() {
fill(255);
rect(this.x, this.y, this.width, this.height);
}
}
class Ball {
constructor() {
this.radius = 8;
this.reset();
}
reset() {
this.x = width/2;
this.y = height - 50;
this.vx = random(-3, 3);
this.vy = -4;
}
update() {
this.x += this.vx;
this.y += this.vy;
// Check bottom
if (this.y > height) {
gameOver = true;
}
}
checkPaddle(paddle) {
if (this.y + this.radius > paddle.y &&
this.y + this.radius < paddle.y + paddle.height &&
this.x > paddle.x - this.radius &&
this.x < paddle.x + paddle.width + this.radius) {
this.vy = -abs(this.vy);
// Add slight angle based on hit position
let hitPos = (this.x - paddle.x) / paddle.width;
this.vx = map(hitPos, 0, 1, -4, 4);
}
}
checkWalls() {
if (this.x < this.radius || this.x > width - this.radius) {
this.vx *= -1;
}
if (this.y < this.radius) {
this.vy *= -1;
}
}
bounce() {
this.vy *= -1;
}
show() {
fill(255);
ellipse(this.x, this.y, this.radius * 2);
}
}
class Brick {
constructor(x, y, w, h) {
this.x = x;
this.y = y;
this.w = w;
this.h = h;
this.colors = [color(255, 0, 0), color(255, 165, 0), color(255, 255, 0), color(0, 255, 0), color(0, 0, 255)];
}
show() {
fill(this.colors[floor((this.y - brickOffsetTop) / (this.h + brickPadding))]);
rect(this.x, this.y, this.w, this.h);
}
collide(ball) {
if (ball.x + ball.radius > this.x &&
ball.x - ball.radius < this.x + this.w &&
ball.y + ball.radius > this.y &&
ball.y - ball.radius < this.y + this.h) {
return true;
}
return false;
}
}
Iniciá sesión para ver el prompt completo
Continuar con:
Al iniciar sesión, aceptás nuestros Términos de uso y Política de privacidad
Uso
Este prompt está diseñado para usarse con coding. Copiá el contenido de arriba y pegalo en tu herramienta de IA preferida.
Para mejores resultados, personalizá los marcadores (indicados con corchetes o mayúsculas) con tus requisitos específicos.
Referencias
- Categoría: Prompts de coding
- Fuente: https://x.com/icreatelife/status/1636934371243438080
Discusión
0 comentarios