{# All menu and submenu items #}
<div class="navbar">
  <div class="navbar-header pull-right">

      {% import _self as menus %}
      {#
        We call a macro which calls itself to render the full tree.
        @see http://twig.sensiolabs.org/doc/tags/macro.html
      #}
      {{ menus.menu_links(items, attributes, 0) }}

      {% macro menu_links(items, attributes, menu_level, textUrl) %}
        {% import _self as menus %}
        {% if items %}
          {% if menu_level == 0 %}
            <ul class="nav navbar-nav" role="menu" aria-labelledby="block-usip-main-menu">
          {% else %}
            <ul class="dropdown-menu" role="menu" aria-labelledby="block-usip-main-submenu-{{ textUrl }}">
          {% endif %}
          {% for item in items %}
      {%
      set classes = [
        'menu-item',
        item.is_expanded ? 'expanded',
        item.is_collapsed ? 'collapsed',
        item.in_active_trail ? 'active-trail',
      ]
      %}

            {% if item.below %}
              {% if menu_level == 0 %}
                <li {{ item.attributes.addClass('dropdown',classes) }} >
                  <a href="{{ item.url }}" class="dropdown-toggle" data-toggle="dropdown" id="block-usip-main-submenu-{{ item.title|replace({' ': '-', '&': ''}) }}" data-level="{{ menu_level }}">{{ item.title }}<span class="dropdown-menu-caret dropdown-menu-caret--desktop"></span></a>

                  <a href="{{ item.url }}" class="dropdown-menu-link" id="block-usip-main-submenu-{{ item.title|replace({' ': '-', '&': ''}) }}" data-level="{{ menu_level }}">{{ item.title }}</a>
                  <div class="dropdown-menu-caret" data-toggle="dropdown"></div>

                  {{ menus.menu_links(item.below, attributes, menu_level + 1, item.title|replace({' ': '-', '&': ''}) ) }}
                </li>
              {% else %}
                <li {{ item.attributes.addClass('dropdown-submenu',classes) }}>
                  <a href="{{ item.url }}" data-toggle="dropdown" id="block-usip-main-submenu-{{ item.title|replace({' ': '-', '&': ''}) }}" data-level="{{ menu_level }}">{{ item.title }}</a>
                  {{ menus.menu_links(item.below, attributes, menu_level + 1, item.title|replace({' ': '-', '&': ''}) ) }}
                </li>
              {% endif %}
            {% else %}
              <li {{ item.attributes.addClass(classes) }}>
                {{ link(item.title, item.url, { 'data-level': menu_level }) }} 
              </li>
            {% endif %}
          {% endfor %}
          </ul>
        {% endif %}
      {% endmacro %}

  </div>
</div>