User prompt
It’s not shooting out the direction I’m pointing in
User prompt
When I turn the direction I’m shooting isn’t coming from the tip of the triangle
User prompt
It’s not shooting out of the right part and it’s not changing the direction where it shoots out when I turn
User prompt
Make longest tip of the triangle the front and where it shoots and the direction it moves
User prompt
Make the player slower and steering less sensitive and make the tip of the triangle the front
User prompt
Don’t make the buttons hollow and make it auto move forward forever
User prompt
The buttons don’t work and it’s still not moving forward
User prompt
The buttons don’t work and it’s constantly moving left
User prompt
Make my rocket ship a triangle shape and make it pixel art and all the stuff is hollow
User prompt
Make turning less sensitive and have it move ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Make the shoot one in the middle and left one on the left of the shoot and right on the right side and make them big
Code edit (1 edits merged)
Please save this source code
User prompt
Pixel Asteroid Blaster
Initial prompt
Make a game like asteroids game with the player that turns and has to shoot asteroids but make it black and white in pixel art and there buttons to turn and one to shoot
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1");
/****
* Classes
****/
var Asteroid = Container.expand(function (size) {
var self = Container.call(this);
// Size can be 0 (small), 1 (medium), or 2 (large)
self.size = size || 2;
// Create a container for the asteroid
var asteroidGraphics = new Container();
self.addChild(asteroidGraphics);
// Determine asteroid size
var radius;
if (self.size === 0) {
radius = 16; // small
} else if (self.size === 1) {
radius = 32; // medium
} else {
radius = 64; // large
}
// Create a pixel art circle (asteroid)
var pixelSize = 4; // Size of each "pixel"
var pixelGap = 1; // Gap between pixels for hollow effect
var steps = 16; // Number of points around the circle
// Draw a circle of pixels
for (var i = 0; i < steps; i++) {
var angle = i / steps * Math.PI * 2;
var px = Math.cos(angle) * radius;
var py = Math.sin(angle) * radius;
var pixel = LK.getAsset('asteroidLarge', {
anchorX: 0.5,
anchorY: 0.5,
width: pixelSize - pixelGap,
height: pixelSize - pixelGap,
x: px,
y: py
});
asteroidGraphics.addChild(pixel);
}
// Random velocity
var speed = (3 - self.size) * 0.8 + 0.5; // Smaller asteroids move faster
var angle = Math.random() * Math.PI * 2;
self.velocity = {
x: Math.cos(angle) * speed,
y: Math.sin(angle) * speed
};
// Random rotation
self.rotationSpeed = (Math.random() - 0.5) * 0.05;
self.update = function () {
// Move
self.x += self.velocity.x;
self.y += self.velocity.y;
// Rotate
asteroidGraphics.rotation += self.rotationSpeed;
// Wrap around screen edges
if (self.x < -50) {
self.x = 2098;
}
if (self.x > 2098) {
self.x = -50;
}
if (self.y < -50) {
self.y = 2782;
}
if (self.y > 2782) {
self.y = -50;
}
};
self.getPoints = function () {
return (3 - self.size) * 100; // Small: 300, Medium: 200, Large: 100
};
return self;
});
var Bullet = Container.expand(function () {
var self = Container.call(this);
// Create a container for pixel art bullet
var bulletGraphics = new Container();
self.addChild(bulletGraphics);
// Create a small pixel art square (bullet)
var bulletSize = 8;
var pixelSize = 2; // Size of each "pixel"
var pixelGap = 1; // Gap between pixels for hollow effect
// Draw the outline of the square
var points = [{
x: -bulletSize / 2,
y: -bulletSize / 2
},
// Top left
{
x: bulletSize / 2,
y: -bulletSize / 2
},
// Top right
{
x: bulletSize / 2,
y: bulletSize / 2
},
// Bottom right
{
x: -bulletSize / 2,
y: bulletSize / 2
} // Bottom left
];
// Draw the square outline
for (var i = 0; i < 4; i++) {
var startPoint = points[i];
var endPoint = points[(i + 1) % 4];
// Calculate steps
var dx = endPoint.x - startPoint.x;
var dy = endPoint.y - startPoint.y;
var steps = Math.max(Math.abs(dx), Math.abs(dy)) / pixelSize;
// Draw pixels along the line
for (var step = 0; step <= steps; step++) {
var px = startPoint.x + dx * (step / steps);
var py = startPoint.y + dy * (step / steps);
var pixel = LK.getAsset('bulletShape', {
anchorX: 0.5,
anchorY: 0.5,
width: pixelSize - pixelGap,
height: pixelSize - pixelGap,
x: px,
y: py
});
bulletGraphics.addChild(pixel);
}
}
self.speed = 10;
self.velocity = {
x: 0,
y: 0
};
self.lifespan = 60; // 1 second at 60fps
self.age = 0;
self.update = function () {
self.x += self.velocity.x;
self.y += self.velocity.y;
self.age++;
// Wrap around screen edges
if (self.x < 0) {
self.x = 2048;
}
if (self.x > 2048) {
self.x = 0;
}
if (self.y < 0) {
self.y = 2732;
}
if (self.y > 2732) {
self.y = 0;
}
};
return self;
});
var Button = Container.expand(function (assetId) {
var self = Container.call(this);
// Create button as a solid shape
var buttonGraphics = self.attachAsset(assetId, {
anchorX: 0.5,
anchorY: 0.5,
scaleX: 2,
scaleY: 2
});
buttonGraphics.alpha = 0.5;
// Determine button shape based on assetId
var isCircle = assetId === 'fireButton' || assetId === 'forwardButton';
var buttonSize = 60; // Radius or half-width
self.isPressed = false;
self.down = function (x, y, obj) {
self.isPressed = true;
buttonGraphics.alpha = 0.8;
};
self.up = function (x, y, obj) {
self.isPressed = false;
buttonGraphics.alpha = 0.5;
};
return self;
});
var Ship = Container.expand(function () {
var self = Container.call(this);
// Create a custom triangle ship
var shipGraphics = new Container();
self.addChild(shipGraphics);
// Create a pixel art triangle
var triangleSize = 48;
var pixelSize = 4; // Size of each "pixel"
var pixelGap = 1; // Gap between pixels for hollow effect
// Create triangle points - longest tip as front
var points = [{
x: triangleSize,
y: 0
},
// Right (now front)
{
x: -triangleSize / 2,
y: triangleSize / 2
},
// Bottom left
{
x: -triangleSize / 2,
y: -triangleSize / 2
} // Top left
];
// Draw the outline with pixel art style
for (var i = 0; i < 3; i++) {
var startPoint = points[i];
var endPoint = points[(i + 1) % 3];
// Calculate step count based on distance
var dx = endPoint.x - startPoint.x;
var dy = endPoint.y - startPoint.y;
var steps = Math.max(Math.abs(dx), Math.abs(dy)) / pixelSize;
// Draw pixels along the line
for (var step = 0; step <= steps; step++) {
var px = startPoint.x + dx * (step / steps);
var py = startPoint.y + dy * (step / steps);
var pixel = LK.getAsset('shipShape', {
anchorX: 0.5,
anchorY: 0.5,
width: pixelSize - pixelGap,
height: pixelSize - pixelGap,
x: px,
y: py
});
shipGraphics.addChild(pixel);
}
}
shipGraphics.x = 0;
shipGraphics.y = 0;
// Ship properties
self.rotation = 0;
self.rotationSpeed = 0.025; // Reduced further for even less sensitive turning
self.isRotatingLeft = false;
self.isRotatingRight = false;
self.isMoving = false;
self.isFiring = false;
self.fireDelay = 15; // frames between shots
self.fireTimer = 0;
self.invulnerable = false;
self.invulnerableTime = 0;
// Add movement properties
self.velocity = {
x: 0,
y: 0
};
self.maxSpeed = 3; // Reduced from 5 to make ship slower
self.thrust = 0.05; // Reduced from 0.1 to make acceleration slower
self.friction = 0.98; // Slow deceleration
self.update = function () {
// Handle rotation
if (self.isRotatingLeft) {
self.rotation -= self.rotationSpeed;
}
if (self.isRotatingRight) {
self.rotation += self.rotationSpeed;
}
shipGraphics.rotation = self.rotation;
// Always move forward automatically
var angle = self.rotation;
self.velocity.x += Math.cos(angle) * self.thrust;
self.velocity.y += Math.sin(angle) * self.thrust;
// Apply speed limit
var speed = Math.sqrt(self.velocity.x * self.velocity.x + self.velocity.y * self.velocity.y);
if (speed > self.maxSpeed) {
self.velocity.x = self.velocity.x / speed * self.maxSpeed;
self.velocity.y = self.velocity.y / speed * self.maxSpeed;
}
// Apply friction to slow down gradually
self.velocity.x *= self.friction;
self.velocity.y *= self.friction;
// Update position
self.x += self.velocity.x;
self.y += self.velocity.y;
// Wrap around screen edges
if (self.x < 0) {
self.x = 2048;
}
if (self.x > 2048) {
self.x = 0;
}
if (self.y < 0) {
self.y = 2732;
}
if (self.y > 2732) {
self.y = 0;
}
// Handle firing
if (self.isFiring) {
if (self.fireTimer <= 0) {
self.fireTimer = self.fireDelay;
return true; // Signal to create a bullet
}
}
if (self.fireTimer > 0) {
self.fireTimer--;
}
// Handle invulnerability
if (self.invulnerable) {
self.invulnerableTime--;
shipGraphics.alpha = Math.sin(LK.ticks * 0.5) * 0.5 + 0.5;
if (self.invulnerableTime <= 0) {
self.invulnerable = false;
shipGraphics.alpha = 1;
}
}
return false;
};
self.makeInvulnerable = function (frames) {
self.invulnerable = true;
self.invulnerableTime = frames;
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x000000
});
/****
* Game Code
****/
// Game variables
var ship;
var bullets = [];
var asteroids = [];
var score = 0;
var lives = 3;
var level = 1;
var gameStarted = false;
var gameOver = false;
var triangleSize = 48; // Ship triangle size for bullet positioning
// UI elements
var leftButton;
var rightButton;
var fireButton;
var scoreTxt;
var livesTxt;
var levelTxt;
var startText;
// Initialize the game
function initGame() {
// Create ship
ship = new Ship();
ship.x = 2048 / 2;
ship.y = 2732 / 2;
ship.makeInvulnerable(120); // 2 seconds
// Add visual effect to indicate ship is ready for movement
tween(ship, {
alpha: 0.5
}, {
duration: 500,
easing: tween.easeInOut,
onFinish: function onFinish() {
tween(ship, {
alpha: 1
}, {
duration: 500,
easing: tween.easeInOut
});
}
});
game.addChild(ship);
// Create control buttons
leftButton = new Button('rotateLeftButton');
leftButton.x = 300; // Position on the left side
leftButton.y = 2732 - 200; // Position at the bottom
leftButton.scale.set(2, 2); // Make button bigger
game.addChild(leftButton);
// Fire button in the middle
fireButton = new Button('fireButton');
fireButton.x = 2048 / 2; // Position in middle
fireButton.y = 2732 - 200; // Position at the bottom
fireButton.scale.set(2, 2); // Make button bigger
game.addChild(fireButton);
// No forward button needed - ship moves automatically
rightButton = new Button('rotateRightButton');
rightButton.x = 2048 - 300; // Position on the right side
rightButton.y = 2732 - 200; // Position at the bottom
rightButton.scale.set(2, 2); // Make button bigger
game.addChild(rightButton);
// Create UI text
scoreTxt = new Text2('SCORE: 0', {
size: 40,
fill: 0xFFFFFF
});
scoreTxt.anchor.set(0, 0);
LK.gui.topRight.addChild(scoreTxt);
livesTxt = new Text2('LIVES: 3', {
size: 40,
fill: 0xFFFFFF
});
livesTxt.anchor.set(0, 0);
LK.gui.top.addChild(livesTxt);
levelTxt = new Text2('LEVEL: 1', {
size: 40,
fill: 0xFFFFFF
});
levelTxt.anchor.set(1, 0);
LK.gui.topLeft.addChild(levelTxt);
// Start screen text
if (!gameStarted) {
startText = new Text2('TAP TO START', {
size: 80,
fill: 0xFFFFFF
});
startText.anchor.set(0.5, 0.5);
LK.gui.center.addChild(startText);
}
// Clear any existing game objects
bullets = [];
asteroids = [];
// Initialize asteroids for the first level
createAsteroidsForLevel(level);
// Start game music
LK.playMusic('gameMusic', {
loop: true
});
}
function createAsteroidsForLevel(level) {
// Number of asteroids based on level
var numAsteroids = Math.min(4 + level, 12);
for (var i = 0; i < numAsteroids; i++) {
var asteroid = new Asteroid(2); // Start with large asteroids
// Position the asteroid away from the player
do {
asteroid.x = Math.random() * 2048;
asteroid.y = Math.random() * 2732;
} while (distance(asteroid.x, asteroid.y, ship.x, ship.y) < 300);
asteroids.push(asteroid);
game.addChild(asteroid);
}
}
function distance(x1, y1, x2, y2) {
return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
}
function createBullet() {
var bullet = new Bullet();
// Calculate bullet starting position at the tip of the triangle
var angle = ship.rotation;
var offsetX = Math.cos(angle) * triangleSize;
var offsetY = Math.sin(angle) * triangleSize;
// Position bullet at the tip of the ship
bullet.x = ship.x + offsetX;
bullet.y = ship.y + offsetY;
// Calculate bullet velocity based on ship's rotation
bullet.velocity.x = Math.cos(angle) * bullet.speed;
bullet.velocity.y = Math.sin(angle) * bullet.speed;
bullets.push(bullet);
game.addChild(bullet);
// Play shoot sound
LK.getSound('shoot').play();
}
function updateAsteroids() {
for (var i = asteroids.length - 1; i >= 0; i--) {
var asteroid = asteroids[i];
asteroid.update();
// Check for collision with the ship
if (!ship.invulnerable && asteroid.intersects(ship)) {
// Player loses a life
lives--;
livesTxt.setText('LIVES: ' + lives);
// Play explosion sound
LK.getSound('explosion').play();
// Flash screen
LK.effects.flashScreen(0xFF0000, 500);
// Make ship invulnerable for a few seconds
ship.makeInvulnerable(180);
// Game over if no lives left
if (lives <= 0) {
LK.setScore(score);
LK.showGameOver();
gameOver = true;
return;
}
}
}
}
function updateBullets() {
for (var i = bullets.length - 1; i >= 0; i--) {
var bullet = bullets[i];
bullet.update();
// Remove bullets that have lived too long
if (bullet.age > bullet.lifespan) {
game.removeChild(bullet);
bullets.splice(i, 1);
continue;
}
// Check for collisions with asteroids
var hitAsteroid = false;
for (var j = asteroids.length - 1; j >= 0; j--) {
var asteroid = asteroids[j];
if (bullet.intersects(asteroid)) {
hitAsteroid = true;
// Add score based on asteroid size
score += asteroid.getPoints();
scoreTxt.setText('SCORE: ' + score);
// Play explosion sound
LK.getSound('explosion').play();
// Break asteroid into smaller pieces if it's not already the smallest
if (asteroid.size > 0) {
for (var k = 0; k < 2; k++) {
var newAsteroid = new Asteroid(asteroid.size - 1);
newAsteroid.x = asteroid.x;
newAsteroid.y = asteroid.y;
asteroids.push(newAsteroid);
game.addChild(newAsteroid);
}
}
// Remove the asteroid
game.removeChild(asteroid);
asteroids.splice(j, 1);
break;
}
}
if (hitAsteroid) {
// Remove the bullet
game.removeChild(bullet);
bullets.splice(i, 1);
}
}
// Check if all asteroids are destroyed
if (asteroids.length === 0) {
// Next level
level++;
levelTxt.setText('LEVEL: ' + level);
// Create new asteroids for the next level
createAsteroidsForLevel(level);
}
}
// Main game update function
game.update = function () {
if (!gameStarted) {
return;
}
// Update ship controls based on button state
ship.isRotatingLeft = leftButton.isPressed;
ship.isRotatingRight = rightButton.isPressed;
ship.isFiring = fireButton.isPressed;
ship.isMoving = true; // Always moving forward
// Update ship
if (ship.update()) {
createBullet();
}
// Update bullets and check for collisions
updateBullets();
// Update asteroids and check for collisions
updateAsteroids();
};
// Event handlers
game.down = function (x, y, obj) {
if (!gameStarted) {
gameStarted = true;
if (startText) {
LK.gui.center.removeChild(startText);
startText = null;
}
}
// Ensure buttons can detect touch events when pressed
var local;
// Check left button
local = leftButton.toLocal({
x: x,
y: y
});
if (local.x >= -leftButton.width / 2 && local.x <= leftButton.width / 2 && local.y >= -leftButton.height / 2 && local.y <= leftButton.height / 2) {
leftButton.down(local.x, local.y, {});
}
// Check fire button
local = fireButton.toLocal({
x: x,
y: y
});
if (local.x >= -fireButton.width / 2 && local.x <= fireButton.width / 2 && local.y >= -fireButton.height / 2 && local.y <= fireButton.height / 2) {
fireButton.down(local.x, local.y, {});
}
// Forward button removed - ship moves automatically
// Check right button
local = rightButton.toLocal({
x: x,
y: y
});
if (local.x >= -rightButton.width / 2 && local.x <= rightButton.width / 2 && local.y >= -rightButton.height / 2 && local.y <= rightButton.height / 2) {
rightButton.down(local.x, local.y, {});
}
};
// Add up handler to handle releasing buttons
game.up = function (x, y, obj) {
// Reset all button states when touch/click is released
leftButton.up(0, 0, {});
fireButton.up(0, 0, {});
rightButton.up(0, 0, {});
};
// Initialize the game when this script runs
initGame(); ===================================================================
--- original.js
+++ change.js
@@ -188,23 +188,23 @@
// Create a pixel art triangle
var triangleSize = 48;
var pixelSize = 4; // Size of each "pixel"
var pixelGap = 1; // Gap between pixels for hollow effect
- // Create triangle points - tip pointing toward movement direction
+ // Create triangle points - longest tip as front
var points = [{
- x: 0,
- y: -triangleSize / 2
+ x: triangleSize,
+ y: 0
},
- // Top (now front)
+ // Right (now front)
{
- x: triangleSize / 2,
+ x: -triangleSize / 2,
y: triangleSize / 2
},
- // Bottom right
+ // Bottom left
{
x: -triangleSize / 2,
- y: triangleSize / 2
- } // Bottom left
+ y: -triangleSize / 2
+ } // Top left
];
// Draw the outline with pixel art style
for (var i = 0; i < 3; i++) {
var startPoint = points[i];
@@ -333,8 +333,9 @@
var lives = 3;
var level = 1;
var gameStarted = false;
var gameOver = false;
+var triangleSize = 48; // Ship triangle size for bullet positioning
// UI elements
var leftButton;
var rightButton;
var fireButton;
@@ -439,13 +440,16 @@
return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
}
function createBullet() {
var bullet = new Bullet();
- // Position bullet at ship's position
- bullet.x = ship.x;
- bullet.y = ship.y;
- // Calculate bullet velocity based on ship's rotation
+ // Calculate bullet starting position at the tip of the triangle
var angle = ship.rotation;
+ var offsetX = Math.cos(angle) * triangleSize;
+ var offsetY = Math.sin(angle) * triangleSize;
+ // Position bullet at the tip of the ship
+ bullet.x = ship.x + offsetX;
+ bullet.y = ship.y + offsetY;
+ // Calculate bullet velocity based on ship's rotation
bullet.velocity.x = Math.cos(angle) * bullet.speed;
bullet.velocity.y = Math.sin(angle) * bullet.speed;
bullets.push(bullet);
game.addChild(bullet);