User prompt
in tile move, tiles should only keep moving if distance is larger than 15
User prompt
update the distance threshold to 15px in move
User prompt
Make speed of tiles 15px per move, also update the distance threshold to this
Code edit (1 edits merged)
Please save this source code
User prompt
Update the move code, such that speed that tiles move is in any direction is always 4 pixels per tick
User prompt
Use a fixed speed of 4px per move for movement
User prompt
Use a fixed speed for tile movement
User prompt
don't allow the tiles to move past their target position, right now they rubber band back and forward, fix that
User prompt
Make tile movement have speedX and speedY and make it speed up as it moves towards it's target position
User prompt
tile movement should not slow down as it gets closer to it's final destination
User prompt
Change the toberemove code such that allTilesStopped is set to false if the tile did notmove
User prompt
also set allTilesStopped to false if a to be removed tile moves
User prompt
move the allTilesStopped check to after toBeRemoved array code.
User prompt
Also factor in toBeRemoved tiles in allTilesStopped
User prompt
fix the tileLabel reference error in updateToRealValue
User prompt
Fix Bug: 'TypeError: undefined is not an object (evaluating 'self.tileLabel.setText')' in this line: 'self.tileLabel.setText(self.value.toString());' Line Number: 20
User prompt
In the allTilesStopped check call the updateToReal value method
User prompt
Create a updateToReal value method on Tile
User prompt
Fix Bug: 'ReferenceError: Can't find variable: tileLabel' in this line: 'tileLabel.setText(squares[i][j].value.toString());' Line Number: 210
User prompt
Currently tiles update their value when they stop move, instead update it such that all tiles have to stop move before values are updated
User prompt
Tile values should not update until everything on the board has stopped moving
User prompt
Target tiles can be moved after mergeTiles, make sure the new targetX and targetY is set on merged tiles if the target tile moves
User prompt
When merging, re-attach the tile that was kept such that it has a higher zindex
User prompt
when moving a tile to the remove array also re-attach it at index zero
User prompt
remove to be removed tiles if move returns true
var Tile = Container.expand(function (value) { var self = Container.call(this); self.value = value || 2; var tileGraphics = self.createAsset('tile', 'Tile Graphics', 0, 0); var tileLabel = new Text2(self.value.toString(), { size: 300, fill: '#ffffff', font: 'bold' }); tileLabel.anchor.set(0.5, 0.5); tileLabel.x = tileGraphics.width / 2; tileLabel.y = tileGraphics.height / 2; tileGraphics.addChild(tileLabel); self.setValue = function (value) { self.newValue = value; }; self.targetX = 0; self.targetY = 0; self.isMoving = false; self.merged = false; self.setPosition = function (x, y, instant) { self.targetX = x * 500; self.targetY = y * 500; if (instant) { self.x = self.targetX; self.y = self.targetY; } }; self.move = function () { var threshold = 5; var dx = self.targetX - self.x; var dy = self.targetY - self.y; if (Math.abs(dx) > threshold || Math.abs(dy) > threshold) { self.isMoving = true; self.x += dx * 0.2; self.y += dy * 0.2; return false; } self.isMoving = false; self.x = self.targetX; self.y = self.targetY; return true; }; }); var Game = Container.expand(function () { var self = Container.call(this); var toBeRemoved = []; self.addRandomTile = function () { var emptyPositions = []; for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] === null) { emptyPositions.push({ x: i, y: j }); } } } if (emptyPositions.length > 0) { var randomPosition = emptyPositions[Math.floor(Math.random() * emptyPositions.length)]; var square = new Tile(); square.setPosition(randomPosition.x, randomPosition.y, true); squares[randomPosition.x][randomPosition.y] = square; gridContainer.addChild(square); } }; self.mergeTiles = function (x1, y1, x2, y2) { if (squares[x1][y1] !== null && squares[x2][y2] !== null && squares[x1][y1].value === squares[x2][y2].value && !squares[x1][y1].merged && !squares[x2][y2].merged) { squares[x2][y2].setValue(squares[x2][y2].value * 2, true); squares[x2][y2].merged = true; squares[x1][y1].targetX = squares[x2][y2].targetX; squares[x1][y1].targetY = squares[x2][y2].targetY; toBeRemoved.push(squares[x1][y1]); squares[x1][y1] = null; gridContainer.removeChild(squares[x2][y2]); gridContainer.addChild(squares[x2][y2]); return true; } return false; }; var gridSize = 4; LK.stageContainer.setBackgroundColor(0xD3D3D3); var gridContainer = new Container(); gridContainer.x = 44; gridContainer.y = 200; self.addChild(gridContainer); var squares = new Array(gridSize).fill().map(() => new Array(gridSize).fill(null)); for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { squares[i][j] = null; } } var initialTiles = 2; for (var i = 0; i < initialTiles; i++) { var x, y; do { x = Math.floor(Math.random() * gridSize); y = Math.floor(Math.random() * gridSize); } while (squares[x][y] !== null); var square = new Tile(); square.setPosition(x, y, true); squares[x][y] = square; gridContainer.addChild(square); } var swipeStart = { x: 0, y: 0 }; var swipeEnd = { x: 0, y: 0 }; var boardChanged = false; self.moveTiles = function (direction) { var dx = (direction === 'right') - (direction === 'left'); var dy = (direction === 'down') - (direction === 'up'); var moved = false; do { moved = false; var iStart = dx > 0 ? gridSize - 1 : 0; var iEnd = dx > 0 ? -1 : gridSize; var iStep = dx > 0 ? -1 : 1; var jStart = dy > 0 ? gridSize - 1 : 0; var jEnd = dy > 0 ? -1 : gridSize; var jStep = dy > 0 ? -1 : 1; for (var i = iStart; i !== iEnd; i += iStep) { for (var j = jStart; j !== jEnd; j += jStep) { var x = i + dx; var y = j + dy; if (x >= 0 && x < gridSize && y >= 0 && y < gridSize && squares[i][j] !== null) { if (squares[x][y] === null) { squares[x][y] = squares[i][j]; squares[i][j] = null; squares[x][y].setPosition(x, y); moved = true; boardChanged = true; } else if (squares[x][y] !== null && squares[i][j] !== null && squares[x][y].value === squares[i][j].value) { moved = self.mergeTiles(i, j, x, y); if (moved) boardChanged = true; } } } } } while (moved); for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] !== null) { squares[i][j].merged = false; } } } }; stage.on('down', function (obj) { var anyTileMoving = squares.some(row => row.some(tile => tile && tile.isMoving)); if (!anyTileMoving) { var pos = obj.event.getLocalPosition(self); swipeStart = { x: pos.x, y: pos.y }; } }); stage.on('up', function (obj) { var pos = obj.event.getLocalPosition(self); swipeEnd = { x: pos.x, y: pos.y }; var dx = swipeEnd.x - swipeStart.x; var dy = swipeEnd.y - swipeStart.y; var threshold = 50; if (Math.abs(dx) > threshold || Math.abs(dy) > threshold) { if (Math.abs(dx) > Math.abs(dy)) { if (dx > 0) { self.moveTiles('right'); } else { self.moveTiles('left'); } } else { if (dy > 0) { self.moveTiles('down'); } else { self.moveTiles('up'); } } } var anyTileMoving = squares.some(row => row.some(tile => tile && tile.isMoving)); if (!anyTileMoving && boardChanged) { self.addRandomTile(); boardChanged = false; } }); LK.on('tick', function () { var allTilesStopped = true; for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] !== null) { if (!squares[i][j].move()) { allTilesStopped = false; } } } } if (allTilesStopped) { for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] !== null && squares[i][j].newValue) { squares[i][j].value = squares[i][j].newValue; squares[i][j].tileLabel.setText(squares[i][j].value.toString()); squares[i][j].newValue = null; } } } } for (var i = 0; i < toBeRemoved.length; i++) { if (toBeRemoved[i].move()) { toBeRemoved[i].destroy(); toBeRemoved.splice(i, 1); i--; } } }); });
===================================================================
--- original.js
+++ change.js
@@ -206,9 +206,9 @@
for (var i = 0; i < gridSize; i++) {
for (var j = 0; j < gridSize; j++) {
if (squares[i][j] !== null && squares[i][j].newValue) {
squares[i][j].value = squares[i][j].newValue;
- tileLabel.setText(squares[i][j].value.toString());
+ squares[i][j].tileLabel.setText(squares[i][j].value.toString());
squares[i][j].newValue = null;
}
}
}