kacperks/worldbox-minigame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update index.html

Browse Source
This commit is contained in:
{{QWERTYKBGUI}} 2025-03-13 21:45:01 +01:00
parent 61f1fece99
commit 11165b76b6
1 changed files with 248 additions and 215 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

459
index.html
View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Virtual World with Professions, Houses, Hunger & Fruit Trees</title> <title>Virtual World</title>
<style> <style>
body { body {
margin: 0; margin: 0;
@ -56,7 +56,7 @@
<body> <body>
<div id="app"> <div id="app">
<h1>Virtual World: Builders, Farmers, Houses & Hunger</h1> <h1>Virtual World</h1>
<p id="controls">Drag to move the map, scroll to zoom in/out.</p> <p id="controls">Drag to move the map, scroll to zoom in/out.</p>
<canvas id="worldCanvas" width="800" height="600"></canvas> <canvas id="worldCanvas" width="800" height="600"></canvas>
<div id="log"></div> <div id="log"></div>
@ -69,10 +69,10 @@
- Builder & Farmer Professions - Builder & Farmer Professions
- Hunger & Energy - Hunger & Energy
- Fruit Trees (gather fruit, plant new trees) - Fruit Trees (gather fruit, plant new trees)
- House Construction (stores fruit, citizens can eat & rest) - Houses (store fruit, citizens can eat & rest)
- Chopping Trees (for wood) - Roads automatically built between houses once they finish construction!
- Child Birth Events
- Logging & Pan/Zoom - Logging & Pan/Zoom
- Child Birth Events
--------------------------------------------------------------------------------- ---------------------------------------------------------------------------------
*/ */
@ -102,7 +102,7 @@ const cityStorage = {
// Array of resource nodes (trees & fruit trees) // Array of resource nodes (trees & fruit trees)
let resources = []; let resources = [];
// Buildings (houses under construction or completed) // Buildings array (includes both House sites and Road sites)
let buildings = []; let buildings = [];
// Citizens // Citizens
@ -112,29 +112,31 @@ let citizens = [];
* SIMULATION CONSTANTS * SIMULATION CONSTANTS
**********************************************************************/ **********************************************************************/
// Hunger & Energy // Hunger & Energy
const HUNGER_INCREMENT = 0.005; // how fast hunger increases per frame const HUNGER_INCREMENT = 0.005;
const ENERGY_DECREMENT_WORK = 0.02; // how fast energy decreases when working const ENERGY_DECREMENT_WORK = 0.02;
const ENERGY_INCREMENT_REST = 0.05; // how fast energy recovers when resting const ENERGY_INCREMENT_REST = 0.05;
const HUNGER_THRESHOLD = 50; // if hunger > 50, citizen tries to eat const HUNGER_THRESHOLD = 50;
const ENERGY_THRESHOLD = 30; // if energy < 30, citizen tries to rest const ENERGY_THRESHOLD = 30;
const HUNGER_MAX = 100; // max hunger (if you want advanced mechanics, you could do damage if it hits 100) const HUNGER_MAX = 100;
const ENERGY_MAX = 100; // max energy const ENERGY_MAX = 100;
// House building requirements // House building requirements
const HOUSE_WOOD_REQUIRED = 50; const HOUSE_WOOD_REQUIRED = 50;
const HOUSE_BUILD_RATE = 0.2; // how quickly build progress advances per frame const HOUSE_BUILD_RATE = 0.2;
// House capacity for fruit
const HOUSE_MAX_FRUIT = 30; const HOUSE_MAX_FRUIT = 30;
// Fruit tree resource // Fruit tree resource
const FRUIT_TREE_START_AMOUNT = 20; // each fruit tree starts with 20 fruit const FRUIT_TREE_START_AMOUNT = 20;
const FRUIT_GATHER_RATE = 1; // how much fruit is gathered per tick const FRUIT_GATHER_RATE = 1;
const FRUIT_PLANT_COST = 1; // how many fruit is needed to plant a new fruit tree const FRUIT_PLANT_COST = 1;
// Professions // Professions
const PROFESSIONS = ["Farmer", "Builder"]; const PROFESSIONS = ["Farmer", "Builder"];
// Road building requirements
// We'll make roads also be "buildings" with buildingType = "Road"
const ROAD_WOOD_REQUIRED = 10;
const ROAD_BUILD_RATE = 0.3;
/********************************************************************** /**********************************************************************
* LOGGING * LOGGING
@ -173,16 +175,16 @@ function createCitizen(name, x, y) {
profession, profession,
x, x,
y, y,
vx: (Math.random() - 0.5) * 0.3, // small random movement vx: (Math.random() - 0.5) * 0.3,
vy: (Math.random() - 0.5) * 0.3, vy: (Math.random() - 0.5) * 0.3,
color: `hsl(${Math.random() * 360}, 70%, 50%)`, color: `hsl(${Math.random() * 360}, 70%, 50%)`,
task: null, // current task (string) task: null,
target: null, // resource or building target: null,
carryingWood: 0, carryingWood: 0,
carryingFruit: 0, carryingFruit: 0,
carryingCapacity: 10, carryingCapacity: 10,
hunger: 0, // 0 = not hungry, 100 = extremely hungry hunger: 0,
energy: ENERGY_MAX // 0 = exhausted, 100 = fully rested energy: ENERGY_MAX
}; };
} }
@ -190,32 +192,62 @@ function createResource(type, x, y, amount) {
return { type, x, y, amount }; return { type, x, y, amount };
} }
function createBuildingSite(buildingType, x, y) { /**
* Buildings can be:
* - House:
* x, y, buildingType="House"
* requiredWood, deliveredWood, buildProgress, completed
* storedFruit, maxFruit
* - Road:
* buildingType="Road"
* (x, y) as midpoint for drawing info
* x1, y1, x2, y2 for endpoints
* requiredWood, deliveredWood, buildProgress, completed
*/
function createHouseSite(x, y) {
return { return {
buildingType, buildingType: "House",
x, x,
y, y,
requiredWood: HOUSE_WOOD_REQUIRED, requiredWood: HOUSE_WOOD_REQUIRED,
deliveredWood: 0, deliveredWood: 0,
buildProgress: 0, buildProgress: 0,
completed: false, completed: false,
storedFruit: 0, // once completed, houses can store fruit storedFruit: 0,
maxFruit: HOUSE_MAX_FRUIT maxFruit: HOUSE_MAX_FRUIT
}; };
} }
function createRoadSite(x1, y1, x2, y2) {
// midpoint for label
const mx = (x1 + x2) / 2;
const my = (y1 + y2) / 2;
return {
buildingType: "Road",
x: mx,
y: my,
x1, y1,
x2, y2,
requiredWood: ROAD_WOOD_REQUIRED,
deliveredWood: 0,
buildProgress: 0,
completed: false
};
}
/********************************************************************** /**********************************************************************
* WORLD INITIALIZATION * WORLD INITIALIZATION
**********************************************************************/ **********************************************************************/
function initWorld() { function initWorld() {
// Create some normal "wood trees" (type: "Tree") // Create some normal wood trees
for (let i = 0; i < 15; i++) { for (let i = 0; i < 15; i++) {
const x = randInt(-1000, 1000); const x = randInt(-1000, 1000);
const y = randInt(-1000, 1000); const y = randInt(-1000, 1000);
resources.push(createResource("Tree", x, y, 100)); // 100 wood each resources.push(createResource("Tree", x, y, 100));
} }
// Create some fruit trees (type: "FruitTree") // Create some fruit trees
for (let i = 0; i < 10; i++) { for (let i = 0; i < 10; i++) {
const x = randInt(-1000, 1000); const x = randInt(-1000, 1000);
const y = randInt(-1000, 1000); const y = randInt(-1000, 1000);
@ -239,31 +271,40 @@ function initWorld() {
function update() { function update() {
frameCount++; frameCount++;
// Update each citizen (AI + movement) // Update each citizen
citizens.forEach((cit) => { citizens.forEach((cit) => {
updateCitizen(cit); updateCitizen(cit);
}); });
// Periodically add new citizens (child births) // Periodically add new citizens (child births)
// e.g., every ~10 seconds
if (frameCount % 600 === 0) { if (frameCount % 600 === 0) {
const baby = createCitizen(randomName(), randInt(-200, 200), randInt(-200, 200)); const baby = createCitizen(randomName(), randInt(-200, 200), randInt(-200, 200));
citizens.push(baby); citizens.push(baby);
logAction(`A child is born: ${baby.name} [${baby.profession}]`); logAction(`A child is born: ${baby.name} [${baby.profession}]`);
} }
// Update buildings (construct progress) // Update buildings
buildings.forEach((b) => { buildings.forEach((b) => {
if (!b.completed && b.deliveredWood >= b.requiredWood) { if (!b.completed && b.deliveredWood >= b.requiredWood) {
b.buildProgress += HOUSE_BUILD_RATE; // House or Road? Different build rates
let buildRate = HOUSE_BUILD_RATE;
if (b.buildingType === "Road") {
buildRate = ROAD_BUILD_RATE;
}
b.buildProgress += buildRate;
if (b.buildProgress >= 100) { if (b.buildProgress >= 100) {
b.completed = true; b.completed = true;
logAction(`A new ${b.buildingType} is completed at (${b.x}, ${b.y})!`); if (b.buildingType === "House") {
logAction(`A new House is completed at (${b.x}, ${b.y})!`);
// Once the house is completed, build a road from it to the nearest house
maybeBuildRoad(b);
} else {
logAction(`A Road has been completed!`);
}
} }
} }
}); });
// Draw
drawWorld(); drawWorld();
requestAnimationFrame(update); requestAnimationFrame(update);
} }
@ -272,62 +313,37 @@ function update() {
* CITIZEN UPDATE (AI + Movement) * CITIZEN UPDATE (AI + Movement)
**********************************************************************/ **********************************************************************/
function updateCitizen(cit) { function updateCitizen(cit) {
// Increase hunger over time // Hunger & energy
cit.hunger += HUNGER_INCREMENT; cit.hunger += HUNGER_INCREMENT;
if (cit.hunger > HUNGER_MAX) { if (cit.hunger > HUNGER_MAX) cit.hunger = HUNGER_MAX;
cit.hunger = HUNGER_MAX; // cap
// (Optional) If you want to handle "starvation" logic, do it here
}
// If working (chopping, gathering, building, etc.), reduce energy
if (cit.task === 'chop' || cit.task === 'gatherFruit' || cit.task === 'build') { if (cit.task === 'chop' || cit.task === 'gatherFruit' || cit.task === 'build') {
cit.energy -= ENERGY_DECREMENT_WORK; cit.energy -= ENERGY_DECREMENT_WORK;
} else if (cit.task === 'restAtHouse') { } else if (cit.task === 'restAtHouse') {
cit.energy += ENERGY_INCREMENT_REST; cit.energy += ENERGY_INCREMENT_REST;
} else { } else {
// Slight random movement => small passive energy drop cit.energy -= 0.0005; // slight passive drain
cit.energy -= 0.0005;
} }
// Cap energy
if (cit.energy < 0) cit.energy = 0; if (cit.energy < 0) cit.energy = 0;
if (cit.energy > ENERGY_MAX) cit.energy = ENERGY_MAX; if (cit.energy > ENERGY_MAX) cit.energy = ENERGY_MAX;
// If the citizen has no task or just finished something, assign a new one // Assign a new task if none
if (!cit.task) { if (!cit.task) {
assignNewTask(cit); assignNewTask(cit);
} }
// Execute task logic // Execute current task logic
switch (cit.task) { switch (cit.task) {
case 'chop': case 'chop': chopTask(cit); break;
chopTask(cit); case 'deliverWood': deliverWoodTask(cit); break;
break; case 'build': buildTask(cit); break;
case 'deliverWood': case 'gatherFruit': gatherFruitTask(cit); break;
deliverWoodTask(cit); case 'deliverFruit': deliverFruitTask(cit); break;
break; case 'plantFruitTree': plantFruitTreeTask(cit); break;
case 'build': case 'eatAtHouse': eatAtHouseTask(cit); break;
buildTask(cit); case 'restAtHouse': restAtHouseTask(cit); break;
break; default: randomWander(cit); break;
case 'gatherFruit':
gatherFruitTask(cit);
break;
case 'deliverFruit':
deliverFruitTask(cit);
break;
case 'plantFruitTree':
plantFruitTreeTask(cit);
break;
case 'eatAtHouse':
eatAtHouseTask(cit);
break;
case 'restAtHouse':
restAtHouseTask(cit);
break;
default:
// Idle or random wandering
randomWander(cit);
break;
} }
// Apply velocity // Apply velocity
@ -336,10 +352,10 @@ function updateCitizen(cit) {
} }
/********************************************************************** /**********************************************************************
* TASK ASSIGNMENT & HELPER LOGIC * TASK ASSIGNMENT
**********************************************************************/ **********************************************************************/
function assignNewTask(cit) { function assignNewTask(cit) {
// 1) If hunger is too high, find a house that has fruit to eat // If hunger too high, eat if possible
if (cit.hunger >= HUNGER_THRESHOLD) { if (cit.hunger >= HUNGER_THRESHOLD) {
const houseWithFruit = findHouseWithFruit(); const houseWithFruit = findHouseWithFruit();
if (houseWithFruit) { if (houseWithFruit) {
@ -349,7 +365,7 @@ function assignNewTask(cit) {
} }
} }
// 2) If energy is too low, find any completed house to rest // If energy too low, rest at any completed house
if (cit.energy <= ENERGY_THRESHOLD) { if (cit.energy <= ENERGY_THRESHOLD) {
const completedHouse = findAnyCompletedHouse(); const completedHouse = findAnyCompletedHouse();
if (completedHouse) { if (completedHouse) {
@ -359,7 +375,7 @@ function assignNewTask(cit) {
} }
} }
// Profession-based tasks // Profession-based
if (cit.profession === "Builder") { if (cit.profession === "Builder") {
builderTasks(cit); builderTasks(cit);
} else { } else {
@ -367,15 +383,8 @@ function assignNewTask(cit) {
} }
} }
/**
* Builder logic:
* - If carrying wood and building needs wood, deliver it
* - If there's a building under construction that is short on wood, chop or deliver
* - If building is ready to build (wood delivered), help build
* - Otherwise, just gather wood or idle
*/
function builderTasks(cit) { function builderTasks(cit) {
// Check if there's a building that still needs wood // Find building needing wood
const buildingNeedingWood = buildings.find(b => !b.completed && b.deliveredWood < b.requiredWood); const buildingNeedingWood = buildings.find(b => !b.completed && b.deliveredWood < b.requiredWood);
if (buildingNeedingWood) { if (buildingNeedingWood) {
// If carrying wood, deliver // If carrying wood, deliver
@ -384,7 +393,7 @@ function builderTasks(cit) {
cit.target = buildingNeedingWood; cit.target = buildingNeedingWood;
return; return;
} }
// Else chop wood // Otherwise chop wood
const tree = findNearestResourceOfType(cit, "Tree"); const tree = findNearestResourceOfType(cit, "Tree");
if (tree) { if (tree) {
cit.task = 'chop'; cit.task = 'chop';
@ -393,7 +402,7 @@ function builderTasks(cit) {
} }
} }
// If there's a building that has enough wood but not completed, help build // If there's a building with enough wood but not finished, build
const buildingToConstruct = buildings.find(b => !b.completed && b.deliveredWood >= b.requiredWood); const buildingToConstruct = buildings.find(b => !b.completed && b.deliveredWood >= b.requiredWood);
if (buildingToConstruct) { if (buildingToConstruct) {
cit.task = 'build'; cit.task = 'build';
@ -401,7 +410,7 @@ function builderTasks(cit) {
return; return;
} }
// If nothing else, chop wood (store in city storage) so we can build new houses // Otherwise chop wood (to store)
const anyTree = findNearestResourceOfType(cit, "Tree"); const anyTree = findNearestResourceOfType(cit, "Tree");
if (anyTree) { if (anyTree) {
cit.task = 'chop'; cit.task = 'chop';
@ -409,17 +418,11 @@ function builderTasks(cit) {
return; return;
} }
// Otherwise, idle // Idle
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
} }
/**
* Farmer logic:
* - If carrying fruit and there's a house that can store more, deliver fruit
* - If not carrying fruit or house is full, gather fruit
* - Maybe also plant a fruit tree if carrying fruit
*/
function farmerTasks(cit) { function farmerTasks(cit) {
// If carrying fruit, try delivering to a house // If carrying fruit, try delivering to a house
if (cit.carryingFruit > 0) { if (cit.carryingFruit > 0) {
@ -439,45 +442,37 @@ function farmerTasks(cit) {
return; return;
} }
// Maybe plant a fruit tree if carrying at least 1 fruit (random chance) // Occasionally plant a new fruit tree if carrying fruit
if (cit.carryingFruit >= FRUIT_PLANT_COST && Math.random() < 0.1) { if (cit.carryingFruit >= FRUIT_PLANT_COST && Math.random() < 0.1) {
cit.task = 'plantFruitTree'; cit.task = 'plantFruitTree';
cit.target = null; // we'll pick a location near the citizen cit.target = null;
return; return;
} }
// Otherwise, idle // Idle
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
} }
/********************************************************************** /**********************************************************************
* SPECIFIC TASK IMPLEMENTATIONS * TASK HANDLERS
**********************************************************************/ **********************************************************************/
/** CHOP TASK - gather wood from normal trees */
function chopTask(cit) { function chopTask(cit) {
const tree = cit.target; const tree = cit.target;
if (!tree || tree.amount <= 0) { if (!tree || tree.amount <= 0) {
// Tree depleted
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
return; return;
} }
moveToward(cit, tree.x, tree.y, 0.4); moveToward(cit, tree.x, tree.y, 0.4);
// If close enough, chop
if (distance(cit.x, cit.y, tree.x, tree.y) < 10) { if (distance(cit.x, cit.y, tree.x, tree.y) < 10) {
const canGather = cit.carryingCapacity - cit.carryingWood; const canGather = cit.carryingCapacity - cit.carryingWood;
const toGather = Math.min(1, tree.amount, canGather); // gather 1 wood per tick const toGather = Math.min(1, tree.amount, canGather);
tree.amount -= toGather; tree.amount -= toGather;
cit.carryingWood += toGather; cit.carryingWood += toGather;
// Log occasionally
if (Math.random() < 0.01) { if (Math.random() < 0.01) {
logAction(`${cit.name} [${cit.profession}] is chopping wood...`); logAction(`${cit.name} [${cit.profession}] is chopping wood...`);
} }
// If full or tree depleted, we’re done
if (cit.carryingWood >= cit.carryingCapacity || tree.amount <= 0) { if (cit.carryingWood >= cit.carryingCapacity || tree.amount <= 0) {
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
@ -485,71 +480,61 @@ function chopTask(cit) {
} }
} }
/** DELIVER WOOD TASK - deliver wood to building under construction */
function deliverWoodTask(cit) { function deliverWoodTask(cit) {
const building = cit.target; const b = cit.target;
if (!building || building.completed) { if (!b || b.completed) {
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
return; return;
} }
moveToward(cit, building.x, building.y, 0.4); moveToward(cit, b.x, b.y, 0.4);
if (distance(cit.x, cit.y, b.x, b.y) < 20) {
if (distance(cit.x, cit.y, building.x, building.y) < 20) { const needed = b.requiredWood - b.deliveredWood;
// Deliver wood
const needed = building.requiredWood - building.deliveredWood;
if (needed > 0 && cit.carryingWood > 0) { if (needed > 0 && cit.carryingWood > 0) {
const toDeliver = Math.min(cit.carryingWood, needed); const toDeliver = Math.min(cit.carryingWood, needed);
building.deliveredWood += toDeliver; b.deliveredWood += toDeliver;
cit.carryingWood -= toDeliver; cit.carryingWood -= toDeliver;
logAction(`${cit.name} delivered ${toDeliver} wood to ${building.buildingType}.`); logAction(`${cit.name} delivered ${toDeliver} wood to ${b.buildingType}.`);
} }
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
} }
} }
/** BUILD TASK - once wood is delivered, help increase build progress (handled in global update) */
function buildTask(cit) { function buildTask(cit) {
const building = cit.target; const b = cit.target;
if (!building || building.completed) { if (!b || b.completed) {
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
return; return;
} }
moveToward(cit, building.x, building.y, 0.3); moveToward(cit, b.x, b.y, 0.3);
// Building progress handled globally
// They passively build while on site; actual progress is in global update
} }
/** GATHER FRUIT TASK - from fruit trees */
function gatherFruitTask(cit) { function gatherFruitTask(cit) {
const fruitTree = cit.target; const tree = cit.target;
if (!fruitTree || fruitTree.amount <= 0) { if (!tree || tree.amount <= 0) {
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
return; return;
} }
moveToward(cit, fruitTree.x, fruitTree.y, 0.4); moveToward(cit, tree.x, tree.y, 0.4);
if (distance(cit.x, cit.y, tree.x, tree.y) < 10) {
if (distance(cit.x, cit.y, fruitTree.x, fruitTree.y) < 10) {
const canGather = cit.carryingCapacity - cit.carryingFruit; const canGather = cit.carryingCapacity - cit.carryingFruit;
const toGather = Math.min(FRUIT_GATHER_RATE, fruitTree.amount, canGather); const toGather = Math.min(FRUIT_GATHER_RATE, tree.amount, canGather);
fruitTree.amount -= toGather; tree.amount -= toGather;
cit.carryingFruit += toGather; cit.carryingFruit += toGather;
if (Math.random() < 0.01) { if (Math.random() < 0.01) {
logAction(`${cit.name} [Farmer] is gathering fruit...`); logAction(`${cit.name} [Farmer] is gathering fruit...`);
} }
if (cit.carryingFruit >= cit.carryingCapacity || tree.amount <= 0) {
if (cit.carryingFruit >= cit.carryingCapacity || fruitTree.amount <= 0) {
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
} }
} }
} }
/** DELIVER FRUIT TASK - deposit fruit into a house */
function deliverFruitTask(cit) { function deliverFruitTask(cit) {
const house = cit.target; const house = cit.target;
if (!house || !house.completed) { if (!house || !house.completed) {
@ -558,7 +543,6 @@ function deliverFruitTask(cit) {
return; return;
} }
moveToward(cit, house.x, house.y, 0.4); moveToward(cit, house.x, house.y, 0.4);
if (distance(cit.x, cit.y, house.x, house.y) < 20) { if (distance(cit.x, cit.y, house.x, house.y) < 20) {
// Deliver fruit // Deliver fruit
const space = house.maxFruit - house.storedFruit; const space = house.maxFruit - house.storedFruit;
@ -573,16 +557,12 @@ function deliverFruitTask(cit) {
} }
} }
/** PLANT FRUIT TREE TASK - if carrying fruit, plant a new tree somewhere near */
function plantFruitTreeTask(cit) { function plantFruitTreeTask(cit) {
// Choose a spot near the citizen // Plant near the citizen
const px = cit.x + randInt(-50, 50); const px = cit.x + randInt(-50, 50);
const py = cit.y + randInt(-50, 50); const py = cit.y + randInt(-50, 50);
// Move there
moveToward(cit, px, py, 0.4); moveToward(cit, px, py, 0.4);
// If close enough to that spot, plant
if (distance(cit.x, cit.y, px, py) < 10) { if (distance(cit.x, cit.y, px, py) < 10) {
if (cit.carryingFruit >= FRUIT_PLANT_COST) { if (cit.carryingFruit >= FRUIT_PLANT_COST) {
cit.carryingFruit -= FRUIT_PLANT_COST; cit.carryingFruit -= FRUIT_PLANT_COST;
@ -594,7 +574,6 @@ function plantFruitTreeTask(cit) {
} }
} }
/** EAT AT HOUSE TASK - if a house has fruit, reduce hunger */
function eatAtHouseTask(cit) { function eatAtHouseTask(cit) {
const house = cit.target; const house = cit.target;
if (!house || !house.completed) { if (!house || !house.completed) {
@ -603,24 +582,21 @@ function eatAtHouseTask(cit) {
return; return;
} }
moveToward(cit, house.x, house.y, 0.4); moveToward(cit, house.x, house.y, 0.4);
if (distance(cit.x, cit.y, house.x, house.y) < 20) { if (distance(cit.x, cit.y, house.x, house.y) < 20) {
// Eat some fruit to reduce hunger // Eat some fruit
if (house.storedFruit > 0 && cit.hunger > 0) { if (house.storedFruit > 0 && cit.hunger > 0) {
const amountToEat = 10; // each 'meal' reduces 10 hunger const amountToEat = 10;
const eaten = Math.min(amountToEat, house.storedFruit); const eaten = Math.min(amountToEat, house.storedFruit);
house.storedFruit -= eaten; house.storedFruit -= eaten;
cit.hunger -= eaten; cit.hunger -= eaten;
if (cit.hunger < 0) cit.hunger = 0; if (cit.hunger < 0) cit.hunger = 0;
logAction(`${cit.name} ate ${eaten} fruit. Hunger now ${Math.floor(cit.hunger)}.`); logAction(`${cit.name} ate ${eaten} fruit. Hunger now ${Math.floor(cit.hunger)}.`);
} }
// Done eating
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
} }
} }
/** REST AT HOUSE TASK - if house is completed, recover energy */
function restAtHouseTask(cit) { function restAtHouseTask(cit) {
const house = cit.target; const house = cit.target;
if (!house || !house.completed) { if (!house || !house.completed) {
@ -629,10 +605,8 @@ function restAtHouseTask(cit) {
return; return;
} }
moveToward(cit, house.x, house.y, 0.4); moveToward(cit, house.x, house.y, 0.4);
// If close enough, we are "resting" => see updateCitizen (rest recovers energy).
if (distance(cit.x, cit.y, house.x, house.y) < 20) { if (distance(cit.x, cit.y, house.x, house.y) < 20) {
// If we reached max energy, done // Gains energy passively
if (cit.energy >= ENERGY_MAX - 1) { if (cit.energy >= ENERGY_MAX - 1) {
cit.energy = ENERGY_MAX; cit.energy = ENERGY_MAX;
cit.task = null; cit.task = null;
@ -641,6 +615,35 @@ function restAtHouseTask(cit) {
} }
} }
/**********************************************************************
* ROAD-BUILDING LOGIC
**********************************************************************/
/**
* When a new house is completed, we build a road from it
* to the nearest existing house (if one exists).
*/
function maybeBuildRoad(newHouse) {
// Find the nearest completed house (other than the new one)
const otherHouses = buildings.filter(b => b.buildingType === "House" && b.completed && b !== newHouse);
if (otherHouses.length === 0) return; // no other house to connect
let nearest = null;
let minDist = Infinity;
otherHouses.forEach((oh) => {
const d = distance(newHouse.x, newHouse.y, oh.x, oh.y);
if (d < minDist) {
minDist = d;
nearest = oh;
}
});
if (!nearest) return;
// Place a road site
const roadSite = createRoadSite(newHouse.x, newHouse.y, nearest.x, nearest.y);
buildings.push(roadSite);
logAction(`A Road site created between houses at (${newHouse.x}, ${newHouse.y}) and (${nearest.x}, ${nearest.y}).`);
}
/********************************************************************** /**********************************************************************
* FIND BUILDINGS OR RESOURCES * FIND BUILDINGS OR RESOURCES
**********************************************************************/ **********************************************************************/
@ -660,26 +663,24 @@ function findNearestResourceOfType(cit, rtype) {
} }
function findHouseWithFruit() { function findHouseWithFruit() {
// Return the first completed house that has >0 storedFruit return buildings.find(b => b.buildingType === "House" && b.completed && b.storedFruit > 0);
return buildings.find(b => b.completed && b.storedFruit > 0);
} }
function findAnyCompletedHouse() { function findAnyCompletedHouse() {
return buildings.find(b => b.completed); return buildings.find(b => b.buildingType === "House" && b.completed);
} }
function findHouseNeedingFruit() { function findHouseNeedingFruit() {
return buildings.find(b => b.completed && b.storedFruit < b.maxFruit); return buildings.find(b => b.buildingType === "House" && b.completed && b.storedFruit < b.maxFruit);
} }
/********************************************************************** /**********************************************************************
* RANDOM/IDLE MOVEMENT * RANDOM WANDER
**********************************************************************/ **********************************************************************/
function randomWander(cit) { function randomWander(cit) {
// Occasional random direction change
if (Math.random() < 0.01) { if (Math.random() < 0.01) {
cit.vx = (Math.random() - 0.5) * 0.3; cit.vx = (Math.random() - 0.5) * 0.5;
cit.vy = (Math.random() - 0.5) * 0.3; cit.vy = (Math.random() - 0.5) * 0.5;
} }
} }
@ -706,53 +707,45 @@ function distance(x1, y1, x2, y2) {
} }
/********************************************************************** /**********************************************************************
* BUILDING LOGIC * AUTO-CREATION OF NEW HOUSE SITES
* Similar logic to previous examples: if cityStorage has enough wood,
* we place a new House site occasionally.
**********************************************************************/ **********************************************************************/
/**
* If no building is under construction and cityStorage has enough wood,
* place a new house building site.
* We'll do it once every few seconds to show city growth.
*/
setInterval(() => { setInterval(() => {
const underConstruction = buildings.find(b => !b.completed); const underConstruction = buildings.find(b => b.buildingType === "House" && !b.completed);
if (!underConstruction && cityStorage.wood >= HOUSE_WOOD_REQUIRED) { if (!underConstruction && cityStorage.wood >= HOUSE_WOOD_REQUIRED) {
cityStorage.wood -= HOUSE_WOOD_REQUIRED; cityStorage.wood -= HOUSE_WOOD_REQUIRED;
const x = randInt(-500, 500); const x = randInt(-500, 500);
const y = randInt(-500, 500); const y = randInt(-500, 500);
const site = createBuildingSite("House", x, y); const site = createHouseSite(x, y);
buildings.push(site); buildings.push(site);
logAction(`A new House construction site placed at (${x}, ${y}).`); logAction(`A new House site placed at (${x}, ${y}).`);
} }
}, 5000); // check every 5 seconds }, 5000);
/********************************************************************** /**********************************************************************
* DEPOSIT WOOD IN CITY STORAGE IF CITIZENS ARE IDLE * DEPOSIT WOOD IN CITY STORAGE IF IDLE BUILDER
* (Similar to previous examples)
**********************************************************************/ **********************************************************************/
const originalAssignNewTask = assignNewTask; const originalAssignNewTask = assignNewTask;
assignNewTask = function(cit) { assignNewTask = function(cit) {
// If a builder is carrying wood but no building needs it, // If builder carrying wood, but no building needs it, deposit to city center
// deposit to city storage (which we treat as (0,0))
if (cit.profession === "Builder") { if (cit.profession === "Builder") {
const buildingNeedingWood = buildings.find(b => !b.completed && b.deliveredWood < b.requiredWood); const buildingNeedingWood = buildings.find(b => !b.completed && b.deliveredWood < b.requiredWood);
if (cit.carryingWood > 0 && !buildingNeedingWood) { if (cit.carryingWood > 0 && !buildingNeedingWood) {
const distToCenter = distance(cit.x, cit.y, 0, 0); const distToCenter = distance(cit.x, cit.y, 0, 0);
if (distToCenter < 20) { if (distToCenter < 20) {
// Deposit wood
cityStorage.wood += cit.carryingWood; cityStorage.wood += cit.carryingWood;
logAction(`${cit.name} deposited ${cit.carryingWood} wood into city storage.`); logAction(`${cit.name} deposited ${cit.carryingWood} wood into city storage.`);
cit.carryingWood = 0; cit.carryingWood = 0;
} else { } else {
// Move to center // Move to city center
moveToward(cit, 0, 0, 0.4); moveToward(cit, 0, 0, 0.4);
// We'll remain idle if we get close enough
cit.task = null; cit.task = null;
cit.target = null; cit.target = null;
return; return;
} }
} }
} }
// Then do the original logic
originalAssignNewTask(cit); originalAssignNewTask(cit);
}; };
@ -765,15 +758,18 @@ function drawWorld() {
// Draw grid // Draw grid
drawGrid(); drawGrid();
// Draw resources (trees, fruit trees) // Draw resources
resources.forEach((res) => { resources.forEach((res) => drawResource(res));
drawResource(res);
});
// Draw buildings // Draw roads first (both completed or under construction)
buildings.forEach((b) => { buildings
drawBuilding(b); .filter(b => b.buildingType === "Road")
}); .forEach(b => drawRoad(b));
// Draw houses
buildings
.filter(b => b.buildingType === "House")
.forEach(b => drawHouse(b));
// Draw city storage info // Draw city storage info
drawCityStorage(); drawCityStorage();
@ -793,42 +789,38 @@ function drawGrid() {
ctx.lineWidth = 1 / scale; ctx.lineWidth = 1 / scale;
const range = 2000; const range = 2000;
const startX = -range; for (let x = -range; x <= range; x += 100) {
const endX = range;
const startY = -range;
const endY = range;
ctx.beginPath(); ctx.beginPath();
for (let x = startX; x <= endX; x += 100) { ctx.moveTo(x, -range);
ctx.moveTo(x, startY); ctx.lineTo(x, range);
ctx.lineTo(x, endY);
}
for (let y = startY; y <= endY; y += 100) {
ctx.moveTo(startX, y);
ctx.lineTo(endX, y);
}
ctx.stroke(); ctx.stroke();
}
for (let y = -range; y <= range; y += 100) {
ctx.beginPath();
ctx.moveTo(-range, y);
ctx.lineTo(range, y);
ctx.stroke();
}
ctx.restore(); ctx.restore();
} }
function drawResource(res) { function drawResource(res) {
if (res.amount <= 0) return; // skip depleted if (res.amount <= 0) return;
ctx.save(); ctx.save();
ctx.translate(canvas.width / 2 + offsetX, canvas.height / 2 + offsetY); ctx.translate(canvas.width / 2 + offsetX, canvas.height / 2 + offsetY);
ctx.scale(scale, scale); ctx.scale(scale, scale);
if (res.type === "Tree") { if (res.type === "Tree") {
ctx.fillStyle = "#228B22"; // green ctx.fillStyle = "#228B22";
ctx.beginPath(); ctx.beginPath();
ctx.arc(res.x, res.y, 10, 0, Math.PI * 2); ctx.arc(res.x, res.y, 10, 0, Math.PI * 2);
ctx.fill(); ctx.fill();
ctx.fillStyle = "#000"; ctx.fillStyle = "#000";
ctx.font = "12px sans-serif"; ctx.font = "12px sans-serif";
ctx.fillText(`${res.type} (${res.amount})`, res.x - 20, res.y - 12); ctx.fillText(`Tree (${res.amount})`, res.x - 20, res.y - 12);
} else if (res.type === "FruitTree") { } else if (res.type === "FruitTree") {
ctx.fillStyle = "#FF6347"; // tomato color ctx.fillStyle = "#FF6347";
ctx.beginPath(); ctx.beginPath();
ctx.arc(res.x, res.y, 10, 0, Math.PI * 2); ctx.arc(res.x, res.y, 10, 0, Math.PI * 2);
ctx.fill(); ctx.fill();
@ -840,7 +832,10 @@ function drawResource(res) {
ctx.restore(); ctx.restore();
} }
function drawBuilding(b) { /**
* Draw a House building site or a completed House
*/
function drawHouse(b) {
ctx.save(); ctx.save();
ctx.translate(canvas.width / 2 + offsetX, canvas.height / 2 + offsetY); ctx.translate(canvas.width / 2 + offsetX, canvas.height / 2 + offsetY);
ctx.scale(scale, scale); ctx.scale(scale, scale);
@ -850,24 +845,65 @@ function drawBuilding(b) {
ctx.strokeStyle = "#FF8C00"; ctx.strokeStyle = "#FF8C00";
ctx.lineWidth = 2 / scale; ctx.lineWidth = 2 / scale;
ctx.strokeRect(b.x - 15, b.y - 15, 30, 30); ctx.strokeRect(b.x - 15, b.y - 15, 30, 30);
ctx.fillStyle = "#000"; ctx.fillStyle = "#000";
ctx.font = "12px sans-serif"; ctx.font = "12px sans-serif";
ctx.fillText(`${b.buildingType} (Building)`, b.x - 30, b.y - 25); ctx.fillText(`House (Building)`, b.x - 30, b.y - 25);
ctx.fillText(`Wood: ${b.deliveredWood}/${b.requiredWood}`, b.x - 30, b.y + 30); ctx.fillText(`Wood: ${b.deliveredWood}/${b.requiredWood}`, b.x - 30, b.y + 30);
ctx.fillText(`Progress: ${Math.floor(b.buildProgress)}%`, b.x - 30, b.y + 42); ctx.fillText(`Progress: ${Math.floor(b.buildProgress)}%`, b.x - 30, b.y + 42);
} else { } else {
// Completed house // Completed
ctx.fillStyle = "#DAA520"; ctx.fillStyle = "#DAA520";
ctx.fillRect(b.x - 15, b.y - 15, 30, 30); ctx.fillRect(b.x - 15, b.y - 15, 30, 30);
ctx.fillStyle = "#000"; ctx.fillStyle = "#000";
ctx.font = "12px sans-serif"; ctx.font = "12px sans-serif";
ctx.fillText(`${b.buildingType}`, b.x - 15, b.y - 20); ctx.fillText(`House`, b.x - 15, b.y - 20);
ctx.fillText(`Fruit: ${b.storedFruit}/${b.maxFruit}`, b.x - 25, b.y + 32); ctx.fillText(`Fruit: ${b.storedFruit}/${b.maxFruit}`, b.x - 25, b.y + 32);
} }
ctx.restore(); ctx.restore();
} }
/**
* Draw a Road building site or a completed Road
*/
function drawRoad(b) {
ctx.save();
ctx.translate(canvas.width / 2 + offsetX, canvas.height / 2 + offsetY);
ctx.scale(scale, scale);
// Draw line between (b.x1, b.y1) and (b.x2, b.y2)
if (!b.completed) {
ctx.setLineDash([5, 5]); // dashed if under construction
ctx.strokeStyle = "#888";
} else {
ctx.setLineDash([]);
ctx.strokeStyle = "#444";
}
ctx.lineWidth = 2 / scale;
ctx.beginPath();
ctx.moveTo(b.x1, b.y1);
ctx.lineTo(b.x2, b.y2);
ctx.stroke();
// Draw small label near midpoint
ctx.fillStyle = "#000";
ctx.font = "12px sans-serif";
if (!b.completed) {
ctx.fillText(`Road (Building) ${Math.floor(b.buildProgress)}%`, b.x, b.y - 15);
ctx.fillText(`Wood: ${b.deliveredWood}/${b.requiredWood}`, b.x - 20, b.y + 15);
} else {
ctx.fillText(`Road`, b.x - 10, b.y - 5);
}
ctx.restore();
}
/**
* Show city storage
*/
function drawCityStorage() { function drawCityStorage() {
ctx.save(); ctx.save();
ctx.fillStyle = "#000"; ctx.fillStyle = "#000";
@ -887,12 +923,10 @@ function drawCitizen(cit) {
ctx.arc(cit.x, cit.y, 7, 0, Math.PI * 2); ctx.arc(cit.x, cit.y, 7, 0, Math.PI * 2);
ctx.fill(); ctx.fill();
// Show name + profession + carrying // Show name, profession, carrying, hunger, energy
ctx.fillStyle = "#000"; ctx.fillStyle = "#000";
ctx.font = "10px sans-serif"; ctx.font = "10px sans-serif";
ctx.fillText(`${cit.name} [${cit.profession}]`, cit.x + 10, cit.y - 2); ctx.fillText(`${cit.name} [${cit.profession}]`, cit.x + 10, cit.y - 2);
// Additional info: wood/fruit/hunger/energy
ctx.fillText(`W:${cit.carryingWood} F:${cit.carryingFruit} H:${Math.floor(cit.hunger)} E:${Math.floor(cit.energy)}`, cit.x + 10, cit.y + 10); ctx.fillText(`W:${cit.carryingWood} F:${cit.carryingFruit} H:${Math.floor(cit.hunger)} E:${Math.floor(cit.energy)}`, cit.x + 10, cit.y + 10);
ctx.restore(); ctx.restore();
@ -945,7 +979,6 @@ canvas.addEventListener('wheel', (e) => {
* START * START
**********************************************************************/ **********************************************************************/
initWorld(); initWorld();
</script> </script>
</body> </body>
</html> </html>