Demo JsonForms / Comments

Comments

From Wikisphere
Jump to navigation Jump to search
Commentsobject
commentsarray(1)
    item 1object
    name
    a name
    content
    a content
    repliesarray(1)
      rootobject
      name
      a1 name
      content
      a1 content
      repliesarray(0)

    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