/**** 
* Classes
****/ 
var HomeScreen = Container.expand(function () {
	var self = Container.call(this);
	// Title
	var title = new Text2('Ping Pong Ball', {
		size: 100,
		fill: 0xFFFFFF
	});
	title.anchor.set(0.5, 0.5);
	title.x = 1024;
	title.y = 400;
	self.addChild(title);
	// Developer info button (person logo)
	var developerBtn = self.attachAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1800,
		y: 200,
		scaleX: 0.5,
		scaleY: 0.5
	});
	var developerText = new Text2('👤', {
		size: 40,
		fill: 0xFFFFFF
	});
	developerText.anchor.set(0.5, 0.5);
	developerText.x = 1800;
	developerText.y = 200;
	self.addChild(developerText);
	// Difficulty buttons
	var easyBtn = self.attachAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 800
	});
	var easyText = new Text2('EASY', {
		size: 40,
		fill: 0xFFFFFF
	});
	easyText.anchor.set(0.5, 0.5);
	easyText.x = 1024;
	easyText.y = 800;
	self.addChild(easyText);
	var mediumBtn = self.attachAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 900
	});
	var mediumText = new Text2('MEDIUM', {
		size: 40,
		fill: 0xFFFFFF
	});
	mediumText.anchor.set(0.5, 0.5);
	mediumText.x = 1024;
	mediumText.y = 900;
	self.addChild(mediumText);
	var hardBtn = self.attachAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1000
	});
	var hardText = new Text2('HARD', {
		size: 40,
		fill: 0xFFFFFF
	});
	hardText.anchor.set(0.5, 0.5);
	hardText.x = 1024;
	hardText.y = 1000;
	self.addChild(hardText);
	// Add click handlers for difficulty buttons
	easyBtn.down = function (x, y, obj) {
		selectedDifficulty = 'easy';
		gameState = 'nameEntry';
		// Show name entry popup
		showNameEntryPopup();
	};
	mediumBtn.down = function (x, y, obj) {
		selectedDifficulty = 'medium';
		gameState = 'nameEntry';
		// Show name entry popup
		showNameEntryPopup();
	};
	hardBtn.down = function (x, y, obj) {
		selectedDifficulty = 'hard';
		gameState = 'nameEntry';
		// Show name entry popup
		showNameEntryPopup();
	};
	// Add click handler for developer info button
	developerBtn.down = function (x, y, obj) {
		showDeveloperPopup();
	};
	return self;
});
// Game states
var Preloader = Container.expand(function () {
	var self = Container.call(this);
	// Logo
	var logo = self.attachAsset('preloaderLogo', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 800
	});
	// Title
	var title = new Text2('Ping Pong Ball', {
		size: 80,
		fill: 0xFFFFFF
	});
	title.anchor.set(0.5, 0.5);
	title.x = 1024;
	title.y = 1000;
	self.addChild(title);
	// Loading bar background
	var loadingBarBg = self.attachAsset('loadingBarBg', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1200
	});
	// Loading bar fill
	var loadingBarFill = self.attachAsset('loadingBarFill', {
		anchorX: 0,
		anchorY: 0.5,
		x: 824,
		y: 1200,
		scaleX: 0
	});
	// Percentage text
	var percentageText = new Text2('0%', {
		size: 40,
		fill: 0xFFFFFF
	});
	percentageText.anchor.set(0.5, 0.5);
	percentageText.x = 1024;
	percentageText.y = 1300;
	self.addChild(percentageText);
	self.progress = 0;
	self.targetProgress = 0;
	self.setProgress = function (percent) {
		self.targetProgress = percent;
	};
	self.update = function () {
		if (self.progress < self.targetProgress) {
			self.progress += 2;
			if (self.progress > self.targetProgress) {
				self.progress = self.targetProgress;
			}
			loadingBarFill.scaleX = self.progress / 100;
			percentageText.setText(Math.floor(self.progress) + '%');
		}
	};
	return self;
});

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

/**** 
* Game Code
****/ 
// Game states
// Preloader Assets
// Game Assets
// Sound effects
var gameState = 'preloader'; // preloader, home, nameEntry, playing, gameOver, victory
var selectedDifficulty = 'easy';
var playerName = '';
var loadingProgress = 0;
// UI elements
var preloader = null;
var homeScreen = null;
// Initialize preloader
if (gameState === 'preloader') {
	preloader = game.addChild(new Preloader());
	LK.getSound('loadingSound').play();
	// Simulate loading progress
	var loadingTimer = LK.setInterval(function () {
		loadingProgress += 5;
		preloader.setProgress(loadingProgress);
		if (loadingProgress >= 100) {
			LK.clearInterval(loadingTimer);
			// Transition to home screen after loading
			LK.setTimeout(function () {
				gameState = 'home';
				preloader.destroy();
				homeScreen = game.addChild(new HomeScreen());
			}, 500);
		}
	}, 100);
}
// Name entry popup
function showNameEntryPopup() {
	var namePopup = game.addChild(LK.getAsset('popup', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1366
	}));
	var nameTitle = new Text2('Enter Your Name', {
		size: 50,
		fill: 0xFFFFFF
	});
	nameTitle.anchor.set(0.5, 0.5);
	nameTitle.x = 1024;
	nameTitle.y = 1200;
	game.addChild(nameTitle);
	var nameInput = new Text2('Player', {
		size: 40,
		fill: 0xFFFFFF
	});
	nameInput.anchor.set(0.5, 0.5);
	nameInput.x = 1024;
	nameInput.y = 1300;
	game.addChild(nameInput);
	// Add input background for better visibility
	var inputBg = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1300,
		scaleX: 1.5,
		scaleY: 0.8
	}));
	// Variables for text editing
	var isEditing = false;
	var currentText = 'Player';
	var cursorVisible = true;
	var cursorTimer = null;
	// Function to update display text with cursor
	function updateNameDisplay() {
		if (isEditing && cursorVisible) {
			nameInput.setText(currentText + '_');
		} else {
			nameInput.setText(currentText);
		}
	}
	// Make input clickable to start editing
	inputBg.down = function (x, y, obj) {
		if (!isEditing) {
			isEditing = true;
			currentText = '';
			// Start cursor blinking
			cursorTimer = LK.setInterval(function () {
				cursorVisible = !cursorVisible;
				updateNameDisplay();
			}, 500);
			updateNameDisplay();
		}
	};
	// Simple character input simulation (tap to cycle through alphabet)
	var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
	var currentChar = 0;
	var charCycleBtn = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 900,
		y: 1300,
		scaleX: 0.4,
		scaleY: 0.4
	}));
	var charCycleText = new Text2('A', {
		size: 30,
		fill: 0xFFFFFF
	});
	charCycleText.anchor.set(0.5, 0.5);
	charCycleText.x = 900;
	charCycleText.y = 1300;
	game.addChild(charCycleText);
	// Add character button
	var addCharBtn = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1150,
		y: 1300,
		scaleX: 0.4,
		scaleY: 0.4
	}));
	var addCharText = new Text2('+', {
		size: 30,
		fill: 0xFFFFFF
	});
	addCharText.anchor.set(0.5, 0.5);
	addCharText.x = 1150;
	addCharText.y = 1300;
	game.addChild(addCharText);
	// Delete character button
	var deleteCharBtn = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1150,
		y: 1380,
		scaleX: 0.4,
		scaleY: 0.4
	}));
	var deleteCharText = new Text2('-', {
		size: 30,
		fill: 0xFFFFFF
	});
	deleteCharText.anchor.set(0.5, 0.5);
	deleteCharText.x = 1150;
	deleteCharText.y = 1380;
	game.addChild(deleteCharText);
	// Cycle through alphabet
	charCycleBtn.down = function (x, y, obj) {
		if (isEditing) {
			currentChar = (currentChar + 1) % alphabet.length;
			charCycleText.setText(alphabet[currentChar]);
		}
	};
	// Add current character to name
	addCharBtn.down = function (x, y, obj) {
		if (isEditing && currentText.length < 12) {
			currentText += alphabet[currentChar];
			updateNameDisplay();
		}
	};
	// Delete last character
	deleteCharBtn.down = function (x, y, obj) {
		if (isEditing && currentText.length > 0) {
			currentText = currentText.slice(0, -1);
			updateNameDisplay();
		}
	};
	updateNameDisplay();
	var doneBtn = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1450,
		scaleX: 0.8,
		scaleY: 0.8
	}));
	var doneText = new Text2('DONE', {
		size: 40,
		fill: 0xFFFFFF
	});
	doneText.anchor.set(0.5, 0.5);
	doneText.x = 1024;
	doneText.y = 1450;
	game.addChild(doneText);
	doneBtn.down = function (x, y, obj) {
		playerName = currentText || 'Player';
		gameState = 'playing';
		// Clean up cursor timer
		if (cursorTimer) {
			LK.clearInterval(cursorTimer);
		}
		// Clean up popup
		namePopup.destroy();
		nameTitle.destroy();
		nameInput.destroy();
		inputBg.destroy();
		charCycleBtn.destroy();
		charCycleText.destroy();
		addCharBtn.destroy();
		addCharText.destroy();
		deleteCharBtn.destroy();
		deleteCharText.destroy();
		doneBtn.destroy();
		doneText.destroy();
		homeScreen.destroy();
		// Start game
		startGame();
	};
}
// Developer info popup
function showDeveloperPopup() {
	var devPopup = game.addChild(LK.getAsset('popup', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1366
	}));
	var gameTitle = new Text2('Ping Pong Ball', {
		size: 60,
		fill: 0xFFFFFF
	});
	gameTitle.anchor.set(0.5, 0.5);
	gameTitle.x = 1024;
	gameTitle.y = 1200;
	game.addChild(gameTitle);
	var noteText = new Text2('This game is built by a student so if you feel any bug\nand glitch or issue. Please tell me. I will fix it\nas soon as possible. Thank You', {
		size: 30,
		fill: 0xFFFFFF
	});
	noteText.anchor.set(0.5, 0.5);
	noteText.x = 1024;
	noteText.y = 1300;
	game.addChild(noteText);
	var emailBtn = game.addChild(LK.getAsset('button', {
		anchorX: 0.5,
		anchorY: 0.5,
		x: 1024,
		y: 1400,
		scaleX: 0.8,
		scaleY: 0.8
	}));
	var emailText = new Text2('[email protected]', {
		size: 25,
		fill: 0xFFFFFF
	});
	emailText.anchor.set(0.5, 0.5);
	emailText.x = 1024;
	emailText.y = 1400;
	game.addChild(emailText);
	var madeByText = new Text2('Made by Mohit Dudi', {
		size: 30,
		fill: 0xFFFFFF
	});
	madeByText.anchor.set(0.5, 0.5);
	madeByText.x = 1024;
	madeByText.y = 1480;
	game.addChild(madeByText);
	var copyrightText = new Text2('All copyright 2025 reserved by mohit dudi', {
		size: 25,
		fill: 0xFFFFFF
	});
	copyrightText.anchor.set(0.5, 0.5);
	copyrightText.x = 1024;
	copyrightText.y = 1520;
	game.addChild(copyrightText);
	// Close popup when clicking outside or add close button
	devPopup.down = function (x, y, obj) {
		devPopup.destroy();
		gameTitle.destroy();
		noteText.destroy();
		emailBtn.destroy();
		emailText.destroy();
		madeByText.destroy();
		copyrightText.destroy();
	};
}
// Start game function
function startGame() {
	// This will be implemented in the next step
	console.log('Starting game with difficulty:', selectedDifficulty, 'and player name:', playerName);
}
// Game update loop
game.update = function () {
	// Handle different game states
	if (gameState === 'preloader') {
		// Preloader updates automatically
	} else if (gameState === 'home') {
		// Home screen is static, waiting for user input
	}
	// Additional game states will be handled here
};

===================================================================
--- original.js
+++ change.js
@@ -221,8 +221,118 @@
 	nameInput.anchor.set(0.5, 0.5);
 	nameInput.x = 1024;
 	nameInput.y = 1300;
 	game.addChild(nameInput);
+	// Add input background for better visibility
+	var inputBg = game.addChild(LK.getAsset('button', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		x: 1024,
+		y: 1300,
+		scaleX: 1.5,
+		scaleY: 0.8
+	}));
+	// Variables for text editing
+	var isEditing = false;
+	var currentText = 'Player';
+	var cursorVisible = true;
+	var cursorTimer = null;
+	// Function to update display text with cursor
+	function updateNameDisplay() {
+		if (isEditing && cursorVisible) {
+			nameInput.setText(currentText + '_');
+		} else {
+			nameInput.setText(currentText);
+		}
+	}
+	// Make input clickable to start editing
+	inputBg.down = function (x, y, obj) {
+		if (!isEditing) {
+			isEditing = true;
+			currentText = '';
+			// Start cursor blinking
+			cursorTimer = LK.setInterval(function () {
+				cursorVisible = !cursorVisible;
+				updateNameDisplay();
+			}, 500);
+			updateNameDisplay();
+		}
+	};
+	// Simple character input simulation (tap to cycle through alphabet)
+	var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+	var currentChar = 0;
+	var charCycleBtn = game.addChild(LK.getAsset('button', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		x: 900,
+		y: 1300,
+		scaleX: 0.4,
+		scaleY: 0.4
+	}));
+	var charCycleText = new Text2('A', {
+		size: 30,
+		fill: 0xFFFFFF
+	});
+	charCycleText.anchor.set(0.5, 0.5);
+	charCycleText.x = 900;
+	charCycleText.y = 1300;
+	game.addChild(charCycleText);
+	// Add character button
+	var addCharBtn = game.addChild(LK.getAsset('button', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		x: 1150,
+		y: 1300,
+		scaleX: 0.4,
+		scaleY: 0.4
+	}));
+	var addCharText = new Text2('+', {
+		size: 30,
+		fill: 0xFFFFFF
+	});
+	addCharText.anchor.set(0.5, 0.5);
+	addCharText.x = 1150;
+	addCharText.y = 1300;
+	game.addChild(addCharText);
+	// Delete character button
+	var deleteCharBtn = game.addChild(LK.getAsset('button', {
+		anchorX: 0.5,
+		anchorY: 0.5,
+		x: 1150,
+		y: 1380,
+		scaleX: 0.4,
+		scaleY: 0.4
+	}));
+	var deleteCharText = new Text2('-', {
+		size: 30,
+		fill: 0xFFFFFF
+	});
+	deleteCharText.anchor.set(0.5, 0.5);
+	deleteCharText.x = 1150;
+	deleteCharText.y = 1380;
+	game.addChild(deleteCharText);
+	// Cycle through alphabet
+	charCycleBtn.down = function (x, y, obj) {
+		if (isEditing) {
+			currentChar = (currentChar + 1) % alphabet.length;
+			charCycleText.setText(alphabet[currentChar]);
+		}
+	};
+	// Add current character to name
+	addCharBtn.down = function (x, y, obj) {
+		if (isEditing && currentText.length < 12) {
+			currentText += alphabet[currentChar];
+			updateNameDisplay();
+		}
+	};
+	// Delete last character
+	deleteCharBtn.down = function (x, y, obj) {
+		if (isEditing && currentText.length > 0) {
+			currentText = currentText.slice(0, -1);
+			updateNameDisplay();
+		}
+	};
+	updateNameDisplay();
 	var doneBtn = game.addChild(LK.getAsset('button', {
 		anchorX: 0.5,
 		anchorY: 0.5,
 		x: 1024,
@@ -238,14 +348,25 @@
 	doneText.x = 1024;
 	doneText.y = 1450;
 	game.addChild(doneText);
 	doneBtn.down = function (x, y, obj) {
-		playerName = nameInput.text;
+		playerName = currentText || 'Player';
 		gameState = 'playing';
+		// Clean up cursor timer
+		if (cursorTimer) {
+			LK.clearInterval(cursorTimer);
+		}
 		// Clean up popup
 		namePopup.destroy();
 		nameTitle.destroy();
 		nameInput.destroy();
+		inputBg.destroy();
+		charCycleBtn.destroy();
+		charCycleText.destroy();
+		addCharBtn.destroy();
+		addCharText.destroy();
+		deleteCharBtn.destroy();
+		deleteCharText.destroy();
 		doneBtn.destroy();
 		doneText.destroy();
 		homeScreen.destroy();
 		// Start game