User prompt
when correct use correct sound and when wrong use wrong sound
User prompt
when card is swiped use card sound
User prompt
Migrate to the latest version of LK
Code edit (2 edits merged)
Please save this source code
User prompt
make previewnextcard size 5% smaller
Code edit (1 edits merged)
Please save this source code
User prompt
next card should stop at the exact same position of current card before moving left.
Code edit (3 edits merged)
Please save this source code
User prompt
Fix Bug: 'TypeError: Cannot read properties of null (reading 'y')' in this line: 'if (Math.abs(nextCard.y - 2732 / 2 + 100) <= 20) {' Line Number: 315
Code edit (11 edits merged)
Please save this source code
User prompt
Fix Bug: 'TypeError: Cannot read properties of null (reading 'y')' in this line: 'if (Math.abs(nextCard.y - 2732 / 2 + 100) <= 20) {' Line Number: 315
Code edit (1 edits merged)
Please save this source code
/**** * Classes ****/ var Card = Container.expand(function () { var self = Container.call(this); self.setSuit = function (suit) { self.suit = suit; var suitAsset = self.createAsset('suit_' + suit, { anchorX: 0.5, anchorY: 0.5 }); suitAsset.x = 0; suitAsset.y = 0; self.addChild(suitAsset); }; var cardGraphics = self.attachAsset('card', { anchorX: 0.5, anchorY: 0.5 }); cardGraphics.anchor.set(0.5, 0.5); var valueText = new Text2('', { size: 170, fill: '#000000', font: 'bold', anchor: { x: 0, y: 0 } }); valueText.anchor.set(0, 0); valueText.x = -cardGraphics.width / 2 + 90; valueText.y = -cardGraphics.height / 2 + 40; var valueText2 = new Text2('', { size: 170, fill: '#000000', font: 'bold', anchor: { x: 1, y: 1 } }); valueText2.anchor.set(0, 0); valueText2.x = cardGraphics.width / 2 - 90; valueText2.y = cardGraphics.height / 2 - 40; 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 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 MiniCard = Container.expand(function () { var self = Container.call(this); self.setSuit = function (suit) { self.suit = suit; var suitAsset = self.createAsset('suit_' + suit, { anchorX: 0.5, anchorY: 0.5 }); suitAsset.scale.x = 0.25; suitAsset.scale.y = 0.25; suitAsset.x = 0; suitAsset.y = 20; self.addChild(suitAsset); }; var cardGraphics = self.attachAsset('card', { anchorX: 0.5, anchorY: 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; }); var Player = Container.expand(function () { var self = Container.call(this); var playerGraphics = self.attachAsset('player', { anchorX: 0.5, anchorY: 0.5 }); self.score = 0; self.updateScore = function (score) { self.score = score; }; }); var PreviewNextCard = Container.expand(function () { var self = Container.call(this); self.alpha = 0.5; self.setSuit = function (suit) { if (self.suitAsset) { self.suitAsset.destroy(); } self.suit = suit; self.suitAsset = self.createAsset('suit_' + suit, { anchorX: 0.5, anchorY: 0.5 }); self.suitAsset.scale.x *= 0.98; self.suitAsset.scale.y *= 0.98; self.suitAsset.x = 0; self.suitAsset.y = 0; self.addChild(self.suitAsset); }; var cardGraphics = self.attachAsset('card', { anchorX: 0.5, anchorY: 0.5 }); cardGraphics.anchor.set(0.5, 0.5); cardGraphics.scale.x *= 0.98; cardGraphics.scale.y *= 0.98; 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 + 150; nextText.x = -120; self.addChild(nextText); }); var StartMessageDisplay = Container.expand(function () { var self = Container.call(this); var background = self.attachAsset('start_message_background', { anchorX: 0.5, anchorY: 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); }; }); /**** * Initialize Game ****/ var game = new LK.Game({ backgroundColor: 0x000000 }); /**** * Game Code ****/ var player = new Player(); var background = game.attachAsset('background', { anchorX: 0.5, anchorY: 0.5 }); background.x = 2048 / 2; background.y = 2732 / 2; game.addChild(background); var canSwipe = true; game.on('up', function (x, y, obj) { if (!canSwipe) { return; } var endY = game.toLocal(obj.global).y; if (startY === null || endY === null || Math.abs(startY - endY) < 50) { return; } canSwipe = false; LK.setTimeout(function () { previewNextCard.alpha = 0.5; }, 1000); LK.setTimeout(function () { canSwipe = true; }, 1500); 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); LK.setTimeout(function () { if (deck.length > 0) { previewNextCard.setSuit(deck[deck.length - 1].suit); } }, 1000); console.log('Current Card:', 'Value:', currentCard.value, 'Suit:', currentCard.suit); LK.on('tick', function moveCard() { if (nextCard && 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 (x, y, obj) { startY = game.toLocal(obj.global).y; });
===================================================================
--- original.js
+++ change.js
@@ -1,118 +1,23 @@
/****
* Classes
-****/
-var PreviewNextCard = Container.expand(function () {
- var self = Container.call(this);
- self.alpha = 0.5;
- self.setSuit = function (suit) {
- if (self.suitAsset) {
- self.suitAsset.destroy();
- }
- self.suit = suit;
- self.suitAsset = self.createAsset('suit_' + suit, 'Suit Asset', 0.5, 0.5);
- self.suitAsset.scale.x *= 0.98;
- self.suitAsset.scale.y *= 0.98;
- self.suitAsset.x = 0;
- self.suitAsset.y = 0;
- self.addChild(self.suitAsset);
- };
- var cardGraphics = self.createAsset('card', 'Card Graphics', 0.5, 0.5);
- cardGraphics.anchor.set(0.5, 0.5);
- cardGraphics.scale.x *= 0.98;
- cardGraphics.scale.y *= 0.98;
- 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 + 150;
- 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);
+ var suitAsset = self.createAsset('suit_' + suit, {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
suitAsset.x = 0;
suitAsset.y = 0;
self.addChild(suitAsset);
};
- var cardGraphics = self.createAsset('card', 'Card Graphics', 0.5, 0.5);
+ var cardGraphics = self.attachAsset('card', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
cardGraphics.anchor.set(0.5, 0.5);
var valueText = new Text2('', {
size: 170,
fill: '#000000',
@@ -173,28 +78,49 @@
valueText2.setText(displayValue.toString());
};
self.value = 0;
});
-var Player = Container.expand(function () {
+var MessageDisplay = 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 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 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);
+ var suitAsset = self.createAsset('suit_' + suit, {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
suitAsset.scale.x = 0.25;
suitAsset.scale.y = 0.25;
suitAsset.x = 0;
suitAsset.y = 20;
self.addChild(suitAsset);
};
- var cardGraphics = self.createAsset('card', 'Mini Card Graphics', 0.5, 0.5);
+ var cardGraphics = self.attachAsset('card', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
cardGraphics.scale.x = 0.125;
cardGraphics.scale.y = 0.125;
cardGraphics.anchor.set(0.5, 0.5);
var valueText = new Text2('', {
@@ -225,30 +151,130 @@
valueText.setText(displayValue.toString());
};
self.value = 0;
});
+var Player = Container.expand(function () {
+ var self = Container.call(this);
+ var playerGraphics = self.attachAsset('player', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.score = 0;
+ self.updateScore = function (score) {
+ self.score = score;
+ };
+});
+var PreviewNextCard = Container.expand(function () {
+ var self = Container.call(this);
+ self.alpha = 0.5;
+ self.setSuit = function (suit) {
+ if (self.suitAsset) {
+ self.suitAsset.destroy();
+ }
+ self.suit = suit;
+ self.suitAsset = self.createAsset('suit_' + suit, {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ self.suitAsset.scale.x *= 0.98;
+ self.suitAsset.scale.y *= 0.98;
+ self.suitAsset.x = 0;
+ self.suitAsset.y = 0;
+ self.addChild(self.suitAsset);
+ };
+ var cardGraphics = self.attachAsset('card', {
+ anchorX: 0.5,
+ anchorY: 0.5
+ });
+ cardGraphics.anchor.set(0.5, 0.5);
+ cardGraphics.scale.x *= 0.98;
+ cardGraphics.scale.y *= 0.98;
+ 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 + 150;
+ nextText.x = -120;
+ self.addChild(nextText);
+});
+var StartMessageDisplay = Container.expand(function () {
+ var self = Container.call(this);
+ var background = self.attachAsset('start_message_background', {
+ anchorX: 0.5,
+ anchorY: 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);
+ };
+});
/****
* 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);
+var background = game.attachAsset('background', {
+ anchorX: 0.5,
+ anchorY: 0.5
+});
background.x = 2048 / 2;
background.y = 2732 / 2;
game.addChild(background);
var canSwipe = true;
-game.on('up', function (obj) {
+game.on('up', function (x, y, obj) {
if (!canSwipe) {
return;
}
- var endY = obj.event.getLocalPosition(game).y;
+ var endY = game.toLocal(obj.global).y;
if (startY === null || endY === null || Math.abs(startY - endY) < 50) {
return;
}
canSwipe = false;
@@ -409,9 +435,8 @@
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);
@@ -424,7 +449,7 @@
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;
+game.on('down', function (x, y, obj) {
+ startY = game.toLocal(obj.global).y;
});
\ No newline at end of file
Green casino baize. To be used as background. No shade. 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.
white rectangle flat. rounded corners. no background. no shadow. card shape.. Single Game Texture. In-Game asset. 2d. Blank background. High contrast. No shadows.