So let me explain this a bit better so you can understand the logic flow.
Menu pulls the data from the server, it takes that data to build the buttons, Divs, etc.
This menu also pulls from the server for any updates. Upon pulling it checks if the data changed. If it didn’t it does nothing, if it did, it then splits that json into the individual character records that it feeds to the (currently) embeds via a message.
the charactersheet\charsheet.html exists as the framework where all the data resides on top of a charactersheet png. The charsheet.js is listening for the message. Once it gets the message it then pulls the json data fed to it by menu and checks if it is different than what is currently has, if it isn’t then it does nothing, if it did change it then goes through and updates the data in the page.
EX
function writeHP(hp) {
if ('total' in hp) {
document.getElementById('maxhp').innerText = hp.total.value.toString();
var maxHP = hp.total.value;
}
else {
document.getElementById('maxhp').innerText = "0";
var maxHP = 0;
}
if ('wounds' in hp) {
var wounds = hp.wounds.value;
}
else {
var wounds = 0;
}
document.getElementById('currenthp').innerText = (maxHP - wounds).toString();
}
So main pulls, then doles out the individual character data to the pages. So the charsheets don’t fetch anything, only the menu does, and feeds the charsheets.