verticalNavigation

Last modified by Vincent Massol on 2023/02/20 09:35

Summary
Generates a vertical menu from an object describing the categories
Usage
#**
 * Generates a vertical menu from an object describing the categories
 *
 * Expected format of the object:
 * menu = vector of items
 * item = map with the following fields:
 *        'id'       : mandatory
 *        'name'     : the text displayed for the corresponding menu item;
 *                     optional, defaults to
 *                     $services.localization.render("$!{translationPrefix}${item.id}")
 *        'url'      : the "action" of the menu item; optional, defaults to #
 *        'cssClass' : a specific css class for the menu item for custom
 *                     styling; optional, defaults to ''
 *        'children' : vector of items, allowing to recursively define submenus
 *
 * @param $menu the menu object, in the format described above
 * @param $options a map of options, where the following entries are currently used:
 *        'translationPrefix' :  the translation prefix added to the id of each
 *                     item, in order to generate the name; ignored for items whose
 *                     name is specified
 *        'crtItemId': identifier of the current menu item (for differential styling)
 *        'cssClass' : specific css class for this menu
 *#
#macro(verticalNavigation $menu $options)

#**
 * Generates a vertical menu item from an object (a map)
 *
 * Expected format:
 * item = map with the following fields:
 *        'id'       : mandatory
 *        'name'     : the text displayed for the corresponding menu item;
 *                     optional, defaults to
 *                     $services.localization.render("$!{translationPrefix}${item.id}")
 *        'url'      : the "action" of the menu item; optional
 *        'cssClass' : a specific css class for the menu item for custom
 *                     styling; optional, defaults to ''
 *        'children' : vector of items, allowing to recursively define submenus
 *
 * @param $item the menu item object, in the format described above
 * @param $level the current level of the item, of the form '\*+'; the number of
 *        stars indicates the depth of the item in the menu
 * @param $options a map of options, where the following entries are currently used:
 *        'translationPrefix' :  the translation prefix added to the id of each
 *                     item, in order to generate the name; ignored for items whose
 *                     name is specified
 *        'crtItemId': identifier of the current menu item (for differential styling)
 *#
#macro(verticalNavigationItem $item $level $options)
Since
Unknown, but a long time ago
Example
{{velocity}}
#set($adminMenu = [
  {
    'id' : 'lf',
    'icon': 'columns',
    'displayBeforeCategory': 'content',
    'children': [
       {'id' : 'Themes', 'perSpace' : true, 'order' : 100},
       {'id' : 'Panels.PanelWizard', 'perSpace' : true, 'order' : 300},
       {'id' : 'Presentation', 'perSpace' : true, 'order' : 600}
    ]
  },
  {
    'id' : 'usersgroups',
    'icon': 'group',
    'displayBeforeCategory': 'extensionmanager',
    'children': [
       {'id' : 'Users', 'order' : 100},
       {'id' : 'Groups', 'order' : 200},
       {'id' : 'Rights', 'perSpace' : false, 'order' : 300},
       {'id' : 'PageAndChildrenRights', 'perSpace' : true, 'order' : 300, 'global': false},
       {'id' : 'PageRights', 'perSpace' : true, 'order' : 350, 'global': false},
       {'id' : 'UserProfile', 'order' : 400},
       {'id' : 'Registration', 'order' : 500}
    ]
  },
  {
    'id' : 'other',
    'icon': 'wrench',
    'children' : []
  }
])

#verticalNavigation($adminMenu {
  'id': 'administration-menu',
  'cssClass': 'admin-menu'
})
{{/velocity}}

Result:

verticalNavigation.png

Get Connected