// Initialise Variables
// type: 1 = primary 2 = secondary 3 = refined
var food = {
name:'food',
type:1,
total:0,
increment:1,
secondary:'skins',
secondaryChance:0.1
},
wood = {
name:'wood',
type:1,
total:0,
increment:1,
secondary:'herbs',
secondaryChance:0.1
},
stone = {
name:'stone',
type:1,
total:0,
increment:1,
secondary:'ore',
secondaryChance:0.1
},
skins = {
name:'skins',
type:2,
total:0,
refined:'leather',
increment:1
},
herbs = {
name:'herbs',
type:2,
total:0,
refined:'belief',
increment:1
},
ore = {
name:'ore',
type:2,
total:0,
refined:'metal',
increment:1
},
leather = {
name:'leather',
type:3,
total:0,
increment:0.5
},
belief = {
name:'belief',
type:3,
total:0,
increment:0.5
},
metal = {
name:'metal',
type:3,
total:0,
increment:0.5
}
// Clicker type (who created the resource)
player = 0
gatherer = 0
// Called when primary resource is clicked
function primaryResourceClick(resource){
resource.total += resource.increment;
console.log(resource + resource.total);
x = Math.random();
console.log(x);
if (resource.name == 'food'){
document.getElementById("food").innerHTML = food.total;
if (x < food.secondaryChance) {
skins += skins.increment;
document.getElementById("skins").innerHTML = skins.total;
console.log(skins + skins.total);
}
}
if (resource.name == 'wood') {
document.getElementById("wood").innerHTML = wood.total;
if (x < wood.secondaryChance) {
herbs += herbs.increment;
document.getElementById("herbs").innerHTML = herbs.total;
console.log(herbs + herbs.total);
}
}
if (resource.name == 'stone') {
document.getElementById("stone").innerHTML = stone.total;
if (x < stone.secondaryChance) {
ore += ore.increment;
document.getElementById("ore").innerHTML = ore.total;
console.log(ore + ore.total)
}
}
};<html>
<head>
<title>Village</title>
<link rel="stylesheet" type="text/css" href="interface.css" />
<script language="javascript" src="main.js"></script>
</head>
<body>
<div id="resources">
<div id="primaryResources">
<h4>Primary Resources</h4>
<table id="primaryResourcesDisplay">
<tr>
<td><button type="button" onclick="primaryResourceClick(food)">Gather Food</button></td>
<td>Food:</td>
<td><span id="food">0</span></td>
</tr>
<tr>
<td><button type="button" onclick="primaryResourceClick(wood)">Cut Wood</button>
<td>Wood:</td>
<td><span id="wood">0</span></td>
</tr>
<tr>
<td><button type="button" onclick="primaryResourceClick(stone)">Mine Stone</button>
<td>Stone:</td>
<td><span id="stone">0</span></td>
</tr>
</table>
</div>
<div id="secondaryResources">
<h4>Secondary Resources</h4>
<table id="secondaryResourcesDisplay">
<tr>
<td>Skins:</td>
<td><span id="skins">0</span></td>
<td>Leather:</td>
<td><span id="leather">0</span></td>
</tr>
<tr>
<td>Herbs:</td>
<td><span id="herbs">0</span></td>
<td>Belief:</td>
<td><span id="belief">0</span></td>
</tr>
<tr>
<td>Ore:</td>
<td><span id="ore">0</span></td>
<td>Metal:</td>
<td><span id="metal">0</span></td>
</tr>
</table>
</div>
</div>
</body>
<html>Whenever any of the secondary resources is updated, it shows as undefined. I've tried logging some data to the console, the console also shows the variable as undefined. What's even stranger is that the console not showing any errors.
skins.incrementis equal to1. Therefore, skins increases by one.