User prompt
Move up higher and make smaller
User prompt
Move them up a bit
User prompt
Move the controls to follow the player too just put them in the bottom of screen
User prompt
Fix the buttons
User prompt
Make the camera view move with the player
User prompt
Please fix the bug: 'Can't find variable: MAP_HEIGHT' in or related to this line: 'for (var y = 0; y < MAP_HEIGHT; y++) {' Line Number: 137
User prompt
Please fix the bug: 'Can't find variable: MAP_HEIGHT' in or related to this line: 'for (var y = 0; y < MAP_HEIGHT; y++) {' Line Number: 138
User prompt
Make the map random gen and big and 5 items
User prompt
Add 4 buttons to move with
User prompt
move the buttons to the middle
User prompt
no you moved them the wrong way go the other
User prompt
the buttons are off the screen move them to the bottom middle
Code edit (1 edits merged)
Please save this source code
User prompt
Stellar Shadows: Space Puzzle Explorer
Initial prompt
A 2D puzzle game in space featuring limited vision. Also add 4 buttons for forward backward left right with arrows as an icon and you use those for movement. Also make sure that the buttons are visible.
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
// Fog tile (covers unseen areas)
var FogTile = Container.expand(function () {
var self = Container.call(this);
self.asset = self.attachAsset('fog', {
anchorX: 0.5,
anchorY: 0.5
});
self.alpha = 0.92;
return self;
});
// MapTile: floor, wall, exit, item
var MapTile = Container.expand(function () {
var self = Container.call(this);
self.type = 'floor'; // default
self.asset = null;
self.xIndex = 0;
self.yIndex = 0;
self.hasItem = false;
self.itemAsset = null;
self.isExit = false;
self.setType = function (type) {
self.type = type;
if (self.asset) {
self.removeChild(self.asset);
}
if (type === 'floor') {
self.asset = self.attachAsset('floor', {
anchorX: 0.5,
anchorY: 0.5
});
} else if (type === 'wall') {
self.asset = self.attachAsset('wall', {
anchorX: 0.5,
anchorY: 0.5
});
} else if (type === 'exit') {
self.asset = self.attachAsset('exit', {
anchorX: 0.5,
anchorY: 0.5
});
self.isExit = true;
}
};
self.placeItem = function () {
self.hasItem = true;
if (!self.itemAsset) {
self.itemAsset = self.attachAsset('item', {
anchorX: 0.5,
anchorY: 0.5
});
}
};
self.removeItem = function () {
self.hasItem = false;
if (self.itemAsset) {
self.removeChild(self.itemAsset);
self.itemAsset = null;
}
};
return self;
});
// Player class
var Player = Container.expand(function () {
var self = Container.call(this);
self.asset = self.attachAsset('player', {
anchorX: 0.5,
anchorY: 0.5
});
self.xIndex = 0;
self.yIndex = 0;
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x000000
});
/****
* Game Code
****/
// Map generation constants
var MAP_WIDTH = 20;
var MAP_HEIGHT = 15;
var TILE_SIZE = 160;
var MAP_OFFSET_X = (2048 - MAP_WIDTH * TILE_SIZE) / 2;
var MAP_OFFSET_Y = 200;
// Generate random map
function generateRandomMap() {
var map = [];
// Initialize with walls
for (var y = 0; y < MAP_HEIGHT; y++) {
map[y] = [];
for (var x = 0; x < MAP_WIDTH; x++) {
map[y][x] = 1; // wall
}
}
// Create random rooms and corridors
for (var y = 1; y < MAP_HEIGHT - 1; y += 2) {
for (var x = 1; x < MAP_WIDTH - 1; x += 2) {
map[y][x] = 0; // floor
// Random corridors
if (Math.random() < 0.6 && x + 2 < MAP_WIDTH - 1) {
map[y][x + 1] = 0; // horizontal corridor
}
if (Math.random() < 0.6 && y + 2 < MAP_HEIGHT - 1) {
map[y + 1][x] = 0; // vertical corridor
}
}
}
// Place exit
var exitX = MAP_WIDTH - 2;
var exitY = MAP_HEIGHT - 2;
map[exitY][exitX] = 2; // exit
// Place 5 items randomly on floor tiles
var itemsPlaced = 0;
while (itemsPlaced < 5) {
var randX = Math.floor(Math.random() * (MAP_WIDTH - 2)) + 1;
var randY = Math.floor(Math.random() * (MAP_HEIGHT - 2)) + 1;
if (map[randY][randX] === 0 && !(randX === 1 && randY === 1)) {
map[randY][randX] = 3; // item
itemsPlaced++;
}
}
return map;
}
var mapData = generateRandomMap();
// --- GLOBALS ---
var mapTiles = []; // 2D array of MapTile
var fogTiles = []; // 2D array of FogTile
var player = null;
var playerStart = {
x: 1,
y: 1
};
var exitPos = {
x: 7,
y: 9
};
var itemsTotal = 0;
var itemsCollected = 0;
var visionRadius = 1.5; // tiles
var moveLock = false; // prevent double moves
var arrowButtons = {};
var lastPlayerPos = {
x: 1,
y: 1
};
// --- GUI ---
var itemsTxt = new Text2('Items: 0/0', {
size: 90,
fill: "#fff"
});
itemsTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(itemsTxt);
// --- MAP GENERATION ---
for (var y = 0; y < MAP_HEIGHT; y++) {
mapTiles[y] = [];
fogTiles[y] = [];
for (var x = 0; x < MAP_WIDTH; x++) {
var tile = new MapTile();
tile.xIndex = x;
tile.yIndex = y;
var type = mapData[y][x];
if (type === 1) {
tile.setType('wall');
} else if (type === 2) {
tile.setType('exit');
exitPos.x = x;
exitPos.y = y;
} else {
tile.setType('floor');
}
if (type === 3) {
tile.placeItem();
itemsTotal++;
}
tile.x = MAP_OFFSET_X + x * TILE_SIZE + TILE_SIZE / 2;
tile.y = MAP_OFFSET_Y + y * TILE_SIZE + TILE_SIZE / 2;
game.addChild(tile);
mapTiles[y][x] = tile;
// Fog
var fog = new FogTile();
fog.x = tile.x;
fog.y = tile.y;
game.addChild(fog);
fogTiles[y][x] = fog;
}
}
itemsTxt.setText('Items: 0/' + itemsTotal);
// --- PLAYER ---
player = new Player();
player.xIndex = playerStart.x;
player.yIndex = playerStart.y;
player.x = MAP_OFFSET_X + player.xIndex * TILE_SIZE + TILE_SIZE / 2;
player.y = MAP_OFFSET_Y + player.yIndex * TILE_SIZE + TILE_SIZE / 2;
game.addChild(player);
// --- FOG OF WAR ---
function updateFog() {
for (var y = 0; y < MAP_HEIGHT; y++) {
for (var x = 0; x < MAP_WIDTH; x++) {
var dx = x - player.xIndex;
var dy = y - player.yIndex;
var dist = Math.sqrt(dx * dx + dy * dy);
if (dist <= visionRadius) {
// Reveal
fogTiles[y][x].alpha = 0;
} else if (dist <= visionRadius + 1) {
// Faded memory
fogTiles[y][x].alpha = 0.5;
} else {
// Full fog
fogTiles[y][x].alpha = 0.92;
}
}
}
}
updateFog();
// --- MOVEMENT LOGIC ---
function canMoveTo(x, y) {
if (x < 0 || x >= MAP_WIDTH || y < 0 || y >= MAP_HEIGHT) return false;
var tile = mapTiles[y][x];
if (tile.type === 'wall') return false;
return true;
}
function movePlayer(dx, dy) {
if (moveLock) return;
var nx = player.xIndex + dx;
var ny = player.yIndex + dy;
if (!canMoveTo(nx, ny)) {
// Bump animation
var bumpX = player.x + dx * 20;
var bumpY = player.y + dy * 20;
moveLock = true;
tween(player, {
x: bumpX,
y: bumpY
}, {
duration: 80,
easing: tween.easeOut,
onFinish: function onFinish() {
tween(player, {
x: MAP_OFFSET_X + player.xIndex * TILE_SIZE + TILE_SIZE / 2,
y: MAP_OFFSET_Y + player.yIndex * TILE_SIZE + TILE_SIZE / 2
}, {
duration: 80,
onFinish: function onFinish() {
moveLock = false;
}
});
}
});
return;
}
lastPlayerPos.x = player.xIndex;
lastPlayerPos.y = player.yIndex;
player.xIndex = nx;
player.yIndex = ny;
moveLock = true;
tween(player, {
x: MAP_OFFSET_X + nx * TILE_SIZE + TILE_SIZE / 2,
y: MAP_OFFSET_Y + ny * TILE_SIZE + TILE_SIZE / 2
}, {
duration: 120,
easing: tween.easeInOut,
onFinish: function onFinish() {
moveLock = false;
afterMove();
}
});
updateFog();
}
function afterMove() {
// Check for item
var tile = mapTiles[player.yIndex][player.xIndex];
if (tile.hasItem) {
tile.removeItem();
itemsCollected++;
itemsTxt.setText('Items: ' + itemsCollected + '/' + itemsTotal);
LK.effects.flashObject(player, 0xffe066, 400);
}
// Check for exit
if (tile.isExit) {
if (itemsCollected >= itemsTotal) {
LK.showYouWin();
} else {
// Flash exit red if not all items collected
LK.effects.flashObject(tile, 0xff0000, 400);
}
}
}
// --- ARROW BUTTONS ---
function createArrowButton(id, x, y, rotation, moveFn) {
var btn = LK.getAsset(id, {
anchorX: 0.5,
anchorY: 0.5
});
btn.x = x;
btn.y = y;
btn.scaleX = 1.2;
btn.scaleY = 1.2;
btn.rotation = rotation;
btn.alpha = 0.9;
btn.interactive = true;
btn.down = function () {
moveFn();
};
game.addChild(btn);
return btn;
}
// Place arrow buttons at bottom center of screen, arranged in a D-pad layout
var btnCenterX = 2048 / 2;
var btnCenterY = 2732 - 250; // Position near bottom for easy access
var btnSpacing = 200; // spacing between buttons
arrowButtons.up = createArrowButton('arrowUp', btnCenterX, btnCenterY - btnSpacing, 0, function () {
movePlayer(0, -1);
});
arrowButtons.down = createArrowButton('arrowDown', btnCenterX, btnCenterY + btnSpacing, Math.PI, function () {
movePlayer(0, 1);
});
arrowButtons.left = createArrowButton('arrowLeft', btnCenterX - btnSpacing, btnCenterY, -Math.PI / 2, function () {
movePlayer(-1, 0);
});
arrowButtons.right = createArrowButton('arrowRight', btnCenterX + btnSpacing, btnCenterY, Math.PI / 2, function () {
movePlayer(1, 0);
});
// --- TOUCH DRAG MOVEMENT (OPTIONAL) ---
// For MVP, only arrow buttons. (No swipe/drag movement.)
// --- GAME UPDATE ---
game.update = function () {
// No per-frame logic needed for MVP
};
// --- GAME OVER HANDLING ---
// Handled by LK.showYouWin()
// --- INITIAL FOG UPDATE ---
updateFog(); ===================================================================
--- original.js
+++ change.js
@@ -88,10 +88,54 @@
/****
* Game Code
****/
-// Simple static map for MVP
-var mapData = [[1, 1, 1, 1, 1, 1, 1, 1, 1], [1, 0, 0, 0, 1, 0, 0, 3, 1], [1, 0, 1, 0, 1, 0, 1, 0, 1], [1, 0, 1, 0, 0, 0, 1, 0, 1], [1, 0, 1, 1, 1, 0, 1, 0, 1], [1, 0, 0, 0, 1, 0, 0, 0, 1], [1, 1, 1, 0, 1, 1, 1, 0, 1], [1, 3, 0, 0, 0, 0, 1, 0, 1], [1, 0, 1, 1, 1, 0, 1, 0, 1], [1, 0, 0, 0, 1, 0, 0, 2, 1], [1, 1, 1, 1, 1, 1, 1, 1, 1]];
+// Map generation constants
+var MAP_WIDTH = 20;
+var MAP_HEIGHT = 15;
+var TILE_SIZE = 160;
+var MAP_OFFSET_X = (2048 - MAP_WIDTH * TILE_SIZE) / 2;
+var MAP_OFFSET_Y = 200;
+// Generate random map
+function generateRandomMap() {
+ var map = [];
+ // Initialize with walls
+ for (var y = 0; y < MAP_HEIGHT; y++) {
+ map[y] = [];
+ for (var x = 0; x < MAP_WIDTH; x++) {
+ map[y][x] = 1; // wall
+ }
+ }
+ // Create random rooms and corridors
+ for (var y = 1; y < MAP_HEIGHT - 1; y += 2) {
+ for (var x = 1; x < MAP_WIDTH - 1; x += 2) {
+ map[y][x] = 0; // floor
+ // Random corridors
+ if (Math.random() < 0.6 && x + 2 < MAP_WIDTH - 1) {
+ map[y][x + 1] = 0; // horizontal corridor
+ }
+ if (Math.random() < 0.6 && y + 2 < MAP_HEIGHT - 1) {
+ map[y + 1][x] = 0; // vertical corridor
+ }
+ }
+ }
+ // Place exit
+ var exitX = MAP_WIDTH - 2;
+ var exitY = MAP_HEIGHT - 2;
+ map[exitY][exitX] = 2; // exit
+ // Place 5 items randomly on floor tiles
+ var itemsPlaced = 0;
+ while (itemsPlaced < 5) {
+ var randX = Math.floor(Math.random() * (MAP_WIDTH - 2)) + 1;
+ var randY = Math.floor(Math.random() * (MAP_HEIGHT - 2)) + 1;
+ if (map[randY][randX] === 0 && !(randX === 1 && randY === 1)) {
+ map[randY][randX] = 3; // item
+ itemsPlaced++;
+ }
+ }
+ return map;
+}
+var mapData = generateRandomMap();
// --- GLOBALS ---
var mapTiles = []; // 2D array of MapTile
var fogTiles = []; // 2D array of FogTile
var player = null;