src/Elements/Bundle/DemiFrontendBundle/Resources/views/List/list.desktop.html.twig line 1

Open in your IDE?
  1. {% extends('@ElementsDemiFrontend/Layout/list-layout.html.twig') %}
  2. {% block content %}
  3.     {% set isMapAllowed = not pimcore_checkbox('noMapAllowed').isChecked() %}
  4.     {% set showMapToggle = pimcore_checkbox('showMapToggle').isChecked() %}
  5.     {% set showMapInitially = not pimcore_checkbox('hideMapInitially').isChecked() %}
  6.     {% set useListTeaserStyle = not pimcore_checkbox('useListTiles').isChecked() %}
  7.     {% set showMap = isMapAllowed and not pimcore_device().isPhone() and ((app.request.get('showMap') is null and showMapInitially) or app.request.get('showMap') == 1) %}
  8.     {% set nearbySearchJson = '/var/tmp/typeahead/' ~ app.request.getLocale() ~ '/nearbySearch.json' %}
  9.     {% set searchJson = '/var/tmp/typeahead/hotellists' ~ document.getId() ~ '.json' %}
  10.     {% set region = document.property('region') %}
  11.     {% if not demi_improvedFileExists(searchJson, "PIMCORE_WEB_ROOT") %}
  13.         {% set searchJson = '/var/tmp/typeahead/' ~ app.request.getLocale() ~ '/hotels' ~ (region.getIsMainRegion() ? '' : ('-' ~ region.id)) ~'.json' %}
  14.     {% endif %}
  16.     {% if not editmode %}
  17.     <script type="text/javascript" data-cookieconsent="ignore">
  18.         {% if noDate and (pimcore_checkbox('autoOpenModal').isChecked() or app.request.get('openSearchOnLoad') == 1) %}
  19.         _config.openSearchOnLoad = true;
  20.         {% endif %}
  21.         {% if not searchParam.getIsAlternative() %}
  22.         _config.makeAlternativeSearchRequest = {{ makeAlternativeSearchRequest == true ? "true" : "false" }};
  23.         _config.showAlternativeResults = false;
  24.         _config.hasListMap = {{ isMapAllowed ? 'true': 'false' }};
  25.         {% endif %}
  26.         {% if demi_improvedFileExists(searchJson, "PIMCORE_WEB_ROOT") %}
  27.         _config.searchAutocompleteUrl = '/cache-buster-{{ demi_getExistingCacheFile(searchJson) }}';
  28.         {% endif %}
  29.         {% if demi_improvedFileExists(nearbySearchJson, "PIMCORE_WEB_ROOT") %}
  30.         _config.nearbySearchAutocompleteUrl = '/cache-buster-{{ demi_getExistingCacheFile(nearbySearchJson) }}';
  31.         {% endif %}
  32.         _config.acommodationMapHideBusinesses = {{ demi_core_configuration('getMapHideBusinesses', {}) ? 'true' : 'false' }}
  34.     </script>
  37.     {# Json Map Datenjs-room-selection__price-detail-content #}
  38.     {% set mapPoiJson = demi_demiUrl({
  39.         'path' : document.getFullPath() | trim ('/', 'left') }, 'demi_map_poi_json') %}
  41.     {% set accoTeaserLink = demi_demiUrl({
  42.         'path' : document.getFullPath() | trim ('/', 'left') }, 'demi_compact_teaser') %}
  44.     <script type="text/javascript" data-cookieconsent="ignore">
  45.         {% if searchParam and searchParam.getOrderRandSeed() %}
  46.         _config.urlParams = _config.urlParams || [];
  47.         _config.urlParams.push({name: "randSeed", value: "{{ searchParam.getOrderRandSeed() }}"});
  48.         {% endif %}
  50.         {# // -> JS Config für die Suche und die Liste #}
  51.         _config.accoList = true;
  52.         _config.accoListUrl = '';
  53.         _config.accoListIsPackageList = {{ isPackageSearch ? 'true' : 'false' }};
  55.         {# // -> JS Config für die map #}
  56.         _config.accommodationMap = true;
  57.         _config.accommodationMapPoisUrl = '{{ mapPoiJson }}';
  58.         _config.accommodationMapInfoboxUrl = '{{ accoTeaserLink }}';
  60.         _config.historyController = true;
  61.     </script>
  64.     {# Main #}
  65.     {% if document.getProperty("demi_housePackageContainer") or document.getProperty("demi_housePackageContainer") %}
  66.         {% set listType = document.getProperty("demi_housePackageContainer") ?: document.getProperty("demi_housePackageMasterSelfAssign") %}
  67.         {% set hasPackageContainer = true %}
  70.         {{ include('@ElementsDemiFrontend/Includes/elements/package-list-info.desktop.html.twig', {
  71.             "searchParam" : searchParam,
  72.             "listType" : listType
  73.         }) }}
  74.     {% endif %}
  77.     {{ include('@ElementsDemiFrontend/Includes/elements/search-info.desktop.html.twig', {
  78.         "searchParam" : searchParam,
  79.         "availabilityIsChecked" : availabilityIsChecked,
  80.         "isSearch" : true,
  81.         "noDate" : noDate,
  82.         "hasPackageContainer" : hasPackageContainer ?? false
  83.     }) }}
  85.     {{ include('@ElementsDemiFrontend/Includes/elements/filter-bar.desktop.html.twig', {
  86.         'filterSnippet' : pimcore_relation('filterSnippet').getData(),
  87.         'noDate' : noDate,
  88.         'searchParam' : searchParam,
  89.         'minPrice' : minPrice,
  90.         'maxPrice' : maxPrice,
  91.         'isSearch' : false
  92.     }) }}
  94.     <div class="list-with-map-container">
  95.         <div class="list__items-container js-acco-list-container {{ showMap ? '' : 'is-full-width' }}" id="list">
  96.             <div hidden>
  97.                 {{ include('@ElementsDemiFrontend/Accommodation/lightboxTopbar.html.twig') }}
  98.             </div>
  99.             {{ include('@ElementsDemiFrontend/Snippet/filterSidebar/sorting.desktop.html.twig', {
  100.                 'searchParam' : searchParam,
  101.                 'totalCount' : paginator.getTotalItemCount()
  102.             }) }}
  104.             {% endif %}
  105.             {% if editmode %}
  106.                 {{ include('@ElementsDemiFrontend/List/includes/editmode.html.twig') }}
  107.                 <div class="mb-4">
  108.                     <div class="alert alert-warning">
  109.                         {{ include('@ElementsDemiFrontend/List/includes/list-footer.html.twig') }}
  110.                     </div>
  111.                 </div>
  112.             {% else %}
  114.             <div class="acco-list js-acco-list" role="alert" aria-live="assertive">
  116.                 <div class="text-center my-5 js-acco-list__loading" hidden>
  117.                     {{ include('@ElementsDemiFrontend/Includes/elements/spinner/loading-spinner.html.twig') }}
  118.                 </div>
  120.                 <div class="js-acco-list__content">
  121.                     {% if searchParam.getProductIds() is empty and (document.getProperty("demi_housePackageContainer") or document.getProperty("demi_housePackageContainer")) %}
  122.                         {{ 'demi.detail.no-packages' | trans }}
  123.                     {% else %}
  124.                         {{ include('@ElementsDemiFrontend/List/list-content.html.twig', {
  125.                             'accommodationPaginator' : paginator,
  126.                             'searchError' : searchError ?? null,
  127.                             'error' : error
  128.                         }) }}
  129.                     {% endif %}
  130.                 </div>
  131.             </div>
  133.             {# Preis info #}
  134.             {{ include('@ElementsDemiFrontend/Includes/elements/price-info.html.twig',
  135.                 {"searchParameter" : searchParam }) }}
  137.             {# Alternative Sucheergebnisse wenn in der oberen Liste zu wenig gefunden wurde. #}
  138.             {{ include('@ElementsDemiFrontend/List/includes/acco-list-alternative-search.html.twig') }}
  140.             <section>
  141.                 {% set contactSnippet = demi_core_configuration('getContactSnippet', {}) %}
  142.                 {% if contactSnippet is not null %}
  143.                     <hr class="hr--border-gray my-4">
  144.                     {{ pimcore_inc(contactSnippet) }}
  145.                 {% endif %}
  146.             </section>
  148.             <div>
  149.                 {{ include('@ElementsDemiFrontend/List/includes/list-footer.html.twig') }}
  150.             </div>
  151.         </div>
  154.         {# -> Ausgabe der Map #}
  156.         {% if isMapAllowed %}
  157.             <div class="js-accommodation-map accommodation-map" {{ showMap ? '' : 'hidden' }}>
  158.                 <div class="js-accommodation-map__canvas accommodation-map__canvas">
  159.                     <div class="pt-5 mt-5 text-center">
  160.                         <div class="mt-5">
  161.                             {{ include('@ElementsDemiFrontend/Includes/elements/spinner/loading-spinner.html.twig') }}
  162.                         </div>
  163.                     </div>
  164.                 </div>
  167.                     <div
  168.                         class="accommodation-map__controls accommodation-map__controls--top-right {{ demi_core_configuration('getSortingNearbySearch', {}) ? 'accommodation-map__controls--drawing' : '' }}">
  169.                         <div
  170.                             class="map-tooltip map-tooltip--left {{ demi_core_configuration('getSortingNearbySearch', {}) ? 'map-tooltip--bottom-left-md-down' : '' }} js-draw-on-map__tooltip"
  171.                             aria-hidden="true">
  172.                             {{ "demi.list.map.draw-area" | trans }}
  173.                         </div>
  175.                         <button type="button"
  176.                                 class="btn btn-white accommodation-map__control accommodation-map__control--w-a js-draw-on-map__clear {{ demi_core_configuration('getSortingNearbySearch', {}) ? 'accommodation-map__clear-btn' : '' }} mr-2"
  177.                                 hidden aria-hidden="true">
  178.                             {{ "demi.list.map.remove-area" | trans }}
  179.                         </button>
  181.                         <button type="button" class="btn btn-primary accommodation-map__control js-draw-on-map"
  182.                                 aria-hidden="true">
  183.                             <span class="demi-icon demi-icon-draw-on-map js-draw-on-map__start-drawing"></span>
  184.                             <span class="demi-icon demi-icon-close js-draw-on-map__cancel-drawing" hidden></span>
  185.                         </button>
  186.                     </div>
  187.                     <div class="accommodation-map__controls accommodation-map__controls--top-left">
  188.                         {% if demi_core_configuration('getSortingNearbySearch', {}) %}
  189.                             <div class="js-nearby-search-autocomplete nearby-search-autocomplete js-filter-form__autocomplete">
  190.                                 <div class="form-box">
  191.                                     <div class="row row--gutter-width-0">
  192.                                         <div class="col">
  193.                                             <label class="d-block" for="map-nearby">
  194.                                                 <script data-cookieconsent="ignore">
  195.                                                     _config.nearbySearch = true;
  196.                                                 </script>
  197.                                                 <span class="form-box__label">{{ 'demi.search.nearby-label' | trans }}</span>
  198.                                                 <input name="nearby"
  199.                                                        id="map-nearby"
  200.                                                        type="text"
  201.                                                        class="form-box__content form-control js-nearby-search-autocomplete__input"
  202.                                                        placeholder="{{ 'demi.search.nearby' | trans }}">
  203.                                             </label>
  204.                                         </div>
  205.                                         <div class="col-auto">
  206.                                             <button class="btn btn-primary form-box__addon-button js-nearby-search-autocomplete__my-location"
  207.                                                     type="button"
  208.                                                     title="{{ 'demi.search.nearby.my-location' | trans }}"
  209.                                                     aria-label="{{ 'demi.search.nearby.my-location' | trans }}">
  210.                                                 <span class="demi-icon demi-icon-target" aria-hidden="true"></span>
  211.                                             </button>
  212.                                         </div>
  213.                                     </div>
  214.                                 </div>
  215.                             </div>
  216.                         {% endif %}
  217.                     </div>
  219.                 <div class="accommodation-map__controls btn-group-vertical">
  220.                     <button type="button" class="btn accommodation-map__control js-accommodation-map__zoom-in btn-white"
  221.                             aria-label="{{ 'sr.demi.map.vergrößern' | trans }}">
  222.                         <span class="demi-icon demi-icon-plus"></span>
  223.                     </button>
  224.                     <button type="button"
  225.                             class="btn accommodation-map__control js-accommodation-map__zoom-out btn-white"
  226.                             aria-label="{{ 'sr.demi.map.verkleinern' | trans }}">
  227.                         <span class="demi-icon demi-icon-minus"></span>
  228.                     </button>
  229.                 </div>
  230.                 <div hidden>
  231.                     <div class="js-accommodation-map__detail" role="alert" aria-live="assertive">
  232.                         <div class="js-accommodation-map__detail-loading">
  233.                             <div class="text-center p-3">
  234.                                 {{ include('@ElementsDemiFrontend/Includes/elements/spinner/loading-spinner.html.twig', {
  235.                                     'styleModifier' : 'mb-2'
  236.                                 }) }}
  237.                             </div>
  238.                         </div>
  239.                     </div>
  240.                 </div>
  241.             </div>
  242.         {% endif %}
  243.         {% endif %}
  244.     </div>
  248.     <div class="btn-group list-toggle d-lg-none" role="group">
  249.         {% if isMapAllowed %}
  250.             <button type="button" class="btn btn-default list-toggle__btn js-toggle-map-style fz16">
  251.                 <span class="js-toggle-map-style__show-map"><span
  252.                         class="btn__icon demi-icon demi-icon-map mr-2"></span>{{ "demi.list.map" | trans }}</span>
  253.                 <span class="js-toggle-map-style__show-list" hidden><span
  254.                         class="btn__icon demi-icon demi-icon-arrow-left mr-2"></span>{{ "demi.list.list" | trans }}</span>
  255.             </button>
  256.         {% endif %}
  258.         <button type="button" class="btn btn-default list-toggle__btn js-sidebar__toggle fz16"
  259.                 data-target="#filter-sidebar" aria-label="icon-btn" title="icon-btn">
  260.             <span class="btn__icon demi-icon demi-icon-filter mr-2 icon-in-text"></span>{{ "demi.list.filter" | trans }}
  261.         </button>
  262.     </div>
  263. {% endblock %}