User prompt
Add particles to the game that spawns from each cell that is destroyed
User prompt
adjust z-index to show first the firts cell created
User prompt
when new cells are created they should push each other downwards
User prompt
new cell should not stay in the topmost grid position
User prompt
new created cells should move downwards the same way all cells do
Code edit (1 edits merged)
Please save this source code
User prompt
New cells should drop to the botomost position of that column
User prompt
Fix Bug: 'RangeError: Maximum call stack size exceeded' in this line: 'self.moveToEmptySpace();' Line Number: 224
User prompt
First new cell to spawn in the screen on the top layer should move to the space free closer to the bottom of the screen
User prompt
Fix Bug: 'ReferenceError: col is not defined' in this line: 'if (self.previewCells[col]) {' Line Number: 134
User prompt
Show preview of new cells on top
User prompt
Invert order of new cells falling
User prompt
Bring to front first cell created
User prompt
Cell that appears first in the screen should go down first to find empty space
User prompt
Fix Bug: 'Timeout.tick error: Cannot set properties of undefined (setting '0')' in this line: 'grid[col][0] = newCell;' Line Number: 219
User prompt
New cells that appear should go down with a 1 tenth of a second interval
User prompt
The dot that is show in screen should go down first in move to empty space
User prompt
When new cells drop, make sure they go to the bottom of the grid in the oreder they are displayed
User prompt
If now moves are allow wait 2 seconds and show game over
User prompt
After cells are destoyed qait for a second before looking for valid connections
User prompt
Check for no valid connection only when grid is full of cells in their final position
User prompt
If no valid connection show meesage sayng no valid connection in the center of the screen
User prompt
After grid is refreshed and all cells are in their new position check if there are any valid connections
User prompt
When gane over delay for a second
User prompt
Every time after the grid is full check if there is at least one valid connection. If there is not, end game
var Cell = Container.expand(function (type) { var self = Container.call(this); var cellGraphics = self.createAsset('cell', 'Grid Cell', .5, .5); self.targetX = 0; self.targetY = 0; self.isMoving = false; self.totalTypes = 5; self.type = type || Math.floor(Math.random() * self.totalTypes); var hue = self.type / self.totalTypes; var color = hsvToRgb(hue, 1, 1); cellGraphics.tint = color; self.move = function (x, y, instant) { self.targetX = x; self.targetY = y; if (instant) { self.x = x; self.y = y; } }; self.tick = function () { var acceleration = 1; self.speedX = self.speedX || 0; self.speedY = self.speedY || 0; var threshold = 1; var dx = self.targetX - self.x; var dy = self.targetY - self.y; if (Math.abs(dx) < threshold && Math.abs(dy) < threshold) { self.x = self.targetX; self.y = self.targetY; self.isMoving = false; self.speedX = 0; self.speedY = 0; } else { if (dx !== 0) { self.speedX += dx > 0 ? acceleration : -acceleration; } if (dy !== 0) { self.speedY += dy > 0 ? acceleration : -acceleration; } var nextX = self.x + self.speedX; var nextY = self.y + self.speedY; if (self.speedX > 0 && nextX > self.targetX || self.speedX < 0 && nextX < self.targetX) { nextX = self.targetX; self.speedX = 0; } if (self.speedY > 0 && nextY > self.targetY || self.speedY < 0 && nextY < self.targetY) { nextY = self.targetY; self.speedY = 0; } self.x = nextX; self.y = nextY; self.isMoving = self.x !== self.targetX || self.y !== self.targetY; } }; }); function hsvToRgb(h, s, v) { var i = Math.floor(h * 6), f = h * 6 - i, p = v * (1 - s), q = v * (1 - f * s), t = v * (1 - (1 - f) * s), mod = i % 6, r = [v, q, p, p, t, v][mod], g = [t, v, v, q, p, p][mod], b = [p, p, t, v, v, q][mod]; return (r * 255 << 16) + (g * 255 << 8) + b * 255; } var Game = Container.expand(function () { var self = Container.call(this); self.checkMovesAllowed = function () { for (var i = 0; i < gridWidth; i++) { for (var j = 0; j < gridHeight; j++) { var cell = grid[i][j]; if (cell) { var neighbors = self.findConnectedNeighbors(cell); if (neighbors.length > 1) { return true; } } } } return false; }; var gridWidth = 4; var gridHeight = 4; var gridSpacing = 8; var tempCell = new Cell(); var cellWidth = tempCell.width; var cellHeight = tempCell.height; tempCell.destroy(); var gridContainer = new Container(); self.addChild(gridContainer); var totalGridWidth = gridWidth * (cellWidth + gridSpacing) - gridSpacing; var totalGridHeight = gridHeight * (cellHeight + gridSpacing) - gridSpacing; gridContainer.x = (2048 - totalGridWidth) / 2 + cellWidth / 2; gridContainer.y = (2732 - totalGridHeight) / 2 + cellHeight / 2; self.calculateTargetPosition = function (col, row) { return { x: col * (cellWidth + gridSpacing), y: row * (cellHeight + gridSpacing) }; }; self.findConnectedNeighbors = function (cell, connectedNeighbors) { connectedNeighbors = connectedNeighbors || []; if (!cell) return []; var cellType = cell.type; var cellColRow = self.findCellColRow(cell); if (cellColRow) { var directions = [[-1, 0], [1, 0], [0, -1], [0, 1]]; directions.forEach(function (dir) { var newRow = cellColRow.row + dir[0]; var newCol = cellColRow.col + dir[1]; if (newRow >= 0 && newRow < gridHeight && newCol >= 0 && newCol < gridWidth) { var neighborCell = grid[newCol][newRow]; if (neighborCell && neighborCell.type === cellType && connectedNeighbors.indexOf(neighborCell) === -1) { connectedNeighbors.push(neighborCell); self.findConnectedNeighbors(neighborCell, connectedNeighbors); } } }); } return connectedNeighbors; }; self.findCellColRow = function (cell) { for (var col = 0; col < gridWidth; col++) { for (var row = 0; row < gridHeight; row++) { if (grid[col][row] === cell) { return { col: col, row: row }; } } } return null; }; self.deleteCell = function (cell) { var colRow = self.findCellColRow(cell); if (colRow) { grid[colRow.col][colRow.row] = null; cell.destroy(); self.moveToEmptySpace(); } }; self.attachCellListeners = function (cell) { var dragStartCell = null; cell.on('down', function (obj) { dragStartCell = cell; cell.alpha = 0.5; }); cell.on('move', function (obj) { if (dragStartCell) { var pos = obj.event.getLocalPosition(gridContainer); var col = Math.floor((pos.x + cellWidth / 2) / (cellWidth + gridSpacing)); var row = Math.floor((pos.y + cellHeight / 2) / (cellHeight + gridSpacing)); if (col >= 0 && col < gridWidth && row >= 0 && row < gridHeight) { var targetCell = grid[col][row]; if (targetCell) { if (targetCell !== dragStartCell) { if (targetCell.type === dragStartCell.type) { targetCell.alpha = 0.5; dragStartCell.alpha = 0.5; dragStartCell.isMatched = true; targetCell.isMatched = true; } else { dragStartCell.alpha = 1; dragStartCell = null; } } } } } }); cell.on('up', function (obj) { for (var i = 0; i < gridWidth; i++) { for (var j = 0; j < gridHeight; j++) { if (grid[i][j]) grid[i][j].alpha = 1; } } if (dragStartCell && dragStartCell.isMatched) { var matchedCells = self.findConnectedNeighbors(dragStartCell); matchedCells.forEach(function (cell) { self.deleteCell(cell); }); } dragStartCell = null; }); }; var grid = []; for (var i = 0; i < gridWidth; i++) { grid[i] = []; for (var j = 0; j < gridHeight; j++) { var cell = new Cell(); var targetPos = self.calculateTargetPosition(i, j); cell.move(targetPos.x, targetPos.y, true); self.attachCellListeners(cell); grid[i][j] = cell; gridContainer.addChild(cell); } } self.moveToEmptySpace = function () { var moved; do { moved = false; for (var col = 0; col < gridWidth; col++) { for (var row = gridHeight - 2; row >= 0; row--) { if (grid[col][row] && !grid[col][row + 1]) { var targetCell = grid[col][row]; var targetPos = self.calculateTargetPosition(col, row + 1); targetCell.move(targetPos.x, targetPos.y); grid[col][row + 1] = targetCell; grid[col][row] = null; moved = true; } } } } while (moved); for (var col = 0; col < gridWidth; col++) { for (var row = gridHeight - 1; row >= 0; row--) { if (!grid[col][row]) { var newCell = new Cell(); var targetPos = self.calculateTargetPosition(col, row); newCell.x = targetPos.x; newCell.y = targetPos.y - cellHeight - 200; newCell.move(targetPos.x, targetPos.y); self.attachCellListeners(newCell); grid[col][row] = newCell; gridContainer.addChild(newCell); break; } } self.moveToEmptySpace(); } }; LK.on('tick', function () { for (var i = 0; i < gridWidth; i++) { for (var j = 0; j < gridHeight; j++) { if (grid[i][j]) grid[i][j].tick(); } } if (!self.checkMovesAllowed()) { if (!self.gameOverTimeout) { self.gameOverTimeout = LK.setTimeout(function () { LK.showGameOver(); }, 2000); } } else { if (self.gameOverTimeout) { LK.clearTimeout(self.gameOverTimeout); self.gameOverTimeout = null; } } }); });
===================================================================
--- original.js
+++ change.js
@@ -130,12 +130,8 @@
var colRow = self.findCellColRow(cell);
if (colRow) {
grid[colRow.col][colRow.row] = null;
cell.destroy();
- if (colRow && self.previewCells[colRow.col]) {
- grid[colRow.col][0] = self.previewCells[colRow.col];
- self.previewCells[colRow.col] = null;
- }
self.moveToEmptySpace();
}
};
self.attachCellListeners = function (cell) {
@@ -182,9 +178,8 @@
dragStartCell = null;
});
};
var grid = [];
- self.previewCells = [];
for (var i = 0; i < gridWidth; i++) {
grid[i] = [];
for (var j = 0; j < gridHeight; j++) {
var cell = new Cell();
@@ -212,17 +207,22 @@
}
}
} while (moved);
for (var col = 0; col < gridWidth; col++) {
- if (!grid[col][0]) {
- var newCell = new Cell();
- var targetPos = self.calculateTargetPosition(col, -1);
- newCell.x = targetPos.x;
- newCell.y = targetPos.y;
- self.attachCellListeners(newCell);
- gridContainer.addChild(newCell);
- self.previewCells[col] = newCell;
+ for (var row = gridHeight - 1; row >= 0; row--) {
+ if (!grid[col][row]) {
+ var newCell = new Cell();
+ var targetPos = self.calculateTargetPosition(col, row);
+ newCell.x = targetPos.x;
+ newCell.y = targetPos.y - cellHeight - 200;
+ newCell.move(targetPos.x, targetPos.y);
+ self.attachCellListeners(newCell);
+ grid[col][row] = newCell;
+ gridContainer.addChild(newCell);
+ break;
+ }
}
+ self.moveToEmptySpace();
}
};
LK.on('tick', function () {
for (var i = 0; i < gridWidth; i++) {