jguido/widget-bundle

This Bundle add a widget system for rendering data a generic way. It also permit a generation of widget files.

Installation

composer require jguido/widget-bundle

Then add this bundle to your kernel (app/AppKernel.php) :, _(*1)

new WidgetBundle\WidgetBundle(),
new ApplicationWidgetBundle\ApplicationWidgetBundle(),

Add in app/config/routing.yml, _(*2)

bundle_widget:
    resource: "@WidgetBundle/Resources/config/routing.yml"
    prefix:   /

Add in app/config/config.yml in import section, _(*3)

- { resource: "@ApplicationWidgetBundle/Resources/config/widgets.yml" }

Add this line in the style declaration of your layout, _(*4)

<link href="{{ asset('bundles/widget/css/widget-render.css') }}" rel="stylesheet" media="screen" type="text/css"/>

Add this line in the javascript declaration of your layout, _(*5)

<script type="text/javascript" src="{{ asset('bundles/widget/js/Widget.js') }}"></script>

Usage

There is a command for generating files of the desired widget :, _(*6)

php bin/console generate:widget <widget_name>

The rendering of a widget is done like this, _(*7)

The simpliest way, _(*8)

{{ render_widget('widget.<widget_name>') }}

If the route of your widget needs parameters, _(*9)

{{ render_widget('widget.<widget_name>', {'param1': param1}) }}

But if you do so, you will have to update the route definition in the file of your bundle (in src/ApplicationWidgetBundle/Widget/your_widget), _(*10)

Content of the widget is loaded with ajax calls, all the dom events are functionnals (window.onload, $(function){...});), _(*11)

File structure : src -- ApplicationWidgetBundle ----Resources ------config --------widgets.yml (the widgets service definition) ------views (where the views generated are placed) ----Widget (inside all the widget (controller) class, _(*12)

Example (Use case)

You want to generate a bundle "test", _(*13)

in console :, _(*14)

php bin/console generate:widget test

What i will have in the service definition (src/ApplicationWidgetBundle/Resources/config/widgets.yml):, _(*15)

services:

    widget.test:
        class: ApplicationWidgetBundle\Widget\TestWidget

Inside the widget class:, _(*16)

<?php


namespace ApplicationWidgetBundle\Widget;


use WidgetBundle\Base\BaseWidget;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use Symfony\Component\HttpFoundation\Response;

class TestWidget extends BaseWidget
{

    /**
     * @param $params
     * @return mixed
     */
    protected function getData($params)
    {
        throw new \Exception("Not implemented");
    }

    /**
     * @param array|null $params
     * @return string
     */
    public function getUri(array $params = null)
    {
        return $this->generateUrl('path_widget_test', $params);
    }

    /**
     * @return Response
     * @internal param Request $request
     * @Route("/widgets/test/render", name="path_widget_test")
     */
    public function widgetAction()
    {
        return $this->render('ApplicationWidgetBundle:Test:test.html.twig');
    }
}

This TestWidget class will act as a common controller, _(*17)

Inside the views directory:, _(*18)

a sub directory called Test and inside a file test.html.twig, _(*19)

<div class="col-xs-12">
    This is widget Test
</div>

You will be able to render it through other twig views like this :, _(*20)

{{ render_widget('widget.test') }}