Play
:quality(85)/https:%2F%2Fcdn.frvr.ai/685e4b8ac2dd70f5774acb94.png)
:quality(85)/https:%2F%2Fcdn.frvr.ai/685e4b6dc2dd70f5774acb91.png)
#simple
#interactive
#pelotarebotina
#cajaderebote
#2d
#pro
#tio
#xd
Creation History
User prompt
quiero que cuando la pelota toque algo tenga una animacion de espancion ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
quiero que en esas tres partes tambien añadas el sonido g y que cuando inicie el juego ya esten de color negro que no sea necesario tocarlos ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
pero que no las toque juntas que sea una sola y que sea aleatoria al igual pon lo mismo en el otro lado y arriba ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
quiero que ese bloque blanco que pude reproduzca el sonido C y el sonido un cuando la pelota blanca lo toque y que se haga de color negro ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
que sea blanco y que cubra todo un lado de la pantalla
User prompt
añade un bloque delgado y largo en una esquina de la pantalla
User prompt
quiero que los circulos del fondo sean mas grandes y aigan mas
User prompt
quiero que el bloque rojo haga el sonido de sonidodebloquerojo cuando desaparezca
User prompt
y ahora añade circulos en el fondo
User prompt
añade mas
User prompt
no que tenga circulos si no que ondas musicales y asi
User prompt
ahora que tenga fondo negro completamente negro y que tenga varios simbolos de notas musicales
User prompt
pero que el fondo tenga destas musicales
User prompt
añade un fondo con teclas musicales pero con una opacidad de oscuridad
User prompt
mejor elimina el aim
User prompt
ahora quiero que los bloques azules y rojos nose interpongan entre si osea que aparezcan alejados entre si y quiero que la pelota blanca tenga un aim para que se mas sencillo darle a los destas
User prompt
que aiga una puntuacion arriba de bloques azules rotos y de bloques rojos rotos
User prompt
haz que aiga una probabilid del 10% en el momento en el que choque la pelota blanca con un blockblue o blockred caiga un circulo chiquito que le de mas velocidad ala pelota blanca si el bloque blanco de abajo lo toca ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
haz a que aparezca aleatoriamente y añade musica
User prompt
haz que cuando destruyan el bloque azul salga un bloque rojo color fuerte neon
User prompt
ahora quiero que el bloque azul tenga el sonido de sonidodebloqueazul
User prompt
pero que esos bloques tengan colisiones y la bolita los pueda destruir
User prompt
quiero que por cada colision aparezca un nuevo bloque de color azul fuerte
User prompt
quita los bloques de colores
User prompt
pero no en ese sentido si no que tenga que romper varios bloques pero todos esos bloques cuenten como uno para que no de lag
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var AimLine = Container.expand(function () {
var self = Container.call(this);
var lineGraphics = self.attachAsset('aimLine', {
anchorX: 0.5,
anchorY: 0
});
return self;
});
var BlueBlock = Container.expand(function () {
var self = Container.call(this);
var blockGraphics = self.attachAsset('blueBlock', {
anchorX: 0.5,
anchorY: 0.5
});
return self;
});
var BouncingCircle = Container.expand(function () {
var self = Container.call(this);
var circleGraphics = self.attachAsset('bouncingCircle', {
anchorX: 0.5,
anchorY: 0.5
});
// Velocity properties
self.velocityX = 12;
self.velocityY = 10;
self.update = function () {
// Move the circle
self.x += self.velocityX;
self.y += self.velocityY;
// Check collision with blue blocks
for (var i = blocks.length - 1; i >= 0; i--) {
var block = blocks[i];
if (self.intersects(block)) {
// Play blue block sound
LK.getSound('sonidodebloqueazul').play();
// Update blue blocks score
blueBlocksScore++;
blueScoreText.setText('Blue: ' + blueBlocksScore);
// Spawn red block at random position with minimum distance from other blocks
var newRedBlock = game.addChild(new RedBlock());
var validPosition = false;
var attempts = 0;
while (!validPosition && attempts < 50) {
newRedBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
newRedBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
validPosition = true;
// Check distance from all existing blue blocks
for (var b = 0; b < blocks.length; b++) {
var existingBlock = blocks[b];
var dx = newRedBlock.x - existingBlock.x;
var dy = newRedBlock.y - existingBlock.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 200) {
// Minimum distance of 200 pixels
validPosition = false;
break;
}
}
// Check distance from all existing red blocks
for (var r = 0; r < redBlocks.length; r++) {
var existingRedBlock = redBlocks[r];
var dx = newRedBlock.x - existingRedBlock.x;
var dy = newRedBlock.y - existingRedBlock.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 200) {
// Minimum distance of 200 pixels
validPosition = false;
break;
}
}
attempts++;
}
redBlocks.push(newRedBlock);
// 10% chance to spawn power orb
if (Math.random() < 0.1) {
var powerOrb = game.addChild(new PowerOrb());
powerOrb.x = block.x;
powerOrb.y = block.y;
powerOrbs.push(powerOrb);
}
// Destroy the block
block.destroy();
blocks.splice(i, 1);
// Reverse ball Y velocity
self.velocityY = -self.velocityY;
break; // Only hit one block per frame
}
}
// Check collision with red blocks
for (var j = redBlocks.length - 1; j >= 0; j--) {
var redBlock = redBlocks[j];
if (self.intersects(redBlock)) {
// Update red blocks score
redBlocksScore++;
redScoreText.setText('Red: ' + redBlocksScore);
// 10% chance to spawn power orb
if (Math.random() < 0.1) {
var powerOrb = game.addChild(new PowerOrb());
powerOrb.x = redBlock.x;
powerOrb.y = redBlock.y;
powerOrbs.push(powerOrb);
}
// Destroy the red block
redBlock.destroy();
redBlocks.splice(j, 1);
// Reverse ball Y velocity
self.velocityY = -self.velocityY;
break; // Only hit one block per frame
}
}
// Bounce off screen edges
if (self.x <= 25) {
self.x = 25;
self.velocityX = -self.velocityX;
}
if (self.x >= 2048 - 25) {
self.x = 2048 - 25;
self.velocityX = -self.velocityX;
}
if (self.y <= 25) {
self.y = 25;
self.velocityY = -self.velocityY;
}
if (self.y >= 2732 - 25) {
self.y = 2732 - 25;
self.velocityY = -self.velocityY;
}
};
return self;
});
// Cache paddle constants
var Paddle = Container.expand(function () {
var self = Container.call(this);
var paddleGraphics = self.attachAsset('paddle', {
anchorX: 0.5,
anchorY: 0.5
});
self.update = function () {
// Prevent paddle from going through left wall
if (self.x < PADDLE_HALF_WIDTH) {
self.x = PADDLE_HALF_WIDTH;
}
// Prevent paddle from going through right wall
if (self.x > SCREEN_WIDTH - PADDLE_HALF_WIDTH) {
self.x = SCREEN_WIDTH - PADDLE_HALF_WIDTH;
}
};
return self;
});
var PowerOrb = Container.expand(function () {
var self = Container.call(this);
var orbGraphics = self.attachAsset('powerOrb', {
anchorX: 0.5,
anchorY: 0.5
});
// Fall downward
self.velocityY = 8;
self.update = function () {
self.y += self.velocityY;
// Remove if goes off screen
if (self.y > 2800) {
self.destroy();
// Remove from powerOrbs array
for (var i = powerOrbs.length - 1; i >= 0; i--) {
if (powerOrbs[i] === self) {
powerOrbs.splice(i, 1);
break;
}
}
}
};
return self;
});
var RedBlock = Container.expand(function () {
var self = Container.call(this);
var blockGraphics = self.attachAsset('redBlock', {
anchorX: 0.5,
anchorY: 0.5
});
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x2a2a2a
});
/****
* Game Code
****/
// Cache paddle constants
var PADDLE_HALF_WIDTH = 150;
var SCREEN_WIDTH = 2048;
var blocks = [];
var redBlocks = [];
var powerOrbs = [];
var blueBlocksScore = 0;
var redBlocksScore = 0;
var aimLines = [];
// Create score text for blue blocks
var blueScoreText = new Text2('Blue: 0', {
size: 60,
fill: 0x0066CC
});
blueScoreText.anchor.set(0.5, 0);
LK.gui.top.addChild(blueScoreText);
blueScoreText.x = -200;
blueScoreText.y = 60;
// Create score text for red blocks
var redScoreText = new Text2('Red: 0', {
size: 60,
fill: 0xFF0000
});
redScoreText.anchor.set(0.5, 0);
LK.gui.top.addChild(redScoreText);
redScoreText.x = 200;
redScoreText.y = 60;
var bouncingCircle = game.addChild(new BouncingCircle());
bouncingCircle.x = 1024;
bouncingCircle.y = 2550; // Position above paddle
bouncingCircle.lastIntersecting = false;
var paddle = game.addChild(new Paddle());
paddle.x = 1024;
paddle.y = 2600;
game.move = function (x, y, obj) {
paddle.x = x;
};
// Play background music
LK.playMusic('musica');
game.update = function () {
// Track ball-paddle collision state transitions
var currentIntersecting = bouncingCircle.intersects(paddle);
if (!bouncingCircle.lastIntersecting && currentIntersecting) {
// Collision just started - push ball above paddle and reverse Y velocity
bouncingCircle.y = paddle.y - 20 - 25;
bouncingCircle.velocityY = -Math.abs(bouncingCircle.velocityY);
// Spawn new blue block at random position with minimum distance from other blocks
var newBlock = game.addChild(new BlueBlock());
var validPosition = false;
var attempts = 0;
while (!validPosition && attempts < 50) {
newBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
newBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
validPosition = true;
// Check distance from all existing blue blocks
for (var b = 0; b < blocks.length; b++) {
var existingBlock = blocks[b];
var dx = newBlock.x - existingBlock.x;
var dy = newBlock.y - existingBlock.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 200) {
// Minimum distance of 200 pixels
validPosition = false;
break;
}
}
// Check distance from all existing red blocks
for (var r = 0; r < redBlocks.length; r++) {
var existingRedBlock = redBlocks[r];
var dx = newBlock.x - existingRedBlock.x;
var dy = newBlock.y - existingRedBlock.y;
var distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 200) {
// Minimum distance of 200 pixels
validPosition = false;
break;
}
}
attempts++;
}
blocks.push(newBlock);
}
bouncingCircle.lastIntersecting = currentIntersecting;
// Check power orb collisions with paddle
for (var k = powerOrbs.length - 1; k >= 0; k--) {
var powerOrb = powerOrbs[k];
if (powerOrb.intersects(paddle)) {
// Increase ball speed
var speedMultiplier = 1.5;
bouncingCircle.velocityX *= speedMultiplier;
bouncingCircle.velocityY *= speedMultiplier;
// Visual feedback - flash ball green
tween(bouncingCircle, {
tint: 0x00ff00
}, {
duration: 200,
onFinish: function onFinish() {
tween(bouncingCircle, {
tint: 0xffffff
}, {
duration: 200
});
}
});
// Remove power orb
powerOrb.destroy();
powerOrbs.splice(k, 1);
}
}
// Clear existing aim lines
for (var a = 0; a < aimLines.length; a++) {
aimLines[a].destroy();
}
aimLines = [];
// Create aim line trajectory visualization
var ballX = bouncingCircle.x;
var ballY = bouncingCircle.y;
var velX = bouncingCircle.velocityX;
var velY = bouncingCircle.velocityY;
// Simulate ball trajectory for aim line
var simX = ballX;
var simY = ballY;
var simVelX = velX;
var simVelY = velY;
for (var step = 0; step < 30; step++) {
// Create aim line segment
var aimLine = game.addChild(new AimLine());
aimLine.x = simX;
aimLine.y = simY;
aimLine.alpha = 0.6 - step * 0.02; // Fade out over distance
aimLines.push(aimLine);
// Simulate next position
simX += simVelX * 0.5;
simY += simVelY * 0.5;
// Simulate bounces off walls
if (simX <= 25 || simX >= 2048 - 25) {
simVelX = -simVelX;
}
if (simY <= 25) {
simVelY = -simVelY;
}
// Stop if ball would hit bottom
if (simY >= 2600) {
break;
}
}
// Check if ball hits bottom area (game over zone)
if (bouncingCircle.y >= 2700) {
LK.showGameOver();
return;
}
}; ===================================================================
--- original.js
+++ change.js
@@ -5,8 +5,16 @@
/****
* Classes
****/
+var AimLine = Container.expand(function () {
+ var self = Container.call(this);
+ var lineGraphics = self.attachAsset('aimLine', {
+ anchorX: 0.5,
+ anchorY: 0
+ });
+ return self;
+});
var BlueBlock = Container.expand(function () {
var self = Container.call(this);
var blockGraphics = self.attachAsset('blueBlock', {
anchorX: 0.5,
@@ -35,12 +43,42 @@
LK.getSound('sonidodebloqueazul').play();
// Update blue blocks score
blueBlocksScore++;
blueScoreText.setText('Blue: ' + blueBlocksScore);
- // Spawn red block at random position
+ // Spawn red block at random position with minimum distance from other blocks
var newRedBlock = game.addChild(new RedBlock());
- newRedBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
- newRedBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
+ var validPosition = false;
+ var attempts = 0;
+ while (!validPosition && attempts < 50) {
+ newRedBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
+ newRedBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
+ validPosition = true;
+ // Check distance from all existing blue blocks
+ for (var b = 0; b < blocks.length; b++) {
+ var existingBlock = blocks[b];
+ var dx = newRedBlock.x - existingBlock.x;
+ var dy = newRedBlock.y - existingBlock.y;
+ var distance = Math.sqrt(dx * dx + dy * dy);
+ if (distance < 200) {
+ // Minimum distance of 200 pixels
+ validPosition = false;
+ break;
+ }
+ }
+ // Check distance from all existing red blocks
+ for (var r = 0; r < redBlocks.length; r++) {
+ var existingRedBlock = redBlocks[r];
+ var dx = newRedBlock.x - existingRedBlock.x;
+ var dy = newRedBlock.y - existingRedBlock.y;
+ var distance = Math.sqrt(dx * dx + dy * dy);
+ if (distance < 200) {
+ // Minimum distance of 200 pixels
+ validPosition = false;
+ break;
+ }
+ }
+ attempts++;
+ }
redBlocks.push(newRedBlock);
// 10% chance to spawn power orb
if (Math.random() < 0.1) {
var powerOrb = game.addChild(new PowerOrb());
@@ -167,8 +205,9 @@
var redBlocks = [];
var powerOrbs = [];
var blueBlocksScore = 0;
var redBlocksScore = 0;
+var aimLines = [];
// Create score text for blue blocks
var blueScoreText = new Text2('Blue: 0', {
size: 60,
fill: 0x0066CC
@@ -204,12 +243,42 @@
if (!bouncingCircle.lastIntersecting && currentIntersecting) {
// Collision just started - push ball above paddle and reverse Y velocity
bouncingCircle.y = paddle.y - 20 - 25;
bouncingCircle.velocityY = -Math.abs(bouncingCircle.velocityY);
- // Spawn new blue block at random position
+ // Spawn new blue block at random position with minimum distance from other blocks
var newBlock = game.addChild(new BlueBlock());
- newBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
- newBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
+ var validPosition = false;
+ var attempts = 0;
+ while (!validPosition && attempts < 50) {
+ newBlock.x = Math.random() * (2048 - 120) + 60; // Random X within screen bounds
+ newBlock.y = Math.random() * 800 + 200; // Random Y in upper part of screen
+ validPosition = true;
+ // Check distance from all existing blue blocks
+ for (var b = 0; b < blocks.length; b++) {
+ var existingBlock = blocks[b];
+ var dx = newBlock.x - existingBlock.x;
+ var dy = newBlock.y - existingBlock.y;
+ var distance = Math.sqrt(dx * dx + dy * dy);
+ if (distance < 200) {
+ // Minimum distance of 200 pixels
+ validPosition = false;
+ break;
+ }
+ }
+ // Check distance from all existing red blocks
+ for (var r = 0; r < redBlocks.length; r++) {
+ var existingRedBlock = redBlocks[r];
+ var dx = newBlock.x - existingRedBlock.x;
+ var dy = newBlock.y - existingRedBlock.y;
+ var distance = Math.sqrt(dx * dx + dy * dy);
+ if (distance < 200) {
+ // Minimum distance of 200 pixels
+ validPosition = false;
+ break;
+ }
+ }
+ attempts++;
+ }
blocks.push(newBlock);
}
bouncingCircle.lastIntersecting = currentIntersecting;
// Check power orb collisions with paddle
@@ -237,8 +306,45 @@
powerOrb.destroy();
powerOrbs.splice(k, 1);
}
}
+ // Clear existing aim lines
+ for (var a = 0; a < aimLines.length; a++) {
+ aimLines[a].destroy();
+ }
+ aimLines = [];
+ // Create aim line trajectory visualization
+ var ballX = bouncingCircle.x;
+ var ballY = bouncingCircle.y;
+ var velX = bouncingCircle.velocityX;
+ var velY = bouncingCircle.velocityY;
+ // Simulate ball trajectory for aim line
+ var simX = ballX;
+ var simY = ballY;
+ var simVelX = velX;
+ var simVelY = velY;
+ for (var step = 0; step < 30; step++) {
+ // Create aim line segment
+ var aimLine = game.addChild(new AimLine());
+ aimLine.x = simX;
+ aimLine.y = simY;
+ aimLine.alpha = 0.6 - step * 0.02; // Fade out over distance
+ aimLines.push(aimLine);
+ // Simulate next position
+ simX += simVelX * 0.5;
+ simY += simVelY * 0.5;
+ // Simulate bounces off walls
+ if (simX <= 25 || simX >= 2048 - 25) {
+ simVelX = -simVelX;
+ }
+ if (simY <= 25) {
+ simVelY = -simVelY;
+ }
+ // Stop if ball would hit bottom
+ if (simY >= 2600) {
+ break;
+ }
+ }
// Check if ball hits bottom area (game over zone)
if (bouncingCircle.y >= 2700) {
LK.showGameOver();
return;
Sounds & Music
Used plugins
@upit/tween
