Commit 9ae50ec1 authored by Boris Kocherov's avatar Boris Kocherov

improve documentation thanks @jerome

parent 89c3a776
......@@ -9,7 +9,7 @@ Gadget api is similar to any renderjs field api.
```javascript
gadget.render({
key: 'field_identificator',
value: [1,2],
value: [1,2], // json_document
schema: {
type: 'array',
items: {
......@@ -24,7 +24,9 @@ gadget.render({
If schema_url is specified instead of schema property then schema_url is used for schema download.
Schema_url parameter should be specified for proper computation of an absolute url. If schema_url is omitted
then the current gadget url is used as base_url.
then the current gadget url is used as base_url.
gadget.getContent() can be used to get the current value of edited json document.
Parent gadget should have declared notification methods to catch validation status.
......@@ -65,7 +67,127 @@ rJS(window)
})
```
## What inside
## rendering rules
* string json schema type is rendered as `<input type="string">`
* number/integer json schema type is rendered as `<input type="number">`
for integer step=1 is set by default
this step can be changed by using multipleOf property
html5 attributes min/max is used to limit the value
* enum is rendered as a select
```json
{"enum": ["Street", "Avenue", "Boulevard"]}
```
is rendered as select :
```html
<select>
<option value="Street">Street</option>
<option value="Avenue">Avenue</option>
<option value="Boulevard">Boulevard</option>
</select>
```
* set of oneOf/anyOf const schema with titles render as select with titles:
json schema:
```json
{"oneOf": [
{
"title": "Street - small road",
"const": "Street"
},
{
"title": "Avenue - larger road. This is the recommended option",
"const": "Avenue"
},
{
"title": "Boulevard",
"const": "Boulevard"
}
]}
```
json document:
```json
"Avenue"
```
is rendered as select:
```html
<select>
<option value="Street">Street - small road</option>
<option selected value="Avenue">Avenue - larger road. This is the recommended option</option>
<option value="Boulevard">Boulevard</option>
</select>
```
* json_document strongly react to render so:
schema
```json
{
"$schema": "http://json-schema.org/draft-06/schema#",
"title": "event",
"type": "object",
"additionalProperties": false,
"properties": {
"time": {"type": "integer"},
"contact": {
"anyOf": [
{
"title": "organisation",
"type": "object",
"additionalProperties": false,
"properties": {
"type": {"const": "organisation", "default": "organisation"},
"title": {"type": "string"},
"corporate_registration_code": {"type": "string"}
}
},
{
"title": "person",
"type": "object",
"additionalProperties": false,
"properties": {
"type": {"const": "person", "default": "person"},
"title": {"type": "string"},
"marital_status": {"enum": ["married", "divorced", "single"]}
}
}
]
}
}
}
```
if json_document = undefined then the it is rendered as:
![event undefined](doc/event_document_undefined.png)
and clicking on selector:
![event undefined_pressed](doc/event_with_pressed_selector.png)
if json_document = `{"contact":{"type":"person"}}` then it's rendered as:
![event_person](doc/event_person.png)
if json_document = `{"contact":{"type":"organisation"}}` then it's rendered as:
![event_organisation](doc/event_organisation.png)
## What is inside
gadget consists of three parts:
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment