/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");
var storage = LK.import("@upit/storage.v1", {
	highScore: 0
});

/**** 
* Classes
****/ 
//Library for using the camera (the background becomes the user's camera video feed) and the microphone. It can access face coordinates for interactive play, as well detect microphone volume / voice interactions
//var facekit = LK.import('@upit/facekit.v1');
//Classes can only be defined here. You cannot create inline classes in the games code.
var Tile = Container.expand(function (assetId, row, col) {
	var self = Container.call(this);
	self.assetId = assetId;
	self.row = row;
	self.col = col;
	self.isMatched = false;
	var tileGraphics = self.attachAsset(assetId, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.down = function (x, y, obj) {
		if (!self.isMatched) {
			tileSelected(self);
		}
	};
	self.destroy = function () {
		self.isMatched = true;
		// tween the tile out or fade it
		tween(self, {
			alpha: 0,
			scaleX: 0,
			scaleY: 0
		}, {
			duration: 300,
			onFinish: function onFinish() {
				// Remove from game scene
				self.parent.removeChild(self);
				// Remove from tiles array
				var index = tiles.indexOf(self);
				if (index > -1) {
					tiles.splice(index, 1);
				}
				// Check for game win condition
				if (tiles.length === 0) {
					LK.showYouWin();
				}
			}
		});
	};
	return self; //You must return self if you want other classes to be able to inherit from this class
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x4682B4 // Init game with a steelblue background
});

/**** 
* Game Code
****/ 
// Global variables
/*
Supported Types:
1. Shape:
- Simple geometric figures with these properties:
* width: (required) pixel width of the shape.
* height: (required) pixel height of the shape.
* color: (required) color of the shape.
* shape: (required) type of shape. Valid options: 'box', 'ellipse'.
2. Image:
- Imported images with these properties:
* width: (required) pixel resolution width.
* height: (required) pixel resolution height.
* id: (required) identifier for the image.
* flipX: (optional) horizontal flip. Valid values: 0 (no flip), 1 (flip).
* flipY: (optional) vertical flip. Valid values: 0 (no flip), 1 (flip).
* orientation: (optional) rotation in multiples of 90 degrees, clockwise. Valid values:
- 0: No rotation.
- 1: Rotate 90 degrees.
- 2: Rotate 180 degrees.
- 3: Rotate 270 degrees.
Note: Width and height remain unchanged upon flipping.
3. Sound:
- Sound effects with these properties:
* id: (required) identifier for the sound.
* volume: (optional) custom volume. Valid values are a float from 0 to 1.
4. Music:
- In contract to sound effects, only one music can be played at a time
- Music is using the same API to initilize just like sound.
- Music loops by default
- Music with these config options:
* id: (required) identifier for the sound.
* volume: (optional) custom volume. Valid values are a float from 0 to 1.
* start: (optional) a float from 0 to 1 used for cropping and indicates the start of the cropping
* end: (optional) a float from 0 to 1 used for cropping and indicates the end of the cropping
*/
// Assets are automatically created and loaded either dynamically during gameplay
// or via static code analysis based on their usage in the code.
// Initialize assets used in this game. Scale them according to what is needed for the game.
//We have access to the following plugins. (Note that the variable names used are mandetory for each plugin)
//Only include the plugins you need to create the game.
//Minimalistic tween library which should be used for animations over time, including tinting / colouring an object, scaling, rotating, or changing any game object property.
//Storage library which should be used for persistent game data
var selectedTile = null;
var tiles = [];
var scoreTxt;
var highScoreTxt;
var gameBoard; // Container for tiles
// Game dimensions
var gameWidth = 2048;
var gameHeight = 2732;
// Tile dimensions and spacing
var tileWidth = 150;
var tileHeight = 150;
var tileSpacing = 20;
// Game board dimensions
var boardCols = 6;
var boardRows = 8;
var boardWidth = boardCols * (tileWidth + tileSpacing) - tileSpacing;
var boardHeight = boardRows * (tileHeight + tileSpacing) - tileSpacing;
// Available nature-themed assets
var availableAssets = ['potato', 'tomato', 'carrot', 'flower', 'tree', 'apple', 'corn', 'mushroom', 'pumpkin', 'sunflower', 'broccoli', 'strawberry'];
// Intro screen container
var introContainer;
// Function to generate the game board layout
function generateBoardLayout(rows, cols) {
	var layout = [];
	var allTiles = [];
	var totalTiles = rows * cols;
	// Ensure an even number of tiles
	if (totalTiles % 2 !== 0) {
		totalTiles--;
		// You might want to handle this case, e.g., reduce a row or column
	}
	// Create pairs of tiles
	for (var i = 0; i < totalTiles / 2; i++) {
		var randomAssetId = availableAssets[Math.floor(Math.random() * availableAssets.length)];
		allTiles.push(randomAssetId);
		allTiles.push(randomAssetId);
	}
	// Shuffle the tiles
	for (var i = allTiles.length - 1; i > 0; i--) {
		var j = Math.floor(Math.random() * (i + 1));
		var temp = allTiles[i];
		allTiles[i] = allTiles[j];
		allTiles[j] = temp;
	}
	// Arrange tiles into a grid layout
	for (var r = 0; r < rows; r++) {
		layout[r] = [];
		for (var c = 0; c < cols; c++) {
			if (allTiles.length > 0) {
				layout[r][c] = allTiles.pop();
			} else {
				layout[r][c] = null; // Handle odd number of tiles if needed
			}
		}
	}
	return layout;
}
// Function to create and position tiles
function createBoard(layout) {
	gameBoard = new Container();
	game.addChild(gameBoard);
	// Center the board on the screen
	gameBoard.x = (gameWidth - boardWidth) / 2;
	gameBoard.y = (gameHeight - boardHeight) / 2 + 100; // Adjust vertical position to avoid top menu
	for (var r = 0; r < layout.length; r++) {
		for (var c = 0; c < layout[r].length; c++) {
			var assetId = layout[r][c];
			if (assetId) {
				var tile = new Tile(assetId, r, c);
				tile.x = c * (tileWidth + tileSpacing) + tileWidth / 2;
				tile.y = r * (tileHeight + tileSpacing) + tileHeight / 2;
				gameBoard.addChild(tile);
				tiles.push(tile);
			}
		}
	}
}
// Function to handle tile selection and matching
function tileSelected(tile) {
	if (selectedTile === null) {
		selectedTile = tile;
		// Highlight the selected tile (optional)
		// tween(selectedTile, { tint: 0xffff00 }, { duration: 100 });
	} else if (selectedTile === tile) {
		// Deselect the same tile
		// tween(selectedTile, { tint: 0xffffff }, { duration: 100 });
		selectedTile = null;
	} else {
		// Check for a match
		if (selectedTile.assetId === tile.assetId) {
			// Match found
			LK.getSound('match_sound').play();
			LK.setScore(LK.getScore() + 10);
			scoreTxt.setText('Score: ' + LK.getScore());
			selectedTile.destroy();
			tile.destroy();
			selectedTile = null;
		} else {
			// No match
			LK.getSound('no_match_sound').play();
			// Optionally indicate no match (e.g., flash tiles red)
			// tween(selectedTile, { tint: 0xff0000 }, { duration: 200, onFinish: function() { tween(selectedTile, { tint: 0xffffff }, { duration: 200 }); } });
			// tween(tile, { tint: 0xff0000 }, { duration: 200, onFinish: function() { tween(tile, { tint: 0xffffff }, { duration: 200 }); } });
			selectedTile = null;
		}
	}
}
// Initialize score and high score display (created but not shown until game starts)
scoreTxt = new Text2('Score: 0', {
	size: 80,
	fill: 0xFFFFFF
});
scoreTxt.anchor.set(0.5, 0);
scoreTxt.y = 20; // Position below the top menu area
highScoreTxt = new Text2('High Score: ' + storage.highScore, {
	size: 80,
	fill: 0xFFFFFF
});
highScoreTxt.anchor.set(0.5, 0);
highScoreTxt.y = 120; // Position below the score display
// Create intro container
introContainer = new Container();
game.addChild(introContainer);
// Add intro background
var introBg = introContainer.attachAsset('Introbackground', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: gameWidth / 2,
	y: gameHeight / 2
});
// Get the actual dimensions of the background asset
var bgWidth = introBg.width;
var bgHeight = introBg.height;
// Calculate scale to cover the entire screen
var scaleX = gameWidth / bgWidth;
var scaleY = gameHeight / bgHeight;
// Use the larger scale to ensure full coverage
var scale = Math.max(scaleX, scaleY);
// Apply the scale
introBg.scale.set(scale, scale);
// Start button with image asset
var startButton = introContainer.attachAsset('Startbutton', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: gameWidth / 2,
	y: gameHeight - 200 // 200px from bottom
});
// Smooth continuous blinking animation using tween
function animateStartButton() {
	tween(startButton, {
		alpha: 0.3
	}, {
		duration: 1000,
		easing: tween.easeInOut,
		onFinish: function onFinish() {
			tween(startButton, {
				alpha: 1
			}, {
				duration: 1000,
				easing: tween.easeInOut,
				onFinish: animateStartButton // Loop the animation
			});
		}
	});
}
animateStartButton();
// Handle tap on start button to begin the game
startButton.down = function (x, y, obj) {
	tween.stop(startButton); // Stop the blinking animation
	introContainer.parent.removeChild(introContainer);
	startGame();
};
// High score button beside start button from the left side by 600px
var highScoreButton = introContainer.attachAsset('Highscorebutton', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: gameWidth / 2 - 600,
	// 100px to the left of start button
	y: gameHeight - 200 // Same Y position as start button
});
// Handle tap on high score button
highScoreButton.down = function (x, y, obj) {
	// Create high score display overlay
	var highScoreOverlay = new Container();
	introContainer.addChild(highScoreOverlay);
	// Create a dark semi-transparent background for scores
	var bgOverlay = LK.getAsset('box', {
		width: gameWidth,
		height: gameHeight,
		color: 0x000000,
		shape: 'box',
		anchorX: 0.5,
		anchorY: 0.5,
		x: gameWidth / 2,
		y: gameHeight / 2,
		alpha: 0.8
	});
	highScoreOverlay.addChild(bgOverlay);
	// High score text
	var hsText = new Text2('High Score\n' + storage.highScore, {
		size: 150,
		fill: 0xFFFFFF
	});
	hsText.anchor.set(0.5, 0.5);
	hsText.x = gameWidth / 2;
	hsText.y = gameHeight / 2;
	highScoreOverlay.addChild(hsText);
	// Close button
	var closeText = new Text2('Tap to Close', {
		size: 80,
		fill: 0xFFFF00
	});
	closeText.anchor.set(0.5, 0.5);
	closeText.x = gameWidth / 2;
	closeText.y = gameHeight / 2 + 200;
	highScoreOverlay.addChild(closeText);
	// Handle tap to close overlay
	highScoreOverlay.down = function (x, y, obj) {
		highScoreOverlay.parent.removeChild(highScoreOverlay);
	};
};
// Function to start the game
function startGame() {
	LK.setScore(0);
	scoreTxt.setText('Score: 0');
	LK.gui.top.addChild(scoreTxt);
	LK.gui.top.addChild(highScoreTxt);
	var boardLayout = generateBoardLayout(boardRows, boardCols);
	createBoard(boardLayout);
	LK.playMusic('bg_music');
}
// Game update loop (currently not needed for this game's logic, but included for structure)
game.update = function () {
	// Update high score if current score is higher
	if (LK.getScore() > storage.highScore) {
		storage.highScore = LK.getScore();
		highScoreTxt.setText('High Score: ' + storage.highScore);
	}
};

===================================================================
--- original.js
+++ change.js
@@ -291,21 +291,21 @@
 highScoreButton.down = function (x, y, obj) {
 	// Create high score display overlay
 	var highScoreOverlay = new Container();
 	introContainer.addChild(highScoreOverlay);
-	// Background for high score display
-	var bgOverlay = highScoreOverlay.attachAsset('Introbackground', {
+	// Create a dark semi-transparent background for scores
+	var bgOverlay = LK.getAsset('box', {
+		width: gameWidth,
+		height: gameHeight,
+		color: 0x000000,
+		shape: 'box',
 		anchorX: 0.5,
 		anchorY: 0.5,
 		x: gameWidth / 2,
 		y: gameHeight / 2,
-		alpha: 0.9
+		alpha: 0.8
 	});
-	// Scale overlay background to cover screen
-	var overlayScaleX = gameWidth / bgOverlay.width;
-	var overlayScaleY = gameHeight / bgOverlay.height;
-	var overlayScale = Math.max(overlayScaleX, overlayScaleY);
-	bgOverlay.scale.set(overlayScale, overlayScale);
+	highScoreOverlay.addChild(bgOverlay);
 	// High score text
 	var hsText = new Text2('High Score\n' + storage.highScore, {
 		size: 150,
 		fill: 0xFFFFFF