{{ attach_library('ui_patterns/menu_mg.menu_mg_lib') }}

{% set attributes = attributes|default(create_attribute()) %}
{% set mid = mid|default("mega-" ~ random()) %}
{% set nv_tgl_down = nv_tgl_down|default(global_icon_down|default('fas fa-chevron-down')) %}
{% set nv_tgl_up = nv_tgl_up|default(global_icon_times|default('fas fa-times') ~ "-circle") %}
{% set show_brd_img = show_brd_img|default(false) %}
{% set icon = icon|default('fas fa-angle-right') %}
{% set allow_close = allow_close|default(false) %}
{% set show_close = show_close|default(false) %}
{% set tab_version = tab_version|default('tbi_c') %}
{% set lg_col_width = lg_col_width|default(3) %}
{% set md_col_width = md_col_width|default(3) %}
{% set justify_content = justify_content|default(false) %}

{% set tab_items = [] %}

{% for link in links %}
  {% set col_content = "" %}
  {% if link.sub_links %}
    {% set col_content %}
      {% if justify_content %}
        <div class="row" style="justify-content: {{ justify_content }}">
      {% else %}
        <div class="row">
      {% endif %}
        {# This mapping is redundant, but let's keep it #}
        {% set top_link = {
          'url': link['url'],
          'title': link['title'],
          'active': link['active'],
          'attributes': link['attributes'],
          'class': link['class'] ~ ' ' ~ 'mg-top',
          'hide_item': link['hide_item'],
          'in_active_trail': link['in_active_trail'],
        } %}
        {% set sub_link_col_items = [top_link] %}

        {% for sub_link in link.sub_links %}
          {% if sub_link['break'] %}
            <div class="col-md-{{ md_col_width }} col-lg-{{ lg_col_width }}">
              {{ pattern('menu_std', {
                'links': sub_link_col_items,
                'max_depth': 1,
                'tid': 'header - ' ~ sub_link_col_items[0]['title'],
                'icon': icon,
              }) }}
            </div>
            {% set sub_link_col_items = [] %}
            {% set sub_link_col_items = sub_link_col_items|merge([sub_link]) %}
          {% else %}
            {% set sub_link_col_items = sub_link_col_items|merge([sub_link]) %}
          {% endif %}
        {% endfor %}

        {% if sub_link_col_items is not empty %}
          <div class="col-md-{{ md_col_width }} col-lg-{{ lg_col_width }}">
            {{ pattern('menu_std', {
              'links': sub_link_col_items,
              'max_depth': 1,
              'tid': 'header - ' ~ sub_link_col_items[0]['title'],
              'icon': icon,
            }) }}
          </div>
        {% endif %}
      </div>
    {% endset %}
  {% endif %}
  {% if link.sub_content %}
    {% set col_content %}
      <div class="row">
        {{ link.sub_content }}
      </div>
    {% endset %}
  {% endif %}

  {% set link_classes = [
    link.class,
    link['in_active_trail'] ? 'active-trail',
  ] %}

  {% set tab_item = {
    "tbid": link.lid,
    "title": link.title|raw,
    "content": col_content,
    "first": false,
    "url": link.url,
    "nav_attrs": link.attributes,
    "nav_class": link_classes|join(' '),
  } %}

  {% set tab_items = tab_items|merge([tab_item]) %}

{% endfor %}

{% set home_section %}
  <ul class="ulc" id="mm-mobile">
    {% if not upper_links %}
      <li class="liin mbis">
        {{ pattern_preview('hamburger') }}
      </li>
    {% endif %}
    <li class="liin header-logo-wrapper">
      <a href="/" alt="Home link" id="header-logo-link">
        <img id="header-logo"
             height="{{ logo_height }}"
             width="{{ logo_width }}"
             src="{{ logo_url }}"
             alt="{{ logo_alt }}"/>
        {% if logo_url_minimise %}
        <img id="header-logo-minimise"
             height="{{ logo_height_minimise }}"
             width="{{ logo_width_minimise }}"
             src="{{ logo_url_minimise }}"
             alt="{{ logo_alt }}"/>
        {% endif %}
      </a>
    </li>
    {% if show_brd_img %}
      <li class="liin brd-img-wrapper">
        <div class="brd-img">
          <div class="brd-img-inner"></div>
        </div>
      </li>
    {% endif %}
    <li class="liin mbis">
      <a href="/search"
         tabindex="-1"
         data-bs-target="#modal-search"
         data-bs-toggle="modal"
         class="lg-down" >
        <i class="fas fa-search"></i>
        <span class="sr-only">Search</span>
      </a>
    </li>
  </ul>
{% endset %}

{# TEMPLATE #}

{{ home_section }}

<div id="mmright" >

  {% if upper_links %}
    {# Also add our menu icon #}
    {% set menu_link = {
      'lid': 'mmham',
      'url': '#',
      'title': '<span class="sr-only">Main menu</span><i class="fas fa-bars"></i>',
      'li_class': 'mmham mm-links-ham',
      'attributes': {
        'data-alt-toggle': 'scrollto',
        'data-alt-target': 'top',
      }
    } %}
    {% set upper_links = upper_links|merge([menu_link]) %}
    <div id="mmright-upper">
      {{ pattern('menu_il', {
        'links': upper_links,
        'post_link': pattern_preview('hamburger'),
      }) }}
    </div>
  {% endif %}

  <div id="mmright-lower">
    {% if pre_link %}
      {% include "@atoms/tm-links/standard/standard.twig" with {
        "text": pre_link['title'],
        "url": pre_link['url'],
        "class": pre_link['class']  ~ ' pre-link ' ~ (pre_link['in_active_trail'] ? 'active-trail'),
        "attributes": pre_link['attributes'],
      } only %}
    {% endif %}
    <div id="mm-tabs" class="{{ post_link ? 'wpl' }}">
      {{ pattern('bs-tabs-items', {
        'items': tab_items,
        'pid': mid,
        'nv_tgl_down': nv_tgl_down,
        'nv_tgl_up': nv_tgl_up,
        'allow_close': allow_close,
        'show_close': show_close,
        'child_content_class': 'container',
      }, tab_version) }}
    </div>
    {% if post_link %}
      {% include "@atoms/tm-links/standard/standard.twig" with {
        "text": post_link['title'],
        "url": post_link['url'],
        "class": post_link['class']  ~ ' post-link ' ~ (post_link['in_active_trail'] ? 'active-trail'),
        "attributes": post_link['attributes'],
      } only %}
    {% endif %}
  </div>

</div>
