User prompt
Ok but I need many more roadlines going left and right so that we simulate the separation of lanes
User prompt
Loading Ok now I want you to add perspective to those roadlines. My road is like this / \ and the road lines are / | \ but the further they are from the bottom, the smaller they are. The closer they get to the bottom the bigger.
User prompt
Ok let the lines start a liiitle bit below 50% on y, like 200 pixels below
Code edit (1 edits merged)
Please save this source code
User prompt
All the roadline should start at that position when spawned! Also don't stop spawning road lines continuosly, but always starting from 50% 50%
User prompt
Ok the roadlines, should start on 50% x and 50% height of the screen and then go down
Code edit (1 edits merged)
Please save this source code
User prompt
Implement this, but using mypalm and roadline asset and applied to my game engine and how I have my game now // Create Palms const palms = []; for (let i = 0; i < 8; i++) { const palm = new PIXI.Sprite(palmTexture); palm.anchor.set(0.5, 0.5); palm.x = (i % 2 === 0 ? 200 : 568) + Math.random() * 20 - 10; // Left/right side palm.y = 100 + i * 80; // Staggered vertically palm.scale.set(1 - i * 0.07); // Smaller if farther palm.originalX = palm.x; palms.push(palm); palmGroup.addChild(palm); } // Create Road Lines const roadLines = []; for (let i = 0; i < 10; i++) { const line = new PIXI.Sprite(roadLineTexture); line.anchor.set(0.5, 0.5); line.x = app.screen.width / 2; line.y = i * 80; line.scale.set(0.5, 1); roadLines.push(line); roadLineGroup.addChild(line); } // Sway parameters let swayCounter = 0; // Animation loop - maybe in the update? app.ticker.add((delta) => { swayCounter += delta * 0.1; // Move palms palms.forEach((palm, index) => { palm.y += (index < 3 ? 3 : 1) * delta; // Close palms move faster palm.x = palm.originalX + Math.sin(swayCounter + index) * 5; // Sway effect // Reset palms if (palm.y > app.screen.height + 100) { palm.y = -100; palm.originalX = (index % 2 === 0 ? 200 : 568) + Math.random() * 20 - 10; palm.scale.set(1 - Math.random() * 0.3); } }); // Move road lines roadLines.forEach((line) => { line.y += 5 * delta; if (line.y > app.screen.height) { line.y = -20; } }); }); ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Create a "palmGroup" container and a "roadLineGroup" container
User prompt
Do it
User prompt
Remove the game over conditions
User prompt
Instead of using the trafficCar asset, select randomly one from: trafficCar, trafficCar1, trafficCar2 or trafficCar3
Code edit (2 edits merged)
Please save this source code
User prompt
Ok so the speed perception of the trafficCar is reverse. So what should happen is that the car goes slowly as it spawns but then the closer it is to the bottom the quicker it goes
Code edit (1 edits merged)
Please save this source code
User prompt
The speed of the traffic car should gop from slow to quicker as it progresses in its diagonal movement
Code edit (1 edits merged)
Please save this source code
User prompt
The x movement of the trafficCar is broken. I want them to go in diagonal from center to the specific targetX, but they will reach that targetX only when at the bottom of the screen, so should interpolate ↪💡 Consider importing and using the following plugins: @upit/tween.v1
Code edit (1 edits merged)
Please save this source code
User prompt
The final position of a trafficCar should be something either between 300 and 800 or (1200 and 1800)
User prompt
Change how you move the player car, just follow the mouse x position to move left or right, no click needed
Code edit (5 edits merged)
Please save this source code
User prompt
Scale the traffic cars double compared to how it is right now
User prompt
Don't spawn any more traffic cars untli the existing one has disappear
Code edit (1 edits merged)
Please save this source code
/**** * Plugins ****/ var tween = LK.import("@upit/tween.v1"); var storage = LK.import("@upit/storage.v1", { highScore: 0 }); /**** * Classes ****/ var PlayerCar = Container.expand(function () { var self = Container.call(this); var carGraphics = self.attachAsset('playerCar', { anchorX: 0.5, anchorY: 0.5 }); self.width = carGraphics.width; self.height = carGraphics.height; self.speed = 0; self.maxSpeed = 15; self.steering = 0; self.crashed = false; self.crash = function () { if (!self.crashed) { self.crashed = true; LK.getSound('crash').play(); LK.effects.flashObject(self, 0xFF0000, 1000); // Reduce speed on crash self.speed = Math.max(0, self.speed - 5); // Reset crash state after 1 second LK.setTimeout(function () { self.crashed = false; }, 1000); } }; self.update = function () { // Handle car physics if (!self.crashed) { self.speed = Math.min(self.maxSpeed, self.speed + 0.1); } // Apply steering if not crashed if (!self.crashed) { self.x += self.steering; } // Keep car within bounds if (self.x < self.width / 2) { self.x = self.width / 2; } if (self.x > 2048 - self.width / 2) { self.x = 2048 - self.width / 2; } }; return self; }); var TrafficCar = Container.expand(function () { var self = Container.call(this); var carGraphics = self.attachAsset('trafficCar', { anchorX: 0.5, anchorY: 0.5 }); self.width = carGraphics.width; self.height = carGraphics.height; self.speed = 5; self.direction = Math.random() > 0.5 ? 1 : -1; // Random direction: -1 = left, 1 = right self.startY = 2000; // Starting Y position (further up the screen) self.targetY = 2732 + self.height; // Y position when fully off-screen (bottom) self.initialScale = 0.1; self.targetScale = 1.0; self.directionX = 0; // Horizontal movement will be calculated in update // Set initial scale self.scale.set(self.initialScale); self.update = function () { // Calculate progress towards target Y var progress = (self.y - self.startY) / (self.targetY - self.startY); progress = Math.max(0, Math.min(1, progress)); // Clamp between 0 and 1 // Interpolate scale based on progress var currentScale = self.initialScale + (self.targetScale - self.initialScale) * progress; self.scale.set(currentScale); // Calculate horizontal movement based on progress and direction // As car gets closer to player, it moves more to the side self.directionX = self.direction * (2 + progress * 5); // Update position self.y += gameSpeed - self.speed; self.x += self.directionX; // Destroy if off screen if (self.y > self.targetY) { // Check against targetY self.destroy(); } }; return self; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x000000 }); /**** * Game Code ****/ // Game state variables var gameSpeed = 10; var gameStarted = false; var gameTime = 30; // Initial time in seconds var distance = 0; var level = 1; var checkpointDistance = 500; // Distance between checkpoints var nextCheckpointAt = checkpointDistance; var trafficCars = []; var obstacles = []; var checkpoints = []; var timeBonuses = []; var difficultyTimer; // Create road var road = LK.getAsset('road', { anchorX: 0.5, anchorY: 0.5, x: 2048 / 2, y: 2732 / 2 }); game.addChild(road); // Create player car var player = new PlayerCar(); player.x = 2048 / 2; player.y = 2732 - 300; game.addChild(player); // Create UI elements var timeText = new Text2('Time: 30', { size: 80, fill: 0xFFFFFF }); timeText.anchor.set(0, 0); LK.gui.topRight.addChild(timeText); timeText.x = -250; // Offset from right edge var scoreText = new Text2('Score: 0', { size: 80, fill: 0xFFFFFF }); scoreText.anchor.set(0, 0); LK.gui.top.addChild(scoreText); var levelText = new Text2('Level: 1', { size: 80, fill: 0xFFFFFF }); levelText.anchor.set(0, 0); LK.gui.topRight.addChild(levelText); levelText.y = 100; // Offset below time levelText.x = -250; // Offset from right edge var startText = new Text2('TAP TO START', { size: 120, fill: 0xFFFFFF }); startText.anchor.set(0.5, 0.5); LK.gui.center.addChild(startText); // Functions to spawn game elements function spawnTrafficCar() { var car = new TrafficCar(); car.x = 2048 / 2; // Start in the middle of the screen car.y = car.startY; // Start at the defined startY car.speed = 3 + Math.random() * 5; // Random speed trafficCars.push(car); game.addChild(car); // Schedule next car spawn based on difficulty var nextSpawnTime = 2000 - level * 100; nextSpawnTime = Math.max(nextSpawnTime, 500); // Minimum 0.5 seconds LK.setTimeout(spawnTrafficCar, nextSpawnTime); } // Start game function function startGame() { gameStarted = true; gameTime = 30; distance = 0; level = 1; gameSpeed = 10; nextCheckpointAt = checkpointDistance; LK.setScore(0); // Update UI scoreText.setText('Score: 0'); timeText.setText('Time: ' + Math.ceil(gameTime)); levelText.setText('Level: ' + level); // Remove start text LK.gui.center.removeChild(startText); // Start spawning game elements spawnTrafficCar(); // Set timer to increase difficulty difficultyTimer = LK.setInterval(function () { if (gameStarted) { level++; gameSpeed += 1; levelText.setText('Level: ' + level); } }, 30000); // Increase difficulty every 30 seconds // Play background music LK.playMusic('bgmusic'); } // Handle touch input game.down = function (x, y) { if (!gameStarted) { startGame(); return; } // Store starting touch position for steering game.lastTouchX = x; }; game.move = function (x, y) { if (!gameStarted || !game.lastTouchX) { return; } // Calculate steering based on touch movement var deltaX = x - game.lastTouchX; player.steering = deltaX * 0.2; // Scale down movement // Update last position game.lastTouchX = x; }; game.up = function () { if (gameStarted) { // Stop steering when touch ends player.steering = 0; game.lastTouchX = null; } }; // Main game update function game.update = function () { if (!gameStarted) { return; } // Update game time gameTime -= 1 / 60; // Assuming 60 FPS timeText.setText('Time: ' + Math.ceil(gameTime)); // Update distance if (gameStarted) { distance += gameSpeed; LK.setScore(Math.floor(distance / 10)); scoreText.setText('Score: ' + LK.getScore()); } // Check for game over if (gameTime <= 0) { endGame(); return; } // Check collisions with traffic cars for (var i = trafficCars.length - 1; i >= 0; i--) { var car = trafficCars[i]; if (player.intersects(car) && !player.crashed) { player.crash(); trafficCars.splice(i, 1); car.destroy(); } } }; function endGame() { if (!gameStarted) { return; } gameStarted = false; // Save high score if (LK.getScore() > storage.highScore) { storage.highScore = LK.getScore(); } // Clear any intervals LK.clearInterval(difficultyTimer); // Show game over LK.showGameOver(); }
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1", {
highScore: 0
});
/****
* Classes
****/
var PlayerCar = Container.expand(function () {
var self = Container.call(this);
var carGraphics = self.attachAsset('playerCar', {
anchorX: 0.5,
anchorY: 0.5
});
self.width = carGraphics.width;
self.height = carGraphics.height;
self.speed = 0;
self.maxSpeed = 15;
self.steering = 0;
self.crashed = false;
self.crash = function () {
if (!self.crashed) {
self.crashed = true;
LK.getSound('crash').play();
LK.effects.flashObject(self, 0xFF0000, 1000);
// Reduce speed on crash
self.speed = Math.max(0, self.speed - 5);
// Reset crash state after 1 second
LK.setTimeout(function () {
self.crashed = false;
}, 1000);
}
};
self.update = function () {
// Handle car physics
if (!self.crashed) {
self.speed = Math.min(self.maxSpeed, self.speed + 0.1);
}
// Apply steering if not crashed
if (!self.crashed) {
self.x += self.steering;
}
// Keep car within bounds
if (self.x < self.width / 2) {
self.x = self.width / 2;
}
if (self.x > 2048 - self.width / 2) {
self.x = 2048 - self.width / 2;
}
};
return self;
});
var TrafficCar = Container.expand(function () {
var self = Container.call(this);
var carGraphics = self.attachAsset('trafficCar', {
anchorX: 0.5,
anchorY: 0.5
});
self.width = carGraphics.width;
self.height = carGraphics.height;
self.speed = 5;
self.direction = Math.random() > 0.5 ? 1 : -1; // Random direction: -1 = left, 1 = right
self.startY = 2000; // Starting Y position (further up the screen)
self.targetY = 2732 + self.height; // Y position when fully off-screen (bottom)
self.initialScale = 0.1;
self.targetScale = 1.0;
self.directionX = 0; // Horizontal movement will be calculated in update
// Set initial scale
self.scale.set(self.initialScale);
self.update = function () {
// Calculate progress towards target Y
var progress = (self.y - self.startY) / (self.targetY - self.startY);
progress = Math.max(0, Math.min(1, progress)); // Clamp between 0 and 1
// Interpolate scale based on progress
var currentScale = self.initialScale + (self.targetScale - self.initialScale) * progress;
self.scale.set(currentScale);
// Calculate horizontal movement based on progress and direction
// As car gets closer to player, it moves more to the side
self.directionX = self.direction * (2 + progress * 5);
// Update position
self.y += gameSpeed - self.speed;
self.x += self.directionX;
// Destroy if off screen
if (self.y > self.targetY) {
// Check against targetY
self.destroy();
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x000000
});
/****
* Game Code
****/
// Game state variables
var gameSpeed = 10;
var gameStarted = false;
var gameTime = 30; // Initial time in seconds
var distance = 0;
var level = 1;
var checkpointDistance = 500; // Distance between checkpoints
var nextCheckpointAt = checkpointDistance;
var trafficCars = [];
var obstacles = [];
var checkpoints = [];
var timeBonuses = [];
var difficultyTimer;
// Create road
var road = LK.getAsset('road', {
anchorX: 0.5,
anchorY: 0.5,
x: 2048 / 2,
y: 2732 / 2
});
game.addChild(road);
// Create player car
var player = new PlayerCar();
player.x = 2048 / 2;
player.y = 2732 - 300;
game.addChild(player);
// Create UI elements
var timeText = new Text2('Time: 30', {
size: 80,
fill: 0xFFFFFF
});
timeText.anchor.set(0, 0);
LK.gui.topRight.addChild(timeText);
timeText.x = -250; // Offset from right edge
var scoreText = new Text2('Score: 0', {
size: 80,
fill: 0xFFFFFF
});
scoreText.anchor.set(0, 0);
LK.gui.top.addChild(scoreText);
var levelText = new Text2('Level: 1', {
size: 80,
fill: 0xFFFFFF
});
levelText.anchor.set(0, 0);
LK.gui.topRight.addChild(levelText);
levelText.y = 100; // Offset below time
levelText.x = -250; // Offset from right edge
var startText = new Text2('TAP TO START', {
size: 120,
fill: 0xFFFFFF
});
startText.anchor.set(0.5, 0.5);
LK.gui.center.addChild(startText);
// Functions to spawn game elements
function spawnTrafficCar() {
var car = new TrafficCar();
car.x = 2048 / 2; // Start in the middle of the screen
car.y = car.startY; // Start at the defined startY
car.speed = 3 + Math.random() * 5; // Random speed
trafficCars.push(car);
game.addChild(car);
// Schedule next car spawn based on difficulty
var nextSpawnTime = 2000 - level * 100;
nextSpawnTime = Math.max(nextSpawnTime, 500); // Minimum 0.5 seconds
LK.setTimeout(spawnTrafficCar, nextSpawnTime);
}
// Start game function
function startGame() {
gameStarted = true;
gameTime = 30;
distance = 0;
level = 1;
gameSpeed = 10;
nextCheckpointAt = checkpointDistance;
LK.setScore(0);
// Update UI
scoreText.setText('Score: 0');
timeText.setText('Time: ' + Math.ceil(gameTime));
levelText.setText('Level: ' + level);
// Remove start text
LK.gui.center.removeChild(startText);
// Start spawning game elements
spawnTrafficCar();
// Set timer to increase difficulty
difficultyTimer = LK.setInterval(function () {
if (gameStarted) {
level++;
gameSpeed += 1;
levelText.setText('Level: ' + level);
}
}, 30000); // Increase difficulty every 30 seconds
// Play background music
LK.playMusic('bgmusic');
}
// Handle touch input
game.down = function (x, y) {
if (!gameStarted) {
startGame();
return;
}
// Store starting touch position for steering
game.lastTouchX = x;
};
game.move = function (x, y) {
if (!gameStarted || !game.lastTouchX) {
return;
}
// Calculate steering based on touch movement
var deltaX = x - game.lastTouchX;
player.steering = deltaX * 0.2; // Scale down movement
// Update last position
game.lastTouchX = x;
};
game.up = function () {
if (gameStarted) {
// Stop steering when touch ends
player.steering = 0;
game.lastTouchX = null;
}
};
// Main game update function
game.update = function () {
if (!gameStarted) {
return;
}
// Update game time
gameTime -= 1 / 60; // Assuming 60 FPS
timeText.setText('Time: ' + Math.ceil(gameTime));
// Update distance
if (gameStarted) {
distance += gameSpeed;
LK.setScore(Math.floor(distance / 10));
scoreText.setText('Score: ' + LK.getScore());
}
// Check for game over
if (gameTime <= 0) {
endGame();
return;
}
// Check collisions with traffic cars
for (var i = trafficCars.length - 1; i >= 0; i--) {
var car = trafficCars[i];
if (player.intersects(car) && !player.crashed) {
player.crash();
trafficCars.splice(i, 1);
car.destroy();
}
}
};
function endGame() {
if (!gameStarted) {
return;
}
gameStarted = false;
// Save high score
if (LK.getScore() > storage.highScore) {
storage.highScore = LK.getScore();
}
// Clear any intervals
LK.clearInterval(difficultyTimer);
// Show game over
LK.showGameOver();
}