/**** 
* Plugins
****/ 
var tween = LK.import("@upit/tween.v1");

/**** 
* Classes
****/ 
// Monster class
var Monster = Container.expand(function () {
	var self = Container.call(this);
	// Default monster uses 'monster' asset
	var monsterBody = self.attachAsset('monster', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	// Monster hit overlay (hidden by default)
	var monsterHit = self.attachAsset('monsterHit', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0
	});
	// Health bar background
	var healthBarBg = self.attachAsset('healthBarBg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100 // visually above monster's head
	});
	// Health bar foreground
	var healthBarFg = self.attachAsset('healthBarFg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	// Health values
	self.maxHealth = 10;
	self.health = self.maxHealth;
	// Update health bar width
	self.updateHealthBar = function () {
		// Clamp health
		if (self.health < 0) {
			self.health = 0;
		}
		if (self.health > self.maxHealth) {
			self.health = self.maxHealth;
		}
		// Set width proportional to health
		healthBarFg.width = 300 * (self.health / self.maxHealth);
	};
	// Hit animation
	self.hitAnim = function () {
		// Show hit overlay quickly, then fade out
		monsterHit.alpha = 0.6;
		tween(monsterHit, {
			alpha: 0
		}, {
			duration: 180,
			easing: tween.linear
		});
		// Slight scale pop
		tween.stop(monsterBody, {
			scaleX: true,
			scaleY: true
		});
		monsterBody.scaleX = 1.1;
		monsterBody.scaleY = 1.1;
		tween(monsterBody, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 120,
			easing: tween.easeOut
		});
	};
	// Take damage
	self.takeDamage = function (amount) {
		self.health -= amount;
		if (self.health < 0) {
			self.health = 0;
		}
		self.updateHealthBar();
		self.hitAnim();
		LK.getSound('hit').play();
	};
	// Reset monster health
	self.resetHealth = function (newMax) {
		self.maxHealth = newMax;
		self.health = self.maxHealth;
		self.updateHealthBar();
	};
	// On tap/click
	self.down = function (x, y, obj) {
		self.takeDamage(1);
	};
	// Initialize health bar
	self.updateHealthBar();
	return self;
});
// Monster2 class
var Monster2 = Container.expand(function () {
	var self = Container.call(this);
	var monsterBody = self.attachAsset('monster2', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var monsterHit = self.attachAsset('monster2', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.3
	});
	var healthBarBg = self.attachAsset('healthBarBg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	var healthBarFg = self.attachAsset('healthBarFg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	self.maxHealth = 12;
	self.health = self.maxHealth;
	self.updateHealthBar = function () {
		if (self.health < 0) {
			self.health = 0;
		}
		if (self.health > self.maxHealth) {
			self.health = self.maxHealth;
		}
		healthBarFg.width = 300 * (self.health / self.maxHealth);
	};
	self.hitAnim = function () {
		monsterHit.alpha = 0.7;
		tween(monsterHit, {
			alpha: 0.3
		}, {
			duration: 180,
			easing: tween.linear
		});
		tween.stop(monsterBody, {
			scaleX: true,
			scaleY: true
		});
		monsterBody.scaleX = 1.15;
		monsterBody.scaleY = 1.15;
		tween(monsterBody, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 120,
			easing: tween.easeOut
		});
	};
	self.takeDamage = function (amount) {
		self.health -= amount;
		if (self.health < 0) {
			self.health = 0;
		}
		self.updateHealthBar();
		self.hitAnim();
		LK.getSound('hit').play();
	};
	self.resetHealth = function (newMax) {
		self.maxHealth = newMax;
		self.health = self.maxHealth;
		self.updateHealthBar();
	};
	self.down = function (x, y, obj) {
		self.takeDamage(1);
	};
	self.updateHealthBar();
	return self;
});
// Monster3 class
var Monster3 = Container.expand(function () {
	var self = Container.call(this);
	var monsterBody = self.attachAsset('monster3', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var monsterHit = self.attachAsset('monster3', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.3
	});
	var healthBarBg = self.attachAsset('healthBarBg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	var healthBarFg = self.attachAsset('healthBarFg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	self.maxHealth = 15;
	self.health = self.maxHealth;
	self.updateHealthBar = function () {
		if (self.health < 0) {
			self.health = 0;
		}
		if (self.health > self.maxHealth) {
			self.health = self.maxHealth;
		}
		healthBarFg.width = 300 * (self.health / self.maxHealth);
	};
	self.hitAnim = function () {
		monsterHit.alpha = 0.7;
		tween(monsterHit, {
			alpha: 0.3
		}, {
			duration: 180,
			easing: tween.linear
		});
		tween.stop(monsterBody, {
			scaleX: true,
			scaleY: true
		});
		monsterBody.scaleX = 1.2;
		monsterBody.scaleY = 1.2;
		tween(monsterBody, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 120,
			easing: tween.easeOut
		});
	};
	self.takeDamage = function (amount) {
		self.health -= amount;
		if (self.health < 0) {
			self.health = 0;
		}
		self.updateHealthBar();
		self.hitAnim();
		LK.getSound('hit').play();
	};
	self.resetHealth = function (newMax) {
		self.maxHealth = newMax;
		self.health = self.maxHealth;
		self.updateHealthBar();
	};
	self.down = function (x, y, obj) {
		self.takeDamage(1);
	};
	self.updateHealthBar();
	return self;
});
// Monster4 class
var Monster4 = Container.expand(function () {
	var self = Container.call(this);
	var monsterBody = self.attachAsset('monster4', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var monsterHit = self.attachAsset('monster4', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.3
	});
	var healthBarBg = self.attachAsset('healthBarBg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	var healthBarFg = self.attachAsset('healthBarFg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	self.maxHealth = 18;
	self.health = self.maxHealth;
	self.updateHealthBar = function () {
		if (self.health < 0) {
			self.health = 0;
		}
		if (self.health > self.maxHealth) {
			self.health = self.maxHealth;
		}
		healthBarFg.width = 300 * (self.health / self.maxHealth);
	};
	self.hitAnim = function () {
		monsterHit.alpha = 0.7;
		tween(monsterHit, {
			alpha: 0.3
		}, {
			duration: 180,
			easing: tween.linear
		});
		tween.stop(monsterBody, {
			scaleX: true,
			scaleY: true
		});
		monsterBody.scaleX = 1.25;
		monsterBody.scaleY = 1.25;
		tween(monsterBody, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 120,
			easing: tween.easeOut
		});
	};
	self.takeDamage = function (amount) {
		self.health -= amount;
		if (self.health < 0) {
			self.health = 0;
		}
		self.updateHealthBar();
		self.hitAnim();
		LK.getSound('hit').play();
	};
	self.resetHealth = function (newMax) {
		self.maxHealth = newMax;
		self.health = self.maxHealth;
		self.updateHealthBar();
	};
	self.down = function (x, y, obj) {
		self.takeDamage(1);
	};
	self.updateHealthBar();
	return self;
});
// Monster5 class (using 'monster5' asset)
var Monster5 = Container.expand(function () {
	var self = Container.call(this);
	var monsterBody = self.attachAsset('monster5', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	var monsterHit = self.attachAsset('monster5', {
		anchorX: 0.5,
		anchorY: 0.5,
		alpha: 0.3
	});
	var healthBarBg = self.attachAsset('healthBarBg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	var healthBarFg = self.attachAsset('healthBarFg', {
		anchorX: 0.5,
		anchorY: 1,
		y: 1100
	});
	self.maxHealth = 20;
	self.health = self.maxHealth;
	self.updateHealthBar = function () {
		if (self.health < 0) {
			self.health = 0;
		}
		if (self.health > self.maxHealth) {
			self.health = self.maxHealth;
		}
		healthBarFg.width = 300 * (self.health / self.maxHealth);
	};
	self.hitAnim = function () {
		monsterHit.alpha = 0.7;
		tween(monsterHit, {
			alpha: 0.3
		}, {
			duration: 180,
			easing: tween.linear
		});
		tween.stop(monsterBody, {
			scaleX: true,
			scaleY: true
		});
		monsterBody.scaleX = 1.3;
		monsterBody.scaleY = 1.3;
		tween(monsterBody, {
			scaleX: 1,
			scaleY: 1
		}, {
			duration: 120,
			easing: tween.easeOut
		});
	};
	self.takeDamage = function (amount) {
		self.health -= amount;
		if (self.health < 0) {
			self.health = 0;
		}
		self.updateHealthBar();
		self.hitAnim();
		LK.getSound('hit').play();
	};
	self.resetHealth = function (newMax) {
		self.maxHealth = newMax;
		self.health = self.maxHealth;
		self.updateHealthBar();
	};
	self.down = function (x, y, obj) {
		self.takeDamage(1);
	};
	self.updateHealthBar();
	return self;
});

/**** 
* Initialize Game
****/ 
// MonsterFactory to spawn a random monster type
var game = new LK.Game({
	backgroundColor: 0x181818
});

/**** 
* Game Code
****/ 
// Keep track of last monster type index
// MonsterFactory to spawn a random monster type
var lastMonsterIdx = -1;
function MonsterFactory() {
	// List of monster constructors, one for each asset
	// We'll define Monster5 inline below
	var monsterTypes = [Monster, Monster2, Monster3, Monster4, Monster5];
	var idx;
	// Pick a random type different from last
	if (monsterTypes.length > 1) {
		do {
			idx = Math.floor(Math.random() * monsterTypes.length);
		} while (idx === lastMonsterIdx);
	} else {
		idx = 0;
	}
	lastMonsterIdx = idx;
	return new monsterTypes[idx]();
}
var score = 0;
// Score text
var scoreTxt = new Text2('0', {
	size: 120,
	fill: "#fff"
});
scoreTxt.anchor.set(0.5, 0);
// Place at top center, but not in top 100px (avoid menu)
scoreTxt.y = 20;
LK.gui.top.addChild(scoreTxt);
// Add background image as a background layer
var background = LK.getAsset('background', {
	anchorX: 0.5,
	anchorY: 0.5,
	x: 2048 / 2,
	y: 2732 / 2,
	width: 2048,
	height: 2732
});
game.addChild(background, 0); // Add at index 0 to ensure it's behind everything
// Center position for monster (adjusted for large monster size)
var centerX = 2048 / 2;
var centerY = 2732 / 2 + 100;
// --- Player Health Bar (LARGE, at bottom, with attractive number text) ---
var playerMaxHealth = 10;
var playerHealth = playerMaxHealth;
// Player health bar background (very large, at bottom)
var playerHealthBarBg = LK.getAsset('healthBarBg', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2732 - 80,
	width: 900,
	height: 180
});
game.addChild(playerHealthBarBg);
// Player health bar foreground (very large, at bottom)
var playerHealthBarFg = LK.getAsset('healthBarFg', {
	anchorX: 0.5,
	anchorY: 1,
	x: 2048 / 2,
	y: 2732 - 80,
	width: 880,
	height: 170
});
game.addChild(playerHealthBarFg);
// Player health number text (centered, bold, shadow, large, attractive)
var playerHealthText = new Text2(playerHealth + " / " + playerMaxHealth, {
	size: 120,
	fill: 0xFFF44A,
	font: "Impact, 'Arial Black', Tahoma, sans-serif",
	stroke: "#222",
	strokeThickness: 10,
	shadow: true,
	shadowColor: "#000",
	shadowBlur: 12,
	shadowDistance: 0
});
playerHealthText.anchor.set(0.5, 0.5);
playerHealthText.x = 2048 / 2;
playerHealthText.y = 2732 - 170;
game.addChild(playerHealthText);
// Function to update player health bar width and text
function updatePlayerHealthBar() {
	if (playerHealth < 0) playerHealth = 0;
	if (playerHealth > playerMaxHealth) playerHealth = playerMaxHealth;
	playerHealthBarFg.width = 880 * (playerHealth / playerMaxHealth);
	playerHealthText.setText(playerHealth + " / " + playerMaxHealth);
}
updatePlayerHealthBar();
// Current monster
var monster = null;
// Function to spawn a new monster
function spawnMonster() {
	// Remove old monster if exists
	if (monster) {
		monster.destroy();
		monster = null;
	}
	// Increase difficulty: every 10 monsters, +2 health
	var baseHealth = 10 + Math.floor(score / 10) * 2;
	// Use MonsterFactory to get a random monster type
	monster = MonsterFactory();
	monster.x = centerX;
	monster.y = centerY;
	// Set health scaling for all monsters
	if (typeof monster.resetHealth === "function") {
		monster.resetHealth(baseHealth);
	}
	game.addChild(monster);
}
// Game update loop
game.update = function () {
	if (!monster) {
		return;
	}
	// If monster is dead, increment score and spawn new
	if (monster.health <= 0) {
		score += 1;
		scoreTxt.setText(score);
		// Example: Heal player by 1 on monster defeat, and update health bar
		playerHealth = Math.min(playerHealth + 1, playerMaxHealth);
		updatePlayerHealthBar();
		spawnMonster();
	}
};
// Start first monster
spawnMonster();

===================================================================
--- original.js
+++ change.js
@@ -407,10 +407,10 @@
 
 /**** 
 * Game Code
 ****/ 
-// MonsterFactory to spawn a random monster type
 // Keep track of last monster type index
+// MonsterFactory to spawn a random monster type
 var lastMonsterIdx = -1;
 function MonsterFactory() {
 	// List of monster constructors, one for each asset
 	// We'll define Monster5 inline below
@@ -449,36 +449,53 @@
 game.addChild(background, 0); // Add at index 0 to ensure it's behind everything
 // Center position for monster (adjusted for large monster size)
 var centerX = 2048 / 2;
 var centerY = 2732 / 2 + 100;
-// --- Player Health Bar (enlarged to match monster bars) ---
+// --- Player Health Bar (LARGE, at bottom, with attractive number text) ---
 var playerMaxHealth = 10;
 var playerHealth = playerMaxHealth;
-// Player health bar background
+// Player health bar background (very large, at bottom)
 var playerHealthBarBg = LK.getAsset('healthBarBg', {
 	anchorX: 0.5,
-	anchorY: 0,
+	anchorY: 1,
 	x: 2048 / 2,
-	y: 80,
-	width: 400,
-	height: 140
+	y: 2732 - 80,
+	width: 900,
+	height: 180
 });
 game.addChild(playerHealthBarBg);
-// Player health bar foreground
+// Player health bar foreground (very large, at bottom)
 var playerHealthBarFg = LK.getAsset('healthBarFg', {
 	anchorX: 0.5,
-	anchorY: 0,
+	anchorY: 1,
 	x: 2048 / 2,
-	y: 80,
-	width: 400,
-	height: 144
+	y: 2732 - 80,
+	width: 880,
+	height: 170
 });
 game.addChild(playerHealthBarFg);
-// Function to update player health bar width
+// Player health number text (centered, bold, shadow, large, attractive)
+var playerHealthText = new Text2(playerHealth + " / " + playerMaxHealth, {
+	size: 120,
+	fill: 0xFFF44A,
+	font: "Impact, 'Arial Black', Tahoma, sans-serif",
+	stroke: "#222",
+	strokeThickness: 10,
+	shadow: true,
+	shadowColor: "#000",
+	shadowBlur: 12,
+	shadowDistance: 0
+});
+playerHealthText.anchor.set(0.5, 0.5);
+playerHealthText.x = 2048 / 2;
+playerHealthText.y = 2732 - 170;
+game.addChild(playerHealthText);
+// Function to update player health bar width and text
 function updatePlayerHealthBar() {
 	if (playerHealth < 0) playerHealth = 0;
 	if (playerHealth > playerMaxHealth) playerHealth = playerMaxHealth;
-	playerHealthBarFg.width = 400 * (playerHealth / playerMaxHealth);
+	playerHealthBarFg.width = 880 * (playerHealth / playerMaxHealth);
+	playerHealthText.setText(playerHealth + " / " + playerMaxHealth);
 }
 updatePlayerHealthBar();
 // Current monster
 var monster = null;