Hi everyone.

I'm a game development student at university. For our first assignment we have to create a text based rpg (think fighting fantasy or the hobbit) in html and javascript.

The course itself teaches programming from the very beginning. I've been a front-end web developer for a year now and a game developer for almost 2 now, so I have a lot more experience with programming. Those of us that are more advanced are recommend to go above and beyond the assignment brief to get the best marks and show our motivation for the subject.

I've begun working on the code itself and it's been suggested to me that I should use JSON (or something similar) to store the data. This includes the text for dialogue and flavour text, stats and that sort of thing. So whilst I've been programming my constructors I've tried to work around the basis that I'll be somehow parsing in this data.

Whilst I know that JSON is javascript (basically), I've tried to look into using it and parsing it into my code but I'm really struggling to understand how it can be done. It's not a very well documented area, with the only real methods I've seen to parse in the JSON is with jQuert by passing the JSON object into another variable. Surely at this point I might as well just be storing the data within my JavaScript in the first place? Is there no way to search within the JSON document and read data directly without storing everything in my JavaScript again?

If anyone has any suggestions on how I should be doing this, or any alternatives and resources, then please point me in the right direction.

Thanks, Joeb.

Hi Joeb,

as this looks like homework, i'll stay very simplistic in the explanation, to allow you some research.

well, for Json parsing you can use JSON.parse() & JSON.stringify(), so you don't need to worry about the "parsing" part of you assignment.

Unless your teacher specifically asked to manually parse it, which can become a quite huge topic.

about the "search in json" part, you have 2 ways of doing it (there are more ways of doing it, but i guess those are simple enough for your task)

1). if you json is *not* yet parsed , you can use any text search mechanism, like indexOf().

2). if you already parsed your json, you can loop through the object properties with Object.keys().

Now, for the "without store it in JS again", i didn't get what you mean. The Json, being it text or object, will be loaded into JS to be manipulated.

Hope that helps,

Good luck

EDIT :

just some notes about the methods i say

- the JSON.parse/stringify are safe to use as all major/updated browser supports it.

- however watch out for indexOf as some browsers do not support it very well

- Object.keys is defined in ECMAScript5, which pretty much all major/updated browser already support

Hi Kakyo!

Thanks for the resources!

All of this JSON side of things isn't really required at all, all they want is a basic text game based on conditionals, so I'm trying to blow them away with effort and skill

I'd been looking at those functions beforehand, but was struggling a bit with the docs. As far as what I could tell it seemed more like they were turning JS into JSON rather than the other way around!

When I was saying about not hard coding it, I mean: Why shouldn't I just write the data in my javascript if the json has to be stored in a variable anyway?

Also, in order to help you understand an example of what I'd like to do:

Say I have a location constructor, where some examples parameters include ID, name, description and choices. Would it be possible to have a single location variable containing the JSON data for a single location that would be written over whenever a player enters a new location via a for loop (by matching an id for the players location with the id for that location)?

I'm not sure I really understand the usefulness of JSON as a tool in my case.

Thanks, Joeb.

EDIT:

As a better idea of what I would be trying to do with that example, here is my code so far for the location constructor:

var numLocations = 10;
var locations = [];

for (var i = 0; i < numLocations; i++)
{
    locations[i] = new Location(i, "name", "desc", "choices");
}


for (var i = 0; i < locations.length; i++) 
{
    if (player.location == locations[i].locationID) 
    {
        locations[i].start();
    }
}

In this example I'd like to pass in the name, description and choices to the for loop from a JSON file. Would this be possible? I know it'd take some reworking the loop to actually find the correct location based on the loop counter, but is this feasible logic for the problem?

Hello Joeb,

The main reason for having the json is : "Separation of concerns".

Yes, you can write the entire data into JS, but also Blizzard could code WoW into one file.

However , this creates a hell of a code to maintain and this is a receipt to disaster.

so the goal of having the JSON is that the *actual data* is in one side and *how to use* this data is in another side.

Another good point is, you could "stream" you json *during* the gameplay, so the player loads only what is needed.

let's say, for example, you have 1000 locations, if you code all those into one file, this would have, let's say, 100mb.

now you got a handful of problems to deal with :

- the user will be downloading places that he might not even go yet.

var parsedJSON = JSON.parse(<content of text file here>);
for loop { 
  location[i] = new Location(id, parsedJSON.Name, parsedJson.Desc, parsedJson.choices);
}

Thanks for this!

It was very helpful in pushing towards where I should be looking for information and helping me to sort out my files.

I am currently struggling with locally loading my JSON file, but I'm sure I've got a handle on sorting this leg of the assignment out.

Thanks very much!

It's also important to notice, that you can access JSON data by named index, instead of numbered index.
Say you got a file/object that looks like this:

locations = {
  "City": {
    "name" = "city",
    "difficulty" = 4,
    "description" = "A low population city",
  },
  "Home": {
    "name" = "Athurs Home",
    "difficulty" = 8,
    "description" = "It's dark",
    "possible_directions" = ["City", "FordsHome", "Kitchen"],
  }
}

Instead of looping through all possible locations, you can simply write something like:
var current_location = locations['City'];
display_text(current_location.description); // assuming you got a display_text() function

Which should improve readability.
Notice that you can access the data both as an array, and as an object.

If you use spaces in the name, you have to use the array-method.

Hope this helps.