/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");

/**** 
* Classes
****/ 
var GridCell = Container.expand(function () {
	var self = Container.call(this);
	// Method to initialize or reset a cell
	self.init = function () {
		// Create the background square for the cell if it doesn't exist
		if (!self.background) {
			self.background = self.attachAsset('cuadricula', {
				anchorX: 0.5,
				anchorY: 0.5
			});
		}
		// Initialize or reset properties
		self.value = 0;
		self.sprite = null;
		self.row = -1;
		self.col = -1;
		return self; // Enable chaining
	};
	// Method to set value and corresponding sprite
	self.setValue = function (newValue) {
		// Skip if same value
		if (self.value === newValue) {
			return;
		}
		self.value = newValue;
		// Remove previous sprite if exists
		if (self.sprite) {
			self.removeChild(self.sprite);
		}
		// Create new sprite based on value
		var spriteId = 'meme' + newValue;
		self.sprite = LK.getAsset(spriteId, {
			anchorX: 0.5,
			anchorY: 0.5
		});
		self.addChild(self.sprite);
	};
	// Handle tap event
	self.down = function (x, y, obj) {
		handleCellTap(self);
	};
	// Initialize the cell
	self.init();
	return self;
});

/**** 
* Initialize Game
****/ 
// Factory function to get a GridCell (from pool or new)
// Grid configuration
var game = new LK.Game({
	backgroundColor: 0xF4FFFF
});

/**** 
* Game Code
****/ 
// Cell pool for object reuse
// Grid configuration
var cellPool = [];
// Factory function to get a GridCell (from pool or new)
function getGridCell() {
	if (cellPool.length > 0) {
		return cellPool.pop().init(); // Reuse a cell from the pool
	}
	return new GridCell(); // Create a new cell
}
// Function to return a cell to the pool
function recycleGridCell(cell) {
	if (cell) {
		cellPool.push(cell); // Add to pool for later reuse
	}
}
var selectedCell = null;
var isAnimating = false; // Flag to track if gravity or fill animations are in progress
function handleCellTap(tappedCell) {
	// Ignore taps while animations are in progress
	if (isAnimating) {
		return;
	}
	// Case 1: No cell selected yet - select this one
	if (selectedCell === null) {
		selectedCell = tappedCell;
		LK.effects.flashObject(selectedCell.sprite, 0xFFFF00, 150); // Flash yellow quickly
		return;
	}
	var cell1 = selectedCell;
	var cell2 = tappedCell;
	// Case 2: Tapped the already selected cell - deselect it
	if (cell1 === cell2) {
		selectedCell = null; // Deselect
		return;
	}
	// Case 3: Check for adjacency (vertical or horizontal)
	var isAdjacent = Math.abs(cell1.row - cell2.row) === 1 && cell1.col === cell2.col || Math.abs(cell1.col - cell2.col) === 1 && cell1.row === cell2.row;
	if (!isAdjacent) {
		// Case 4: Non-adjacent cell - select the new cell instead
		selectedCell = tappedCell;
		LK.effects.flashObject(selectedCell.sprite, 0xFFFF00, 150); // Flash the new selection
		return;
	}
	// Case 5: Adjacent cell - perform the swap
	// Store original positions for animation
	var pos1_x = cell1.x;
	var pos1_y = cell1.y;
	var pos2_x = cell2.x;
	var pos2_y = cell2.y;
	// Store original grid indices
	var row1 = cell1.row;
	var col1 = cell1.col;
	var row2 = cell2.row;
	var col2 = cell2.col;
	// Swap cells in the gridCells array
	gridCells[row1][col1] = cell2;
	gridCells[row2][col2] = cell1;
	// Swap row/col properties on the cell objects
	cell1.row = row2;
	cell1.col = col2;
	cell2.row = row1;
	cell2.col = col1;
	// Animate the visual swap of positions
	tween(cell1, {
		x: pos2_x,
		y: pos2_y
	}, {
		duration: 300
	});
	tween(cell2, {
		x: pos1_x,
		y: pos1_y
	}, {
		duration: 300
	});
	selectedCell = null; // Reset selection after swap
	// Schedule the match check and destruction slightly after the animation completes
	LK.setTimeout(function () {
		checkForAndDestroyMatches(cell1, cell2); // Pass the swapped cells
		// Future enhancement: After destruction, new cells might fall,
		// and new matches could form. This would require a loop of:
		// check/destroy -> fill -> check/destroy ... until no more matches.
		// For now, we just check once after the swap.
	}, 350); // Animation is 300ms, add a small buffer of 50ms
}
// Helper functions for match detection and destruction
function getMatches() {
	var matches = [];
	// Helper function to find matches in a specific direction
	function findDirectionalMatches(isHorizontal) {
		var primary, secondary;
		var primaryMax = isHorizontal ? gridSize + extraRows : gridSize;
		var secondaryMax = isHorizontal ? gridSize : gridSize + extraRows;
		// Only check visible grid plus extra rows above
		for (primary = isHorizontal ? extraRows : 0; primary < primaryMax; primary++) {
			for (secondary = 0; secondary < secondaryMax;) {
				// Skip if not enough cells left for a match of 3
				if (secondary > secondaryMax - 3) {
					secondary++;
					continue;
				}
				// Get current cell based on direction
				var cell1 = isHorizontal ? gridCells[primary][secondary] : gridCells[secondary][primary];
				if (!cell1) {
					// Skip empty cells
					secondary++;
					continue;
				}
				var currentMatchValue = cell1.value;
				var currentMatchCells = [cell1];
				// Check subsequent cells for matches
				for (var k = secondary + 1; k < secondaryMax; k++) {
					var nextCell = isHorizontal ? gridCells[primary][k] : gridCells[k][primary];
					if (nextCell && nextCell.value === currentMatchValue) {
						currentMatchCells.push(nextCell);
					} else {
						break; // End of current potential match
					}
				}
				// Add to matches if we found 3 or more
				if (currentMatchCells.length >= 3) {
					matches.push(currentMatchCells);
				}
				// Move index forward based on match length
				secondary += currentMatchCells.length > 0 ? currentMatchCells.length : 1;
			}
		}
	}
	// Find horizontal matches
	findDirectionalMatches(true);
	// Find vertical matches
	findDirectionalMatches(false);
	return matches;
}
function destroyCells(cellsToDestroy) {
	// Set animation flag to prevent user interaction during destruction
	isAnimating = true;
	// Process each cell with a slight delay for more satisfying destruction
	var delay = 0;
	var delayIncrement = 100; // 100ms delay between each meme destruction
	// Calculate total destruction time for this sequence only
	var totalDestructionTime = cellsToDestroy.length * delayIncrement;
	cellsToDestroy.forEach(function (cell) {
		// Schedule destruction with increasing delay
		LK.setTimeout(function () {
			// Defensive checks: ensure cell exists and is the one we expect in the grid
			if (cell && gridCells[cell.row] && gridCells[cell.row][cell.col] === cell) {
				// Play explosion sound
				LK.getSound('Explosion').play();
				// Visual flash effect
				LK.effects.flashObject(cell, 0xFFFFFF, 200);
				// Remove from display
				gridContainer.removeChild(cell);
				cell.destroy(); // Destroy the cell object (releases resources)
				gridCells[cell.row][cell.col] = null; // Mark as empty in the logical grid
			}
		}, delay);
		// Increase delay for next cell
		delay += delayIncrement;
	});
	// After destroying cells, make memes fall to fill empty spaces
	// Wait until all cells are destroyed using the exact time for this sequence
	LK.setTimeout(function () {
		applyGravity();
	}, totalDestructionTime + 50); // Use exact time based on this destruction sequence
}
// Function to make memes fall down to fill empty spaces
function applyGravity() {
	// Set animation flag to prevent user interaction
	isAnimating = true;
	// Loop through each column
	for (var col = 0; col < gridSize; col++) {
		// Start from the bottom row and work upwards
		for (var row = gridSize + extraRows - 1; row >= extraRows; row--) {
			// If current cell is empty
			if (!gridCells[row][col]) {
				// Look for the nearest non-empty cell above
				var sourceRow = row - 1;
				while (sourceRow >= 0 && !gridCells[sourceRow][col]) {
					sourceRow--;
				}
				// If we found a cell to move down
				if (sourceRow >= 0) {
					var cellToMove = gridCells[sourceRow][col];
					// Update grid array
					gridCells[row][col] = cellToMove;
					gridCells[sourceRow][col] = null;
					// Update cell's logical position
					cellToMove.row = row;
					// Add the cell to the grid container if it was previously hidden
					if (sourceRow < extraRows) {
						gridContainer.addChild(cellToMove);
					}
					// Animate the fall
					var newPos = getCellPosition(row, col);
					tween(cellToMove, {
						y: newPos.y
					}, {
						duration: 300,
						ease: "bounce"
					});
				}
			}
		}
	}
	// After all cells have fallen, fill in empty spaces at the top with new memes
	LK.setTimeout(function () {
		fillEmptySpacesWithNewMemes();
	}, 400); // Wait for falling animation to complete
}
// Create new memes to fill empty spots at the top of the grid
function fillEmptySpacesWithNewMemes() {
	var anyNewMemeAdded = false;
	// Check each column for empty spaces
	for (var col = 0; col < gridSize; col++) {
		// Start from the top (row 0) and fill any empty spaces
		for (var row = 0; row < gridSize + extraRows; row++) {
			if (!gridCells[row][col]) {
				anyNewMemeAdded = true;
				// Create a new meme cell
				var newCell = getGridCell();
				var pos = getCellPosition(row, col);
				// Position the new cell above the grid (for animation)
				newCell.x = pos.x;
				newCell.y = pos.y - 400; // Start above the visible grid
				// Set random value for the new meme
				var randomValue = Math.floor(Math.random() * 5) + 1;
				newCell.setValue(randomValue);
				// Set logical position
				newCell.row = row;
				newCell.col = col;
				// Add to grid array 
				gridCells[row][col] = newCell;
				// Only add to display if in visible area
				if (row >= extraRows) {
					gridContainer.addChild(newCell);
				}
				// Animate falling into place
				tween(newCell, {
					y: pos.y
				}, {
					duration: 300,
					ease: "bounce"
				});
			}
		}
	}
	// If new memes were added, check for matches only after all fall animations are complete
	if (anyNewMemeAdded) {
		LK.setTimeout(function () {
			// Now that all falling animations are complete, check for matches
			var newMatches = getMatches();
			if (newMatches.length > 0) {
				// Get all cells from all new match groups
				var newCellsToDestroy = [];
				var newCellTracker = {};
				newMatches.forEach(function (group) {
					group.forEach(function (cell) {
						var cellKey = cell.row + "_" + cell.col;
						if (!newCellTracker[cellKey]) {
							newCellsToDestroy.push(cell);
							newCellTracker[cellKey] = true;
						}
					});
				});
				// Destroy these new matches only after all falling has fully completed
				if (newCellsToDestroy.length) {
					destroyCells(newCellsToDestroy);
				}
			} else {
				// No more matches, animations are complete, allow user interaction again
				isAnimating = false;
			}
		}, 500); // Increased delay to ensure all animations are complete
	} else {
		// No new memes were added, animations are complete, allow user interaction again
		isAnimating = false;
	}
}
function checkForAndDestroyMatches(swappedCellA, swappedCellB) {
	// Get all potential matches on the board
	var allMatchGroupsOnBoard = getMatches();
	// Quick return if no matches
	if (!allMatchGroupsOnBoard.length) {
		return; // No matches found anywhere, nothing to do
	}
	// Filter to only match groups containing one of the swapped cells
	var relevantMatchGroups = allMatchGroupsOnBoard.filter(function (group) {
		// Check if any cell in the group is one of our swapped cells
		return group.some(function (cellInGroup) {
			return cellInGroup === swappedCellA || cellInGroup === swappedCellB;
		});
	});
	// Quick return if no relevant matches
	if (!relevantMatchGroups.length) {
		return; // No matches involving the swapped cells were found
	}
	// Create array of unique cells to destroy
	var uniqueCellTracker = {};
	var cellsToDestroy = [];
	// Collect all cells from relevant groups, avoiding duplicates
	relevantMatchGroups.forEach(function (group) {
		group.forEach(function (cell) {
			// Create a unique key for each cell
			var cellKey = cell.row + "_" + cell.col;
			// Only add if we haven't seen this cell yet
			if (!uniqueCellTracker[cellKey]) {
				cellsToDestroy.push(cell);
				uniqueCellTracker[cellKey] = true;
			}
		});
	});
	// Destroy cells if we found any
	if (cellsToDestroy.length) {
		destroyCells(cellsToDestroy);
		// Wait for gravity animation to complete, then check for new matches
		// We use a fresh timeout that doesn't depend on previous destruction delays
		LK.setTimeout(function () {
			// Check for new matches caused by gravity
			var newMatches = getMatches();
			if (newMatches.length > 0) {
				// Get all cells from all new match groups
				var newCellsToDestroy = [];
				var newCellTracker = {};
				newMatches.forEach(function (group) {
					group.forEach(function (cell) {
						var cellKey = cell.row + "_" + cell.col;
						if (!newCellTracker[cellKey]) {
							newCellsToDestroy.push(cell);
							newCellTracker[cellKey] = true;
						}
					});
				});
				// Destroy these new matches with independent timing
				if (newCellsToDestroy.length) {
					// Call destroyCells with reset delay for new destruction cycle
					destroyCells(newCellsToDestroy);
				}
			}
		}, 400); // Reduced wait time to be independent of previous destruction sequence
		// Here you could add scoring or other effects if needed
		// e.g., LK.setScore(LK.getScore() + cellsToDestroy.length * 10);
	}
}
// Game configuration
var gridSize = 8;
var extraRows = 9; // 9 additional rows of memes above the visible grid
var cellSpacing = 10;
var cellSize = 208; // Width/height of the cell background increased by 30%
var gridCells = [];
// Calculate layout
var totalGridWidth = gridSize * cellSize + (gridSize - 1) * cellSpacing;
var totalVisibleGridHeight = totalGridWidth; // Grid is square
var totalGridHeight = totalVisibleGridHeight + extraRows * (cellSize + cellSpacing);
// Center the visible grid on screen
var startX = (2048 - totalGridWidth) / 2 + cellSize / 2;
// Position the grid so the visible part is centered
var startY = (2732 - totalVisibleGridHeight) / 2 + cellSize / 2 + extraRows * (cellSize + cellSpacing);
// Position calculation helper
function getCellPosition(row, col) {
	return {
		x: startX + col * (cellSize + cellSpacing),
		y: startY + row * (cellSize + cellSpacing) - extraRows * (cellSize + cellSpacing)
	};
}
// Create grid container
var gridContainer = new Container();
game.addChild(gridContainer);
// Create and initialize the grid
function initializeGrid() {
	// Clear existing grid if any
	gridCells = [];
	// Create grid cells (including extra rows above)
	for (var row = 0; row < gridSize + extraRows; row++) {
		gridCells[row] = [];
		for (var col = 0; col < gridSize; col++) {
			// Get cell position
			var pos = getCellPosition(row, col);
			// Create new cell (using pool if implemented)
			var cell = getGridCell ? getGridCell() : new GridCell();
			// Position cell
			cell.x = pos.x;
			cell.y = pos.y;
			// Assign row and column
			cell.row = row;
			cell.col = col;
			// Generate random value (1-5), but avoid creating initial matches
			var randomValue;
			var attempts = 0;
			do {
				randomValue = Math.floor(Math.random() * 5) + 1;
				attempts++;
				// Check left and above for potential matches
				var leftMatchCount = 0;
				var aboveMatchCount = 0;
				// Check left
				if (col >= 2) {
					if (gridCells[row][col - 1].value === randomValue && gridCells[row][col - 2].value === randomValue) {
						leftMatchCount = 2;
					}
				}
				// Check above
				if (row >= 2) {
					if (gridCells[row - 1][col].value === randomValue && gridCells[row - 2][col].value === randomValue) {
						aboveMatchCount = 2;
					}
				}
				// If no potential matches or too many attempts, exit loop
			} while ((leftMatchCount >= 2 || aboveMatchCount >= 2) && attempts < 10);
			cell.setValue(randomValue);
			// Add to grid - only if it's in the visible area
			if (row >= extraRows) {
				gridContainer.addChild(cell);
			}
			gridCells[row][col] = cell;
		}
	}
}
// Initialize the grid
initializeGrid();
// Check for any initial matches and correct them
function ensureNoInitialMatches() {
	var matches = getMatches();
	if (matches.length > 0) {
		// Replace cells in matches with new random values
		matches.forEach(function (group) {
			group.forEach(function (cell) {
				// Get current value
				var currentValue = cell.value;
				var newValue;
				// Find a new value that doesn't cause a match
				do {
					newValue = Math.floor(Math.random() * 5) + 1;
				} while (newValue === currentValue);
				// Set the new value
				cell.setValue(newValue);
			});
		});
		// Check again recursively if we still have matches
		ensureNoInitialMatches();
	}
}
// Make sure grid starts with no matches
ensureNoInitialMatches();

===================================================================
--- original.js
+++ change.js
@@ -155,13 +155,12 @@
 	var matches = [];
 	// Helper function to find matches in a specific direction
 	function findDirectionalMatches(isHorizontal) {
 		var primary, secondary;
-		// For horizontal checking, we need to iterate through all rows (including extra)
-		// For vertical checking, we keep columns at gridSize
-		var primaryMax = isHorizontal ? visibleGridSize : gridSize;
-		var secondaryMax = gridSize;
-		for (primary = 0; primary < primaryMax; primary++) {
+		var primaryMax = isHorizontal ? gridSize + extraRows : gridSize;
+		var secondaryMax = isHorizontal ? gridSize : gridSize + extraRows;
+		// Only check visible grid plus extra rows above
+		for (primary = isHorizontal ? extraRows : 0; primary < primaryMax; primary++) {
 			for (secondary = 0; secondary < secondaryMax;) {
 				// Skip if not enough cells left for a match of 3
 				if (secondary > secondaryMax - 3) {
 					secondary++;
@@ -238,9 +237,9 @@
 	isAnimating = true;
 	// Loop through each column
 	for (var col = 0; col < gridSize; col++) {
 		// Start from the bottom row and work upwards
-		for (var row = visibleGridSize - 1; row >= 0; row--) {
+		for (var row = gridSize + extraRows - 1; row >= extraRows; row--) {
 			// If current cell is empty
 			if (!gridCells[row][col]) {
 				// Look for the nearest non-empty cell above
 				var sourceRow = row - 1;
@@ -254,8 +253,12 @@
 					gridCells[row][col] = cellToMove;
 					gridCells[sourceRow][col] = null;
 					// Update cell's logical position
 					cellToMove.row = row;
+					// Add the cell to the grid container if it was previously hidden
+					if (sourceRow < extraRows) {
+						gridContainer.addChild(cellToMove);
+					}
 					// Animate the fall
 					var newPos = getCellPosition(row, col);
 					tween(cellToMove, {
 						y: newPos.y
@@ -277,9 +280,9 @@
 	var anyNewMemeAdded = false;
 	// Check each column for empty spaces
 	for (var col = 0; col < gridSize; col++) {
 		// Start from the top (row 0) and fill any empty spaces
-		for (var row = 0; row < visibleGridSize; row++) {
+		for (var row = 0; row < gridSize + extraRows; row++) {
 			if (!gridCells[row][col]) {
 				anyNewMemeAdded = true;
 				// Create a new meme cell
 				var newCell = getGridCell();
@@ -292,11 +295,14 @@
 				newCell.setValue(randomValue);
 				// Set logical position
 				newCell.row = row;
 				newCell.col = col;
-				// Add to grid array and display
+				// Add to grid array 
 				gridCells[row][col] = newCell;
-				gridContainer.addChild(newCell);
+				// Only add to display if in visible area
+				if (row >= extraRows) {
+					gridContainer.addChild(newCell);
+				}
 				// Animate falling into place
 				tween(newCell, {
 					y: pos.y
 				}, {
@@ -403,26 +409,26 @@
 		// e.g., LK.setScore(LK.getScore() + cellsToDestroy.length * 10);
 	}
 }
 // Game configuration
-var gridSize = 8; // Original grid size
-var extraRows = 9; // Number of extra rows to add at the top
-var visibleGridSize = gridSize + extraRows; // Total visible grid size
+var gridSize = 8;
+var extraRows = 9; // 9 additional rows of memes above the visible grid
 var cellSpacing = 10;
 var cellSize = 208; // Width/height of the cell background increased by 30%
 var gridCells = [];
-// Calculate layout for original (visible) 8x8 grid
+// Calculate layout
 var totalGridWidth = gridSize * cellSize + (gridSize - 1) * cellSpacing;
-var totalGridHeight = gridSize * cellSize + (gridSize - 1) * cellSpacing; // Only the height of the original 8 rows
-// Center the grid on screen
+var totalVisibleGridHeight = totalGridWidth; // Grid is square
+var totalGridHeight = totalVisibleGridHeight + extraRows * (cellSize + cellSpacing);
+// Center the visible grid on screen
 var startX = (2048 - totalGridWidth) / 2 + cellSize / 2;
-// Position to maintain the original grid's position, accounting for extra rows on top, and move 500px upward
-var startY = (-2732 + totalGridHeight) / 2 + cellSize / 2;
+// Position the grid so the visible part is centered
+var startY = (2732 - totalVisibleGridHeight) / 2 + cellSize / 2 + extraRows * (cellSize + cellSpacing);
 // Position calculation helper
 function getCellPosition(row, col) {
 	return {
 		x: startX + col * (cellSize + cellSpacing),
-		y: startY + row * (cellSize + cellSpacing)
+		y: startY + row * (cellSize + cellSpacing) - extraRows * (cellSize + cellSpacing)
 	};
 }
 // Create grid container
 var gridContainer = new Container();
@@ -430,10 +436,10 @@
 // Create and initialize the grid
 function initializeGrid() {
 	// Clear existing grid if any
 	gridCells = [];
-	// Create grid cells for all rows (original + extra)
-	for (var row = 0; row < visibleGridSize; row++) {
+	// Create grid cells (including extra rows above)
+	for (var row = 0; row < gridSize + extraRows; row++) {
 		gridCells[row] = [];
 		for (var col = 0; col < gridSize; col++) {
 			// Get cell position
 			var pos = getCellPosition(row, col);
@@ -468,10 +474,12 @@
 				}
 				// If no potential matches or too many attempts, exit loop
 			} while ((leftMatchCount >= 2 || aboveMatchCount >= 2) && attempts < 10);
 			cell.setValue(randomValue);
-			// Add to grid
-			gridContainer.addChild(cell);
+			// Add to grid - only if it's in the visible area
+			if (row >= extraRows) {
+				gridContainer.addChild(cell);
+			}
 			gridCells[row][col] = cell;
 		}
 	}
 }