Creating Dashboards / StageBuilder

Often, it's necessary to create pages with multiple blocks including static content, DGS, forms, and charts with various statistics. The StageBuilder was created to speed up the development of such Dashboard pages.

To access StageBuilder, you need to include it in your project's config or directly in the code:

require_once 'bundle/stage/autoload.php';

You can create Dashboard pages in two ways:

1. Using the StageBuilder class
2. Extending your plugin from StagePlugin

Creating with StageBuilder

Currently, two layout styles are supported:

1. StageBuilder::LAYOUT_ROWS - elements are added row by row
2. StageBuilder::LAYOUT_COLUMNS - elements are added by columns

During initialization, you specify the dashboard size (number of columns) and which layout style to use.

$stage = new StageBuilder(2, StageBuilder::LAYOUT_ROWS);

The dashboard size is formally the size of the grid for arranging blocks (columns in the grid), with a maximum of 12 columns. It uses the Bootstrap grid system and works the same way, except we operate with the concept of columns and when adding a block, we simply specify how many columns it should occupy.

Note that when using StageBuilder::LAYOUT_COLUMNS, the block size specified when adding will be ignored.

Currently, you can add the following types of blocks:

• Store - DGS
• StoreAction - forms for adding and editing with DGS
• Content - static content
• Url - loading ajax content via URL
• Callback - calling a method of any plugin or class

Example of how it works:

class DashboardPlugin extends DisplayPlugin
{
    public function onDisplayDefault(Response &$response)
    {
        $store = $this->plugin->jimbo->createStoreInstance('festi_menus');
        $store2 = $this->plugin->jimbo->createStoreInstance('festi_plugins');
        $store3 = $this->plugin->jimbo->createStoreInstance('festi_url_rules');

        $stage = new StageBuilder(3, StageBuilder::LAYOUT_ROWS);

        $stage->addBlock($store3);
        $stage->addStoreBlock($store);
        $stage->addStoreBlock($store2);

        //
        $actionInsert = $store->createActionInstance(Store::ACTION_INSERT);
        $stage->addBlock($actionInsert);

        //
        $actionEdit = $store->createActionInstance(Store::ACTION_EDIT);
        $actionEdit->load(2);
        $stage->addBlock($actionEdit);

        //
        $actionEdit = $store->createActionInstance(Store::ACTION_INFO);
        $actionEdit->load(2);
        $stage->addBlock($actionEdit);

        //
        $callback = array($this, 'test');
        $stage->addBlock($callback);
        $stage->addCallbackBlock($callback, array(1, 2));

        //
        $stage->addUrlBlock('/test/block/');

        $stage->addBlock($this->fetch('content.phtml'));

        $stage->onRequest($response);
    }
}

If you want one block to occupy two columns, you need to specify its size:

$stage->addStoreBlock($store, 2);

But if you use StageBuilder::LAYOUT_COLUMNS, the block size parameter will be ignored:

Blocks can be added with the universal method:

$stage->addBlock($item);

addBlock determines the block type automatically, with the exception of adding a link, which must be added through the addUrlBlock method. If you need to pass additional parameters for a class method call, you should use addCallbackBlock($callback, $params).

When calling a callback, the first parameter will always be Response

public function test(Response &$response, $a = false, $b = false)
{
    $response->content = $this->ui->block()->content("asdasdasdasd-".$a.'-'.$b)->title('Test')->html();

    return true;
}

addUrlBlock will load content via URL using ajax. The URL block will show a preloader while the data is being loaded.

Creating with StagePlugin

It's the same as with StageBuilder, with the difference that you don't need to create a StageBuilder instance and all methods are available through $this.

class DashboardPlugin extends StagePlugin
{
    public function onDisplayDefault(Response &$response)
    {
        $this->setSize(3);
        $this->setLayout(StageBuilder::LAYOUT_COLUMNS);

        $store = $this->plugin->jimbo->createStoreInstance('festi_menus');
        $store2 = $this->plugin->jimbo->createStoreInstance('festi_plugins');
        $store3 = $this->plugin->jimbo->createStoreInstance('festi_url_rules');

        $this->addBlock($store3);
        $this->addStoreBlock($store);
        $this->addStoreBlock($store2);

        //
        $actionInsert = $store->createActionInstance(Store::ACTION_INSERT);
        $this->addBlock($actionInsert);

        //
        $actionEdit = $store->createActionInstance(Store::ACTION_INFO);
        $actionEdit->load(2);
        $this->addBlock($actionEdit);

        //
        $callback = array($this, 'test');
        $this->addBlock($callback);
        $this->addCallbackBlock($callback, array(1, 2));

        $this->onRequest($response);
    }
}