bundles/FoxHabbit/BasisBundle/Resources/views/Areas/basisbundle-topnav/flyout-types/flyout-scrollspy-swiper-image.html.twig line 1

Open in your IDE?
  1. {% import '@FoxHabbitBasis/Macro/wrap.html.twig' as wrap_macro %}
  2. {% macro renderNavImage( page, imageIsRequired, showDescription) %}
  3.     {% set navImage = page.getDocument().getProperty('navImage')|default(null) %}
  4.     {% set navImageHasAlpha = false %}
  5.     {% if navImage and ( navImage.getMimeType() in ['image/png', 'image/gif'] ) %}
  6.         {% set navImageHasAlpha = true %}
  7.     {% endif %}
  8.     {% set navText = page.getDocument().getProperty('menuDescription')|default(null) %}
  9.     {% if navImage or not imageIsRequired %}
  10.         <div class="nav-image-container" data-page-id="{{ page.getId() }}">
  11.             <div class="parallax-box-wrapper">
  12.                 <div class="parallax-box parallax-box-topnav">
  13.                     <div class="parallax-box-background">
  14.                         <div class="oversized-background embed-responsive embed-responsive-1by1 {{ navImageHasAlpha ? 'bg-white' : 'bg-light-petrol' }}">
  15.                         </div>
  16.                     </div>
  17.                     <div class="parallax-box-item-center">
  18.                         {% if navImage %}
  19.                             {{ navImage.getThumbnail( navImageHasAlpha ? 'nav-image-alpha' : 'nav-image').getHtml({imgAttributes:{class:'img-fluid'}})|raw }}
  20.                         {% endif %}
  21.                     </div>
  22.                     {% if showDescription and navText %}
  23.                         <div class="parallax-box-footer">{{ navText }}</div>
  24.                     {% endif %}
  25.                 </div>
  26.             </div>
  27.         </div>
  28.     {% endif %}
  29. {% endmacro %}
  31. <div
  32.     class="{{ currentLevelConfig.flyout_class }} flyout-desktop"
  33.     data-flyout="{{ page.getId() }}"
  34.     data-level="{{ level }}">
  35.     {{ wrap_macro.wrapperOpen( currentLevelConfig.wrapper, _context) }}
  36.     {% if currentLevelConfig.close.template|default(null) %}
  37.         {% include '@FoxHabbitBasis/Areas/basisbundle-topnav/nav-parts/' ~ currentLevelConfig.close.template ~ '.html.twig' %}
  38.     {% endif %}
  39.     {{ wrap_macro.wrapperOpen( currentLevelConfig.entry_wrapper, _context) }}
  40.     {{ wrap_macro.wrapperOpen( currentLevelConfig.scrollspy_wrapper, _context) }}
  41.     {% for subpage in page %}
  42.         {% if nav_page_check_permissions(subpage, app.getUser()) %}
  43.             <!-- TODO: entry for scrollspy -->
  44.             <li class="nav-item"><a class="nav-link scrollto {{ subpage.getClass() }}" href="#{{ subpage.getId() }}" data-url-id="{{ subpage.getId() }}" data-folder-image="{{ subpage.getId() }}">{{ subpage.getLabel() }}</a>
  45.             </li>
  46.         {% endif %}
  47.     {% endfor %}
  48.     {{ wrap_macro.wrapperClose( currentLevelConfig.scrollspy_wrapper) }}
  50.     {{ wrap_macro.wrapperOpen( currentLevelConfig.swiper_wrapper, _context) }}
  51.     <div class="scroll-up"></div>
  52.     <div class="scrollspy-container" >
  53.         <div class="scrollspy-wrapper">
  54.             {% for subpage in page %}
  55.                 {% if nav_page_check_permissions(subpage, app.getUser()) %}
  56.                     <!-- TODO: entry for Large list in swiper -->
  57.                     <div class="mainlist {{ subpage.getClass() }}" id="{{ subpage.getId() }}">
  58.                         {% if not subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  59.                             <a class="nav-link {{ subpage.getClass() }}" href="{{ subpage.getHref() }}" data-folder-image="{{ subpage.getId() }}">{{ subpage.getLabel() }}</a>
  60.                             {% if subpage.getDocument().getProperty('menuDescription') %}
  61.                                 <a class="nav-link-description" href="{{ subpage.getHref() }}" data-folder-image="{{ subpage.getId() }}">{{ subpage.getDocument().getProperty('menuDescription') }}
  62.                                     <div class="lorch-icon lorch-icon-next text-white">{{ 'navigation.entry.read_more'|trans }}</div></a>
  63.                             {% endif %}
  64.                         {% endif %}
  65.                         <div class="lvl1 {% if subpage.getDocument().getProperty('hideSecondMenuLevel') %} lvl1-toplevel{% endif %}">
  66.                             {% for childpage in subpage %}
  67.                                 {% if nav_page_check_permissions(childpage, app.getUser()) %}
  68.                                     <a class="nav-link-lvl2 {{ childpage.getClass() }}
  69.                                     {% if childpage.getDocument().getProperty('productsMenuHighlight') %} highlight-menu {% endif %}
  70.                                     {% if subpage.getDocument().getProperty('hideSecondMenuLevel') %} nav-link{% endif %}
  71.                                     {% if not subpage.getDocument().getProperty('hideSecondMenuLevel') %} no-children{% endif %}"
  72.                                     data-id="{{ childpage.getId() }}"
  73.                                     href="{{ childpage.getHref() }}"
  74.                                     data-folder-image="{{ childpage.getId() }}">{{ childpage.getLabel() }}</a>
  75.                                     {% if childpage.getDocument().getProperty('menuDescription') and subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  76.                                         <a class="nav-link-description" href="{{ childpage.getHref() }}" data-folder-image="{{ childpage.getId() }}">{{ childpage.getDocument().getProperty('menuDescription') }}
  77.                                             <div class="lorch-icon lorch-icon-next text-white">{{ 'navigation.entry.read_more'|trans }}</div></a>
  78.                                     {% endif %}
  79.                                     {% if childpage.hasPages and subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  80.                                         <div class="lvl2">
  81.                                             {% for subchildpage in childpage %}
  82.                                                 {% if nav_page_check_permissions(subchildpage, app.getUser()) %}
  83.                                                     <a class="nav-link-lvl3 {{ subchildpage.getClass() }}"
  84.                                                         data-id="{{ subchildpage.getId() }}"
  85.                                                         href="{{ subchildpage.getHref() }}"
  86.                                                         data-folder-image="{{ subchildpage.getId() }}">{{ subchildpage.getLabel() }}</a>
  87.                                                 {% endif %}
  88.                                             {% endfor %}
  89.                                         </div>
  90.                                     {% endif %}
  91.                                 {% endif %}
  92.                             {% endfor %}
  93.                         </div>
  94.                     </div>
  95.                 {% endif %}
  96.             {% endfor %}
  97.         </div>
  98.     </div>
  99.     <div class="scroll-down"></div>
  100.     {{ wrap_macro.wrapperClose( currentLevelConfig.swiper_wrapper) }}
  102.     {{ wrap_macro.wrapperOpen( currentLevelConfig.image_wrapper, _context) }}
  103.     {% for subpage in page %}
  104.         {% if nav_page_check_permissions(subpage, app.getUser()) %}
  105.             {% if subpage.getDocument().getProperty('navImage') is defined and not subpage.getDocument().getProperty('navImage') is empty %}
  106.                 {{ _self.renderNavImage( subpage, true, false) }}
  107.             {% endif %}
  108.             {% for childpage in subpage %}
  109.                 {% if nav_page_check_permissions(childpage, app.getUser()) %}
  110.                     {{ _self.renderNavImage( childpage, true, (not subpage.getDocument().getProperty('hideSecondMenuLevel'))) }}
  111.                     {% for subchildpage in childpage %}
  112.                         {% if nav_page_check_permissions(subchildpage, app.getUser()) %}
  113.                             {{ _self.renderNavImage( subchildpage, true, true) }}
  114.                         {% endif %}
  115.                     {% endfor %}
  116.                 {% endif %}
  117.             {% endfor %}
  118.         {% endif %}
  119.     {% endfor %}
  120.     {{ wrap_macro.wrapperClose( currentLevelConfig.image_wrapper) }}
  121.     {{ wrap_macro.wrapperClose( currentLevelConfig.entry_wrapper) }}
  122.     {{ wrap_macro.wrapperOpen( currentLevelConfig.claim_wrapper, _context) }}
  123.     {{ wrap_macro.wrapperClose( currentLevelConfig.claim_wrapper) }}
  124.     {{ wrap_macro.wrapperClose( currentLevelConfig.wrapper) }}
  125. </div>
  126. <div
  127.     class="{{ currentLevelConfig.flyout_class }} flyout-mobile"
  128.     data-flyout="{{ page.getId() }}"
  129.     data-level="{{ level }}">
  130.     {{ wrap_macro.wrapperOpen( currentLevelConfig.mobile_wrapper, _context) }}
  131.     {{ wrap_macro.wrapperOpen( currentLevelConfig.mobile_entry_wrapper, _context) }}
  132.     <div class="menu-header">{{ page.getLabel() }}</div>
  133.     {{ wrap_macro.wrapperOpen( currentLevelConfig.mobile_scrollspy_wrapper, _context) }}
  135.     {% for subpage in page %}
  136.         {% if nav_page_check_permissions(subpage, app.getUser()) %}
  137.             {% if subpage.hasChildren %}
  138.                 <li class="nav-item"><a class="nav-link scrollto {{ subpage.getClass() }}" href="#mobile{{ subpage.getId() }}">{{ subpage.getLabel() }}</a>
  139.                 </li>
  140.             {% else %}
  141.                 <li class="nav-item"><a class="nav-link scrollto {{ subpage.getClass() }}" href="{{ subpage.getHref() }}">{{ subpage.getLabel() }}</a>
  142.                 </li>
  143.             {% endif %}
  144.         {% endif %}
  145.     {% endfor %}
  146.     {{ wrap_macro.wrapperClose( currentLevelConfig.mobile_scrollspy_wrapper) }}
  147.     <div class="flyout-back" data-toggle="nav-flyout"><i class="lorch-icon-back"></i>{{ 'navigation.back.button'|trans }}</div>
  148.  <div class="mobile-menu-list hide">
  149.  <div class="mobile-menu-container">
  150.      <div class="mobile-scroll-wrapper">
  151.      <div class="mobile-scroll-inner">
  152.             {% for subpage in page %}
  153.                 {% if nav_page_check_permissions(subpage, app.getUser()) %}
  154.                     <!-- TODO: entry for Large list in swiper -->
  155.                     <div class="mainlist {{ subpage.getClass() }}" id="mobile{{ subpage.getId() }}">
  156.                         <div class="menu-header">{{ subpage.getLabel() }}</div>
  157.                         {% if not subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  158.                             <a class="nav-link {{ subpage.getClass() }}" href="{{ subpage.getHref() }}">{{ subpage.getLabel() }}</a>
  159.                             {% if subpage.getDocument().getProperty('menuDescription') %}
  160.                                 <a class="nav-link-description" href="{{ subpage.getHref() }}">{{ subpage.getDocument().getProperty('menuDescription') }}
  161.                                     <div class="lorch-icon lorch-icon-next text-white">{{ 'navigation.entry.read_more'|trans }}</div></a>
  162.                             {% endif %}
  163.                         {% endif %}
  164.                         <div class="lvl1 {% if subpage.getDocument().getProperty('hideSecondMenuLevel') %} lvl1-toplevel{% endif %}">
  165.                             {% for childpage in subpage %}
  166.                                 {% if nav_page_check_permissions(childpage, app.getUser()) %}
  167.                                     <a class="nav-link-lvl2 {{ childpage.getClass() }}
  168.                                     {% if childpage.getDocument().getProperty('productsMenuHighlight') %} highlight-menu {% endif %}
  169.                                     {% if subpage.getDocument().getProperty('hideSecondMenuLevel') %} nav-link{% endif %}
  170.                                     {% if not subpage.getDocument().getProperty('hideSecondMenuLevel') %} no-children{% endif %}" data-id="{{ childpage.getId() }}"
  171.                                     href="{{ childpage.getHref() }}">{{ childpage.getLabel() }}</a>
  172.                                     {% if childpage.getDocument().getProperty('menuDescription') and subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  173.                                         <a class="nav-link-description" href="{{ childpage.getHref() }}">{{ childpage.getDocument().getProperty('menuDescription') }}
  174.                                             <div class="lorch-icon lorch-icon-next text-white">{{ 'navigation.entry.read_more'|trans }}</div></a>
  175.                                     {% endif %}
  176.                                     {% if childpage.hasPages and subpage.getDocument().getProperty('hideSecondMenuLevel') %}
  177.                                         <div class="lvl2">
  178.                                             {% for subchildpage in childpage %}
  179.                                                 {% if nav_page_check_permissions(subchildpage, app.getUser()) %}
  180.                                                     <a class="nav-link-lvl3 {{ subchildpage.getClass() }}" data-id="{{ subchildpage.getId() }}"
  181.                                                     href="{{ subchildpage.getHref() }}">{{ subchildpage.getLabel() }}</a>
  182.                                                 {% endif %}
  183.                                             {% endfor %}
  184.                                         </div>
  185.                                     {% endif %}
  186.                                 {% endif %}
  187.                             {% endfor %}
  188.                         </div>
  189.                     </div>
  190.                 {% endif %}
  191.             {% endfor %}
  192.         </div>
  193.      </div>
  194.  </div>
  195.      <div class="flyout-back"><i class="lorch-icon-back"></i>{{ 'navigation.back.button'|trans }}</div>
  196.  </div>
  197.     {{ wrap_macro.wrapperClose( currentLevelConfig.mobile_swiper_wrapper) }}
  198.     {{ wrap_macro.wrapperClose( currentLevelConfig.mobile_entry_wrapper) }}
  199.     {{ wrap_macro.wrapperClose( currentLevelConfig.mobile_wrapper) }}
  200. </div>