usage.json

[
    {
        "created": "20150830195535343",
        "title": "$:/plugins/btheado/jsoneditor/usage",
        "car-schema": "{\n  \"type\": \"object\",\n  \"title\": \"Car\",\n  \"properties\": {\n    \"make\": {\n      \"type\": \"string\",\n      \"enum\": [\n        \"Toyota\",\n        \"BMW\",\n        \"Honda\",\n        \"Ford\",\n        \"Chevy\",\n        \"VW\"\n      ]\n    },\n    \"model\": {\n      \"type\": \"string\"\n    },\n    \"year\": {\n      \"type\": \"integer\",\n      \"enum\": [\n        1995,1996,1997,1998,1999,\n        2000,2001,2002,2003,2004,\n        2005,2006,2007,2008,2009,\n        2010,2011,2012,2013,2014\n      ],\n      \"default\": 2008\n    }\n  }\n}\n",
        "text": "! Introduction\n\nThe jsoneditor widget generates and displays an HTML form constructed from the given [[JSON Schema|http://json-schema.org/]]. The schema can reside in the text of another tiddler or a field from another tiddler or the current tiddler. A TiddlyWiki TextReference is used to specify the schema location. The JSON corresponding to the form values is saved to and restored from the given Tiddler field as specified by a TextReference. Changes to form values are automatically saved to the JSON output.\n\nThis is just a TiddlyWiki wrapper around the [[json-editor|https://github.com/jdorn/json-editor]] package. None of the optional requirements (css frameworks, icons, etc.) of json-editor are included in this plugin.\n\n! Content and Attributes\n\nIf the content of the `<$jsoneditor>` widget is not empty, then the text will be used as the JSON schema. Note that the content passes through the Tiddlywiki parser and it is inserted into a temporary DOM structure. The text content of the dom structure is used as the JSON. Therefore, Tiddlywiki syntax which happens to appear in the JSON would cause the JSON to get mangled. Triple backticks for specifying code blocks, Typed Block syntax (of type application/json for example), and html tags such as ``pre`` or ``p`` might work. Note the backticks and the typed blocks must be preceded by a blank line.\n\nIn addition, HTML special characters may need to be escaped.\n\nAny mangling issues using the widget content can be solved by storing the schema in a tiddler field and using the schema attribute.\n\n|!Attribute |!Description |\n|schema |A TextReference containing the JSON describing the schema for the form. Will only be used if the widget content is empty|\n|jsonOutput |A TextReference telling where to load the JSON data from and save the JSON data to defaults to field in current tiddler named ``json-output``|\n|theme|A value such as ``html``, ``bootstrap2``, ``bootstrap3``, ``foundation3``, etc. as describe in the [[jsoneditor documentation|https://github.com/jdorn/json-editor]]. Adding the given bootstrap, foundation, etc. stylesheet to your tiddlywiki is a prerequisite to using this option. For ``bootstrap3``, for example, you can use the [[bootstrap3 css|http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css]] and  follow the instructions at [[using Stylesheets|http://tiddlywiki.com/#Using%20Stylesheets]]. The jsoneditor ``grid`` format will only work if you use a theme other than the default ``html``|\n\n!Examples\n\n!!Schema and value stored in fields of the current widget\n\n```\n<$jsoneditor schema=\"!!car-schema\" jsonOutput=\"!!car-json\"/>\n```\n\n<$jsoneditor schema=\"!!car-schema\" jsonOutput=\"!!car-json\"/>\n\nThe ``car-json`` field is initially empty. The values in the field above come from defaults as given in the schema. Make changes in the form above and watch the ``car-json`` value change here:\n\n``{{!!car-json}}`` = <code>{{!!car-json}}</code>\n\n<$reveal type=\"nomatch\" state=\"!!usage1\" text=\"show\">\n\n<$button set=\"!!usage1\" setTo=\"show\">Show schema</$button>\n\n</$reveal>\n<$reveal type=\"match\" state=\"!!usage1\" text=\"show\">\n\n<$button set=\"!!usage1\" setTo=\"hide\">Hide schema</$button>\n\n``{{!!car-schema}}`` = <pre>{{!!car-schema}}</pre>\n\n</$reveal>\n\n!!Schema in the content of the widget\n\n```\n<$jsoneditor jsonOutput=\"!!car-json2\">\n\n$$$application/json\n{\n  \"type\": \"object\",\n  \"title\": \"Car\",\n  \"properties\": {\n    \"make\": {\n      \"type\": \"string\",\n      \"enum\": [\n        \"Toyota\",\n        \"BMW\",\n        \"Honda\",\n        \"Ford\",\n        \"Chevy\",\n        \"VW\"\n      ]\n    },\n    \"model\": {\n      \"type\": \"string\"\n    },\n    \"year\": {\n      \"type\": \"integer\",\n      \"enum\": [\n        1995,1996,1997,1998,1999,\n        2000,2001,2002,2003,2004,\n        2005,2006,2007,2008,2009,\n        2010,2011,2012,2013,2014\n      ],\n      \"default\": 2008\n    }\n  }\n}\n$$$\n</$jsoneditor>\n```\n\n<$jsoneditor jsonOutput=\"!!car-json2\">\n\n$$$application/json\n{\n  \"type\": \"object\",\n  \"title\": \"Car\",\n  \"properties\": {\n    \"make\": {\n      \"type\": \"string\",\n      \"enum\": [\n        \"Toyota\",\n        \"BMW\",\n        \"Honda\",\n        \"Ford\",\n        \"Chevy\",\n        \"VW\"\n      ]\n    },\n    \"model\": {\n      \"type\": \"string\"\n    },\n    \"year\": {\n      \"type\": \"integer\",\n      \"enum\": [\n        1995,1996,1997,1998,1999,\n        2000,2001,2002,2003,2004,\n        2005,2006,2007,2008,2009,\n        2010,2011,2012,2013,2014\n      ],\n      \"default\": 2008\n    }\n  }\n}\n$$$\n</$jsoneditor>\n\n``{{!!car-json2}}`` = <code>{{!!car-json2}}</code>\n\n!!Schema stored in the text of another tiddler\n\n```\n<$jsoneditor schema=\"$:/plugins/btheado/jsoneditor/person-schema.json\" jsonOutput=\"!!person-json\"/>\n```\n\n<$jsoneditor schema=\"$:/plugins/btheado/jsoneditor/person-schema.json\" jsonOutput=\"!!person-json\"/>\n\nAgain, the field is initially empty and the form is filled from schema defaults. Make changes above and see them reflected here:\n\n``{{!!person-json}}`` = <code>{{!!person-json}}</code>\n\n<$reveal type=\"nomatch\" state=\"!!usage2\" text=\"show\">\n\n<$button set=\"!!usage2\" setTo=\"show\">Show schema</$button>\n\n</$reveal>\n<$reveal type=\"match\" state=\"!!usage2\" text=\"show\">\n\n<$button set=\"!!usage2\" setTo=\"hide\">Hide schema</$button>\n\n``{{$:/plugins/btheado/jsoneditor/person-schema.json}}`` = {{$:/plugins/btheado/jsoneditor/person-schema.json}}\n\n</$reveal>\n\n\n!!Degenerate case: no schema specified\n\nThe json-editor can function even without a schema. The form can be dynamically created on the fly.\n\n```\n<$jsoneditor jsonOutput=\"!!emptyschema-json\"/>\n```\n\n<$jsoneditor jsonOutput=\"!!emptyschema-json\"/>\n\n``{{!!emptyschema-json}}`` = <code>{{!!emptyschema-json}}</code>\n",
        "modified": "20151115221400324"
    }
]