/**** 
* Classes
****/ 
var ItemFull = Container.expand(function () {
	var self = Container.call(this);
	// Add a move function to update itemFullDrag position on mouse move
	game.move = function (x, y) {
		if (itemFullDrag !== null) {
			// If an object was clicked to be dragged
			itemFullDrag.x = x; // Update its x property when mouse moves
			itemFullDrag.y = Math.max(y, 700); // Restrict y property to not go higher than 700 pixels from the top 
		}
	};
	var itemPlace = self.attachAsset('ItemPlace', {
		anchorX: 0.5,
		anchorY: 1,
		x: 0,
		y: 0,
		width: 282,
		height: 282,
		alpha: 1,
		tint: 0xb40421
	});
	// Create and attach NewItem text
	var newItem = new Text2('3', {
		size: 170,
		fill: 0xFFFFFF,
		font: "Arial Black"
	});
	newItem.Type = function () {
		var rand = Math.random();
		if (rand < 0.34) {
			return 1;
		}
		if (rand < 0.68) {
			return 2;
		}
		if (rand < 0.84) {
			return 3;
		}
		return 4;
	}();
	newItem.anchor.set(0.5, 1);
	newItem.x = itemPlace.x;
	newItem.y = itemPlace.y - itemPlace.height / 2 + 86;
	self.addChild(newItem);
	// Set tint and text based on type
	if (newItem.Type === 1) {
		itemPlace.tint = 0x12893E;
		newItem.setText(Math.floor(Math.random() * 5 + 3).toString());
	} else if (newItem.Type === 2) {
		itemPlace.tint = 0xb40421;
		newItem.setText(Math.floor(Math.random() * 8 + 1).toString());
	} else if (newItem.Type === 3) {
		itemPlace.tint = 0xe07400;
		newItem.setText('2');
	} else if (newItem.Type === 4) {
		itemPlace.tint = 0x174F3C;
		newItem.setText(Math.floor(Math.random() * 4 + 3).toString());
	}
	// Add a down function to set itemFullDrag to self
	self.down = function (x, y, obj) {
		itemFullDrag = self;
		itemFullDragInitialPosition = {
			x: self.x,
			y: self.y
		}; // Store initial position
		LK.setScore(LK.getScore() - 10);
		scoreTxt.setText(LK.getScore());
	};
});
var SquareWhite = Container.expand(function () {
	var self = Container.call(this);
	self.TintType = 0;
	var squareAsset = self.attachAsset('SquareWhite', {
		anchorX: 0.5,
		anchorY: 0.5,
		scaleX: 2.112 * 1.08 * 1.05 * 1.08 * 1.05,
		scaleY: 2.112 * 1.08 * 1.05 * 1.08 * 1.05,
		alpha: 1,
		tint: 0xedf8ff
	});
	self.Filled = 0;
	// Add a down function to change tint when clicked
	self.down = function () {
		self.TintType = 3; // Set TintType to 3 when clicked
		// Calculate the index of the clicked square in the grid
		var index = grid.indexOf(self);
		// Check and set TintType of the square above
		if (index - gridSize >= 0) {
			grid[index - gridSize].TintType = 33;
		}
		// Check and set TintType of the square below
		if (index + gridSize < grid.length) {
			grid[index + gridSize].TintType = 33;
		}
		// Check and set TintType of the square to the left
		if (index % gridSize !== 0) {
			grid[index - 1].TintType = 33;
		}
		// Check and set TintType of the square to the right
		if ((index + 1) % gridSize !== 0) {
			grid[index + 1].TintType = 33;
		}
		if (self.TintType === 0) {
			squareAsset.tint = 0xedf8ff;
		} else if (self.TintType === 1) {
			squareAsset.tint = 0x12893E;
		} else if (self.TintType === 11) {
			squareAsset.tint = 0x11B34C;
		} else if (self.TintType === 2) {
			squareAsset.tint = 0xB40421;
		} else if (self.TintType === 22) {
			squareAsset.tint = 0xE00025;
		} else if (self.TintType === 3) {
			squareAsset.tint = 0xE07400;
		} else if (self.TintType === 33) {
			squareAsset.tint = 0xF58E20;
		} else if (self.TintType === 4) {
			squareAsset.tint = 0x174F3C;
		} else if (self.TintType === 44) {
			squareAsset.tint = 0x33705C;
		} else {
			squareAsset.tint = 0xfbdb00;
		}
	};
});
var WhiteRectangle = Container.expand(function () {
	var self = Container.call(this);
	var rectangleAsset = self.attachAsset('WhiteRectangle', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	rectangleAsset.scale.set(0.25, 0.7); // Increase the height by 100%
	// Add a variable to store the target scale for each rectangle
	self.targetScale = Math.random() * 1.5;
	// Add an update function to stretch the rectangle
	self.update = function () {
		// Continuously stretch the rectangle towards the target scale
		rectangleAsset.scale.x += (self.targetScale - rectangleAsset.scale.x) * 0.02;
		// When the target scale is reached, pick a new target
		if (Math.abs(rectangleAsset.scale.x - self.targetScale) < 0.005) {
			self.targetScale = Math.random() * 1.5;
		}
	};
});

/**** 
* Initialize Game
****/ 
// Create an array to hold the random numbers
//<Assets used in the game will automatically appear here>
var game = new LK.Game({
	backgroundColor: 0x000000 //Init game with black background 
});

/**** 
* Game Code
****/ 
var painterBackground = LK.getAsset('PainterBackground', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2732 - 15 + 15 + 400 - 100 + 50,
	width: 2048 * 0.9 * 0.95,
	height: 800 * 1.3 * 1.5,
	alpha: 1
});
game.addChild(painterBackground);
var itemFullCenter = new ItemFull();
itemFullCenter.x = 2048 / 2;
itemFullCenter.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullCenter);
var itemFullLeft = new ItemFull();
itemFullLeft.x = 2048 / 2 - 415;
itemFullLeft.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullLeft);
var itemFullRight = new ItemFull();
itemFullRight.x = 2048 / 2 + 415;
itemFullRight.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullRight);
var itemFullDrag = null; // Global variable to track the currently dragged ItemFull
var randomNumberTexts = [];
for (var i = 0; i < 50; i++) {
	// Create a new Text2 object to display the random number
	var randomNumberText = new Text2(Math.floor(Math.random() * 10).toString(), {
		size: 40,
		fill: 0x4A73B5,
		font: "Courier New"
	});
	randomNumberText.anchor.set(0.5, 0.5);
	randomNumberText.x = 2048 / 50 * i;
	randomNumberText.y = 2732 / 2 + 930;
	game.addChild(randomNumberText);
	randomNumberTexts.push(randomNumberText);
}
game.up = function (x, y, obj) {
	console.log("Mouse released at:", x, y); // Log mouse release position
	console.log("Current itemFullDrag:", itemFullDrag); // Log the current item being dragged
	if (itemFullDrag !== null) {
		console.log("Dragging stopped for:", itemFullDrag); // Log the item being dragged
		LK.setScore(LK.getScore() + 10); // Add 10 to the score when dragging stops
		scoreTxt.setText(LK.getScore()); // Update score text
		console.log("Score updated to:", LK.getScore()); // Log the updated score
		if (itemFullDrag.itemPlace) {
			// Check if itemPlace is defined
			var dx = itemFullDrag.itemPlace.x - itemFullDrag.x;
			var dy = itemFullDrag.itemPlace.y - itemFullDrag.y;
			var returnSpeed = 0.2; // Speed factor for returning to original position
			itemFullDrag.x += dx * returnSpeed;
			itemFullDrag.y += dy * returnSpeed;
			if (Math.abs(dx) < 1 && Math.abs(dy) < 1) {
				// Snap to position if close enough
				itemFullDrag.x = itemFullDrag.itemPlace.x;
				itemFullDrag.y = itemFullDrag.itemPlace.y;
			}
			// Move ItemFull to ItemPlace when score is increased by 10
		}
		itemFullDrag = null; // Reset dragging
	}
};
// Add mouseout event to reset itemFullDrag when mouse leaves the game area
game.mouseout = function () {
	itemFullDrag = null;
};
// Add an update function to the game to move the numbers to the left
game.update = function () {
	for (var i = 0; i < randomNumberTexts.length; i++) {
		randomNumberTexts[i].x -= 5;
		if (randomNumberTexts[i].x < 0) {
			randomNumberTexts[i].x = 2048;
		}
	}
	// Update tint types of all SquareWhite instances
	grid.forEach(function (square) {
		if (square.TintType === 0) {
			square.tint = 0xedf8ff;
		} else if (square.TintType === 1) {
			square.tint = 0x12893E;
		} else if (square.TintType === 11) {
			square.tint = 0x11B34C;
		} else if (square.TintType === 2) {
			square.tint = 0xB40421;
		} else if (square.TintType === 22) {
			square.tint = 0xE00025;
		} else if (square.TintType === 3) {
			square.tint = 0xE07400;
		} else if (square.TintType === 33) {
			square.tint = 0xF58E20;
		} else if (square.TintType === 4) {
			square.tint = 0x174F3C;
		} else if (square.TintType === 44) {
			square.tint = 0x33705C;
		} else {
			square.tint = 0xfbdb00;
		}
	});
	// Move ItemFull back to ItemPlace when not being dragged
	if (itemFullDrag === null) {
		[itemFullCenter, itemFullLeft, itemFullRight].forEach(function (itemFull) {
			var dx = itemFull.itemPlace.x - itemFull.x;
			var dy = itemFull.itemPlace.y - itemFull.y;
			itemFull.x += dx * 0.1;
			itemFull.y += dy * 0.1;
		});
	}
};
// Add Concrete as a background to all other items
var concreteBackground = LK.getAsset('Concrete', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2,
	width: 2048,
	height: 2732,
	alpha: 1,
	tint: 0x98bee3
});
game.addChildAt(concreteBackground, 0);
// Add ScoreBack behind the score and make it around 1/3 screen long
// Add score on top of the screen
var scoreTxt = new Text2('0', {
	size: 135,
	fill: 0xFFFFFF,
	font: "Helvetica"
});
var scoreBack = LK.getAsset('ScoreBack', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 20 + 75 - 35 + 20 + 40,
	width: 2048 / 3 * 0.85 * 0.85 * 1.2 * 1.3 * 1.1,
	height: 150 * 1.3 * 1.3 * 1.4 * 1.2 * 0.85 * 1.2 * 1.3 * 1.3 * 1.1 * 1.2,
	alpha: 1
});
game.addChild(scoreBack);
// Add an update function to the game to move the numbers to the left
game.update = function () {
	for (var i = 0; i < randomNumberTexts.length; i++) {
		randomNumberTexts[i].x -= 5;
		if (randomNumberTexts[i].x < 0) {
			randomNumberTexts[i].x = 2048;
		}
	}
};
// Add PainterBackground at the bottom of the screen, above ConcreteBackground
var painterBackground = LK.getAsset('PainterBackground', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2732 - 15 + 15 + 400 - 100 + 50,
	width: 2048 * 0.9 * 0.95,
	height: 800 * 1.3 * 1.5,
	alpha: 1
});
game.addChild(painterBackground);
// Generate String Of Numbers
var randomNumberTexts = [];
for (var i = 0; i < 50; i++) {
	// Create a new Text2 object to display the random number
	var randomNumberText = new Text2(Math.floor(Math.random() * 10).toString(), {
		size: 40,
		fill: 0x4A73B5,
		font: "Courier New"
	});
	randomNumberText.anchor.set(0.5, 0.5);
	randomNumberText.x = 2048 / 50 * i;
	randomNumberText.y = 2732 / 2 + 930;
	game.addChild(randomNumberText);
	randomNumberTexts.push(randomNumberText);
}
// Add brown board to the game
var brownBoardWidth = 400; // Define the width of the BrownBoard asset
var brownBoardHeight = 400; // Define the height of the BrownBoard asset
var brownBoard = LK.getAsset('BrownBoard', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2 - 30,
	scaleX: 2048 / brownBoardWidth,
	scaleY: (6 / 1.5 * 1.1 * 1.1 * 0.95 * brownBoardHeight + 30) / brownBoardHeight,
	alpha: 1
});
// Add main background to the game
var background = LK.getAsset('Background', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 + 20,
	y: 2732 / 2,
	width: 2068 * 1.05,
	height: 2000,
	alpha: 1
});
game.addChild(brownBoard);
game.addChild(background);
// Add gridBack behind the grid, but above Background
var gridBack = LK.getAsset('GridBack', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2 - 5,
	y: 2732 / 2 - 20,
	width: 1400 * 1.2 + 5,
	height: 1400 * 1.1 * 1.1 - 10,
	alpha: 1
});
game.addChild(gridBack);
// Initialize a 7x7 grid of SquareWhite in the middle of the screen
var grid = [];
var gridSize = 6;
var squareSize = 225.28 * 1.08 * 1.08 * 1.05; // Increase the size of the grid by an additional 5%
var startX = (2048 - gridSize * squareSize) / 2 + 110 + 20;
var startY = (2732 - gridSize * squareSize) / 2 + 90 + 20 + 5;
for (var i = 0; i < gridSize; i++) {
	for (var j = 0; j < gridSize; j++) {
		var square = new SquareWhite();
		square.x = startX + i * squareSize;
		square.y = startY + j * squareSize;
		game.addChild(square);
		grid.push(square);
	}
}
// Create 6 WhiteCircle instances and stack them on top of each other in the middle of the screen
for (var i = 0; i < 6; i++) {
	var whiteCircle = LK.getAsset('WhiteCircle', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 2048 / 2 - 910,
		y: 2732 / 2 + i * 300 - 730 - 20 - 5,
		width: 31.5,
		height: 31.5,
		tint: 0x34dbeb
	});
	game.addChild(whiteCircle);
	// Add a randomiser to change the brightness of each WhiteCircle every 1-5 seconds
	(function (whiteCircle) {
		var _changeBrightness = function changeBrightness() {
			var randomTime = Math.random() * 5000 + 3000; // Random time between 3-8 seconds
			whiteCircle.alpha = 0.2; // Change brightness to 20%
			LK.setTimeout(function () {
				whiteCircle.alpha = 1; // Revert brightness back
				LK.setTimeout(_changeBrightness, randomTime); // Schedule next brightness change
			}, randomTime);
		};
		_changeBrightness(); // Start changing brightness
	})(whiteCircle);
}
// Add score on top of the screen
var scoreTxt = new Text2('0', {
	size: 160,
	fill: 0x67BAEB,
	font: "Courier New"
});
// Set score to 0
LK.setScore(100);
scoreTxt.setText(LK.getScore());
scoreTxt.anchor.set(0.5, 0);
scoreTxt.y += 9;
LK.gui.top.addChild(scoreTxt);
// Add LevelCounter text 200 pixels under Score
var levelCounterTxt = new Text2('Goal: 100', {
	size: 65,
	fill: 0xb6bcd6,
	font: "Courier New"
});
levelCounterTxt.anchor.set(0.5, 0);
levelCounterTxt.y = scoreTxt.y + 170;
LK.gui.top.addChild(levelCounterTxt);
for (var i = 0; i < 6; i++) {
	var rectangle = game.addChild(new WhiteRectangle());
	rectangle.x = 2048 - rectangle.width / 2 + 20 - 15; // Move to the right side of the screen and 20 pixels more to the right, then move 15 pixels to the left
	rectangle.y = i * (rectangle.height + 10) + 945; // Move 945 pixels lower
}
// Add ItemFull instances
var itemFullCenter = new ItemFull();
itemFullCenter.x = 2048 / 2;
itemFullCenter.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullCenter);
var itemFullLeft = new ItemFull();
itemFullLeft.x = 2048 / 2 - 415;
itemFullLeft.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullLeft);
var itemFullRight = new ItemFull();
itemFullRight.x = 2048 / 2 + 415;
itemFullRight.y = painterBackground.y - painterBackground.height / 2 + 360;
game.addChild(itemFullRight);
;

===================================================================
--- original.js
+++ change.js
@@ -6,10 +6,10 @@
 	// Add a move function to update itemFullDrag position on mouse move
 	game.move = function (x, y) {
 		if (itemFullDrag !== null) {
 			// If an object was clicked to be dragged
-			itemFullDrag.x = Math.max(0, Math.min(x, 2048)); // Restrict x property within screen width
-			itemFullDrag.y = Math.max(0, Math.min(y, 2732)); // Restrict y property within screen height
+			itemFullDrag.x = x; // Update its x property when mouse moves
+			itemFullDrag.y = Math.max(y, 700); // Restrict y property to not go higher than 700 pixels from the top 
 		}
 	};
 	var itemPlace = self.attachAsset('ItemPlace', {
 		anchorX: 0.5,
@@ -60,8 +60,12 @@
 	}
 	// Add a down function to set itemFullDrag to self
 	self.down = function (x, y, obj) {
 		itemFullDrag = self;
+		itemFullDragInitialPosition = {
+			x: self.x,
+			y: self.y
+		}; // Store initial position
 		LK.setScore(LK.getScore() - 10);
 		scoreTxt.setText(LK.getScore());
 	};
 });