tangoman/menu-bundle

Symfony Menu Twig Extension Bundle

TangoMan Menu Bundle

TangoMan Menu Bundle provides an easy way to include menus in twig. TangoMan Menu Bundle makes building back-office for your app a brease., _(*1)

Installation

Step 1: Download the Bundle

Open a command console, enter your project directory and execute the following command to download the latest stable version of this bundle:, _(*2)

$ composer require tangoman/menu-bundle

This command requires you to have Composer installed globally, as explained in the installation chapter of the Composer documentation., _(*3)

Step 2: Enable Bundles

TangoMan Menu Bundle requires TangoMan Callback Bundle to function properly.
Enable both bundles by adding it to the list of registered bundles in the app/AppKernel.php file of your project:, _(*4)

<?php
// app/AppKernel.php

// ...
class AppKernel extends Kernel
{
    // ...

    public function registerBundles()
    {
        $bundles = array(
            // ...
            new TangoMan\CallbackBundle\TangoManCallbackBundle(),
            new TangoMan\MenuBundle\TangoManMenuBundle(),
        );

        // ...
    }
}

Step 3: Place use statement in the controller

use TangoMan\MenuBundle\Model\Item;
use TangoMan\MenuBundle\Model\Menu;

Step 4: Build object in the controller

<?php
// AppBundle/Controller/DefaultController.php
namespace AppBundle\Controller;

// ...

class DefaultController extends Controller
{
    /**
     * @Route("/user/index")
     */
    public function indexAction()
    {
        // ...

        $menu = new Menu();

        $item = new Item();
        $item->setLabel('Tableau de bord')
            ->setRoute('app_admin_admin_index')
            ->setIcon('glyphicon glyphicon-dashboard');
        $menu->addItem($item);

        $item = new Item();
        $item->setDivider(true);
        $menu->addItem($item);

        $item = new Item();
        $item->setLabel('Articles')
            ->setRoute('app_admin_post_index')
            ->setIcon('glyphicon glyphicon-text-color');
        $menu->addItem($item);

        $item = new Item();
        $item->setLabel('Commentaires')
            ->setRoute('app_admin_comment_index')
            ->setIcon('glyphicon glyphicon-comment');
        $menu->addItem($item);

        $item = new Item();
        $item->setDivider(true);
        $menu->addItem($item);

        $item = new Item();
        $item->setLabel('Utilisateurs')
            ->setRoute('app_admin_user_index')
            ->setIcon('glyphicon glyphicon-user');
        $menu->addItem($item);

        // You can use json format as well
        $navbar = '{
            "label": "TangoMan",
            "route": "homepage",
            "icon": "fa fa-car",
            "items": [
                {
                    "label": "Blog",
                    "route": "app_posts_index"
                },
                {
                    "subMenu": {
                        "label": "Administration",
                        "icon": "fa fa-cogs",
                        "roles": ["ROLE_ADMIN"],
                        "items": [
                            {
                                "label": "User",
                                "icon": "fa fa-users",
                                "route": "admin_user_index",
                                "active": "admin_user_index"
                            },
                            {
                                "divider": true
                            },
                            {
                                "label": "Comments",
                                "icon": "fa fa-comments",
                                "route": "admin_comment_index",
                                "active": "admin_comment_index"
                            }
                        }
                    }
                }
            ]
        }';

        // You can also add id or slug to route parameters when necessary: 
        $tabs = '{
            "items": [
                {
                    "label": "List",
                    "route": "app_admin_user_index",
                    "active": "index",
                    "icon": "glyphicon glyphicon-list"
                },
                {
                    "label": "Add",
                    "route": "app_admin_user_new",
                    "active": "new",
                    "icon": "glyphicon glyphicon-plus"
                },
                {
                    "label": "Import",
                    "route": "app_admin_user_import",
                    "active": "import",
                    "icon": "glyphicon glyphicon-import"
                },
                {
                    "label": "Export",
                    "route": "app_admin_user_export",
                    "active": "export",
                    "icon": "glyphicon glyphicon-export"
                },
                {
                    "label": "Edit",
                    "route": "app_admin_user_edit",
                    "id": 1,
                    "active": "edit",
                    "icon": "glyphicon glyphicon-edit"
                }
            ]
        }';

        return $this->render(
            'user/index.html.twig',
            [
                'navbar' => $menu,
                'menu' => $menu,
                'tabs' => $tabs,
                'users' => $users,
            ]
        );
    }
}

Step 5: Integrate in Twig

<div class="container">
    {{ menu(menu, 'navbar') }}
</div>

<div id="sidebar-menu" class="col-xs-12 col-sm-2">
    {{ menu(menu) }}
</div>

<div id="tabs">
    {{ menu(menu, 'tabs') }}
</div>

How to use

To make sure twig can create routes name them like following: - 'app_login' - 'app_check' - 'app_logout' - 'app_user_profile' - 'app_user_edit' - 'app_admin_index' - 'homepage', _(*5)

Note

If you find any bug please report here : Issues, _(*6)

License

Copyrights (c) 2017 Matthias Morin, _(*7)

Distributed under the GPLv3.0 license., _(*8)

If you like TangoMan Menu Bundle please star! And follow me on GitHub: TangoMan75 ... And check my other cool projects., _(*9)

tangoman.free.fr, _(*10)