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

/**** 
* Classes
****/ 
// NumberButton: A tappable number on the board
var NumberButton = Container.expand(function () {
	var self = Container.call(this);
	// Attach circle background, always use btnSize for size and scaling
	var btnSize = 240; // unified button/box size (increased for bigger buttons)
	var circle = self.attachAsset('numberCircle', {
		anchorX: 0.5,
		anchorY: 0.5,
		width: btnSize,
		height: btnSize,
		scaleX: btnSize / 220,
		scaleY: btnSize / 220
	});
	// Number text
	var numberText = new Text2('1', {
		size: 120,
		// increased for bigger buttons
		// This will be scaled with the button
		fill: 0xFFFFFF
	});
	numberText.anchor.set(0.5, 0.5);
	self.addChild(numberText);
	self.value = 1; // The number this button represents
	self.isActive = true; // If false, ignore taps
	self.setNumber = function (n) {
		self.value = n;
		numberText.setText(n);
	};
	self.flash = function (color, duration) {
		tween(circle, {
			tint: color
		}, {
			duration: duration / 2,
			easing: tween.easeIn,
			onFinish: function onFinish() {
				tween(circle, {
					tint: 0x2d9cdb
				}, {
					duration: duration / 2,
					easing: tween.easeOut
				});
			}
		});
	};
	// Touch/click event
	self.down = function (x, y, obj) {
		if (!self.isActive) return;
		if (typeof onNumberButtonPressed === "function") {
			onNumberButtonPressed(self);
		}
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x181c20
});

/**** 
* Game Code
****/ 
// We'll use a simple circle as a background for each number for better touch targets.
// Numbers will be rendered as Text2, so no need for custom shapes or images for numbers.
// --- Game parameters ---
var boardPadding = 80;
var minNumbers = 15;
var maxNumbers = 15;
var level = 1;
var numbersOnBoard = minNumbers;
var timePerLevel = 15000; // ms
var timePenalty = 1500; // ms lost on wrong tap
var timeBonus = 500; // ms gained on perfect level
var maxLevel = 20;
// --- State ---
var numberButtons = [];
var nextNumber = 1;
var timer = null;
var timeLeft = timePerLevel;
var score = 0;
var isPlaying = false;
var lastTapTime = 0;
// --- UI ---
var scoreText = new Text2('Skor: 0', {
	size: 90,
	fill: "#fff"
});
scoreText.anchor.set(0.5, 0);
LK.gui.top.addChild(scoreText);
var timerText = new Text2('Süre: 0', {
	size: 80,
	fill: 0xFFE066
});
timerText.anchor.set(0.5, 0);
LK.gui.top.addChild(timerText);
var levelText = new Text2('Seviye: 1', {
	size: 70,
	fill: 0xB8E994
});
levelText.anchor.set(0.5, 0);
LK.gui.top.addChild(levelText);
// Position GUI elements
scoreText.y = 30;
scoreText.x = LK.gui.top.width / 2;
timerText.y = scoreText.y + scoreText.height + 10;
timerText.x = LK.gui.top.width / 2;
levelText.y = timerText.y + timerText.height + 10;
levelText.x = LK.gui.top.width / 2;
// --- Functions ---
function shuffleArray(arr) {
	for (var i = arr.length - 1; i > 0; i--) {
		var j = Math.floor(Math.random() * (i + 1));
		var temp = arr[i];
		arr[i] = arr[j];
		arr[j] = temp;
	}
	return arr;
}
function layoutNumbers(n) {
	// Remove old buttons
	for (var i = 0; i < numberButtons.length; i++) {
		numberButtons[i].destroy();
	}
	numberButtons = [];
	// Remove old background if exists
	if (typeof numberRowBgBorder !== "undefined" && numberRowBgBorder && numberRowBgBorder.parent) {
		numberRowBgBorder.parent.removeChild(numberRowBgBorder);
		numberRowBgBorder.destroy();
	}
	numberRowBgBorder = null;
	if (typeof numberRowBg !== "undefined" && numberRowBg && numberRowBg.parent) {
		numberRowBg.parent.removeChild(numberRowBg);
		numberRowBg.destroy();
	}
	numberRowBg = null;
	// Make a smaller square background and border, centered
	var squareSize = Math.floor((Math.min(2048, 2732) - boardPadding * 2) * 0.7); // 70% of previous size
	var bgX = 2048 / 2;
	var bgY = 2732 / 2;
	// Add border: create a slightly larger square behind the main background
	var borderThickness = 14;
	numberRowBgBorder = LK.getAsset('numberCircle', {
		width: squareSize + borderThickness * 2,
		height: squareSize + borderThickness * 2,
		color: 0xffffff,
		// White border for visibility
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: (squareSize + borderThickness * 2) / 220,
		scaleY: (squareSize + borderThickness * 2) / 220,
		x: bgX,
		y: bgY
	});
	game.addChild(numberRowBgBorder);
	numberRowBg = LK.getAsset('numberCircle', {
		width: squareSize,
		height: squareSize,
		color: 0x222b38,
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: squareSize / 220,
		scaleY: squareSize / 220,
		x: bgX,
		y: bgY
	});
	game.addChild(numberRowBg);
	// Create a container to hold all numbers, centered in the square
	if (typeof numbersContainer !== "undefined" && numbersContainer && numbersContainer.parent) {
		numbersContainer.parent.removeChild(numbersContainer);
		numbersContainer.destroy();
	}
	numbersContainer = new Container();
	numbersContainer.x = bgX;
	numbersContainer.y = bgY;
	game.addChild(numbersContainer);
	// Layout numbers in a 5x3 table grid, but leave one empty box at the end (rightmost column, last row)
	// All boxes (number buttons and empty box) will be the same size
	var cols = 5;
	var rows = 3;
	var btnSize = 240; // unified button/box size, used everywhere for NumberButton and empty box (increased for bigger buttons)
	var btnSpacing = 70; // space between all boxes
	var gridWidth = cols * btnSize + (cols - 1) * btnSpacing;
	var gridHeight = rows * btnSize + (rows - 1) * btnSpacing;
	var startX = -gridWidth / 2 + btnSize / 2;
	var startY = -gridHeight / 2 + btnSize / 2;
	var positions = [];
	for (var row = 0; row < rows; row++) {
		for (var col = 0; col < cols; col++) {
			positions.push({
				x: startX + col * (btnSize + btnSpacing),
				y: startY + row * (btnSize + btnSpacing)
			});
		}
	}
	// Shuffle numbers
	var nums = [];
	for (var i = 1; i <= n; i++) nums.push(i);
	shuffleArray(nums);
	// Place all numbers inside the single numbersContainer, no per-number backgrounds
	// Leave the last position empty (for the empty box)
	for (var i = 0; i < positions.length - 1; i++) {
		var btn = new NumberButton();
		btn.setNumber(nums[i]);
		btn.x = positions[i].x;
		btn.y = positions[i].y;
		btn.isActive = true;
		// Make button and empty box the same size
		btn.scaleX = 1;
		btn.scaleY = 1;
		numberButtons.push(btn);
		numbersContainer.addChild(btn);
	}
	// Draw the empty box at the last position (rightmost, bottom)
	if (typeof emptyBox !== "undefined" && emptyBox && emptyBox.parent) {
		emptyBox.parent.removeChild(emptyBox);
		emptyBox.destroy();
	}
	// Make the empty box exactly the same size as the number buttons
	emptyBox = LK.getAsset('numberCircle', {
		width: btnSize,
		height: btnSize,
		color: 0x333c4a,
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 1,
		scaleY: 1,
		x: positions[positions.length - 1].x,
		y: positions[positions.length - 1].y
	});
	numbersContainer.addChild(emptyBox);
	// All numbers are now inside a single container (numbersContainer) which is inside the large square background.
}
function startLevel(lvl) {
	level = lvl;
	numbersOnBoard = Math.min(minNumbers + (level - 1) * 2, maxNumbers);
	nextNumber = 1;
	timeLeft = timePerLevel + Math.max(0, (level - 1) * 500); // Slightly more time for higher levels
	levelText.setText('Seviye: ' + level);
	layoutNumbers(numbersOnBoard);
	isPlaying = true;
	updateScoreText();
	updateTimerText();
}
function updateScoreText() {
	scoreText.setText('Skor: ' + score);
}
function updateTimerText() {
	timerText.setText('Süre: ' + Math.ceil(timeLeft / 1000));
}
function endGame(win) {
	isPlaying = false;
	// Remove all number buttons
	for (var i = 0; i < numberButtons.length; i++) {
		numberButtons[i].destroy();
	}
	numberButtons = [];
	// Show win/lose
	if (win) {
		LK.showYouWin();
	} else {
		LK.showGameOver();
	}
}
function onNumberButtonPressed(btn) {
	if (!isPlaying) return;
	if (!btn.isActive) return;
	// --- Swapping logic: allow swapping with empty box if adjacent ---
	// Find btn's position in the grid
	var btnIdx = -1;
	for (var i = 0; i < numberButtons.length; i++) {
		if (numberButtons[i] === btn) {
			btnIdx = i;
			break;
		}
	}
	// The grid is 5 cols x 3 rows, last cell is emptyBox
	var cols = 5;
	var rows = 3;
	var btnSize = 240;
	var btnSpacing = 70;
	var gridWidth = cols * btnSize + (cols - 1) * btnSpacing;
	var gridHeight = rows * btnSize + (rows - 1) * btnSpacing;
	var startX = -gridWidth / 2 + btnSize / 2;
	var startY = -gridHeight / 2 + btnSize / 2;
	// Find emptyBox's position in the grid
	var emptyIdx = numberButtons.length; // always last cell
	// Convert idx to (row, col)
	function idxToRC(idx) {
		return {
			row: Math.floor(idx / cols),
			col: idx % cols
		};
	}
	var btnRC = idxToRC(btnIdx);
	var emptyRC = idxToRC(emptyIdx);
	// Check if adjacent (up, down, left, right)
	var isAdjacent = false;
	if (btnRC.row === emptyRC.row && Math.abs(btnRC.col - emptyRC.col) === 1 || btnRC.col === emptyRC.col && Math.abs(btnRC.row - emptyRC.row) === 1) {
		isAdjacent = true;
	}
	if (isAdjacent) {
		// Swap positions in the grid (swap btn and emptyBox)
		// Swap their x/y
		var tempX = btn.x,
			tempY = btn.y;
		btn.x = emptyBox.x;
		btn.y = emptyBox.y;
		emptyBox.x = tempX;
		emptyBox.y = tempY;
		// Also swap their positions in the numberButtons array
		// (so the logical order matches the visual)
		var tempArr = numberButtons[btnIdx];
		numberButtons[btnIdx] = null; // placeholder
		// Move emptyBox to btnIdx, btn to emptyIdx
		// (numberButtons does not contain emptyBox, so just swap their logical places)
		// To keep logic simple, do nothing to array, as emptyBox is not in numberButtons
		// (if you want to support win condition by order, you may need to update array)
		return; // Do not process as number tap
	}
	// --- Original number tap logic below ---
	if (btn.value === nextNumber) {
		// Correct
		btn.isActive = false;
		btn.flash(0x6fcf97, 300);
		tween(btn, {
			scaleX: 1.2,
			scaleY: 1.2,
			alpha: 0
		}, {
			duration: 250,
			easing: tween.easeOut,
			onFinish: function onFinish() {
				btn.destroy();
			}
		});
		nextNumber++;
		score += 10 + Math.max(0, 5 * (level - 1));
		updateScoreText();
		if (nextNumber > numbersOnBoard) {
			// Level complete
			isPlaying = false;
			// Bonus for perfect
			timeLeft += timeBonus;
			LK.setTimeout(function () {
				if (level >= maxLevel) {
					endGame(true);
				} else {
					startLevel(level + 1);
				}
			}, 600);
		}
	} else {
		// Wrong
		btn.flash(0xeb5757, 400);
		timeLeft -= timePenalty;
		LK.effects.flashObject(btn, 0xeb5757, 300);
		if (timeLeft < 0) {
			timeLeft = 0;
		}
		updateTimerText();
	}
}
// --- Game event handlers ---
game.update = function () {
	if (!isPlaying) return;
	// Timer
	timeLeft -= 1000 / 60;
	if (timeLeft < 0) timeLeft = 0;
	updateTimerText();
	if (timeLeft <= 0) {
		endGame(false);
	}
};
// --- Start game ---
function startGame() {
	score = 0;
	level = 1;
	startLevel(level);
	updateScoreText();
	updateTimerText();
}
startGame();
// --- Touch handling ---
// All handled by NumberButton.down
// --- Horizontal sliding/swipe logic for number row ---
var isDraggingRow = false;
var dragStartX = 0;
var rowStartX = 0;
// Helper: get min/max X of all buttons
function getRowBounds() {
	if (numberButtons.length === 0) return {
		min: 0,
		max: 0
	};
	var minX = numberButtons[0].x,
		maxX = numberButtons[0].x;
	for (var i = 1; i < numberButtons.length; i++) {
		if (numberButtons[i].x < minX) minX = numberButtons[i].x;
		if (numberButtons[i].x > maxX) maxX = numberButtons[i].x;
	}
	return {
		min: minX,
		max: maxX
	};
}
// Only allow sliding if game is playing
game.down = function (x, y, obj) {
	if (!isPlaying) return;
	// Only start drag if touch is on the row area
	var rowY = numberButtons.length > 0 ? numberButtons[0].y : 0;
	if (Math.abs(y - rowY) < 180) {
		isDraggingRow = true;
		dragStartX = x;
		rowStartX = numberButtons.length > 0 ? numberButtons[0].x : 0;
	}
};
game.move = function (x, y, obj) {
	if (!isPlaying) return;
	if (!isDraggingRow) return;
	var dx = x - dragStartX;
	// Move all buttons horizontally
	for (var i = 0; i < numberButtons.length; i++) {
		numberButtons[i].x = rowStartX + dx + i * (btnSize + btnSpacing);
	}
	// Prevent row from sliding out of bounds
	var bounds = getRowBounds();
	var leftLimit = boardPadding + 110;
	var rightLimit = 2048 - boardPadding - 110;
	if (bounds.min < leftLimit) {
		var offset = leftLimit - bounds.min;
		for (var i = 0; i < numberButtons.length; i++) {
			numberButtons[i].x += offset;
		}
	}
	if (bounds.max > rightLimit) {
		var offset = rightLimit - bounds.max;
		for (var i = 0; i < numberButtons.length; i++) {
			numberButtons[i].x += offset;
		}
	}
};
game.up = function (x, y, obj) {
	isDraggingRow = false;
};
// --- Storage (for future highscore etc.) ---
// Not implemented in MVP
// --- Music/Sound ---
// Not implemented in MVP
// --- End of file ---

===================================================================
--- original.js
+++ change.js
@@ -274,8 +274,62 @@
 }
 function onNumberButtonPressed(btn) {
 	if (!isPlaying) return;
 	if (!btn.isActive) return;
+	// --- Swapping logic: allow swapping with empty box if adjacent ---
+	// Find btn's position in the grid
+	var btnIdx = -1;
+	for (var i = 0; i < numberButtons.length; i++) {
+		if (numberButtons[i] === btn) {
+			btnIdx = i;
+			break;
+		}
+	}
+	// The grid is 5 cols x 3 rows, last cell is emptyBox
+	var cols = 5;
+	var rows = 3;
+	var btnSize = 240;
+	var btnSpacing = 70;
+	var gridWidth = cols * btnSize + (cols - 1) * btnSpacing;
+	var gridHeight = rows * btnSize + (rows - 1) * btnSpacing;
+	var startX = -gridWidth / 2 + btnSize / 2;
+	var startY = -gridHeight / 2 + btnSize / 2;
+	// Find emptyBox's position in the grid
+	var emptyIdx = numberButtons.length; // always last cell
+	// Convert idx to (row, col)
+	function idxToRC(idx) {
+		return {
+			row: Math.floor(idx / cols),
+			col: idx % cols
+		};
+	}
+	var btnRC = idxToRC(btnIdx);
+	var emptyRC = idxToRC(emptyIdx);
+	// Check if adjacent (up, down, left, right)
+	var isAdjacent = false;
+	if (btnRC.row === emptyRC.row && Math.abs(btnRC.col - emptyRC.col) === 1 || btnRC.col === emptyRC.col && Math.abs(btnRC.row - emptyRC.row) === 1) {
+		isAdjacent = true;
+	}
+	if (isAdjacent) {
+		// Swap positions in the grid (swap btn and emptyBox)
+		// Swap their x/y
+		var tempX = btn.x,
+			tempY = btn.y;
+		btn.x = emptyBox.x;
+		btn.y = emptyBox.y;
+		emptyBox.x = tempX;
+		emptyBox.y = tempY;
+		// Also swap their positions in the numberButtons array
+		// (so the logical order matches the visual)
+		var tempArr = numberButtons[btnIdx];
+		numberButtons[btnIdx] = null; // placeholder
+		// Move emptyBox to btnIdx, btn to emptyIdx
+		// (numberButtons does not contain emptyBox, so just swap their logical places)
+		// To keep logic simple, do nothing to array, as emptyBox is not in numberButtons
+		// (if you want to support win condition by order, you may need to update array)
+		return; // Do not process as number tap
+	}
+	// --- Original number tap logic below ---
 	if (btn.value === nextNumber) {
 		// Correct
 		btn.isActive = false;
 		btn.flash(0x6fcf97, 300);