{
	"0: data": {
		"srcIndexStart": "0", 
		"file": "docssrc/docs.Tools.JsonViewer.ParseTreeMode.tmpl", 
		"parseTreeMode": "true", 
		"srcLength": "4442", 
		"source": "[$name|ParseTreeMode$]
[$title|Parse Tree Mode$]
[$frame|HTMLPage.tmpl$]
<p>
The version of [$pageTitle|JsonViewer$] included with Goldie has been
customized to include a special Parse Tree Mode for viewing a text document
side-by-side with a JSON-based tree that describes the text. In this mode,
you can click on a tree node to highlight its corresponding text,
or jump from a location in the text to the corresponding tree node.
</p>
<p>
This page describes the special data JsonViewer looks for to enable and use
this mode.
</p>

<h2>Sample</h2>
<p>
Goldie includes the sample JSON file
[$link|https://bitbucket.org/Abscissa/goldie/src/v0.8/jsonSample.json|jsonSample.json$]
that demonstrates how to create a JSON file that JsonViewer's Parse Tree Mode
can use. Here is the content of the file:
</p>
<div class=\"code-plain\">{
    parseTreeMode: true,
    source: \"Once upon a time...\",
    
    \"Story\": {
        srcIndexStart: 0,
        srcLength: 19,
        
        \"Sentence\": {
            srcIndexStart: 0,
            srcLength: 16,
            
            \"Word 1\": {
                srcIndexStart: 0,
                srcLength: 4,
            },
            
            \"Word 2\": {
                srcIndexStart: 5,
                srcLength: 4,
            },
            
            \"Word 3\": {
                srcIndexStart: 10,
                srcLength: 1,
            },
            
            \"Word 4\": {
                srcIndexStart: 12,
                srcLength: 4,
            }
        },
        
        \"Punctuation\": {
            srcIndexStart: 16,
            srcLength: 3,
        }
    }
}</div>
<p>
If you load that file into JsonViewer, it will look like this:
</p>
<img src=\"[$urlToRoot$]JsonViewerSample.png\" alt=\"\" />
<p>
As you can see, this JSON file describes a text file containing
[$code|inline|Once upon a time...$].
It also tells JsonViewer that [$code|inline|Once upon a time$] is a \"Story\",
[$code|inline|...$] is \"Punctuation\",
and [$code|inline|Once$] though [$code|inline|time$] are
\"Word 1\" through \"Word 4\". (Remember that JSON objects can't have
multiple members with the same name.)
</p>
<p>
Click a tree node in the left panel to highlight the corresponding section of text.
Click a location in the text and then click \"Jump to Node\" to select
the corresponding node.
</p>

<h2>Reference</h2>
<p>
	All of the following are optional. However, if none of them are used,
	then Parse Tree Mode won't be particularly useful.
</p>

[$apiHead|[:parseTreeMode:]$]
<div class=\"api-def\">
<p>
	This can go in either the root JSON object (as in the example above),
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	Giving this a value of [$code|inline|true$] instructs JsonViewer to
	automatically turn on Parse Tree Mode when loading the file.
</p>
</div>

[$apiHead|[:source:]$]
<div class=\"api-def\">
<p>
	This can go in either the root JSON object (as in the example above),
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	This contains the actual text that the JSON file describes.
	This text will be shown in the middle panel.
	Don't forget to properly escape any double-quotes.
</p>
</div>

[$apiHead|[:file:]$]
<div class=\"api-def\">
<p>
	<span style=\"font-weight: bold\">Not recommended:</span>
	Use [$ident|source$] instead.
</p>
<p>
	This can go in either the root JSON object,
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	If [$ident|source$] is omitted, then [$ident|file$] can be used to load
	the source text from a specific file. The value of this should be the
	filename containing the text that the JSON file describes.
</p>
<p>
	<span style=\"font-weight: bold\">This is NOT recommended</span>, however, 
	because the two files may become out-of-sync. It is recommended
	that you use [$ident|source$] instead. (This can be safely included in addition to
	[$ident|source$] though, because if [$ident|source$] is included,
	JsonViewer will simply ignore [$ident|file$].)
</p>
</div>

[$apiHead|[:
srcIndexStart
srcLength
:]$]
<div class=\"api-def\">
<p>
	Any JSON object that includes both [$ident|srcIndexStart$] and [$ident|srcLength$]
	is considered to refer to a specific section of the text. This section
	of the text starts at [$ident|srcIndexStart$] (zero-indexed) and
	extends for [$ident|srcLength$] characters.
</p>
</div>
", 
		"0: name": {
			"srcIndexStart": "0", 
			"data": "ParseTreeMode", 
			"srcLength": "22", 
			"0: data": {
				"srcIndexStart": "7", 
				"data": "ParseTreeMode", 
				"srcLength": "13"
			}
		}, 
		"1: data": {
			"srcIndexStart": "22", 
			"data": "
", 
			"srcLength": "1"
		}, 
		"2: title": {
			"srcIndexStart": "23", 
			"data": "Parse Tree Mode", 
			"srcLength": "25", 
			"0: data": {
				"srcIndexStart": "31", 
				"data": "Parse Tree Mode", 
				"srcLength": "15"
			}
		}, 
		"3: data": {
			"srcIndexStart": "48", 
			"data": "
", 
			"srcLength": "1"
		}, 
		"4: frame": {
			"srcIndexStart": "49", 
			"data": "HTMLPage.tmpl", 
			"srcLength": "23", 
			"0: data": {
				"srcIndexStart": "57", 
				"data": "HTMLPage.tmpl", 
				"srcLength": "13"
			}
		}, 
		"5: data": {
			"srcIndexStart": "72", 
			"data": "
<p>
The version of ", 
			"srcLength": "20"
		}, 
		"6: pageTitle": {
			"srcIndexStart": "92", 
			"data": "JsonViewer", 
			"srcLength": "24", 
			"0: data": {
				"srcIndexStart": "104", 
				"data": "JsonViewer", 
				"srcLength": "10"
			}
		}, 
		"7: data": {
			"srcIndexStart": "116", 
			"data": " included with Goldie has been
customized to include a special Parse Tree Mode for viewing a text document
side-by-side with a JSON-based tree that describes the text. In this mode,
you can click on a tree node to highlight its corresponding text,
or jump from a location in the text to the corresponding tree node.
</p>
<p>
This page describes the special data JsonViewer looks for to enable and use
this mode.
</p>

<h2>Sample</h2>
<p>
Goldie includes the sample JSON file
", 
			"srcLength": "475"
		}, 
		"8: link": {
			"srcIndexStart": "591", 
			"param 0": "https://bitbucket.org/Abscissa/goldie/src/v0.8/jsonSample.json", 
			"data": "jsonSample.json", 
			"srcLength": "87", 
			"0: data": {
				"srcIndexStart": "661", 
				"data": "jsonSample.json", 
				"srcLength": "15"
			}
		}, 
		"9: data": {
			"srcIndexStart": "678", 
			"data": "
that demonstrates how to create a JSON file that JsonViewer's Parse Tree Mode
can use. Here is the content of the file:
</p>
<div class=\"code-plain\">{
    parseTreeMode: true,
    source: \"Once upon a time...\",
    
    \"Story\": {
        srcIndexStart: 0,
        srcLength: 19,
        
        \"Sentence\": {
            srcIndexStart: 0,
            srcLength: 16,
            
            \"Word 1\": {
                srcIndexStart: 0,
                srcLength: 4,
            },
            
            \"Word 2\": {
                srcIndexStart: 5,
                srcLength: 4,
            },
            
            \"Word 3\": {
                srcIndexStart: 10,
                srcLength: 1,
            },
            
            \"Word 4\": {
                srcIndexStart: 12,
                srcLength: 4,
            }
        },
        
        \"Punctuation\": {
            srcIndexStart: 16,
            srcLength: 3,
        }
    }
}</div>
<p>
If you load that file into JsonViewer, it will look like this:
</p>
<img src=\"", 
			"srcLength": "1042"
		}, 
		"10: var": {
			"srcIndexStart": "1720", 
			"param 0": "urlToRoot", 
			"srcLength": "13"
		}, 
		"11: data": {
			"srcIndexStart": "1733", 
			"data": "JsonViewerSample.png\" alt=\"\" />
<p>
As you can see, this JSON file describes a text file containing
", 
			"srcLength": "100"
		}, 
		"12: code": {
			"srcIndexStart": "1833", 
			"param 0": "inline", 
			"data": "Once upon a time...", 
			"srcLength": "35", 
			"0: data": {
				"srcIndexStart": "1847", 
				"data": "Once upon a time...", 
				"srcLength": "19"
			}
		}, 
		"13: data": {
			"srcIndexStart": "1868", 
			"data": ".
It also tells JsonViewer that ", 
			"srcLength": "32"
		}, 
		"14: code": {
			"srcIndexStart": "1900", 
			"param 0": "inline", 
			"data": "Once upon a time", 
			"srcLength": "32", 
			"0: data": {
				"srcIndexStart": "1914", 
				"data": "Once upon a time", 
				"srcLength": "16"
			}
		}, 
		"15: data": {
			"srcIndexStart": "1932", 
			"data": " is a \"Story\",
", 
			"srcLength": "15"
		}, 
		"16: code": {
			"srcIndexStart": "1947", 
			"param 0": "inline", 
			"data": "...", 
			"srcLength": "19", 
			"0: data": {
				"srcIndexStart": "1961", 
				"data": "...", 
				"srcLength": "3"
			}
		}, 
		"17: data": {
			"srcIndexStart": "1966", 
			"data": " is \"Punctuation\",
and ", 
			"srcLength": "23"
		}, 
		"18: code": {
			"srcIndexStart": "1989", 
			"param 0": "inline", 
			"data": "Once", 
			"srcLength": "20", 
			"0: data": {
				"srcIndexStart": "2003", 
				"data": "Once", 
				"srcLength": "4"
			}
		}, 
		"19: data": {
			"srcIndexStart": "2009", 
			"data": " though ", 
			"srcLength": "8"
		}, 
		"20: code": {
			"srcIndexStart": "2017", 
			"param 0": "inline", 
			"data": "time", 
			"srcLength": "20", 
			"0: data": {
				"srcIndexStart": "2031", 
				"data": "time", 
				"srcLength": "4"
			}
		}, 
		"21: data": {
			"srcIndexStart": "2037", 
			"data": " are
\"Word 1\" through \"Word 4\". (Remember that JSON objects can't have
multiple members with the same name.)
</p>
<p>
Click a tree node in the left panel to highlight the corresponding section of text.
Click a location in the text and then click \"Jump to Node\" to select
the corresponding node.
</p>

<h2>Reference</h2>
<p>
	All of the following are optional. However, if none of them are used,
	then Parse Tree Mode won't be particularly useful.
</p>

", 
			"srcLength": "453"
		}, 
		"22: apiHead": {
			"srcIndexStart": "2490", 
			"data": "parseTreeMode", 
			"srcLength": "29", 
			"0: data": {
				"srcIndexStart": "2500", 
				"data": "parseTreeMode", 
				"srcLength": "17"
			}
		}, 
		"23: data": {
			"srcIndexStart": "2519", 
			"data": "
<div class=\"api-def\">
<p>
	This can go in either the root JSON object (as in the example above),
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	Giving this a value of ", 
			"srcLength": "218"
		}, 
		"24: code": {
			"srcIndexStart": "2737", 
			"param 0": "inline", 
			"data": "true", 
			"srcLength": "20", 
			"0: data": {
				"srcIndexStart": "2751", 
				"data": "true", 
				"srcLength": "4"
			}
		}, 
		"25: data": {
			"srcIndexStart": "2757", 
			"data": " instructs JsonViewer to
	automatically turn on Parse Tree Mode when loading the file.
</p>
</div>

", 
			"srcLength": "100"
		}, 
		"26: apiHead": {
			"srcIndexStart": "2857", 
			"data": "source", 
			"srcLength": "22", 
			"0: data": {
				"srcIndexStart": "2867", 
				"data": "source", 
				"srcLength": "10"
			}
		}, 
		"27: data": {
			"srcIndexStart": "2879", 
			"data": "
<div class=\"api-def\">
<p>
	This can go in either the root JSON object (as in the example above),
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	This contains the actual text that the JSON file describes.
	This text will be shown in the middle panel.
	Don't forget to properly escape any double-quotes.
</p>
</div>

", 
			"srcLength": "366"
		}, 
		"28: apiHead": {
			"srcIndexStart": "3245", 
			"data": "file", 
			"srcLength": "20", 
			"0: data": {
				"srcIndexStart": "3255", 
				"data": "file", 
				"srcLength": "8"
			}
		}, 
		"29: data": {
			"srcIndexStart": "3265", 
			"data": "
<div class=\"api-def\">
<p>
	<span style=\"font-weight: bold\">Not recommended:</span>
	Use ", 
			"srcLength": "89"
		}, 
		"30: ident": {
			"srcIndexStart": "3354", 
			"data": "source", 
			"srcLength": "16", 
			"0: data": {
				"srcIndexStart": "3362", 
				"data": "source", 
				"srcLength": "6"
			}
		}, 
		"31: data": {
			"srcIndexStart": "3370", 
			"data": " instead.
</p>
<p>
	This can go in either the root JSON object,
	or the first JSON object immediately inside the root
	(\"Story\" in the example above).
</p>
<p>
	If ", 
			"srcLength": "164"
		}, 
		"32: ident": {
			"srcIndexStart": "3534", 
			"data": "source", 
			"srcLength": "16", 
			"0: data": {
				"srcIndexStart": "3542", 
				"data": "source", 
				"srcLength": "6"
			}
		}, 
		"33: data": {
			"srcIndexStart": "3550", 
			"data": " is omitted, then ", 
			"srcLength": "18"
		}, 
		"34: ident": {
			"srcIndexStart": "3568", 
			"data": "file", 
			"srcLength": "14", 
			"0: data": {
				"srcIndexStart": "3576", 
				"data": "file", 
				"srcLength": "4"
			}
		}, 
		"35: data": {
			"srcIndexStart": "3582", 
			"data": " can be used to load
	the source text from a specific file. The value of this should be the
	filename containing the text that the JSON file describes.
</p>
<p>
	<span style=\"font-weight: bold\">This is NOT recommended</span>, however, 
	because the two files may become out-of-sync. It is recommended
	that you use ", 
			"srcLength": "315"
		}, 
		"36: ident": {
			"srcIndexStart": "3897", 
			"data": "source", 
			"srcLength": "16", 
			"0: data": {
				"srcIndexStart": "3905", 
				"data": "source", 
				"srcLength": "6"
			}
		}, 
		"37: data": {
			"srcIndexStart": "3913", 
			"data": " instead. (This can be safely included in addition to
	", 
			"srcLength": "55"
		}, 
		"38: ident": {
			"srcIndexStart": "3968", 
			"data": "source", 
			"srcLength": "16", 
			"0: data": {
				"srcIndexStart": "3976", 
				"data": "source", 
				"srcLength": "6"
			}
		}, 
		"39: data": {
			"srcIndexStart": "3984", 
			"data": " though, because if ", 
			"srcLength": "20"
		}, 
		"40: ident": {
			"srcIndexStart": "4004", 
			"data": "source", 
			"srcLength": "16", 
			"0: data": {
				"srcIndexStart": "4012", 
				"data": "source", 
				"srcLength": "6"
			}
		}, 
		"41: data": {
			"srcIndexStart": "4020", 
			"data": " is included,
	JsonViewer will simply ignore ", 
			"srcLength": "45"
		}, 
		"42: ident": {
			"srcIndexStart": "4065", 
			"data": "file", 
			"srcLength": "14", 
			"0: data": {
				"srcIndexStart": "4073", 
				"data": "file", 
				"srcLength": "4"
			}
		}, 
		"43: data": {
			"srcIndexStart": "4079", 
			"data": ".)
</p>
</div>

", 
			"srcLength": "16"
		}, 
		"44: apiHead": {
			"srcIndexStart": "4095", 
			"data": "
srcIndexStart
srcLength
", 
			"srcLength": "41", 
			"0: data": {
				"srcIndexStart": "4105", 
				"data": "
srcIndexStart
srcLength
", 
				"srcLength": "29"
			}
		}, 
		"45: data": {
			"srcIndexStart": "4136", 
			"data": "
<div class=\"api-def\">
<p>
	Any JSON object that includes both ", 
			"srcLength": "63"
		}, 
		"46: ident": {
			"srcIndexStart": "4199", 
			"data": "srcIndexStart", 
			"srcLength": "23", 
			"0: data": {
				"srcIndexStart": "4207", 
				"data": "srcIndexStart", 
				"srcLength": "13"
			}
		}, 
		"47: data": {
			"srcIndexStart": "4222", 
			"data": " and ", 
			"srcLength": "5"
		}, 
		"48: ident": {
			"srcIndexStart": "4227", 
			"data": "srcLength", 
			"srcLength": "19", 
			"0: data": {
				"srcIndexStart": "4235", 
				"data": "srcLength", 
				"srcLength": "9"
			}
		}, 
		"49: data": {
			"srcIndexStart": "4246", 
			"data": "
	is considered to refer to a specific section of the text. This section
	of the text starts at ", 
			"srcLength": "96"
		}, 
		"50: ident": {
			"srcIndexStart": "4342", 
			"data": "srcIndexStart", 
			"srcLength": "23", 
			"0: data": {
				"srcIndexStart": "4350", 
				"data": "srcIndexStart", 
				"srcLength": "13"
			}
		}, 
		"51: data": {
			"srcIndexStart": "4365", 
			"data": " (zero-indexed) and
	extends for ", 
			"srcLength": "33"
		}, 
		"52: ident": {
			"srcIndexStart": "4398", 
			"data": "srcLength", 
			"srcLength": "19", 
			"0: data": {
				"srcIndexStart": "4406", 
				"data": "srcLength", 
				"srcLength": "9"
			}
		}, 
		"53: data": {
			"srcIndexStart": "4417", 
			"data": " characters.
</p>
</div>", 
			"srcLength": "25"
		}
	}
}