templates/Navigation/navbar.html.twig line 1

Open in your IDE?
  1. {% import "Includes/Macros/cacheMacros.html.twig" as cacheMacros %}
  3. {% if document.property('region').parentId == '324083' %}
  4.     {% set isSubRegion = true %}
  5. {% else %}
  6.     {% set isSubRegion = false %}
  7. {% endif %}
  9. {% set regionCacheKey =  document.property('region') is not null ? document.property('region').getId() : '' %}
  10. {% set navigationRootId = document.property('navigationRoot') is not null ? document.property('navigationRoot').id : ''  %}
  12. {% set linkList = [] %}
  13. {% if not document.property('noEventNav') %}
  14.     {% set linkList = linkList|merge([
  15.         {
  16.             href: siteConfig.eventOverview,
  17.             title: "nav.Event"|trans,
  18.             icon: "calendar"
  19.         }
  20.     ]) %}
  21. {% endif %}
  22. {% if not document.property('noTourNav') %}
  23.     {% set linkList = linkList|merge([
  24.         {
  25.             href: siteConfig.tourOverview,
  26.             title: "nav.Touren"|trans,
  27.             icon: "hiking"
  28.         }
  29.     ]) %}
  30. {% endif %}
  31. {% if not document.property('noWebcamNav') %}
  32.     {% set linkList = linkList|merge([
  33.         {
  34.             href: siteConfig.webcamOverview,
  35.             title: "nav.Webcams"|trans,
  36.             icon: "webcams"
  37.         }
  38.     ]) %}
  39. {% endif %}
  40. {% if not document.property('noWeatherNav') %}
  41.     {% set linkList = linkList|merge([
  42.         {
  43.             href: siteConfig.weatherOverview,
  44.             title: "nav.Wetter"|trans,
  45.             icon: "weather"
  46.         }
  47.     ]) %}
  48. {% endif %}
  50. <header class="main-header {{ isSubRegion ? 'main-header--with-meta-link': '' }}">
  51.     <nav class="main-navbar js-affix-nav main-navbar--fixed js-nav">
  52.         {% if isSubRegion and (pimcore_placeholder('hide-subregion-mobile-bar') is empty or not pimcore_device().isPhone()) %}
  53.             <div class="main-navbar-meta main-navbar-meta--meta-link">
  54.                 <div class="text-center px-3">
  55.                     {% if pimcore_device().isPhone() %}
  56.                         {{ 'startseite.switch mobile'|trans|raw }}
  57.                     {% else %}
  58.                         {{ siteConfig.regionSlideHeadline }}{{ 'startseite.switch'|trans|raw }}
  59.                     {% endif %}
  60.                 </div>
  61.             </div>
  62.         {% endif %}
  63.         {% if pimcore_placeholder('hide-iconlist-mobile') is empty %}
  64.             <div class="main-navbar-meta d-md-none">
  65.                 <ul class="main-navbar-meta__list list-unstyled">
  66.                     {% for item in linkList|default([]) %}
  67.                         <li class="main-navbar__item">
  68.                             <a href="{{ item.href }}" class="main-navbar__item__link" data-event-tracking-category="Navbar" data-event-tracking-action="{{ item.title }}" data-event-tracking-label="{{ item.href }}">
  69.                                 <span class="icon icon-{{ item.icon }} main-navbar__item__icon" aria-hidden="true"></span>
  70.                                 {{ item.title }}
  71.                             </a>
  72.                         </li>
  73.                     {% endfor %}
  75.                     <li class="main-navbar__item">
  76.                         <button class="main-navbar__item__link js-nav__toggle-overlay"
  77.                                 aria-label="{{ 'sr.Show Overlay'|trans }}"
  78.                                 title="{{ 'sr.Show Overlay'|trans }}"
  79.                                 data-nav-overlay-target="#searchOverlay" data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Suche'|trans }}" data-event-tracking-label="{{ siteConfig.search }}">
  80.                             <span class="icon icon-search main-navbar__item__icon" aria-hidden="true"></span>
  81.                             {{ 'nav.Suche'|trans }}
  82.                         </button>
  83.                     </li>
  84.                 </ul>
  85.             </div>
  86.         {% endif %}
  90.         <div class="main-navbar-nav">
  91.             <div class="main-navbar__container js-nav__screen-width">
  93.                 <div class="main-navbar__left ">
  94.                     <button class="main-navbar__toggle collapsed js-nav__toggle-overlay"
  95.                             type="button"
  96.                             aria-expanded="false"
  97.                             aria-label="{{ 'sr.Toggle Navigation'|trans }}"
  98.                             data-nav-overlay-target="#main-navbar-nav"
  99.                             aria-controls="main-navbar-nav">
  100.                         <span class="main-navbar__toggle__line"></span>
  101.                         <span class="main-navbar__toggle__line"></span>
  102.                         <span class="main-navbar__toggle__line"></span>
  103.                         <span class="main-navbar__toggle__text">Menu</span>
  104.                         <span class="main-navbar__toggle__text--open" aria-hidden="true">{{ 'nav.schliessen'|trans }}</span>
  105.                     </button>
  107.                     <div class="nav nav-overlay js-nav__overlay js-render-template js-render-template--not-initially" id="main-navbar-nav" aria-hidden="true">
  108.                         <template class="js-render-template__template">
  109.                             <div class="mega-nav__container js-nav-active-state">
  110.                                 {{ mainNavigation( document, siteConfig, app.request.get('clearCache', false) ) }}
  111.                             </div>
  112.                         </template>
  113.                     </div>
  116.                     {% if document.property('regionOverlay') is instanceof('\\Pimcore\\Model\\Document\\Snippet') %}
  117.                         <button class="main-navbar__regions js-nav__toggle-overlay"
  118.                                 aria-label="{{ 'sr.Show Overlay'|trans }}"
  119.                                 title="{{ 'sr.Show Overlay'|trans }}"
  120.                                 data-nav-overlay-target="#regionsOverlay">
  121.                             <span class="icon icon-pin-regions" aria-hidden="true"></span>
  122.                             <span class="main-navbar__regions-text">
  123.                                 {{ ('nav.' ~ (document.property('region').isMainRegion ? 'Regionen' : 'Region'))|trans }}
  124.                             </span>
  125.                             <span class="icon icon-arrow-down main-navbar__regions-arrow-down" aria-hidden="true"></span>
  126.                         </button>
  127.                         {{ cacheMacros.cacheSnippet('region-overlay-' ~ document.property('regionOverlay').id ~ '-' ~ app.request.locale~ '-' ~ navigationRootId, document.property('regionOverlay'), {'isInNav': true}, 3600) }}
  128.                     {% endif %}
  130.                 </div>
  132.                 <div class="main-navbar__centered" id="js-nav__screen-width__center">
  133.                     <a href="{{ document.getProperty('navLogoLink') ?: siteConfig.home }}" class="pointer-events-auto" data-event-tracking-category="Navbar" data-event-tracking-action="Logo" data-event-tracking-label="{{ document.getProperty('navLogoLink') ?: siteConfig.home }}">
  134.                         {{ (document.getProperty('navLogo') ?: siteConfig.logo ?: siteConfig.logo('en')).thumbnail('navbar-brand').html({imgAttributes: {class: 'main-navbar__brand ', loading: 'eager',id:"js-nav__screen-width__center-logo"},      pictureAttributes: {
  135.                             fetchpriority: 'high',
  136.                         },})| raw }}
  137.                     </a>
  138.                 </div>
  140.                 <div class="main-navbar__right " id="js-nav__screen-width__right">
  141.                     <ul class="main-navbar__list list-unstyled">
  142.                         {% for item in linkList|default([]) %}
  143.                             <li class="main-navbar__item d-none d-md-flex">
  144.                                 <a href="{{ item.href }}" class="main-navbar__item__link" data-event-tracking-category="Navbar" data-event-tracking-action="{{ item.title }}" data-event-tracking-label="{{ item.href }}">
  145.                                     <span class="icon icon-{{ item.icon }} main-navbar__item__icon"
  146.                                           aria-hidden="true"></span>
  147.                                     {{ item.title }}
  148.                                 </a>
  149.                             </li>
  150.                         {% endfor %}
  151.                         <li class="main-navbar__item main-navbar__item--search d-none d-md-flex">
  152.                             <button class="main-navbar__item__link main-navbar__item__link--search js-nav__toggle-overlay"
  153.                                     aria-label="{{ 'sr.Show Overlay'|trans }}"
  154.                                     title="{{ 'sr.Show Overlay'|trans }}"
  155.                                     data-nav-overlay-target="#searchOverlay" data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Suche'|trans }}" data-event-tracking-label="{{ siteConfig.search }}">
  156.                                 <span class="icon icon-search main-navbar__item__icon" aria-hidden="true"></span>
  157.                                 <span class="main-navbar__item-text">{{ 'nav.Suche'|trans }}</span>
  158.                             </button>
  159.                         </li>
  161.                         {% if document.property('searchOverlay') is instanceof('\\Pimcore\\Model\\Document\\Snippet') %}
  162.                             {{ cacheMacros.cacheSnippet('searchOverlay-' ~ document.property('searchOverlay').id ~ '-' ~ app.request.locale ~ '-' ~ navigationRootId, document.property('searchOverlay'), {'isInNav': true}, 3600) }}
  163.                         {% endif %}
  164.                     </ul>
  166.                     {% if document.property('contactDocumentForNav') is instanceof('\\Pimcore\\Model\\Document\\Page') %}
  167.                         <a href="{{ document.property('contactDocumentForNav') }}" class="main-navbar__booking-btn" data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Kontakt'|trans }}" data-event-tracking-label="{{ document.property('contactDocumentForNav') }}">
  168.                             <span class="icon icon-speech-bubble main-navbar__booking-btn__icon" aria-hidden="true"></span>
  169.                             <span class="d-none d-md-inline-block">{{ 'nav.Kontakt'|trans }}</span>
  170.                         </a>
  171.                     {% else %}
  172.                         <a href="{{ demi_checkoutUrl("cart", "step1") }}" class="main-navbar__cart-btn js-cart-counter"
  173.                            data-cart-counter-url="{{ demi_checkoutUrl("cart", "amountInCart") }}"
  174.                            data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Warenkorb'|trans }}" data-event-tracking-label="{{ 'nav.Warenkorb'|trans }}">
  175.                             <span class="position-relative">
  176.                                   <span class="icon icon-cart main-navbar__cart-btn__icon"
  177.                                         aria-hidden="true"></span>
  178.                                 <span class="main-navbar__item-count bg-primary-light js-cart-counter__count" aria-label="cart count">0</span>
  179.                             </span>
  180.                             <span class="d-none d-md-flex">{{ 'nav.Warenkorb'|trans }}</span>
  181.                         </a>
  183.                         {% if siteConfig.disableBookingOverlay %}
  184.                             <a class="main-navbar__booking-btn  js-nav__toggle-overlay" href="{{ demiConfigurationHelper().getAccoParentDocument() }}"
  185.                                     aria-label="{{ 'sr.Show Overlay'|trans }}"
  186.                                     title="{{ 'sr.Show Overlay'|trans }}"
  187.                                     data-nav-overlay-target="#bookingOverlay" data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Urlaub buchen'|trans }}" data-event-tracking-label="{{ demiConfigurationHelper().getAccoParentDocument() }}">
  188.                                 <span class="icon icon-baggage main-navbar__booking-btn__icon" aria-hidden="true"></span>
  189.                                 <span class="d-none d-md-inline-block">{{ 'nav.Urlaub buchen'|trans }}</span>
  190.                             </a>
  191.                         {% else %}
  192.                             <button class="main-navbar__booking-btn  js-nav__toggle-overlay"
  193.                                     aria-label="{{ 'sr.Show Overlay'|trans }}"
  194.                                     title="{{ 'sr.Show Overlay'|trans }}"
  195.                                     data-nav-overlay-target="#bookingOverlay" data-event-tracking-category="Navbar" data-event-tracking-action="{{ 'nav.Urlaub buchen'|trans }}" data-event-tracking-label="{{ demiConfigurationHelper().getAccoParentDocument() }}">
  196.                                 <span class="icon icon-baggage main-navbar__booking-btn__icon" aria-hidden="true"></span>
  197.                                 <span class="d-none d-md-inline-block">{{ 'nav.Urlaub buchen'|trans }}</span>
  198.                             </button>
  200.                             {{ cacheMacros.cacheInclude('bookingOverlay-region'~ regionCacheKey ~ '-' ~ app.request.locale ~ '-' ~ navigationRootId, 'Navigation/Partials/bookingOverlay.html.twig', {}, 3600) }}
  201.                         {% endif %}
  203.                         {% if not document.property('disableAdditionalServicesNavButton') %}
  204.                             <a class="main-navbar__adventure-btn" href="{{ demiConfigurationHelper().getAdditionalServiceDetailPath() }}">
  205.                                 <span class="icon icon-mountain main-navbar__adventure-btn__icon" aria-hidden="true"></span>
  206.                                 <span class="d-none d-md-inline-block">{{ 'nav.Erlebnisse'|trans }}</span>
  207.                             </a>
  208.                         {% endif %}
  209.                     {% endif %}
  210.                 </div>
  211.             </div>
  212.         </div>
  213.     </nav>
  214. </header>