User prompt
make the grid 75% of the screen width
User prompt
``` function getBlockValue(type) { var values = { 'wood': 2, 'stone': 4, 'iron': 8, 'gold': 16, 'diamond': 32, 'emerald': 64, 'netherite': 128 }; return values[type] || 2; } ``` this should go up to 2048
User prompt
having the game in a browser makes swipping difficult because it also navigtes pages
User prompt
let scale up the gui a bit
Code edit (1 edits merged)
Please save this source code
User prompt
CraftMerge: Block Builder
Initial prompt
I want to build a 2048 style game that works similar to Minecraft building structures
/****
* Plugins
****/
var tween = LK.import("@upit/tween.v1");
/****
* Classes
****/
var Block = Container.expand(function (type) {
var self = Container.call(this);
self.type = type;
self.value = getBlockValue(type);
var blockGraphics = self.attachAsset(type, {
anchorX: 0.5,
anchorY: 0.5
});
var blockText = new Text2(self.value.toString(), {
size: 30,
fill: 0xFFFFFF
});
blockText.anchor.set(0.5, 0.5);
self.addChild(blockText);
self.setType = function (newType) {
self.type = newType;
self.value = getBlockValue(newType);
self.removeChild(blockGraphics);
blockGraphics = self.attachAsset(newType, {
anchorX: 0.5,
anchorY: 0.5
});
blockText.setText(self.value.toString());
};
return self;
});
var GridCell = Container.expand(function () {
var self = Container.call(this);
var cellGraphics = self.attachAsset('gridCell', {
anchorX: 0.5,
anchorY: 0.5
});
self.block = null;
self.setBlock = function (block) {
if (self.block) {
self.removeChild(self.block);
}
self.block = block;
if (block) {
self.addChild(block);
block.x = 0;
block.y = 0;
}
};
self.hasBlock = function () {
return self.block !== null;
};
self.clearBlock = function () {
if (self.block) {
self.removeChild(self.block);
self.block = null;
}
};
return self;
});
/****
* Initialize Game
****/
var game = new LK.Game({
backgroundColor: 0x2F4F2F
});
/****
* Game Code
****/
var GRID_SIZE = 4;
var CELL_SIZE = 150;
var CELL_SPACING = 160;
var blockTypes = ['wood', 'stone', 'iron', 'gold', 'diamond', 'emerald', 'netherite'];
var grid = [];
var isMoving = false;
var gameOver = false;
function getBlockValue(type) {
var values = {
'wood': 2,
'stone': 4,
'iron': 8,
'gold': 16,
'diamond': 32,
'emerald': 64,
'netherite': 128
};
return values[type] || 2;
}
function getNextBlockType(currentType) {
var index = blockTypes.indexOf(currentType);
if (index < blockTypes.length - 1) {
return blockTypes[index + 1];
}
return currentType;
}
function getRandomBlockType() {
var types = ['wood', 'wood', 'wood', 'stone', 'stone', 'iron'];
return types[Math.floor(Math.random() * types.length)];
}
// Create grid
var gridContainer = new Container();
game.addChild(gridContainer);
for (var row = 0; row < GRID_SIZE; row++) {
grid[row] = [];
for (var col = 0; col < GRID_SIZE; col++) {
var cell = new GridCell();
cell.x = col * CELL_SPACING;
cell.y = row * CELL_SPACING;
gridContainer.addChild(cell);
grid[row][col] = cell;
}
}
// Center grid
gridContainer.x = (2048 - (GRID_SIZE - 1) * CELL_SPACING) / 2;
gridContainer.y = (2732 - (GRID_SIZE - 1) * CELL_SPACING) / 2;
// Score display
var scoreTxt = new Text2('Score: 0', {
size: 80,
fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
scoreTxt.y = 100;
// Game over text
var gameOverTxt = new Text2('Game Over!', {
size: 120,
fill: 0xFF0000
});
gameOverTxt.anchor.set(0.5, 0.5);
gameOverTxt.visible = false;
LK.gui.center.addChild(gameOverTxt);
function addRandomBlock() {
var emptyCells = [];
for (var row = 0; row < GRID_SIZE; row++) {
for (var col = 0; col < GRID_SIZE; col++) {
if (!grid[row][col].hasBlock()) {
emptyCells.push({
row: row,
col: col
});
}
}
}
if (emptyCells.length > 0) {
var randomCell = emptyCells[Math.floor(Math.random() * emptyCells.length)];
var newBlock = new Block(getRandomBlockType());
grid[randomCell.row][randomCell.col].setBlock(newBlock);
// Scale animation
newBlock.scaleX = 0;
newBlock.scaleY = 0;
tween(newBlock, {
scaleX: 1,
scaleY: 1
}, {
duration: 200,
easing: tween.easeOut
});
}
}
function canMove() {
// Check if any moves are possible
for (var row = 0; row < GRID_SIZE; row++) {
for (var col = 0; col < GRID_SIZE; col++) {
if (!grid[row][col].hasBlock()) {
return true;
}
var currentBlock = grid[row][col].block;
// Check adjacent cells for possible merges
var directions = [{
dr: 0,
dc: 1
}, {
dr: 0,
dc: -1
}, {
dr: 1,
dc: 0
}, {
dr: -1,
dc: 0
}];
for (var d = 0; d < directions.length; d++) {
var newRow = row + directions[d].dr;
var newCol = col + directions[d].dc;
if (newRow >= 0 && newRow < GRID_SIZE && newCol >= 0 && newCol < GRID_SIZE) {
var adjacentCell = grid[newRow][newCol];
if (!adjacentCell.hasBlock() || adjacentCell.block.type === currentBlock.type) {
return true;
}
}
}
}
}
return false;
}
function slideBlocks(direction) {
if (isMoving || gameOver) return;
var moved = false;
var merged = [];
// Initialize merged array
for (var row = 0; row < GRID_SIZE; row++) {
merged[row] = [];
for (var col = 0; col < GRID_SIZE; col++) {
merged[row][col] = false;
}
}
isMoving = true;
if (direction === 'left' || direction === 'right') {
for (var row = 0; row < GRID_SIZE; row++) {
var line = [];
var positions = [];
// Extract blocks from row
if (direction === 'left') {
for (var col = 0; col < GRID_SIZE; col++) {
if (grid[row][col].hasBlock()) {
line.push(grid[row][col].block);
positions.push(col);
grid[row][col].clearBlock();
}
}
} else {
for (var col = GRID_SIZE - 1; col >= 0; col--) {
if (grid[row][col].hasBlock()) {
line.push(grid[row][col].block);
positions.push(col);
grid[row][col].clearBlock();
}
}
}
// Merge identical adjacent blocks
for (var i = 0; i < line.length - 1; i++) {
if (line[i] && line[i + 1] && line[i].type === line[i + 1].type) {
var nextType = getNextBlockType(line[i].type);
line[i].setType(nextType);
LK.setScore(LK.getScore() + getBlockValue(nextType));
line[i + 1].destroy();
line[i + 1] = null;
moved = true;
LK.getSound('merge').play();
}
}
// Remove null elements
line = line.filter(function (block) {
return block !== null;
});
// Place blocks back
if (direction === 'left') {
for (var i = 0; i < line.length; i++) {
grid[row][i].setBlock(line[i]);
if (positions[i] !== i) moved = true;
}
} else {
for (var i = 0; i < line.length; i++) {
grid[row][GRID_SIZE - 1 - i].setBlock(line[i]);
if (positions[i] !== GRID_SIZE - 1 - i) moved = true;
}
}
}
} else {
for (var col = 0; col < GRID_SIZE; col++) {
var line = [];
var positions = [];
// Extract blocks from column
if (direction === 'up') {
for (var row = 0; row < GRID_SIZE; row++) {
if (grid[row][col].hasBlock()) {
line.push(grid[row][col].block);
positions.push(row);
grid[row][col].clearBlock();
}
}
} else {
for (var row = GRID_SIZE - 1; row >= 0; row--) {
if (grid[row][col].hasBlock()) {
line.push(grid[row][col].block);
positions.push(row);
grid[row][col].clearBlock();
}
}
}
// Merge identical adjacent blocks
for (var i = 0; i < line.length - 1; i++) {
if (line[i] && line[i + 1] && line[i].type === line[i + 1].type) {
var nextType = getNextBlockType(line[i].type);
line[i].setType(nextType);
LK.setScore(LK.getScore() + getBlockValue(nextType));
line[i + 1].destroy();
line[i + 1] = null;
moved = true;
LK.getSound('merge').play();
}
}
// Remove null elements
line = line.filter(function (block) {
return block !== null;
});
// Place blocks back
if (direction === 'up') {
for (var i = 0; i < line.length; i++) {
grid[i][col].setBlock(line[i]);
if (positions[i] !== i) moved = true;
}
} else {
for (var i = 0; i < line.length; i++) {
grid[GRID_SIZE - 1 - i][col].setBlock(line[i]);
if (positions[i] !== GRID_SIZE - 1 - i) moved = true;
}
}
}
}
if (moved) {
LK.getSound('slide').play();
scoreTxt.setText('Score: ' + LK.getScore());
LK.setTimeout(function () {
addRandomBlock();
if (!canMove()) {
gameOver = true;
gameOverTxt.visible = true;
LK.setTimeout(function () {
LK.showGameOver();
}, 1500);
}
isMoving = false;
}, 100);
} else {
isMoving = false;
}
}
var startX = 0;
var startY = 0;
var isDragging = false;
game.down = function (x, y, obj) {
startX = x;
startY = y;
isDragging = true;
};
game.up = function (x, y, obj) {
if (!isDragging) return;
var deltaX = x - startX;
var deltaY = y - startY;
var threshold = 50;
if (Math.abs(deltaX) > Math.abs(deltaY) && Math.abs(deltaX) > threshold) {
if (deltaX > 0) {
slideBlocks('right');
} else {
slideBlocks('left');
}
} else if (Math.abs(deltaY) > threshold) {
if (deltaY > 0) {
slideBlocks('down');
} else {
slideBlocks('up');
}
}
isDragging = false;
};
// Initialize with two random blocks
addRandomBlock();
addRandomBlock();
game.update = function () {
// Game logic is handled by events
}; ===================================================================
--- original.js
+++ change.js
@@ -14,9 +14,9 @@
anchorX: 0.5,
anchorY: 0.5
});
var blockText = new Text2(self.value.toString(), {
- size: 20,
+ size: 30,
fill: 0xFFFFFF
});
blockText.anchor.set(0.5, 0.5);
self.addChild(blockText);
@@ -119,17 +119,17 @@
gridContainer.x = (2048 - (GRID_SIZE - 1) * CELL_SPACING) / 2;
gridContainer.y = (2732 - (GRID_SIZE - 1) * CELL_SPACING) / 2;
// Score display
var scoreTxt = new Text2('Score: 0', {
- size: 60,
+ size: 80,
fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreTxt);
scoreTxt.y = 100;
// Game over text
var gameOverTxt = new Text2('Game Over!', {
- size: 80,
+ size: 120,
fill: 0xFF0000
});
gameOverTxt.anchor.set(0.5, 0.5);
gameOverTxt.visible = false;