That's pretty good, but we found our content would very often require a lot more complexity (imagine a list with 20 entries instead of 3). JSON doesn't allow tab or return characters to be present in its strings, so all of our HTML had to be on one line, which became a bit of a challenge to sift through if we ever needed to make changes to it. As such, I developed an alternative. Now, our "JSON" looks like this:

 

{
  "_id": "c-0",
  "_parentId": "b-0",
  "_component": "text",
  "_classes": "",
  "_layout": "full",
  "_type": "component",
  "title": "My component",
  "body": <<<"
    <p>This is a paragraph</p>

    <ul>
      <li>List entry #1</li>
      <li>List entry #2 says "hello everybody".</li>
      <li>List entry #3 says \"I'm escaped.\"</li>
    </ul>
  ">>>
},

Much tidier right?

 

This was accomplished by writing a simple Grunt script which converts a custom file of ours (componentsSYNT.jsonsynt) into the standard Adapt components.json file before any of the other build process execute. The script goes through the .jsonsynt file and removes any tab or return characters it finds between our custom made <<<" ">>> tags, and also automatically escapes any unescaped double quotes ("). This gets rid of all syntax errors that would prevent a normal .JSON file from being compiled, and so it then writes the resulting data to components.json, and allows Adapt's default build process to handle it from there. In fact, the first example I gave above is the output of the second example after its processed by the script.

 

Navigate to your courses grunt/tasks directory.

Add the attached jsonsynt-build.js script into grunt/tasks.

You will now need to edit some Grunt scripts in order to include jsonsynt-build.js in the build process.

For the following files: diff.js, dev.js, build.js.

Add:

Right before:

 

Now navigate to grunt/config, open watch.js, and prepend:

To the start the courseAssets.tasks array.

 

With that, your Grunt has been modified. Now you need to create the componentsSYNT.jsonsynt file that the script will read. To do this, you can just copy and rename your components.json file. And you're done! You can start modifying the componentsSYNT.jsonsynt file!

 

Note: for the time being, this will only work for the components file. If you'd like it to also work for blocks/contentObjects/etc., please modify the array at the start of jsonsynt-build.js to include them.

 

 

JSONSYNT is just a modified JSON, and if you choose, you can use JSON syntax throughout your componentsSYNT.json file with no ill effects.

 

If you want to use return, tab, or unescaped quotes inside of a JSON value, simply change the double quotes surrounding the value to <<<" and ">>>. Example:

 

 

to this:

 

 

The JSONSYNT script will convert all strings inside of <<<" and ">>> to a JSON compatible format. Note that it will not modify any text not inside of <<<" ">>>, so don't go putting tab characters inside of regular double quotes.

 

Another feature of JSONSYNT is comments. Any text placed within <<<! and !>>> will be completely removed when the file is converted. Example:

 

body: <<<"