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: 20,
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: 60,
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,
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
@@ -1,6 +1,367 @@
-/****
+/****
+* 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: 20,
+ 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: 0x000000
-});
\ No newline at end of file
+ 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: 60,
+ 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,
+ 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
+};
\ No newline at end of file