/**** 
* Classes
****/
var PreviewNextCard = Container.expand(function () {
	var self = Container.call(this);
	self.alpha = 0.5;
	self.setSuit = function (suit) {
		self.suit = suit;
		var suitAsset = self.createAsset('suit_' + suit, 'Suit Asset', 0.5, 0.5);
		suitAsset.x = 0;
		suitAsset.y = 0;
		self.addChild(suitAsset);
	};
	var cardGraphics = self.createAsset('card', 'Card Graphics', 0.5, 0.5);
	cardGraphics.anchor.set(0.5, 0.5);
	var valueText = new Text2('', {
		size: 120,
		fill: '#000000',
		font: 'bold',
		anchor: {
			x: 0,
			y: 0
		}
	});
	valueText.anchor.set(0, 0);
	valueText.x = -cardGraphics.width / 2 + 50;
	valueText.y = -cardGraphics.height / 2 + 30;
	self.addChild(valueText);
	self.setValue = function (value) {
		self.value = value;
	};
	self.value = 0;

	// Add 'Next' text on top of the preview card
	var nextText = new Text2('Next', {
		size: 120,
		fill: '#0000000',
		anchor: {
			x: 0.5,
			y: 0
		}
	});
	nextText.y = -cardGraphics.height / 2 - nextText.height / 2 - 20 + 300;
	nextText.x = -120;
	self.addChild(nextText);
});
var StartMessageDisplay = Container.expand(function () {
	var self = Container.call(this);
	var background = self.createAsset('start_message_background', 'Start Message Background', 0.5, 0.5);
	background.x = 1024 + 500;
	background.y = 1266;
	self.addChildAt(background, 0);
	var messageText = new Text2('     Swipe Up\n    for Higher!\n\n           or\n\n    Swipe Down\n     for Lower!', {
		size: 100,
		fill: '#0000000',
		stroke: '#000000',
		strokeThickness: 0,
		anchor: {
			x: 0.5,
			y: 0
		}
	});
	self.addChild(messageText);
	messageText.y = 800;
	messageText.x = 1150;
	self.showMessage = function (message) {
		messageText.setText(message);
		messageText.x = 2000;
		self.addChild(messageText);
		LK.setTimeout(function () {
			messageText.setText('');
		}, 2000);
	};
});
var MessageDisplay = Container.expand(function () {
	var self = Container.call(this);
	var messageText = new Text2('', {
		size: 150,
		fill: '#ffffff',
		stroke: '#000000',
		strokeThickness: 16,
		anchor: {
			x: 0.5,
			y: 0
		}
	});
	self.addChild(messageText);
	messageText.y = 500 - messageText.height;
	self.showMessage = function (message) {
		messageText.setText(message);
		messageText.x = 2048 / 2 - messageText.width / 2;
		self.addChild(messageText);
		LK.setTimeout(function () {
			messageText.setText('');
		}, 2000);
	};
});
var Card = Container.expand(function () {
	var self = Container.call(this);
	self.setSuit = function (suit) {
		self.suit = suit;
		var suitAsset = self.createAsset('suit_' + suit, 'Suit Asset', 0.5, 0.5);
		suitAsset.x = 0;
		suitAsset.y = 0;
		self.addChild(suitAsset);
	};
	var cardGraphics = self.createAsset('card', 'Card Graphics', 0.5, 0.5);
	cardGraphics.anchor.set(0.5, 0.5);
	var valueText = new Text2('', {
		size: 120,
		fill: '#000000',
		font: 'bold',
		anchor: {
			x: 0,
			y: 0
		}
	});
	valueText.anchor.set(0, 0);
	valueText.x = -cardGraphics.width / 2 + 50;
	valueText.y = -cardGraphics.height / 2 + 30;
	var valueText2 = new Text2('', {
		size: 120,
		fill: '#000000',
		font: 'bold',
		anchor: {
			x: 1,
			y: 1
		}
	});
	valueText2.anchor.set(0, 0);
	valueText2.x = cardGraphics.width / 2 - 50;
	valueText2.y = cardGraphics.height / 2 - 30;
	valueText2.scale.y = -1;
	valueText2.scale.x = -1;
	self.addChild(valueText2);
	self.setValue = function (value) {
		self.value = value;
		valueText.setText(value.toString());
		valueText2.setText(value.toString());
	};
	self.addChild(valueText);
	self.addChild(valueText2);
	var suitText = new Text2('', {
		size: 120,
		fill: '#000000',
		anchor: {
			x: 0.5,
			y: 1
		}
	});
	suitText.y = 0;
	self.addChild(suitText);
	self.setValue = function (value) {
		self.value = value;
		var displayValue = value;
		if (value === 11) {
			displayValue = 'J';
		} else if (value === 12) {
			displayValue = 'Q';
		} else if (value === 13) {
			displayValue = 'K';
		} else if (value === 1) {
			displayValue = 'A';
		}
		valueText.setText(displayValue.toString());
		valueText2.setText(displayValue.toString());
	};
	self.value = 0;
});
var Player = Container.expand(function () {
	var self = Container.call(this);
	var playerGraphics = self.createAsset('player', 'Player Graphics', .5, .5);
	self.score = 0;
	self.updateScore = function (score) {
		self.score = score;
	};
});
var MiniCard = Container.expand(function () {
	var self = Container.call(this);
	self.setSuit = function (suit) {
		self.suit = suit;
		var suitAsset = self.createAsset('suit_' + suit, 'Mini Suit Asset', 0.5, 0.5);
		suitAsset.scale.x = 0.125;
		suitAsset.scale.y = 0.125;
		suitAsset.x = 0;
		suitAsset.y = 0;
		self.addChild(suitAsset);
	};
	var cardGraphics = self.createAsset('card', 'Mini Card Graphics', 0.5, 0.5);
	cardGraphics.scale.x = 0.125;
	cardGraphics.scale.y = 0.125;
	cardGraphics.anchor.set(0.5, 0.5);
	var valueText = new Text2('', {
		size: 60,
		fill: '#000000',
		font: 'bold',
		anchor: {
			x: 0,
			y: 0
		}
	});
	valueText.anchor.set(0, 0);
	valueText.x = -cardGraphics.width / 16 + 6.25;
	valueText.y = -cardGraphics.height / 16 + 3.75;
	self.addChild(valueText);
	self.setValue = function (value) {
		self.value = value;
		var displayValue = value;
		if (value === 11) {
			displayValue = 'J';
		} else if (value === 12) {
			displayValue = 'Q';
		} else if (value === 13) {
			displayValue = 'K';
		} else if (value === 1) {
			displayValue = 'A';
		}
		valueText.setText(displayValue.toString());
	};
	self.value = 0;
});

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

/**** 
* Game Code
****/
var player = new Player();
var background = game.createAsset('background', 'Background Asset', 0.5, 0.5);
background.x = 2048 / 2;
background.y = 2732 / 2;
game.addChild(background);
var canSwipe = true;
game.on('up', function (obj) {
	if (!canSwipe) {
		return;
	}
	canSwipe = false;
	previewNextCard.alpha = 0.5;
	LK.setTimeout(function () {
		canSwipe = true;
	}, 1500);
	var endY = obj.event.getLocalPosition(game).y;
	if (startY === null || endY === null) {
		return;
	}
	var swipeDirection = startY - endY;
	var guess = swipeDirection > 0 ? 'higher' : 'lower';
	if (deck.length === 0) {
		LK.showGameOver();
		return;
	}
	nextCard = deck.pop();
	if (!nextCard) {
		return;
	}
	// Decrease the cards left counter
	cardsLeftTxt.setText('Left: ' + deck.length);
	if (startMessageDisplay) {
		startMessageDisplay.destroy();
		startMessageDisplay = null;
	}
	console.log('Next Card:', 'Value:', nextCard.value, 'Suit:', nextCard.suit);
	game.addChild(nextCard);
	nextCard.x = 2048 / 2 + 500;
	nextCard.y = swipeDirection > 0 ? 2732 + nextCard.height - 100 : -nextCard.height - 100;
	var speed = 50;
	var moveCard = function moveCard() {
		if (nextCard) {
			if (swipeDirection > 0 && nextCard.y > 2732 / 2 - 100) {
				nextCard.y -= speed;
			} else if (swipeDirection < 0 && nextCard.y < 2732 / 2 - 100) {
				nextCard.y += speed;
			}
			if (Math.abs(nextCard.y - 2732 / 2 + 100) <= 20) {
				LK.off('tick', moveCard);
			}
		}
	};
	LK.on('tick', moveCard);
	if (game.messageDisplay) {
		game.messageDisplay.destroy();
	}
	game.messageDisplay = game.addChild(new MessageDisplay());
	var correctGuess = guess === 'higher' && nextCard.value >= currentCard.value || guess === 'lower' && nextCard.value <= currentCard.value;
	LK.setTimeout(function () {
		if (correctGuess) {
			player.updateScore(player.score + 1);
			game.updateScoreDisplay(player.score);
			LK.setScore(player.score);
			game.messageDisplay.showMessage('Correct!');
		} else {
			game.messageDisplay.showMessage('Wrong!');
		}
	}, 1000);
	previewNextCard.setSuit(deck[deck.length - 1].suit);
	console.log('Current Card:', 'Value:', currentCard.value, 'Suit:', currentCard.suit);
	LK.on('tick', function moveCard() {
		if (Math.abs(nextCard.y - 2732 / 2 + 100) <= 20) {
			LK.setTimeout(function () {
				LK.on('tick', function moveCardLeft() {
					if (currentCard && currentCard.x > 2048 / 2 - 500) {
						currentCard.x -= 20;
					} else if (currentCard) {
						var miniCard = new MiniCard();
						miniCard.setValue(currentCard.value);
						miniCard.setSuit(currentCard.suit);
						miniCard.x = (game.miniCardX || 110) + miniCard.width / 6;
						miniCard.y = 2732 - miniCard.height - 550 - (game.miniCardYOffset || 0);
						game.addChild(miniCard);
						game.miniCardCount = (game.miniCardCount || 0) + 1;
						if (game.miniCardCount % 13 === 0) {
							game.miniCardX = 110;
							game.miniCardYOffset = (game.miniCardYOffset || 0) - 200;
						} else {
							game.miniCardX = miniCard.x + miniCard.width + 20;
						}
						LK.off('tick', moveCardLeft);
					}
				});
				currentCard = nextCard;
				nextCard = null;
				startY = null;
				if (currentCard) {
					currentCard.x = 2048 / 2;
					currentCard.y = 2732 / 2 - 100;
				}
			}, 500);
			LK.off('tick', moveCard);
		}
	});
});
var scoreTxt = new Text2('0', {
	size: 80,
	fill: "#ffffff",
	stroke: '#000000',
	strokeThickness: 14,
	anchor: {
		x: .5,
		y: .5
	}
});
var cardsLeftTxt = new Text2('Left: 51', {
	size: 80,
	fill: "#ffffff",
	stroke: '#000000',
	strokeThickness: 14,
	anchor: {
		x: 0,
		y: .5
	}
});
scoreTxt.y = 50;
scoreTxt.x = -1340;
cardsLeftTxt.x = scoreTxt.x + scoreTxt.width + 870;
cardsLeftTxt.y = 50;
LK.gui.topRight.addChild(scoreTxt);
LK.gui.topRight.addChild(cardsLeftTxt);
game.updateScoreDisplay = function (score) {
	scoreTxt.setText('Score: ' + score.toString());
};
game.updateScoreDisplay(0);
var startMessageDisplay = new StartMessageDisplay();
game.addChild(startMessageDisplay);
var deck = [];
var currentCard = null;
var nextCard = null;
var suits = ['hearts', 'diamonds', 'clubs', 'spades'];
for (var s = 0; s < suits.length; s++) {
	for (var i = 1; i <= 13; i++) {
		var card = new Card();
		card.setValue(i);
		card.setSuit(suits[s]);
		deck.push(card);
	}
}
deck.sort(function () {
	return 0.5 - Math.random();
});
currentCard = deck[Math.floor(Math.random() * deck.length)];
console.log('First Card:', 'Value:', currentCard.value, 'Suit:', currentCard.suit);
var index = deck.indexOf(currentCard);
deck.splice(index, 1);
game.addChild(currentCard);
currentCard.x = 2048 / 2 - 500;
currentCard.y = 2732 / 2 - 100;
var previewNextCard = new PreviewNextCard();
previewNextCard.alpha = 0;
previewNextCard.setValue(deck[deck.length - 1].value);
previewNextCard.setSuit(deck[deck.length - 1].suit);
previewNextCard.x = 2048 / 2 + 500;
previewNextCard.y = 2732 / 2 - 100;
game.addChild(previewNextCard);
console.log('PreviewNextCard Value:', previewNextCard.value);

// Spawn the miniCard for the current card
var miniCard = new MiniCard();
miniCard.setValue(currentCard.value);
miniCard.setSuit(currentCard.suit);
miniCard.x = 110 + miniCard.width / 6;
miniCard.y = 2732 - miniCard.height - 550;
game.addChild(miniCard);
// Initialize miniCard positioning variables
game.miniCardX = miniCard.x + miniCard.width + 20;
game.miniCardCount = 1;
game.miniCardYOffset = 0;
// Update the cards left counter
cardsLeftTxt.setText('Left: ' + deck.length);
var startY = null;
game.on('down', function (obj) {
	startY = obj.event.getLocalPosition(game).y;
});

===================================================================
--- original.js
+++ change.js
@@ -240,8 +240,9 @@
 	if (!canSwipe) {
 		return;
 	}
 	canSwipe = false;
+	previewNextCard.alpha = 0.5;
 	LK.setTimeout(function () {
 		canSwipe = true;
 	}, 1500);
 	var endY = obj.event.getLocalPosition(game).y;
@@ -387,32 +388,12 @@
 deck.splice(index, 1);
 game.addChild(currentCard);
 currentCard.x = 2048 / 2 - 500;
 currentCard.y = 2732 / 2 - 100;
-if (typeof previewNextCard !== 'undefined') {
-	previewNextCard.destroy();
-}
-if (typeof game.previewNextCardCounter === 'undefined') {
-	game.previewNextCardCounter = 0;
-}
-game.previewNextCardCounter++;
-previewNextCard = new PreviewNextCard();
+var previewNextCard = new PreviewNextCard();
+previewNextCard.alpha = 0;
 previewNextCard.setValue(deck[deck.length - 1].value);
 previewNextCard.setSuit(deck[deck.length - 1].suit);
-// Add a counter display to the previewNextCard
-var previewCounterText = new Text2(game.previewNextCardCounter.toString(), {
-	size: 80,
-	fill: "#ffffff",
-	stroke: '#000000',
-	strokeThickness: 14,
-	anchor: {
-		x: 0.5,
-		y: 0
-	}
-});
-previewCounterText.y = -cardGraphics.height / 2 - previewCounterText.height / 2 - 100;
-previewCounterText.x = 0;
-previewNextCard.addChild(previewCounterText);
 previewNextCard.x = 2048 / 2 + 500;
 previewNextCard.y = 2732 / 2 - 100;
 game.addChild(previewNextCard);
 console.log('PreviewNextCard Value:', previewNextCard.value);