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. ...@@ -9,7 +9,7 @@ Gadget api is similar to any renderjs field api.
```javascript ```javascript
gadget.render({ gadget.render({
key: 'field_identificator', key: 'field_identificator',
value: [1,2], value: [1,2], // json_document
schema: { schema: {
type: 'array', type: 'array',
items: { items: {
...@@ -24,7 +24,9 @@ gadget.render({ ...@@ -24,7 +24,9 @@ gadget.render({
If schema_url is specified instead of schema property then schema_url is used for schema download. 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 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. Parent gadget should have declared notification methods to catch validation status.
...@@ -65,7 +67,127 @@ rJS(window) ...@@ -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: 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