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

/**** 
* Classes
****/ 
var ElementalNote = Container.expand(function (element, x, y) {
	var self = Container.call(this);
	var noteGraphics = self.attachAsset(element + 'Note', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.element = element;
	self.x = x;
	self.y = y;
	var label = new Text2(element.toUpperCase(), {
		size: 30,
		fill: 0xFFFFFF
	});
	label.anchor.set(0.5, 0.5);
	self.addChild(label);
	self.isDisabled = false;
	self.down = function (x, y, obj) {
		// Check if button is disabled
		if (self.isDisabled) {
			return;
		}
		// Disable button
		self.isDisabled = true;
		notePressed(self.element);
		// Play sound effect
		if (self.element === 'fire') {
			LK.getSound('Nota_Fire').play();
		} else {
			LK.getSound('summon').play();
		}
		// Visual feedback - make smaller on press and gray out
		tween(noteGraphics, {
			scaleX: 0.8,
			scaleY: 0.8,
			tint: 0x808080
		}, {
			duration: 100,
			onFinish: function onFinish() {
				// Return to normal size but keep gray
				tween(noteGraphics, {
					scaleX: 1.0,
					scaleY: 1.0
				}, {
					duration: 100,
					onFinish: function onFinish() {
						// After 1 second total, re-enable button and restore color
						LK.setTimeout(function () {
							self.isDisabled = false;
							tween(noteGraphics, {
								tint: 0xffffff
							}, {
								duration: 200
							});
						}, 800); // 800ms + 200ms from previous animations = 1000ms total
					}
				});
			}
		});
	};
	return self;
});
var Enemy = Container.expand(function () {
	var self = Container.call(this);
	var enemyGraphics = self.attachAsset('enemyUnit', {
		anchorX: 0.5,
		anchorY: 0.5,
		width: 280,
		height: 280
	});
	self.health = 80;
	self.maxHealth = 80;
	self.damage = 15;
	self.speed = 1.5;
	self.attackCooldown = 0;
	// Physics properties
	self.velocityY = 0;
	self.onGround = false;
	self.gravity = 0.5;
	// Health bar
	var healthBar = LK.getAsset('shape', {
		width: 100,
		height: 12,
		color: 0xff0000
	});
	healthBar.anchor.set(0.5, 0.5);
	healthBar.y = -80;
	self.addChild(healthBar);
	self.healthBar = healthBar;
	self.update = function () {
		// Apply gravity
		if (!self.onGround) {
			self.velocityY += self.gravity;
			self.y += self.velocityY;
		}
		// Ground collision
		var groundY = 2186;
		if (self.y >= groundY) {
			self.y = groundY;
			self.velocityY = 0;
			self.onGround = true;
		} else {
			self.onGround = false;
		}
		if (self.attackCooldown > 0) {
			self.attackCooldown--;
		}
		// Move towards player tower (speed is controlled by combat state)
		self.x -= self.speed;
		// Check for warriors to attack and combat engagement
		var inCombat = false;
		for (var i = 0; i < warriors.length; i++) {
			var warrior = warriors[i];
			var distance = Math.sqrt(Math.pow(self.x - warrior.x, 2) + Math.pow(self.y - warrior.y, 2));
			if (distance < 250) {
				// Mark as in combat to stop movement
				inCombat = true;
				if (self.attackCooldown <= 0) {
					self.attack(warrior);
					// Play combat sound when fighting with warrior
					playRandomCombatSound();
					// Attack animation - flash red and scale up
					tween(enemyGraphics, {
						tint: 0xff0000,
						scaleX: 1.3,
						scaleY: 1.3
					}, {
						duration: 200,
						onFinish: function onFinish() {
							tween(enemyGraphics, {
								tint: 0xffffff,
								scaleX: 1.0,
								scaleY: 1.0
							}, {
								duration: 200
							});
						}
					});
				}
				break;
			}
		}
		// Stop movement if in combat, otherwise resume normal movement
		if (inCombat) {
			self.speed = 0;
		} else {
			self.speed = 1.5;
		}
		// Check collision with player tower and destroy enemy
		var towerDistance = Math.sqrt(Math.pow(self.x - playerTower.x, 2) + Math.pow(self.y - playerTower.y, 2));
		if (towerDistance < 700) {
			if (self.attackCooldown <= 0) {
				self.attackPlayerTower();
			}
			// Destroy enemy when it touches the tower
			self.destroy();
			var index = enemies.indexOf(self);
			if (index > -1) {
				enemies.splice(index, 1);
			}
		}
		// Update health bar
		var healthPercent = self.health / self.maxHealth;
		self.healthBar.scaleX = healthPercent;
	};
	self.attack = function (target) {
		self.attackCooldown = 80;
		if (target === playerTower) {
			self.attackPlayerTower();
		} else {
			target.takeDamage(self.damage);
		}
	};
	self.attackPlayerTower = function () {
		self.attackCooldown = 80;
		playerTowerHealth -= self.damage;
		if (playerTowerHealth <= 0) {
			LK.showGameOver();
		}
		updateTowerHealthBars();
	};
	self.takeDamage = function (damage) {
		self.health -= damage;
		if (self.health <= 0) {
			// Play enemy death sound
			LK.getSound('enemy_death').play();
			// Death animation - fade out and scale down
			tween(enemyGraphics, {
				alpha: 0,
				scaleX: 0.1,
				scaleY: 0.1,
				rotation: Math.PI * 2
			}, {
				duration: 500,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					self.destroy();
				}
			});
			var index = enemies.indexOf(self);
			if (index > -1) {
				enemies.splice(index, 1);
			}
			LK.setScore(LK.getScore() + 10);
			scoreText.setText('Score: ' + LK.getScore());
		}
	};
	return self;
});
var Warrior = Container.expand(function (element, tier) {
	var self = Container.call(this);
	var assetName = element + 'Warrior';
	if (element === 'fire' && tier === 1) {
		assetName = 'fireWarrior_nivel_1';
	}
	var warriorGraphics = self.attachAsset(assetName, {
		anchorX: 0.5,
		anchorY: 0.5,
		width: 288,
		height: 288
	});
	self.element = element;
	self.tier = tier;
	self.maxHealth = 100 + tier * 50;
	self.health = self.maxHealth;
	self.damage = 20 + tier * 15;
	self.speed = 2;
	self.attackCooldown = 0;
	self.target = null;
	// Physics properties
	self.velocityY = 0;
	self.onGround = false;
	self.gravity = 0.5;
	// Adjust appearance based on tier
	var scale = 1 + tier * 0.3;
	warriorGraphics.scaleX = scale;
	warriorGraphics.scaleY = scale;
	// Health bar
	var healthBar = LK.getAsset('shape', {
		width: 120,
		height: 16,
		color: 0x00ff00
	});
	healthBar.anchor.set(0.5, 0.5);
	healthBar.y = -100;
	self.addChild(healthBar);
	self.healthBar = healthBar;
	self.update = function () {
		// Apply gravity
		if (!self.onGround) {
			self.velocityY += self.gravity;
			self.y += self.velocityY;
		}
		// Ground collision
		var groundY = 2186;
		if (self.y >= groundY) {
			self.y = groundY;
			self.velocityY = 0;
			self.onGround = true;
		} else {
			self.onGround = false;
		}
		// Move towards enemy tower (speed is controlled by combat state)
		if (!self.target) {
			self.x += self.speed;
		}
		// Attack logic
		if (self.attackCooldown > 0) {
			self.attackCooldown--;
		}
		// Check for enemies to attack and combat engagement
		var inCombat = false;
		for (var i = 0; i < enemies.length; i++) {
			var enemy = enemies[i];
			var distance = Math.sqrt(Math.pow(self.x - enemy.x, 2) + Math.pow(self.y - enemy.y, 2));
			if (distance < 250) {
				// Mark as in combat to stop movement
				inCombat = true;
				if (self.attackCooldown <= 0) {
					self.attack(enemy);
					// Play combat sound when fighting with enemy
					playRandomCombatSound();
					// Attack animation - flash blue and scale up
					tween(warriorGraphics, {
						tint: 0x00ffff,
						scaleX: 1.4,
						scaleY: 1.4
					}, {
						duration: 300,
						onFinish: function onFinish() {
							tween(warriorGraphics, {
								tint: 0xffffff,
								scaleX: scale,
								scaleY: scale
							}, {
								duration: 300
							});
						}
					});
				}
				break;
			}
		}
		// Stop movement if in combat, otherwise resume normal movement
		if (inCombat) {
			self.speed = 0;
		} else {
			self.speed = 2;
		}
		// Check collision with enemy tower and destroy warrior
		var towerDistance = Math.sqrt(Math.pow(self.x - enemyTower.x, 2) + Math.pow(self.y - enemyTower.y, 2));
		if (towerDistance < 700) {
			if (self.attackCooldown <= 0) {
				self.attackTower();
			}
			// Destroy warrior when it touches the tower
			self.destroy();
			var index = warriors.indexOf(self);
			if (index > -1) {
				warriors.splice(index, 1);
			}
		}
		// Update health bar
		var healthPercent = self.health / self.maxHealth;
		self.healthBar.scaleX = healthPercent;
		self.healthBar.tint = healthPercent > 0.5 ? 0x00ff00 : healthPercent > 0.25 ? 0xffff00 : 0xff0000;
	};
	self.attack = function (target) {
		self.attackCooldown = 60; // 1 second at 60fps
		if (target === enemyTower) {
			self.attackTower();
		} else {
			target.takeDamage(self.damage);
		}
		LK.getSound('attack').play();
	};
	self.attackTower = function () {
		self.attackCooldown = 60;
		enemyTowerHealth -= self.damage;
		LK.getSound('tower_damage').play();
		if (enemyTowerHealth <= 0) {
			LK.showYouWin();
		}
		updateTowerHealthBars();
	};
	self.takeDamage = function (damage) {
		self.health -= damage;
		if (self.health <= 0) {
			// Death animation - fade out and scale down
			tween(warriorGraphics, {
				alpha: 0,
				scaleX: 0.1,
				scaleY: 0.1,
				rotation: -Math.PI * 2
			}, {
				duration: 600,
				easing: tween.easeOut,
				onFinish: function onFinish() {
					self.destroy();
				}
			});
			var index = warriors.indexOf(self);
			if (index > -1) {
				warriors.splice(index, 1);
			}
		}
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x2c3e50,
	width: 3840,
	height: 1080
});

/**** 
* Game Code
****/ 
var warriors = [];
var enemies = [];
var playerTowerHealth = 1000;
var enemyTowerHealth = 1000;
var enemySpawnTimer = 0;
var isDragging = false;
var lastMouseX = 0;
var cameraX = 0;
var maxCameraX = 1792; // 3840 - 2048 = max scroll distance
var currentMana = 5;
var maxMana = 5;
// UI Elements
var scoreText = new Text2('Score: 0', {
	size: 40,
	fill: 0xFFFFFF
});
scoreText.anchor.set(0, 0);
scoreText.x = 120;
scoreText.y = 50;
LK.gui.topLeft.addChild(scoreText);
// Create mana display
var manaText = new Text2('Mana: 5/5', {
	size: 40,
	fill: 0x00FFFF
});
manaText.anchor.set(0, 0);
manaText.x = 1000;
manaText.y = 10;
LK.gui.topLeft.addChild(manaText);
// Create mana orbs visual display
var manaOrbs = [];
for (var i = 0; i < maxMana; i++) {
	var orb = LK.getAsset('shape', {
		width: 40,
		height: 40,
		color: 0x00FFFF,
		shape: 'ellipse'
	});
	orb.anchor.set(0.5, 0.5);
	orb.x = 1000 + i * 50;
	orb.y = 70;
	LK.gui.topLeft.addChild(orb);
	manaOrbs.push(orb);
}
// Create tiled ground floor
var groundTiles = [];
var tileSize = 592.704; // Size of each ground tile (increased by 5% more)
var groundY = 2732; // Position at bottom of screen
var groundHeight = 728.6; // Extend height to fill bottom gap (tileSize + 136 pixels)
var numTiles = Math.ceil(3840 / tileSize) + 2; // Cover full width plus extra for seamless tiling
for (var i = 0; i < numTiles; i++) {
	var groundTile = game.addChild(LK.getAsset('ground', {
		anchorX: 0.0,
		anchorY: 1.0,
		x: i * tileSize,
		y: groundY,
		width: tileSize,
		height: groundHeight
	}));
	groundTiles.push(groundTile);
}
// Create towers (horizontal layout)
var playerTower = game.addChild(LK.getAsset('playerTower', {
	anchorX: 0.5,
	anchorY: 1.0,
	x: 250,
	y: 2559,
	width: 1200,
	height: 1728
}));
var enemyTower = game.addChild(LK.getAsset('enemyTower', {
	anchorX: 0.5,
	anchorY: 1.0,
	x: 3590,
	y: 2559,
	width: 1200,
	height: 1728
}));
// Tower health bars
var playerTowerHealthBar = LK.getAsset('shape', {
	width: 1200,
	height: 160,
	color: 0x00ff00
});
playerTowerHealthBar.anchor.set(0.5, 0.5);
playerTowerHealthBar.x = playerTower.x;
playerTowerHealthBar.y = playerTower.y - 1840;
game.addChild(playerTowerHealthBar);
var enemyTowerHealthBar = LK.getAsset('shape', {
	width: 1200,
	height: 160,
	color: 0xff0000
});
enemyTowerHealthBar.anchor.set(0.5, 0.5);
enemyTowerHealthBar.x = enemyTower.x;
enemyTowerHealthBar.y = enemyTower.y - 1840;
game.addChild(enemyTowerHealthBar);
// Create elemental notes (horizontal layout at top left) - show all elements
var elements = ['fire', 'water', 'earth', 'wind', 'light'];
var notes = [];
for (var i = 0; i < elements.length; i++) {
	var note = new ElementalNote(elements[i], 0, 0);
	LK.gui.topLeft.addChild(note);
	// Make buttons smaller
	note.scaleX = 0.4;
	note.scaleY = 0.4;
	// Position buttons horizontally in upper left with proper spacing (moved 50% right total)
	note.x = 234 + i * 140; // Start at x:234 (moved from 180), space buttons 140 pixels apart
	note.y = 120; // Fixed y position in upper area
	notes.push(note);
}
// Create camera control buttons
var leftButton = LK.getAsset('shape', {
	width: 100,
	height: 100,
	color: 0x4444aa
});
leftButton.anchor.set(0.5, 0.5);
leftButton.alpha = 0.5; // 50% transparency
LK.gui.left.addChild(leftButton);
var leftButtonText = new Text2('<', {
	size: 60,
	fill: 0xffffff
});
leftButtonText.anchor.set(0.5, 0.5);
leftButton.addChild(leftButtonText);
var rightButton = LK.getAsset('shape', {
	width: 100,
	height: 100,
	color: 0x4444aa
});
rightButton.anchor.set(0.5, 0.5);
rightButton.alpha = 0.5; // 50% transparency
LK.gui.right.addChild(rightButton);
var rightButtonText = new Text2('>', {
	size: 60,
	fill: 0xffffff
});
rightButtonText.anchor.set(0.5, 0.5);
rightButton.addChild(rightButtonText);
function notePressed(element) {
	// Check if we have enough mana
	if (currentMana <= 0) {
		return; // No mana, can't summon
	}
	// Consume mana
	currentMana--;
	updateManaDisplay();
	// Directly summon warrior when note is pressed
	var warrior = new Warrior(element, 1);
	warrior.x = playerTower.x + 300;
	warrior.y = 2186; // Spawn on ground level
	warrior.onGround = true; // Start on ground
	game.addChild(warrior);
	warriors.push(warrior);
	LK.getSound('summon').play();
}
function spawnEnemy() {
	var enemy = new Enemy();
	enemy.x = enemyTower.x - 300;
	enemy.y = 2186; // Spawn on ground level
	enemy.onGround = true; // Start on ground
	game.addChild(enemy);
	enemies.push(enemy);
}
function updateTowerHealthBars() {
	var playerHealthPercent = Math.max(0, playerTowerHealth / 1000);
	var enemyHealthPercent = Math.max(0, enemyTowerHealth / 1000);
	playerTowerHealthBar.scaleX = playerHealthPercent;
	enemyTowerHealthBar.scaleX = enemyHealthPercent;
}
function updateManaDisplay() {
	// Update text
	manaText.setText('Mana: ' + currentMana + '/' + maxMana);
	// Update orb visuals
	for (var i = 0; i < manaOrbs.length; i++) {
		if (i < currentMana) {
			manaOrbs[i].alpha = 1.0; // Full opacity for available mana
			manaOrbs[i].tint = 0x00FFFF; // Cyan color
		} else {
			manaOrbs[i].alpha = 0.3; // Low opacity for depleted mana
			manaOrbs[i].tint = 0x666666; // Gray color
		}
	}
}
function playRandomCombatSound() {
	var combatSounds = ['combatir_1', 'combatir_2', 'combatir_3', 'combatir_4'];
	var randomIndex = Math.floor(Math.random() * combatSounds.length);
	LK.getSound(combatSounds[randomIndex]).play();
}
game.down = function (x, y, obj) {
	if (obj.event && obj.event.button === 2) {
		// Right mouse button
		isDragging = true;
		lastMouseX = x;
		obj.event.preventDefault(); // Prevent context menu
	}
};
leftButton.down = function (x, y, obj) {
	// Move camera left
	cameraX -= 100;
	cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
	game.x = -cameraX;
	// Visual feedback
	tween(leftButton, {
		scaleX: 0.9,
		scaleY: 0.9
	}, {
		duration: 100,
		onFinish: function onFinish() {
			tween(leftButton, {
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 100
			});
		}
	});
};
rightButton.down = function (x, y, obj) {
	// Move camera right
	cameraX += 100;
	cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
	game.x = -cameraX;
	// Visual feedback
	tween(rightButton, {
		scaleX: 0.9,
		scaleY: 0.9
	}, {
		duration: 100,
		onFinish: function onFinish() {
			tween(rightButton, {
				scaleX: 1.0,
				scaleY: 1.0
			}, {
				duration: 100
			});
		}
	});
};
game.up = function (x, y, obj) {
	if (obj.event && obj.event.button === 2) {
		// Right mouse button
		isDragging = false;
	}
};
game.move = function (x, y, obj) {
	if (isDragging) {
		var deltaX = lastMouseX - x;
		cameraX += deltaX;
		cameraX = Math.max(0, Math.min(cameraX, maxCameraX));
		game.x = -cameraX;
		lastMouseX = x;
	}
};
// Create a box at position x=0, y=0
var boxAtOrigin = game.addChild(LK.getAsset('shape', {
	width: 100,
	height: 100,
	color: 0xff0000
}));
boxAtOrigin.x = 0;
boxAtOrigin.y = 0;
// Start background music
LK.playMusic('Music');
game.update = function () {
	// Spawn enemies periodically
	enemySpawnTimer++;
	if (enemySpawnTimer >= 180) {
		// Every 3 seconds
		spawnEnemy();
		enemySpawnTimer = 0;
	}
	// Clean up off-screen warriors
	for (var i = warriors.length - 1; i >= 0; i--) {
		var warrior = warriors[i];
		if (warrior.x > 4000) {
			warrior.destroy();
			warriors.splice(i, 1);
		}
	}
	// Clean up off-screen enemies
	for (var i = enemies.length - 1; i >= 0; i--) {
		var enemy = enemies[i];
		if (enemy.x < -200) {
			enemy.destroy();
			enemies.splice(i, 1);
		}
	}
};

===================================================================
--- original.js
+++ change.js
@@ -413,9 +413,9 @@
 	size: 40,
 	fill: 0x00FFFF
 });
 manaText.anchor.set(0, 0);
-manaText.x = 100;
+manaText.x = 1000;
 manaText.y = 10;
 LK.gui.topLeft.addChild(manaText);
 // Create mana orbs visual display
 var manaOrbs = [];
@@ -426,9 +426,9 @@
 		color: 0x00FFFF,
 		shape: 'ellipse'
 	});
 	orb.anchor.set(0.5, 0.5);
-	orb.x = 100 + i * 50;
+	orb.x = 1000 + i * 50;
 	orb.y = 70;
 	LK.gui.topLeft.addChild(orb);
 	manaOrbs.push(orb);
 }