User prompt
vary the starting location of teh newnumber banner on the Y axis
Code edit (6 edits merged)
Please save this source code
User prompt
when a new number is reached then move image from left to right across top of screen
User prompt
resolve issue by adding move method within the game class for snowflakes
User prompt
show sfalling snowflakes on screen
User prompt
add falling snowflakes of various sizes to the screen. use random scale of between 0.3 and 1 for snowflake size
Code edit (2 edits merged)
Please save this source code
User prompt
add background image
Code edit (8 edits merged)
Please save this source code
User prompt
when tiles merge add in a firework animation
Code edit (1 edits merged)
Please save this source code
var NewNumberBanner = Container.expand(function (value) { var self = Container.call(this); var bannerGraphics = self.createAsset('newNumberBanner', 'New Number Banner', 0.5, 0.5); var bannerLabel = new Text2(value.toString(), { size: 160, fill: '#000000', font: 'Impact' }); bannerLabel.anchor.set(0.5, 0.5); self.addChild(bannerLabel); self.x = -bannerGraphics.width; self.y = Math.random() * (2732 - bannerGraphics.height); self.move = function () { if (self.x < 2048) { self.x += 10; } else { self.destroy(); } }; }); var Snowflake = Container.expand(function () { var self = Container.call(this); var flakeGraphics = self.createAsset('snowflake', 'Snowflake Graphics', 0.5, 0.5); self.scale.set(Math.random() * 0.7 + 0.3); self.x = Math.random() * 2048; self.y = -flakeGraphics.height; self.speed = Math.random() * 2 + 1; self.move = function () { self.y += self.speed; if (self.y > 2732 + flakeGraphics.height) { self.destroy(); } }; }); var Tile = Container.expand(function (value) { var self = Container.call(this); self.alpha = 0; var fadeIn = function () { if (self.alpha < 1) { self.alpha = Math.min(self.alpha + 0.24, 1); self.scale.set(self.alpha); LK.setTimeout(fadeIn, 16.67); } else { self.alpha = 1; self.scale.set(1); } }; fadeIn(); self.value = value || 2; var tileGraphics = self.createAsset('tile', 'Tile Graphics', .5, .5); var hsvToRgb = function (h, s, v) { var r, g, b; var i = Math.floor(h * 6); var f = h * 6 - i; var p = v * (1 - s); var q = v * (1 - f * s); var t = v * (1 - (1 - f) * s); switch (i % 6) { case 0: (r = v, g = t, b = p); break; case 1: (r = q, g = v, b = p); break; case 2: (r = p, g = v, b = t); break; case 3: (r = p, g = q, b = v); break; case 4: (r = t, g = p, b = v); break; case 5: (r = v, g = p, b = q); break; } return (Math.round(r * 255) << 16) + (Math.round(g * 255) << 8) + Math.round(b * 255); }; self.setTint = function () { var hue = (Math.log2(self.value) + 6) % 20 / 20; tileGraphics.tint = hsvToRgb(hue, 0.3, 1); }; self.setTint(); var tileLabel = new Text2(self.value.toString(), { size: 300, fill: '#332d28', font: 'Sans-Serif', weight: '800', strokeThickness: 0 }); tileLabel.anchor.set(0.5, 0.5); tileLabel.x = 0; tileLabel.y = -10; self.addChild(tileLabel); self.setValue = function (value) { self.newValue = value; }; self.updateToRealValue = function () { if (self.newValue) { if (self.value !== self.newValue) { var newNumberBanner = new NewNumberBanner(self.newValue); LK.gui.addChild(newNumberBanner); LK.on('tick', function () { newNumberBanner.move(); }); } self.value = self.newValue; tileLabel.setText(self.value.toString()); var textScale = Math.min(1, 350 / (tileLabel.width / tileLabel.scale.x)); tileLabel.scale.set(textScale); self.setTint(); self.newValue = null; self.scale.set(1.2); var scaleDown = function () { if (self.scale.x > 1) { self.scale.x -= 0.02; self.scale.y -= 0.02; LK.setTimeout(scaleDown, 16.67); } else { self.scale.set(1); } }; scaleDown(); } }; self.targetX = 0; self.targetY = 0; self.isMoving = false; self.merged = false; self.setPosition = function (x, y, instant) { self.targetX = x * 500 + 250; self.targetY = y * 500 + 250; if (instant) { self.x = self.targetX; self.y = self.targetY; } }; self.move = function () { var dx = self.targetX - self.x; var dy = self.targetY - self.y; var distance = Math.sqrt(dx * dx + dy * dy); if (distance > 150) { self.isMoving = true; self.x += dx / distance * 150; self.y += dy / distance * 150; 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 snowflakes = []; self.checkPossibleMoves = function () { for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] === null) { return true; } if (i < gridSize - 1 && squares[i][j] !== null && squares[i + 1][j] !== null && squares[i][j].value === squares[i + 1][j].value) { return true; } if (j < gridSize - 1 && squares[i][j] !== null && squares[i][j + 1] !== null && squares[i][j].value === squares[i][j + 1].value) { return true; } } } return false; }; var scoreTxt = new Text2('2', { size: 160, fill: '#000000', font: 'Impact', strokeThickness: 0 }); var banner = self.createAsset('steampunkBanner', 'Steampunk Banner', .5, 0); banner.x = 1024; banner.y = 0; banner.scale.set(1); self.addChild(banner); scoreTxt.anchor.set(0, 0); scoreTxt.x = 140; LK.gui.topLeft.addChild(scoreTxt); var achievedTxt = new Text2('# Reached', { size: 80, fill: '#000000', font: 'Impact', strokeThickness: 0 }); achievedTxt.anchor.set(0.5, 0); achievedTxt.y = scoreTxt.y + scoreTxt.height + 10; achievedTxt.x = scoreTxt.x + scoreTxt.width / 2; LK.gui.topLeft.addChild(achievedTxt); var moveCounter = 0; var moveCounterTxt = new Text2(moveCounter.toString(), { size: 160, fill: '#000000', font: 'Impact', strokeThickness: 0 }); moveCounterTxt.anchor.set(1, 0); LK.gui.topRight.addChild(moveCounterTxt); var movesLabel = new Text2('moves', { size: 80, fill: '#000000', font: 'Impact', strokeThickness: 0 }); movesLabel.anchor.set(1, 0); movesLabel.y = 180; LK.gui.topRight.addChild(movesLabel); var arrowUp = self.createAsset('arrowUp', 'Arrow Up', .5, .5); arrowUp.x = 1024; arrowUp.y = 2732 - 250; arrowUp.on('down', function () { self.moveTiles('up'); }); var arrowDown = self.createAsset('arrowUp', 'Arrow Down', .5, .5); arrowDown.rotation = Math.PI; arrowDown.x = 1024; arrowDown.y = 2732 - 100; arrowDown.on('down', function () { self.moveTiles('down'); }); var arrowLeft = self.createAsset('arrowUp', 'Arrow Left', .5, .5); arrowLeft.rotation = -Math.PI / 2; arrowLeft.x = 899; arrowLeft.y = 2732 - 175; arrowLeft.on('down', function () { self.moveTiles('left'); }); var arrowRight = self.createAsset('arrowUp', 'Arrow Right', .5, .5); arrowRight.rotation = Math.PI / 2; arrowRight.x = 1149; arrowRight.y = 2732 - 175; arrowRight.on('down', function () { self.moveTiles('right'); }); 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(Math.random() < 0.5 ? 2 : 4); 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(0x000000); var gridContainer = new Container(); gridContainer.x = 44; gridContainer.y = 400; self.addChild(gridContainer); for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { var gridTile = gridContainer.createAsset('gridTile', 'Grid Tile', .5, .5); gridTile.x = i * 500 + 250; gridTile.y = j * 500 + 250; gridTile.alpha = .8; } } 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; var winMessageShown = 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'); } } } }); 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; } } } } for (var i = 0; i < toBeRemoved.length; i++) { if (!toBeRemoved[i].move()) { allTilesStopped = false; } else { toBeRemoved[i].destroy(); toBeRemoved.splice(i, 1); i--; } } 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].updateToRealValue(); if (squares[i][j].value === 2048 && !winMessageShown) { var winMessage = new Text2('Congratulations\n you win!', { size: 150, fill: '#ffffff', font: 'Sans-Serif', weight: '800', stroke: '#000000', strokeThickness: 25, align: 'center' }); winMessage.anchor.set(0.5, 0.5); LK.gui.center.addChild(winMessage); winMessageShown = true; LK.setTimeout(function () { LK.gui.center.removeChild(winMessage); }, 5000); } } } } if (boardChanged) { self.addRandomTile(); boardChanged = false; var maxTileValue = Math.max.apply(Math, squares.map(function (row) { return Math.max.apply(Math, row.map(function (tile) { return tile ? tile.value : 0; })); })); scoreTxt.setText(maxTileValue.toString()); moveCounter++; moveCounterTxt.setText(moveCounter.toString()); } if (!self.checkPossibleMoves()) { for (var i = 0; i < gridSize; i++) { for (var j = 0; j < gridSize; j++) { if (squares[i][j] !== null) { squares[i][j].alpha = 1; squares[i][j].scale.set(1); } } } LK.showGameOver(); } if (LK.ticks % 30 == 0) { var snowflake = new Snowflake(); snowflakes.push(snowflake); self.addChild(snowflake); } snowflakes.forEach(function (flake) { flake.move(); }); snowflakes = snowflakes.filter(function (flake) { return !flake.isDestroyed; }); } }); });
===================================================================
--- original.js
+++ change.js
@@ -8,9 +8,9 @@
});
bannerLabel.anchor.set(0.5, 0.5);
self.addChild(bannerLabel);
self.x = -bannerGraphics.width;
- self.y = 100;
+ self.y = Math.random() * (2732 - bannerGraphics.height);
self.move = function () {
if (self.x < 2048) {
self.x += 10;
} else {
White square with round corners, flat, flat shaded, industrial design. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows. up arrow key Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows. down arrow keys in same style as Id arrowUp Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
snow covered square with round corners Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Christmas landscape scene, soft colours. Blank background. High contrast. No shadows. Single Game Texture. In-Game asset. 2d. Blank backgroud Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Snow flake. simple. white. Blank background. High contrast. No shadows. Single Game Texture. In-Game asset. 2d. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.
Snow ball. Single Game Texture. In-Game asset.Blank background. High contrast. No shadows. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.