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

/**** 
* Classes
****/ 
// Carnivore class
var Carnivore = Container.expand(function () {
	var self = Container.call(this);
	var carnAsset = self.attachAsset('carnivore', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.target = null;
	self.speed = 3.5 + Math.random() * 2;
	self.eaten = false;
	self.update = function () {
		if (self.eaten) return;
		// Find nearest herbivore if not already targeting
		if (!self.target || self.target.eaten) {
			var minDist = 999999,
				closest = null;
			for (var i = 0; i < herbivores.length; i++) {
				var h = herbivores[i];
				if (h.eaten) continue;
				var dx = h.x - self.x,
					dy = h.y - self.y;
				var dist = dx * dx + dy * dy;
				if (dist < minDist) {
					minDist = dist;
					closest = h;
				}
			}
			self.target = closest;
		}
		// Move toward target herbivore
		if (self.target && !self.target.eaten) {
			var dx = self.target.x - self.x;
			var dy = self.target.y - self.y;
			var dist = Math.sqrt(dx * dx + dy * dy);
			if (dist > 1) {
				self.x += dx / dist * self.speed;
				self.y += dy / dist * self.speed;
			}
			// Eat herbivore if close enough
			if (dist < 60 && !self.target.eaten) {
				self.target.die();
				self.target = null;
				// Animate carnivore "eating"
				tween(self, {
					scaleX: 1.2,
					scaleY: 1.2
				}, {
					duration: 120,
					easing: tween.easeOut,
					onFinish: function onFinish() {
						tween(self, {
							scaleX: 1,
							scaleY: 1
						}, {
							duration: 120,
							easing: tween.easeIn
						});
					}
				});
			}
		}
	};
	// Carnivores are not eaten in this MVP
	return self;
});
// Herbivore class
var Herbivore = Container.expand(function () {
	var self = Container.call(this);
	var herbAsset = self.attachAsset('herbivore', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	self.target = null;
	self.speed = 3 + Math.random() * 2;
	self.hungry = true;
	self.eaten = false;
	self.update = function () {
		if (self.eaten) return;
		// Find nearest plant if not already targeting
		if (!self.target || self.target.eaten) {
			var minDist = 999999,
				closest = null;
			for (var i = 0; i < plants.length; i++) {
				var p = plants[i];
				if (p.eaten) continue;
				var dx = p.x - self.x,
					dy = p.y - self.y;
				var dist = dx * dx + dy * dy;
				if (dist < minDist) {
					minDist = dist;
					closest = p;
				}
			}
			self.target = closest;
		}
		// Move toward target plant
		if (self.target && !self.target.eaten) {
			var dx = self.target.x - self.x;
			var dy = self.target.y - self.y;
			var dist = Math.sqrt(dx * dx + dy * dy);
			if (dist > 1) {
				self.x += dx / dist * self.speed;
				self.y += dy / dist * self.speed;
			}
			// Eat plant if close enough
			if (dist < 60 && !self.target.eaten) {
				self.target.die();
				self.target = null;
				// Animate herbivore "eating"
				tween(self, {
					scaleX: 1.2,
					scaleY: 1.2
				}, {
					duration: 120,
					easing: tween.easeOut,
					onFinish: function onFinish() {
						tween(self, {
							scaleX: 1,
							scaleY: 1
						}, {
							duration: 120,
							easing: tween.easeIn
						});
					}
				});
			}
		}
	};
	// Called when eaten by carnivore
	self.die = function (_onFinish) {
		if (self.eaten) return;
		self.eaten = true;
		tween(self, {
			scaleX: 0,
			scaleY: 0,
			alpha: 0
		}, {
			duration: 400,
			easing: tween.easeIn,
			onFinish: function onFinish() {
				self.destroy();
				if (_onFinish) _onFinish();
			}
		});
	};
	return self;
});
// Plant class
var Plant = Container.expand(function () {
	var self = Container.call(this);
	var plantAsset = self.attachAsset('plant', {
		anchorX: 0.5,
		anchorY: 0.5
	});
	// Plants are static, but we can animate them when eaten
	self.eaten = false;
	self.die = function (_onFinish2) {
		if (self.eaten) return;
		self.eaten = true;
		tween(self, {
			scaleX: 0,
			scaleY: 0,
			alpha: 0
		}, {
			duration: 400,
			easing: tween.easeIn,
			onFinish: function onFinish() {
				self.destroy();
				if (_onFinish2) _onFinish2();
			}
		});
	};
	return self;
});

/**** 
* Initialize Game
****/ 
var game = new LK.Game({
	backgroundColor: 0x3cb371 // Greenish background for the map
});

/**** 
* Game Code
****/ 
// --- Global arrays for organisms ---
// --- Asset Initialization ---
var plants = [];
var herbivores = [];
var carnivores = [];
// --- Palette UI ---
var paletteY = 180; // y position for palette
var paletteSpacing = 260;
var paletteItems = [];
// Shift the palette even further left so it is not offscreen
var paletteTotalWidth = paletteSpacing * 2;
var paletteXStart = 2048 / 2 - paletteTotalWidth / 2 - 1300;
// Create palette items for drag-and-drop
function createPaletteItem(type, x, y) {
	var assetId, color, label;
	if (type === 'plant') {
		assetId = 'plant';
		color = 0x6adf60;
		label = 'Plant';
	} else if (type === 'herbivore') {
		assetId = 'herbivore';
		color = 0xf7e26b;
		label = 'Herbivore';
	} else {
		assetId = 'carnivore';
		color = 0xe74c3c;
		label = 'Carnivore';
	}
	var node = new Container();
	var icon = node.attachAsset(assetId, {
		anchorX: 0.5,
		anchorY: 0.5
	});
	node.x = x;
	node.y = y;
	node.type = type;
	// Add label
	var txt = new Text2(label, {
		size: 60,
		fill: "#fff"
	});
	txt.anchor.set(0.5, 0);
	txt.y = 60;
	node.addChild(txt);
	// Add to GUI overlay (so it stays on top)
	LK.gui.top.addChild(node);
	paletteItems.push(node);
	return node;
}
// Place palette items (avoid top left 100x100)
var plantPalette = createPaletteItem('plant', paletteXStart, paletteY);
var herbPalette = createPaletteItem('herbivore', paletteXStart + paletteSpacing, paletteY);
var carnPalette = createPaletteItem('carnivore', paletteXStart + paletteSpacing * 2, paletteY);
// --- Drag and Drop Logic ---
var dragging = null; // {type, node, paletteRef}
var dragOffsetX = 0,
	dragOffsetY = 0;
// Helper: create organism at x,y
function createOrganism(type, x, y) {
	var obj;
	if (type === 'plant') {
		obj = new Plant();
		plants.push(obj);
	} else if (type === 'herbivore') {
		obj = new Herbivore();
		herbivores.push(obj);
	} else {
		obj = new Carnivore();
		carnivores.push(obj);
	}
	obj.x = x;
	obj.y = y;
	obj.scaleX = 1;
	obj.scaleY = 1;
	obj.alpha = 1;
	game.addChild(obj);
	return obj;
}
// Helper: check if point is inside a palette item
function isInPalette(x, y, node) {
	var bounds = {
		x: node.x - 60,
		y: node.y - 60,
		w: 120,
		h: 120
	};
	return x >= bounds.x && x <= bounds.x + bounds.w && y >= bounds.y && y <= bounds.y + bounds.h;
}
// --- Event Handlers ---
// Down: start drag if on palette
game.down = function (x, y, obj) {
	// Check if touch/click is on a palette item
	for (var i = 0; i < paletteItems.length; i++) {
		var p = paletteItems[i];
		// Convert GUI coordinates to game coordinates
		var guiPos = LK.gui.top.toLocal({
			x: x,
			y: y
		}, game);
		if (isInPalette(guiPos.x, guiPos.y, p)) {
			// Start dragging a new organism
			dragging = {
				type: p.type,
				node: createOrganism(p.type, x, y),
				paletteRef: p
			};
			dragOffsetX = 0;
			dragOffsetY = 0;
			// Make it semi-transparent while dragging
			dragging.node.alpha = 0.7;
			return;
		}
	}
	// If not on palette, check if on an organism to move it
	// (Optional: MVP disables moving after placement)
	dragging = null;
};
// Move: update drag position
game.move = function (x, y, obj) {
	if (dragging && dragging.node) {
		dragging.node.x = x + dragOffsetX;
		dragging.node.y = y + dragOffsetY;
	}
};
// Up: drop organism if dragging
game.up = function (x, y, obj) {
	if (dragging && dragging.node) {
		// If dropped inside palette area, destroy (cancel)
		var guiPos = LK.gui.top.toLocal({
			x: x,
			y: y
		}, game);
		var cancel = false;
		for (var i = 0; i < paletteItems.length; i++) {
			if (isInPalette(guiPos.x, guiPos.y, paletteItems[i])) {
				cancel = true;
				break;
			}
		}
		if (cancel) {
			// Remove organism
			dragging.node.destroy();
			if (dragging.type === 'plant') plants.pop();else if (dragging.type === 'herbivore') herbivores.pop();else carnivores.pop();
		} else {
			// Place organism: snap alpha to 1
			dragging.node.alpha = 1;
		}
		dragging = null;
	}
};
// --- Main Update Loop ---
game.update = function () {
	// Update all herbivores
	for (var i = herbivores.length - 1; i >= 0; i--) {
		var h = herbivores[i];
		if (h.eaten) {
			herbivores.splice(i, 1);
			continue;
		}
		if (h.update) h.update();
	}
	// Update all carnivores
	for (var i = carnivores.length - 1; i >= 0; i--) {
		var c = carnivores[i];
		if (c.eaten) {
			carnivores.splice(i, 1);
			continue;
		}
		if (c.update) c.update();
	}
	// Clean up dead plants
	for (var i = plants.length - 1; i >= 0; i--) {
		var p = plants[i];
		if (p.eaten) {
			plants.splice(i, 1);
		}
	}
};
// --- Instructions Text ---
var infoTxt = new Text2("Drag organisms from the palette to the map below.\nHerbivores eat plants. Carnivores eat herbivores.", {
	size: 60,
	fill: 0xFFFFFF
});
infoTxt.anchor.set(0.5, 0);
LK.gui.top.addChild(infoTxt);
infoTxt.x = 2048 / 2;
infoTxt.y = paletteY + 160;
// --- Map Area Border (for visual feedback) ---
var mapBorder = LK.getAsset('plant', {
	anchorX: 0,
	anchorY: 0,
	width: 1800,
	height: 2000,
	color: 0x2e8b57
});
mapBorder.alpha = 0.12;
game.addChild(mapBorder);
mapBorder.x = 124;
mapBorder.y = paletteY + 320;
// --- End of Game Code ---

===================================================================
--- original.js
+++ change.js
@@ -201,9 +201,9 @@
 var paletteSpacing = 260;
 var paletteItems = [];
 // Shift the palette even further left so it is not offscreen
 var paletteTotalWidth = paletteSpacing * 2;
-var paletteXStart = 2048 / 2 - paletteTotalWidth / 2 - 1000;
+var paletteXStart = 2048 / 2 - paletteTotalWidth / 2 - 1300;
 // Create palette items for drag-and-drop
 function createPaletteItem(type, x, y) {
 	var assetId, color, label;
 	if (type === 'plant') {