Upit | Learn about creating the game Xmas Pairs with gen AI

var Line = Container.expand(function (startX, startY, endX, endY) {
	var self = Container.call(this);
	var lineGraphics = self.createAsset('line', 'Line Graphics', 0, 0);
	lineGraphics.width = Math.sqrt(Math.pow(endX - startX, 2) + Math.pow(endY - startY, 2));
	lineGraphics.rotation = Math.atan2(endY - startY, endX - startX);
	lineGraphics.x = startX;
	lineGraphics.y = startY;
	self.addChild(lineGraphics);
	return self;
});
var Picture = Container.expand(function (index) {
	var self = Container.call(this);
	self.index = index;
	var pictureGraphics = self.createAsset('picture' + self.index, 'Picture Graphics', .5, .5);
	return self;
});
var Card = Container.expand(function (index) {
	var self = Container.call(this);
	self.shakeAnimation = function (card) {
		if (!card) return;
		var shakeCount = 0;
		var shakeTimes = 7;
		var shakeStrength = 30;
		var originalX = card.x;
		var originalY = card.y;
		function shake() {
			if (shakeCount < shakeTimes) {
				card.x = originalX + (Math.random() - 0.5) * shakeStrength;
				card.y = originalY + (Math.random() - 0.5) * shakeStrength;
				shakeCount++;
				LK.setTimeout(shake, 50);
			} else {
				card.x = originalX;
				card.y = originalY;
				card.scale.x = 1;
				card.scale.y = 1;
				card.children[0].scale.x = 1;
				card.children[0].scale.y = 1;
				if (card === selectedCard1) selectedCard1 = null;
				if (card === selectedCard2) selectedCard2 = null;
				isAnimating = false;
			}
		}
		shake();
	};
	self.id = index;
	self.on('down', function (obj) {
		if (!self.isMatched && !isAnimating) {
			if (!selectedCard1 || selectedCard1 && selectedCard2) {
				if (selectedCard1) {
					selectedCard1.scale.x = 1;
					selectedCard1.scale.y = 1;
					if (selectedCard1 === self) {
						selectedCard1 = null;
						return;
					}
				}
				selectedCard1 = self;
				selectedCard2 = null;
				self.scale.x = 1.2;
				self.scale.y = 1.2;
			} else if (selectedCard1 && !selectedCard2 && selectedCard1 === self) {
				selectedCard1.scale.x = 1;
				selectedCard1.scale.y = 1;
				selectedCard1 = null;
			} else if (selectedCard1 && !selectedCard2 && selectedCard1 !== self) {
				selectedCard2 = self;
				self.scale.x = 1.2;
				self.scale.y = 1.2;
				if (selectedCard1.id == selectedCard2.id) {
					selectedCard1.match(selectedCard2);
					selectedCard2.match(selectedCard1);
					selectedCard1 = null;
					selectedCard2 = null;
				} else {
					isAnimating = true;
					LK.setTimeout(function () {
						self.shakeAnimation(selectedCard1);
						self.shakeAnimation(selectedCard2);
					}, 300);
				}
			}
		}
	});
	var cardGraphics = self.createAsset('card', 'Card Graphics', .5, .5);
	self.isMatched = false;
	self.match = function (otherCard) {
		var line = new Line(self.x, self.y, otherCard.x, otherCard.y);
		LK.stage.addChild(line);
		LK.setTimeout(function () {
			line.destroy();
		}, 1000);
		var tadaAnimationSteps = 10;
		var tadaAnimationCount = 0;
		var scaleDelta = 0.2;
		var tadaDelay = 0;
		var tadaDelayMax = 60;
		self.tadaAnimation = function () {
			if (tadaAnimationCount < tadaAnimationSteps) {
				self.scale.x += tadaAnimationCount % 2 === 0 ? scaleDelta : -scaleDelta;
				self.scale.y += tadaAnimationCount % 2 === 0 ? scaleDelta : -scaleDelta;
				tadaAnimationCount++;
			} else {
				LK.off('tick', self.tadaAnimation);
			}
		};
		self.shrinkAnimation = function () {
			if (self.scale.x > 0.1) {
				self.scale.x -= 0.01;
				self.scale.y -= 0.01;
			} else {
				self.visible = false;
				self.isMatched = true;
				LK.off('tick', self.tadaAnimation);
				LK.off('tick', self.shrinkAnimation);
			}
		};
		LK.on('tick', self.tadaAnimation);
		LK.setTimeout(function () {
			LK.on('tick', self.shrinkAnimation);
		}, tadaAnimationSteps * 100);
	};
	var picture = self.addChild(new Picture(index));
	picture.x = 0;
	picture.y = 0;
	return self;
});
console.log("Principle : A pair matching game is a type of puzzle game where the player has to find and connect two identical images on a board. The player can only connect the images with a straight line or a line that bends at most twice. The line cannot cross any other images on the board. ");
var debug = true;
var currentCol = 0;
var currentRow = 0;
var cardPairs = [];
var cards = [];
var selectedCard1 = null;
var selectedCard2 = null;
var isAnimating = false;
var nbRows = 2;
var nbCols = 3;
var nbCards = nbRows * nbCols;
var cardWidth = 200;
var cardHeight = 200;
var horizontalOffset = 320;
var verticalOffset = 256;
function canBeLinked(cards, card1, card2) {
	if (cards[card1[0]][card1[1]] !== cards[card2[0]][card2[1]]) {
		return false;
	}
	var visited = Array.from({
		length: cards.length
	}, () => Array(cards[0].length).fill(false));
	function dfs(i, j, bends) {
		if (visited[i][j] || bends > 2) {
			return false;
		}
		if (i === card2[0] && j === card2[1]) {
			return true;
		}
		visited[i][j] = true;
		var directions = [[-1, 0], [1, 0], [0, -1], [0, 1]];
		for (let [di, dj] of directions) {
			var ni = i + di, nj = j + dj;
			if (ni >= 0 && ni < cards.length && nj >= 0 && nj < cards[0].length) {
				if (cards[ni][nj] === 0 || ni === card2[0] && nj === card2[1]) {
					if (di !== 0 && dfs(ni, nj, bends + (dj !== 0)) || dj !== 0 && dfs(ni, nj, bends + (di !== 0))) {
						return true;
					}
				}
			}
		}
		visited[i][j] = false;
		return false;
	}
	return dfs(card1[0], card1[1], 0);
}
var Game = Container.expand(function () {
	var self = Container.call(this);
	self.initGame = function () {
		cardPairs = [];
		for (var i = 0; i < nbCards / 2; i++) {
			cardPairs.push(i, i);
		}
		cardPairs = shuffleArray(cardPairs);
		function shuffleArray(array) {
			for (var i = array.length - 1; i > 0; i--) {
				var j = Math.floor(Math.random() * (i + 1));
				var temp = array[i];
				array[i] = array[j];
				array[j] = temp;
			}
			return array;
		}
	};
	self.initGame();
	var debugText = new Text2('', {
		size: 50,
		fill: '#ffffff'
	});
	debugText.anchor.set(0.5, 0);
	LK.gui.topCenter.addChild(debugText);
	self.on('move', function (obj) {
		var pos = obj.event.getLocalPosition(self);
		var col = 1 + Math.floor((pos.x - horizontalOffset + cardWidth / 2) / cardWidth);
		var row = 1 + Math.floor((pos.y - verticalOffset + cardHeight / 2) / cardHeight);
		currentCol = Math.max(1, Math.min(nbCols, col));
		currentRow = Math.max(1, Math.min(nbRows, row));
		if (debug) {
			debugText.setText('Row: ' + currentRow + ' Col: ' + currentCol);
		}
	});
	for (var i = 0; i < nbCards; i++) {
		var card = self.addChild(new Card(cardPairs[i]));
		card.x = horizontalOffset + i % nbCols * cardWidth;
		card.y = verticalOffset + Math.floor(i / nbCols) * cardHeight;
		cards.push(card);
	}
	LK.on('tick', function () {
		if (cards.every(function (card) {
			return card.isMatched;
		})) {
			LK.showGameOver();
		}
	});
});
Creation History

Images

Most played remixes
