src/Elements/Bundle/DemiFrontendBundle/Resources/views/Brochure/includes/brochure-teaser.html.twig line 1

Open in your IDE?
  1. {# @var brochure \Elements\Demi\Model\ShopItem #}
  2. {% set variants = brochure.getVariants() %}
  3. {% set currentVariant = null %}
  4. {% set isHorizontal = pimcore_checkbox('isHorizontal').getValue() %}
  6. {% set firstImageUrl = demi_demiUrl({
  7.     'path': 'demi',
  8.     'objectId': brochure.getId(),
  9.     'thumbnail': isHorizontal ? 'demi-prospekt-teaser-horizontal' : 'demi-prospekt-teaser',
  10.     'dateFrom':  carbon().create().getTimestamp()
  11. }, 'demi_image', true) %}
  13. {% set links = brochure.getLinks() ? brochure.getLinks().getItems() : [] %}
  15. {% if links|length > 0 %}
  16.     {% set links = demi_sortLinks(links) %}
  17. {% endif %}
  19. <script type="application/javascript" data-cookieconsent="ignore">
  20.     _config.brochuresBookable = _config.brochuresBookable || [];
  23.     _config.brochuresBookable[{{ brochure.getId() }}] = {
  24.         {% for variant in variants %}
  25.                 '{{ variant.getVariationLanguage() }}':  {{ (not variant.getIsNotBookable() and variant.getStock() > 0) ? 'true' : 'false' }} ,
  26.         {% endfor %}
  27.     };
  29. </script>
  31. {% if not selectedLanguage|default(false)%}
  32.     {% set selectedLanguage = app.request.locale %}
  33. {% endif %}
  35. <li class="{{ isHorizontal ? 'col-12' : 'col-xl-3 col-sm-4 col-6 border-right' }} mb-4 js-prospekt-selection__item prospekt-teaser"
  36.     data-prospekt-id="{{ brochure.getId() }}">
  37.     <section class="{{ isHorizontal ? 'row row--gutter-width-20': 'd-flex flex-column justify-content-between h-100' }}">
  38.         {%  if isHorizontal and pimcore_device().isPhone() %}
  39.             <div class="col-12">
  40.                 <h6 class="text-primary fz18">{{ brochure.getName(currentLanguage) }} {{ elements_debug_mode() ? "(oid "~ brochure.getId() ~ ")" : ""  }}</h6>
  41.             </div>
  42.         {% endif %}
  44.         <div class="{{ isHorizontal ? 'col-5 col-sm-3': ''}}">
  45.             <div class="{{ isHorizontal ? 'bg-light-gray p-1': '' }}">
  46.                 <figure class="embed-responsive embed-responsive-{{ isHorizontal ? '3by2': '16by9'}}">
  47.                     <div class="embed-responsive-item center-container">
  48.                         <span class="center-container__item-wrapper">
  49.                             <img data-src="{{ firstImageUrl }}"
  50.                                  class="center-container__item js-lazy-img js-lazy-img--img lazy-img"
  51.                                  alt="{{ brochure.getName(currentLanguage) }}"/>
  53.                             {% do jsConfig().add('lightbox', true) %}
  54.                             
  55.                             {% set gallerySrcUrl = demi_demiUrl({
  56.                                 'path': 'demi',
  57.                                 'objectId': brochure.getId(),
  58.                                 'thumbnail': 'demi-prospekt-gallery',
  59.                                 'thumbSmall': 'demi-prospekt-gallery-small',
  60.                                 'dateFrom':  ''
  61.                             }, 'demi_images') %}
  63.                             <button type="button"
  64.                                     class="btn-show-gallery btn-show-gallery--small btn-no-styling js-lightbox-group-dyn js-tracking--click-piwik"
  65.                                     aria-label="{{ 'demi.detail.open-gallery'|trans }}"
  66.                                     title="{{ 'demi.detail.open-gallery'|trans }}"
  67.                                     data-lightbox-id="lightbox-{{ brochure.getId() }}"
  68.                                     data-lightbox-src-url="{{ gallerySrcUrl }}"
  69.                                     data-tracking-category="Brochure list"
  70.                                     data-tracking-action="open gallery">
  71.                                 <span class="js-lightbox-group-dyn__icon demi-icon demi-icon-search btn-show-gallery__icon"
  72.                                       aria-hidden="true"></span> <span class="js-lightbox-group-dyn__loading"
  73.                                                                        hidden> <span class="text-center d-block">
  74.                                         <span class="circle-spinner circle-spinner--white"
  75.                                               aria-label="{{ 'demi.content-loading'|trans }}"
  76.                                               title="{{ 'demi.content-loading'|trans }}"></span>
  77.                                     </span>
  78.                                 </span>
  79.                             </button>
  80.                         </span>
  81.                     </div>
  82.                 </figure>
  84.                 {% if not isHorizontal %}
  85.                     <h6 class="text-primary text-center my-2 fz15">{{ brochure.getName(currentLanguage) }} {{ elements_debug_mode() ? "(oid "~ brochure.getId() ~ ")" : ""  }}</h6>
  86.                 {% endif %}
  87.             </div>
  88.         </div>
  90.         {% if isHorizontal %}
  91.             <div class="col-7 col-sm-6">
  92.                 {% if pimcore_device().isPhone() %}
  94.                     {% do jsConfig().add('expandable', true) %}
  95.              
  96.                     <div class="js-expandable expandable-block">
  98.                         <div class="expandable-block__content-wrapper js-expandable__content-wrapper expandable-block__content-wrapper--small">
  99.                             <div class="js-expandable__content expandable-block__content">
  100.                                 <div class="wysiwyg">
  101.                                     {% set descriptions = brochure.getDescriptions(carbon().create()) %}
  102.                                     {% if descriptions is iterable %}
  103.                                         {% for description in descriptions %}
  104.                                             {% if description.getDescriptionLanguage() == currentLanguage %}
  105.                                                 {{ description.getText()|raw }}
  106.                                             {% endif %}
  107.                                         {% endfor %}
  108.                                     {% endif %}
  109.                                 </div>
  110.                                 <ul class="list-unstyled">
  111.                                     {% for link in links  %}
  112.                                         {% set tmpUrl = demi_findNiceUrl(link.getUrl()|escape) %}
  113.                                         {% set name = link.getNameLocalized(currentLanguage) ? link.getNameLocalized(currentLanguage) : link.getName() %}
  114.                                         {% if tmpUrl is not empty %}
  115.                                             <li><a class="text-underline text-primary" target="_blank" href="{{ tmpUrl }}">{{ name|escape }}</a></li>
  116.                                         {% endif %}
  117.                                     {% endfor %}
  118.                                 </ul>
  119.                             </div>
  120.                         </div>
  122.                         <div class="expandable-block__more js-expandable__more text-right">
  123.                             <button type="button" class="btn-no-styling text-primary font-medium fz15">
  124.                                 {{ 'demi.detail.read-more'|trans }}
  125.                                 <span class="demi-icon demi-icon-chevron-down icon-in-text ml-2" aria-hidden="true"></span>
  126.                             </button>
  127.                         </div>
  128.                     </div>
  129.                 {% else %}
  130.                     <h6 class="text-primary fz18">{{ brochure.getName(currentLanguage) }}  {{ elements_debug_mode() ? "(oid "~ brochure.getId() ~ ")" : ""  }}</h6>
  131.                     <div class="wysiwyg">
  132.                         {% set descriptions = brochure.getDescriptions(carbon().create()) %}
  133.                         {% if descriptions is iterable %}
  134.                             {% for description in descriptions %}
  135.                                 {% if description.getDescriptionLanguage() == currentLanguage %}
  136.                                     {{ description.getText()|raw }}
  137.                                 {% endif %}
  138.                             {% endfor %}
  139.                         {% endif %}
  140.                     </div>
  141.                     <ul class="list-unstyled">
  142.                         {% for link in links  %}
  143.                             {% set tmpUrl = demi_findNiceUrl(link.getUrl()|escape) %}
  144.                             {% set name = link.getNameLocalized(currentLanguage) ? link.getNameLocalized(currentLanguage) : link.getName() %}
  145.                             {% if tmpUrl is not empty %}
  146.                                 <li><a class="text-underline text-primary" target="_blank" href="{{ tmpUrl }}">{{ name|escape }}</a></li>
  147.                             {% endif %}
  148.                         {% endfor %}
  149.                     </ul>
  150.                 {% endif %}
  151.             </div>
  152.         {% endif %}
  154.         <div class="mt-2 mt-sm-0 {{ isHorizontal ? 'col-12 col-sm-3': '' }} ">
  155.             <label class="form-box form-box--gray mb-2">
  156.                 <span class="form-box__label sr-only">{{ 'demi.brochures.language'|trans }}</span>
  157.                 <select name="language" class="form-box__content form-control js-prospekt-selection__lang" {{ variants|length <= 1 ? 'disabled' : '' }}>
  158.                     {# @var variant \Elements\Demi\Model\ShopItem #}
  159.                     {% for variant in variants %}
  160.                         {% set downloadDocument = variant.getDownloadDocument() %}
  161.                         {% set downloadUrl = downloadDocument ? demi_demiUrl({
  162.                             'id': downloadDocument.getId(),
  163.                             'filenameOverride': (brochure.getName(variant.getVariationLanguage()) ~ "_" ~ variant.getVariationLanguage() ~ ".pdf")|url_encode
  164.                         }, 'demi_download', true) : '' %}
  166.                         {% set language = demi_getClassByStringAndIdentifier("\\Elements\\Demi\\Model\\Language", "getByFid", variant.getVariationLanguage(), 1) %}
  167.                         {% set currentVariant = language.getFid() == selectedLanguage ? variant : currentVariant %}
  168.                         {% if language is not null %}
  169.                             <option value="{{ language.getFid() }}"
  170.                                     data-href="{{ downloadUrl }}"
  171.                                     data-offerId="{{ variant.getId() }}"
  172.                                 {{ language.getFid() == selectedLanguage ? 'selected' : ''}}>
  173.                                 {{ language.getName(currentLanguage) }}
  175.                             </option>
  176.                         {% endif %}
  177.                     {% endfor %}
  178.                     {% set currentVariant = (currentVariant is empty and variants|length > 0) ? variants[0] : currentVariant %}
  179.                 </select>
  181.                 {% if variants|length > 1 %}
  182.                     <span class="demi-icon demi-icon-chevron-down form-box__select-icon" aria-hidden="true"></span>
  183.                 {% endif %}
  184.             </label>
  186.             {% if currentVariant is not null %}
  187.                 {% do jsConfig().add('tracking', true) %}
  189.                 {% set downloadDocument = currentVariant.getDownloadDocument() %}
  190.                 {% set downloadUrl = downloadDocument ? demi_demiUrl({
  191.                             'id': downloadDocument.getId(),
  192.                             'filenameOverride': (brochure.getName(currentVariant.getVariationLanguage()) ~ "_" ~ currentVariant.getVariationLanguage() ~ ".pdf")|url_encode
  193.                  }, 'demi_download', true) : '' %}
  195.                 <a href="{{ downloadUrl }}"
  196.                    class="btn btn-default btn-block text-left mb-2 js-prospekt-selection__item-download js-tracking js-tracking--click"
  197.                    target="_blank"
  198.                    data-tracking-category="Klick Prospekte"
  199.                    data-tracking-action="Download "
  200.                    data-tracking-label="{{ brochure.getName(currentLanguage) }}">
  201.                     <span class="btn__icon demi-icon demi-icon-star mr-1" aria-hidden="true"></span>
  202.                     {{ 'demi.brochures.download'|trans }}
  203.                 </a>
  204.             {% endif %}
  206.             {% set viewUrl = null %}
  207.             {% set viewName = null %}
  208.             {% set links = currentVariant.getLinks() %}
  209.             {% if links is empty %}
  210.                 {% set links = brochure.getLinks() %}
  211.             {% endif %}
  212.             {% if links is not empty %}
  213.                 {% set items = links.getItems() %}
  214.                 {% if items is iterable %}
  215.                     {% for item in items %}
  216.                         {% if item.getLinkType == 1 %}
  217.                         {% set viewUrl = item.getUrl() %}
  218.                         {% set viewName = item.getName() %}
  219.                         {% endif %}
  220.                     {% endfor %}
  221.                 {% endif %}
  222.             {% endif %}
  224.             {% if viewUrl is not null %}
  225.                 <a href="{{ viewUrl }}"
  226.                    class="btn btn-default btn-block text-left mb-2  js-tracking js-tracking--click"
  227.                    target="_blank"
  228.                    data-tracking-category="Klick Prospekte"
  229.                    data-tracking-action="View"
  230.                    data-tracking-label="{{ viewName|escape }}">
  231.                     <span class="btn__icon demi-icon demi-icon-visibility mr-1" aria-hidden="true"></span>
  232.                     {{ 'demi.brochures.view'|trans }}
  233.                 </a>
  234.             {% endif %}
  236.             {% if currentVariant is not null and not currentVariant.getIsNotBookable() and not demi_core_configuration('getIsWhiteLabel', [])%}
  237.                 {{ include('@ElementsDemiFrontend/Includes/elements/buttons/toggle-button.html.twig', {
  238.                     'type': 'checkbox',
  239.                     'name': 'prospekte[]',
  240.                     'isBlock': true,
  241.                     'value': brochure.getId(),
  242.                     'icon': 'check-circle',
  243.                     'text': 'demi.brochures.select'|trans,
  244.                     'isHighlighted': true,
  245.                     'hasIcon': true,
  246.                     'styleModifier': 'js-prospekt-selection__checkbox',
  247.                     'classes': ['toggle-btn--highlighted'],
  248.                     'dataAttr': 'data-offerId=' ~ (currentVariant is not null ? currentVariant.getId() : null)
  249.                 }) }}
  250.             {% endif %}
  251.         </div>
  252.     </section>
  254.     {% if isHorizontal %}
  255.         <hr class="{{ pimcore_device().isPhone() ? 'container-break' : 'mx--4' }}">
  256.     {% endif %}
  257. </li>