Dashboard

The dashboard key defines a dashboard consisting of rows, columns and dashlets that are mounted into framing cells. Dashlets appear in several places within the Cloud CMS interface including the platform landing page, the project landing page and the warehouse landing page.

To populate the dashboard section, your configuration snippet should look like this:

{
    "dashboard": {
        "rows": []
    ]
}

Rows, Columns and Dashlets

Each dashboard defines rows, columns and dashlets. Here is an example with 2 rows, 2 columns each and a dashlet bound to the upper-left and lower-right cells.

{
    "dashboard": {
        "rows": [{
            "cols": [{
                "dashlets": [{
                    "title": "My Project Documents",
                    "type": "project-content",
                    "chrome": true
                }]
            }, {
                "dashlets": []
            }]
        }, {
            "cols": [{
                "dashlets": []
            }, {
                "dashlets": [{
                    "title": "My Project Tasks",
                    "type": "project-tasks",
                    "chrome": true                
                }]
            }]
        }]
    ]
}

The following properties may be specified per dashlet:

  • type identifies the kind of dashlet to bind into the cell
  • chrome specifes whether to render the framed border around the dashlet (with title bar)
  • title is the title to render for the dashlet (if chrome is true)

You may bind multiple dashlets per cell. The will be stacked for you.

Example - Override a Dashboard

You can override any of the out-of-the-box dashboards by using the replace property, like this:

{
    "replace": true,
    "dashboard": {
        "rows": [{
            "cols": [{
                "dashlets": [{
                    "title": "My Project Documents",
                    "type": "project-content",
                    "chrome": true
                }]
            }, {
                "dashlets": []
            }]
        }, {
            "cols": [{
                "dashlets": []
            }, {
                "dashlets": [{
                    "title": "My Project Tasks",
                    "type": "project-tasks",
                    "chrome": true                
                }]
            }]
        }]
    ]
}