Demo JsonForms / Comments

Comments

From Wikisphere
(Redirected from Demo JsonForms/Comments)
Jump to navigation Jump to search

This page demonstrates the following features:

  • compounded schemas: the JsonSchema:Comment is a reference within JsonSchema:Comments
  • use of nested template using children (e.g. Template:Comments )
  • edit_schema and edit_path parameters to add/edit items at the current level of the tree (see Template:Comments.comments)
  • use of parameter depth to add margin to the content (see Template:Comments.comments.Item.replies)
  • use of property x-render-template to specify a fixed template name for the related subschema. This is necessary for nested items otherwise the processor would require a template for each level (see JsonSchema:Comment)
  • use of allOf to override the x-hidden property in the replies subschema from the parent schema. This allows the base schema to edit all data, while the popup forms to keep the replies array hidden. (see JsonSchema:Comments and the notice for more information)



Schemas:


Templates:


Parser function:

{{#jsonformsrender:{{FULLPAGENAME}}  
|slot=jsonforms-data      
}} 

Template: Comments

Template:Comments.comments

Comments

Template:Comments.comments.Item

Name: a name

Message: a content

Template:Comments.comments.Item.replies

Replies

Template:Comments.comments.Item

Name: a1 name

Message: a1 content

Template:Comments.comments.Item.replies

Replies

loading form


Params
{
    "key": "replies",
    "properties": "",
    "count": 0,
    "childrenCount": 0,
    "path": "comments.0.replies.0.replies",
    "jsonpath": "properties.comments.items.properties.replies.items.properties.replies",
    "depth": 5,
    "templateName": "Comments.comments.Item.replies",
    "data": []
}
Params
{
    "key": 0,
    "properties": "name, content, createdAt, replies",
    "count": 4,
    "childrenCount": 4,
    "path": "comments.0.replies.0",
    "jsonpath": "properties.comments.items.properties.replies.items",
    "depth": 4,
    "templateName": "Template:Comments.comments.Item",
    "data": {
        "name": "a1 name",
        "content": "a1 content",
        "createdAt": "",
        "replies": []
    },
    "name": "a1 name",
    "content": "a1 content",
    "createdAt": "",
    "replies": "<subitem>"
}
loading form


Params
{
    "key": "replies",
    "properties": "0",
    "count": 1,
    "childrenCount": 1,
    "path": "comments.0.replies",
    "jsonpath": "properties.comments.items.properties.replies",
    "depth": 3,
    "templateName": "Comments.comments.Item.replies",
    "data": [
        {
            "name": "a1 name",
            "content": "a1 content",
            "createdAt": "",
            "replies": []
        }
    ],
    "0": "<subitem>"
}
Params
{
    "key": 0,
    "properties": "name, content, createdAt, replies",
    "count": 4,
    "childrenCount": 4,
    "path": "comments.0",
    "jsonpath": "properties.comments.items",
    "depth": 2,
    "templateName": "Template:Comments.comments.Item",
    "data": {
        "name": "a name",
        "content": "a content",
        "createdAt": "",
        "replies": [
            {
                "name": "a1 name",
                "content": "a1 content",
                "createdAt": "",
                "replies": []
            }
        ]
    },
    "name": "a name",
    "content": "a content",
    "createdAt": "",
    "replies": "<subitem>"
}


loading form
Params
{
    "key": "comments",
    "properties": "0",
    "count": 1,
    "childrenCount": 1,
    "path": "comments",
    "jsonpath": "properties.comments",
    "depth": 1,
    "templateName": "Template:Comments.comments",
    "data": [
        {
            "name": "a name",
            "content": "a content",
            "createdAt": "",
            "replies": [
                {
                    "name": "a1 name",
                    "content": "a1 content",
                    "createdAt": "",
                    "replies": []
                }
            ]
        }
    ],
    "0": "<subitem>"
}
Params
{
    "key": "",
    "properties": "comments",
    "count": 1,
    "childrenCount": 1,
    "path": "",
    "jsonpath": null,
    "depth": 0,
    "templateName": "Template:Comments",
    "data": {
        "comments": [
            {
                "name": "a name",
                "content": "a content",
                "createdAt": "",
                "replies": [
                    {
                        "name": "a1 name",
                        "content": "a1 content",
                        "createdAt": "",
                        "replies": []
                    }
                ]
            }
        ]
    },
    "comments": "<subitem>"
}


The following form is rendered with this parser function:

{{#jsonforms:Default
|schema=Comments
|editor_options.debug=true
|view=inline
|title=comments
|edit={{FULLPAGENAME}}
|width=800px
}}

(it's not necessary for the purpose of this demo, and the article's data can usually be edited using the action "Edit schema")


loading form


See also