diff --git a/events.js b/events.js index 48401e7..cc4ee0b 100644 --- a/events.js +++ b/events.js @@ -77,6 +77,11 @@ function setupBuyButtons() { logAction("Click on map to place a new Teacher citizen."); }); + document.getElementById('buySoldierBtn').addEventListener('click', () => { + purchaseMode = "Soldier"; + logAction("Click on map to place a new Soldier citizen."); + }); + document.getElementById('buyMarketBtn').addEventListener('click', () => { purchaseMode = "Market"; logAction("Click on map to place a Market site."); @@ -234,6 +239,17 @@ function setupCanvasClick() { } break; + case "Soldier": + if(money >= COST_SOLDIER) { + addMoney(-COST_SOLDIER, "Buy Soldier"); + let c = createCitizen(randomName(), worldX, worldY, "Soldier"); + citizens.push(c); + logAction(`Purchased new Soldier @(${Math.floor(worldX)},${Math.floor(worldY)})`); + } else { + logAction("Not enough money to buy Soldier!"); + } + break; + case "Spawner": if(money >= COST_SPAWNER) { addMoney(-COST_SPAWNER, "Buy Spawner"); diff --git a/render.js b/render.js index 9f6fca0..871ee6d 100644 --- a/render.js +++ b/render.js @@ -253,10 +253,26 @@ function drawCitizen(c) { ctx.translate(canvas.width/2 + offsetX, canvas.height/2 + offsetY); ctx.scale(scale, scale); - ctx.fillStyle = c.color; + // Different colors for different professions + if(c.profession === "Soldier") { + ctx.fillStyle = "#8B0000"; // Dark red for soldiers + } else { + ctx.fillStyle = c.color; + } + ctx.beginPath(); ctx.arc(c.x, c.y, 7, 0, Math.PI*2); ctx.fill(); + + // Draw a sword for soldiers + if(c.profession === "Soldier") { + ctx.strokeStyle = "#DDD"; + ctx.lineWidth = 1/scale; + ctx.beginPath(); + ctx.moveTo(c.x + 5, c.y - 5); + ctx.lineTo(c.x + 12, c.y - 12); + ctx.stroke(); + } // Profession icon let icon = "👤"; @@ -266,6 +282,7 @@ function drawCitizen(c) { case "Merchant": icon = "💰"; break; case "Doctor": icon = "💉"; break; case "Teacher": icon = "📚"; break; + case "Soldier": icon = "⚔️"; break; } ctx.fillStyle = "#000"; @@ -304,6 +321,19 @@ function drawAnimal(a) { ctx.fillStyle = "#000"; ctx.font = "10px sans-serif"; ctx.fillText("🐰", a.x+8, a.y+3); + } else if(a.type === "Wolf") { + ctx.fillStyle = "#444"; + ctx.beginPath(); + ctx.arc(a.x, a.y, 10, 0, Math.PI*2); + ctx.fill(); + + ctx.fillStyle = "#000"; + ctx.font = "12px sans-serif"; + ctx.fillText("🐺", a.x+8, a.y+3); + + // Show hunger level for wolves + ctx.fillStyle = "#f00"; + ctx.fillRect(a.x-10, a.y-15, 20 * (a.hunger/ANIMAL_HUNGER_MAX), 3); } ctx.restore();