custom/plugins/EmovaWbTheme/src/Resources/views/storefront/layout/navigation/offcanvas/item-link.html.twig line 1

Open in your IDE?
  1. {% set isActive = item.category.id == activeId %}
  2. {% set hasChildren = item.category.visibleChildCount > 0 %}
  3. {% set url = category_url(item.category) %}
  4. {% set name = item.category.translated.name %}
  6. <li class="navigation-offcanvas-list-item offcanvas-custom-menu-li">
  7.     {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link %}
  8.     
  9.         <a class="navigation-offcanvas-link nav-item nav-link {% if hasChildren %} js-navigation-offcanvas-link {% else %} js-navigation-offcanvas-link-children {% endif %} {% if parentId == item.category.id %} active {% endif %}"
  10.             {% if hasChildren %} onclick="toggleActiveParent(this)" {% else %} onclick="toggleActiveChildren(this)" {% endif %}
  11.             href="{{ url }}"
  12.             {% if hasChildren %}
  13.                 data-href="{{ path('frontend.menu.offcanvas', {'navigationId': item.category.id}) }}"
  14.             {% endif %}
  15.            itemprop="url"
  16.             {% if category_linknewtab(item.category) %}target="_blank"{% endif %}
  17.            title="{{ name }}">
  18.             {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link_text %}
  19.                 <span itemprop="name">{{ name }}</span>
  20.                 {% if hasChildren %}
  21.                     {% block layout_navigation_offcanvas_navigation_categories_list_category_item_link_icon %}
  22.                         <span
  23.                             class="navigation-offcanvas-link-icon">
  24.                             {% sw_icon 'arrow-right-menu' %}
  25.                         </span>
  26.                     {% endblock %}
  27.                 {% endif %}
  28.             {% endblock %}
  29.         </a>
  30.         <script>
  31.             function toggleActiveParent(link){  
  32.                 if (!link.classList.contains('active')) {
  34.                     var links = document.querySelectorAll('.js-navigation-offcanvas-link');
  35.                     links.forEach(function (el) {
  36.                         el.classList.remove('active');
  37.                     });
  39.                     link.classList.add('active');    
  40.                 }
  41.                 else 
  42.                 {
  43.                     var links = document.querySelectorAll('.js-navigation-offcanvas-link');
  44.                     links.forEach(function (el) {
  45.                         el.classList.remove('active');
  46.                     });
  47.                     setTimeout(function() {
  48.                         var overlayDiv = document.querySelector('.has-transition');
  49.                         if (overlayDiv) {          
  50.                             overlayDiv.parentNode.removeChild(overlayDiv);
  51.                         }
  52.                     }, 500);
  53.                     
  54.                 }                
  55.             }
  57.             function toggleActiveChildren(link){
  58.                 link.classList.toggle('active');
  59.                 var childrenLinks = document.querySelectorAll('.js-navigation-offcanvas-link-children');
  60.                 childrenLinks.forEach(function (el) {
  61.                     el.classList.remove('active');
  62.                 });
  63.             }
  65.         </script>
  66.     {% endblock %}
  67. </li>