Using JSON to change a displayed number or string?

Question

(Disclaimer: This is my first time posting here, so please correct me if I made a mistake!) I'm making a character generator for a tabletop RPG, and I want to have the user select a character race (Centaur, Elf, Human, etc.) from a dropdown list. After selection, how can I have it so that the selected race changes other variables for the player character, such as starting stats (increased strength or dexterity, for example) or special skills?

My current code for HTML5 side:

<form>

<label>Enter Character Name:</label>
      <!-- Input character name in text field. Name is recorded to JSON variable. -->
      <input type="text" id="pcName" name="pcName" required onchange="setName(name)"/>

<label>Select Race: </label>
   <!-- Select Race from dropdown menu. On selection, stats/skills/magic are changed.
    Also adds racial skills/abilities to proper fields. -->
 <select id = "raceList" name="raceList" required onchange="setRace(name)">
 <option name="Centaur" id="Centaur">Centaur</option>
 <option name="Elf" id="Elf">Elf</option>
 <option name="Fae" id="Fae">Fae</option>
 <option name="Human" id="Human">Human</option>
</select>
</form>

<label>Enter Attribute Points: </label>
    <!-- Enter stats for the character. Based on these numbers entered, attribute tables are altered.
      Check to ensure that the numbers entered are not invalid. Recorded to JSON variable. If there were points added from selecting a race, add them here.-->
<input type="text" id="Strength" name="Strength"/>
<input type="text" id="Dexterity" name="Dexterity"/>
<input type="text" id="Intellect" name="Intellect"/>
<input type="text" id="Knowledge" name="Knowledge"/>
<input type="text" id="Endurance" name="Endurance"/>

And my JSON code, with data for the races and an area for the PC's data to be recorded to. When a race is selected, a function (pseudocode after this) parses the JSON data and changes things as needed. For example, the "statModifiers" section adds additional stat points (for example, choosing a Centaur gets you +10 Strength).

{"raceList": [

{"raceName": "Centaur", 
"raceAbilities": ["Large Size", "Speed"], 
  "raceCombatSkills": ["Deadly Charge", "Trample"],
  "statModifiers": [10, 0, 0, 0, 0], 
  "skillModifiers": [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [0,0,0,0]},

  {"raceName": "Elf", 
  "raceAbilities": [], 
  "raceCombatSkills": ["Archery"],
  "statModifiers": [0, 5, 10, 0, 0], 
  "skillModifiers": [0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [5,0,0,0]},

{"raceName": "Fae", 
  "raceAbilities": ["Silent Casting", "Cast While Moving"], 
  "raceCombatSkills": [],
  "statModifiers": [5, 0, 0, 0, 5], 
  "skillModifiers": [0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [15,0,0,15]},

 {"raceName": "Human", 
  "raceAbilities": [], 
  "raceCombatSkills": [],
  "statModifiers": [5, 5, 5, 0, 5], 
  "skillModifiers": [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
  "magicModifiers": [0,0,0,0]},

"pc": [
{"pcName": "name", 
    "pcRace": "race",
    "pcBuild": "build", 
    "pcStats": [5,5,5,5,5], 
    "pcSkills"[20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20],
    "pcArmor": [], 
    "pcItems": []}
]

}

And the JavaScript itself (or rather, what the code is supposed to do, as I'm unsure what code to use):

//Function that, on call, goes through the JSON array for a race object. Then, updates pcRace and pc object with appropriate data.
function setRace(race) {
    for (int i = 0; i < raceName.length; i++) {
        if (raceList.i.raceName === race) {
            pc.pcRace = race;
            //Parse JSON data from selected race here, modify "Attribute Points" and related numbers as well
            return;
        }
    }
}

Little unclear what you are asking, maybe you could slim down your post to just the important parts. But if I'm understanding correctly, I think you need to be looping over raceList (your array) not raceName. — Matt Burland
– Matt Burland, Commented Dec 20, 2013 at 19:44
I personally would have a temporary "pc" and combine the stats of the race and pc until the user is finished with character creation. Display the combined stats (centaur strength + pc strength) during creation and then combine them upon completion. Would that work? — Uxonith
– Uxonith, Commented Dec 20, 2013 at 19:45
Ah, okay, that's a start. Thanks! But how do I get variables like default/modified stats to display correctly? — Thassa
– Thassa, Commented Dec 20, 2013 at 19:48
@Uxonith That could work, actually. How would I make a temporary "pc", though? Would that be created with JS, then? — Thassa
– Thassa, Commented Dec 20, 2013 at 19:51

Matt Burland · Accepted Answer · 2013-12-20 19:51:02Z

2

Personally, I'd reorganize your raceList to be an object literal keyed off of the race name:

raceList = {"Fae" : { 
    "raceAbilities": ["Silent Casting", "Cast While Moving"], 
    "raceCombatSkills": [],
    "statModifiers": [5, 0, 0, 0, 5], 
    "skillModifiers": [0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
    "magicModifiers": [15,0,0,15] }, 
    { "Human" : { //... }
}

Now to find the relevant entry, I can just key off the name instead of iterating through an array:

function setRace(race){
    var raceStats = raceList[race];
}

But if you can't do that, then searching the array works too.

Now for updating your pc, just iterate through the modifiers from raceStats and add them to your pc, for example:

for(var i=0; i < pc.pcStats.length; i++) {
    pcStats[i] += raceStats.statModifiers[i];
}

And so on...

answered Dec 20, 2013 at 19:51

Matt Burland

45.3k18 gold badges110 silver badges182 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Uxonith Over a year ago

The only problem I see with this is that you apply the modifiers the first time, but what happens if you change race, you just keep boosting stats? I guess you could remove "previousRace" statModifers and add the new ones?

Matt Burland Over a year ago

@Uxonith: Yeah, it's probably worth saving the raceStats object (let's call it previousRace) and remove them (by subtracting instead of adding) before adding the new raceStats

Thassa Over a year ago

I would say this answers my question accurately! Thanks, @MattBurland!

Collectives™ on Stack Overflow

Using JSON to change a displayed number or string?

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related