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 data: 0 = floor, 1 = wall, 2 = exit, 3 = item
// 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]];
// --- 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,15 +88,8 @@
/****
* Game Code
****/
-// --- MAP CONFIGURATION ---
-// Shapes for player, floor, wall, exit, item, fog, and arrow buttons
-var MAP_WIDTH = 9;
-var MAP_HEIGHT = 11;
-var TILE_SIZE = 160;
-var MAP_OFFSET_X = Math.floor((2048 - MAP_WIDTH * TILE_SIZE) / 2);
-var MAP_OFFSET_Y = 320; // leave space for GUI at top
// Map data: 0 = floor, 1 = wall, 2 = exit, 3 = item
// 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]];
// --- GLOBALS ---