Code edit (1 edits merged)
Please save this source code
User prompt
desplaza los grid 500 pixees arriba
User prompt
los nuevos memes fueron agregados abajo no arriba
User prompt
agrega 9 filas superiores de memes, manten la posición de las actuales
User prompt
agrega 9 filas superiores sin modificar la posición actual e las cuadriculas
User prompt
agrega 9 filas superiores pero que estos no les afecte la ruptura por caída y no sean movible. Dale un tinte oscuro si se encuentran en estas capas
User prompt
haz que la velocidad de caida sea constante y no dependa de la distancia ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
haz que los nuevos memes pre establecidos sean visibles
User prompt
agrega el mismo dilei a a caida de los memes actuales. haz que empiecen a caer los nuevos memes en esa columna una vez el meme de la parte superior empiece este a punto de finalizar
User prompt
agrega un dilei a la aparición de nuevos memes. Este funciona de la siguiente manera: Es propia de cada columna. va en orden de abajo arriba. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
agrega un dilei individual a la aparición de los nuevos memes ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
agrega un pequeño diley a la entrada de los memes ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
Haz que los nuevos memes caigan una vez finalicen de caer los memes en la cuadricula ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
haz que los nuevos memes empiecena salir una vez caigan los memes actuales
User prompt
haz que las proximas 9 filas de nuevos memes ya este precargado para hacer más sutil su integración
User prompt
haz que la velocidad de caida de los memes actuales con los nuevos sean lás mismas, crea un método para hacer más fluido la entrada. ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
haz que la velocidad de caida de los memes actuales con los nuevos sean lás mismas, crea un método para hacer más fluido la entrada.
User prompt
sincroniza la caída de los memes actuales con los nuevos ↪💡 Consider importing and using the following plugins: @upit/tween.v1
User prompt
haz que no se pueda mover manualmente mientras estan en gravedad
User prompt
haz que no se pueda mover manualmente mientras estan en gravedad
User prompt
haz que las roturas por gravedad empiecen una vez finalicen las caidas
User prompt
si se empieza una nueva roptura de meme que no continue con el delay del anterior
User prompt
haz que a medida que se rompen caigan nuevos memes
User prompt
Please fix the bug: 'Uncaught TypeError: Cannot read properties of undefined (reading 'to')' in or related to this line: 'tween(cell1).to({' Line Number: 138
User prompt
Please fix the bug: 'Uncaught TypeError: tween.to is not a function' in or related to this line: 'tween.to(cell1, {' Line Number: 138
/**** * 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 ****/ // Grid configuration // Cell pool for object reuse 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; // 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++) { 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 = visibleGridSize - 1; row >= 0; 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; // 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 < visibleGridSize; 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 and display gridCells[row][col] = newCell; 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; // Original grid size var extraRows = 9; // Number of extra rows to add at the top var visibleGridSize = gridSize + extraRows; // Total visible grid size var cellSpacing = 10; var cellSize = 208; // Width/height of the cell background increased by 30% var gridCells = []; // Calculate layout for original (visible) 8x8 grid 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 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 - 900; // Position calculation helper function getCellPosition(row, col) { return { x: startX + col * (cellSize + cellSpacing), y: startY + row * (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 for all rows (original + extra) for (var row = 0; row < visibleGridSize; 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 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
@@ -415,9 +415,9 @@
var totalGridHeight = gridSize * cellSize + (gridSize - 1) * cellSpacing; // Only the height of the original 8 rows
// Center the 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 - 500;
+var startY = (2732 - totalGridHeight) / 2 + cellSize / 2 - 900;
// Position calculation helper
function getCellPosition(row, col) {
return {
x: startX + col * (cellSize + cellSpacing),
la figura de una casa color blanca simple para una interfaz. In-Game asset. 2d. High contrast. No shadows
haz el fondo color morado
circular check logo. In-Game asset. 2d. High contrast. No shadows
Cuadrado con los bordes redondeado negro. In-Game asset. 2d. High contrast. No shadows
hazlo un gris claro
Que sea blanco
Que sea blanco