src/Package/Openform/Front/Templates/RelictPack/_templates/template-o9.html.twig line 1

Open in your IDE?
  1. {% from '@openform_front_templates/_includes/_icons.html.twig' import fullscreen, zoomin, zoomout, sliderprev, slidernext, arrowright, info, copyrights, info, infoClose %}
  2. {% set ImageSlides = entity.ImageSlide|filterVisibles(app.request.locale) %}
  3. <div class="collections__wrapper" style="background: {{entity.background|default('#F5DB7B') }}; width: {{entity.textAreaWidth|default('35')}}%; {% if not entity.showHeader %}padding-top:90px;{% endif %}" data-lenis-prevent>
  4.     <div class="collections__content">
  5.         {% if entity.Translation[app.request.locale].titleHtml is defined and entity.Translation[app.request.locale].titleHtml %}
  6.             <div class="collections__content__title block__h3">
  7.                 {{ entity.Translation[app.request.locale].titleHtml|raw }}
  8.             </div>
  9.         {% endif %}
  10.         {% if entity.Translation[app.request.locale].attributesText is defined and entity.Translation[app.request.locale].attributesText %}
  11.             <div class="collections__content__text block__text">
  12.                 {{ entity.Translation[app.request.locale].attributesText|raw }}
  13.             </div>
  14.         {% endif %}
  15.         {% if entity.link is defined and entity.link %}
  16.                 <a href="{{entity.link}}" class="block-text__btns__btn button-read-more button-read-more--black">
  17.                     <span>{{('T_RELICT_LINK')|trans({}, 'openform_front', app.request.locale)}}</span>
  18.                     {{arrowright()}}
  19.                 </a>
  20.         {% endif %}
  21.         {% if entity.Translation[app.request.locale].text is defined and entity.Translation[app.request.locale].text %}
  22.             <div class="collections__content__text block__text">
  23.                 {{ entity.Translation[app.request.locale].text|raw }}
  24.             </div>
  25.         {% endif %}
  26.         {% if entity.filePath is defined and entity.filePath and openform_front_util.isMp3File(entity.filePath) %}
  27.             <div class="block-image__image__audio">
  28.                 <div class="block-audio__player">
  29.                     <audio controls class="js-audio-player block-audio__inner">
  30.                         <source src="{{ entity.filePath }}">
  31.                         Your browser does not support the audio element.
  32.                      </audio>
  33.                 </div>
  34.             </div>
  35.         {% endif %}
  36.         {% if entity.Translation[app.request.locale].description is defined and entity.Translation[app.request.locale].description %}
  37.             <div class="collections__content__text block__text">
  38.                 {{ entity.Translation[app.request.locale].description|raw }}
  39.             </div>
  40.         {% endif %}
  41.         
  42.         
  43.     </div>
  44. </div> 
  45. <div class="collections__arrows">
  46.     {% for key, Relict in entity.RelictPack.getVisibleRelicts(app.request.locale) %}
  47.                 {% if entity.id == Relict.id  %}
  48.                     {% if entity.RelictPack.getVisibleRelicts(app.request.locale)[key - 1] is defined %}
  49.                         {% set prevElement = entity.RelictPack.getVisibleRelicts(app.request.locale)[key - 1] %}
  50.                         {% set href = toolkit_route_localizer.generate('relict_item',{ slug : prevElement.Translation[app.request.locale].slug }, app.request.locale) %}
  51.                         <a href="{{href}}" class="slider-nav__btn slider-nav__btn--prev">
  52.                             {{ sliderprev('PREV_Relict'|trans({}, 'openform_front', app.request.locale)) }}
  53.                         </a>
  54.                     {% endif%}
  55.                     {% if entity.RelictPack.getVisibleRelicts(app.request.locale)[key + 1] is defined %}
  56.                         {% set nextElement = entity.RelictPack.getVisibleRelicts(app.request.locale)[key + 1] %}
  57.                         {% set href = toolkit_route_localizer.generate('relict_item',{ slug : nextElement.Translation[app.request.locale].slug }, app.request.locale) %}
  58.                         <a href="{{href}}" class="slider-nav__btn slider-nav__btn--next">
  59.                             {{ slidernext('Next_Relict'|trans({}, 'openform_front', app.request.locale)) }}
  60.                         </a>
  61.                     {% endif%}
  62.                 {% endif %}
  63.     {% endfor %}
  64. </div>
  65. <div class="collections__wrapper" style="width: {{entity.textAreaWidth ? 'calc(100% - ' ~ entity.textAreaWidth ~ '%)' : '65%'}};"> <div class="object__gallery__splide collection-gallery js-collection-gallery-standard" style="height: 100%; background: {{entity.imageBackgroundColor|default('#F8F7F0') }};">
  66.                             {% if ImageSlides|length > 0 %}
  67.                             <div class="splide js-collections-gallery-o9 collection-gallery__gallery" style="height: 100%;">
  68.                                 <div class="splide__track">
  69.                                     <ul class="splide__list">
  70.                                         {% for key, image in ImageSlides %}
  71.                                             {% set img = openform_front_util.getImagePathByType(image.Thumb ?? '','original') %}
  72.                                             {# {% set img = openform_front_util.getImagePathByType(image.Thumb ?? '','temp11') %}
  73.                                             {% set imgPagination = openform_front_util.getImagePathByType(image.Thumb ?? '','list') %} #}
  74.                                             <li class="splide__slide">
  75.                                                 
  76.                                                 <div class="js-zoom" data-alt="{{image.Translation[app.request.locale].alt}}" style=" height: 100%;">
  77.                                                     {% if entity.imageHeaderStat %}
  78.                                                         <div class="collection-gallery__head" style="color: {{entity.imageHeaderTextColor|default('#231F17')}}; background:{{entity.imageHeaderBackgroundColor|default('#F8F7F0')}}; {% if not entity.showHeader %}padding-top:90px; height: 178px;{% endif %}">
  79.                                                             {% for key, Relict in entity.RelictPack.getVisibleRelicts(app.request.locale) %}
  80.                                                                 {% if entity.id == Relict.id  %}
  81.                                                                 
  82.                                                                     {% if entity.RelictPack.getVisibleRelicts(app.request.locale)|length > 0 %}
  83.                                                                         <div class="collections__arrows__numbers">
  84.                                                                             <span>{{ key + 1 }}</span>/{{ entity.RelictPack.getVisibleRelicts(app.request.locale) is defined ? entity.RelictPack.getVisibleRelicts(app.request.locale)|length }}
  85.                                                                         </div>
  86.                                                                     {% endif %}
  87.                                                                     
  88.                                                                 {% endif %}
  89.                                                             {% endfor %}
  90.                                                         </div>
  91.                                                     {% endif %}
  92.                                                     
  93.                                                     <div class="collection-gallery__item" style="{% if entity.imageHeaderStat %}height: calc(100% - 88px); max-height: (100% - 88px);{% elseif not entity.showHeader %}height:calc(100% - 178px);{% else %}height: 100%; max-height: 100%;{% endif %}  display: flex; align-items: center; justify-content: center;">
  94.                                                         <div style="{{image.imageWidth ? 'width:' ~ image.imageWidth ~ '%;' : 'width: 100%;'}}
  95.                                                 {{image.imageHeight ? 'height:' ~ image.imageHeight ~ '%;' : 'height: 100%;'}}
  96.                                                 {{image.imageWidth ? 'max-width:' ~ image.imageWidth ~ '%;' : 'max-width: 100%;'}}
  97.                                                 {{image.imageHeight ? 'max-height:' ~ image.imageHeight ~ '%;' : 'max-height: 100%;'}}">
  98.                                                  <style>
  99.                                                     .my-zoomist-{{key}} img{
  100.                                                         {% if image.imageBorderColor and image.imageBorderWidth %}border: {{image.imageBorderColor}} solid {{image.imageBorderWidth}}px;{% endif %}"
  101.                                                     }
  102.                                                     .my-zoomist-{{key}} .zoomist-wrapper{
  103.                                                         background:{{image.imageBackgroundColor ? image.imageBackgroundColor : entity.imageBackgroundColor ? entity.imageBackgroundColor : '#F8F7F0' }};
  104.                                                     }
  105.                                                  </style>
  106.                                                             <div class="my-zoomist my-zoomist-{{key}}" data-zoomist-src="{{img}}" tabindex="0"></div>
  107.                                                         </div>
  108.                                                     </div>
  109.                                                 
  110.                                                     <div class="collection-gallery__wrap" >
  111.                                                         <div class="collection-gallery__buttons">
  112.                                                             {% if image.Translation[app.request.locale].text is defined and image.Translation[app.request.locale].text %}
  113.                                                                 <div class="object__info-wrap">
  114.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-info-{{key}}" tabindex="0">{{info(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  115.                                                                     <div class="object__info object__info--info js-info-{{key}}" data-lenis-prevent>
  116.                                                                         <div class="object__info__text block__text">{{image.Translation[app.request.locale].text|raw}}</div>
  117.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  118.                                                                     </div>
  119.                                                                 </div>
  120.                                                             {% endif %}
  121.                                                             {% if image.Translation[app.request.locale].copyrights %}
  122.                                                                 <div class="object__info-wrap">
  123.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-copyright-{{key}}" tabindex="0">{{copyrights(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  124.                                                                     <div class="object__info object__info--copyright js-copyright-{{key}}" data-lenis-prevent>
  125.                                                                         <div class="object__info__text block__text">{{image.Translation[app.request.locale].copyrights|raw}}</div>
  126.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  127.                                                                     </div>
  128.                                                                 </div>
  129.                                                             {% endif %}
  130.                                                             <button class="collection-gallery__buttons__btn js-fullscreen" data-alt="{{image.Translation[app.request.locale].alt}}" tabindex="0" data-color="{{image.imageBackgroundColor is defined and image.imageBackgroundColor ? image.imageBackgroundColor }}"
  131.                                                                 data-image="{{img}}"
  132.                                                                 data-description="{{image.Translation[app.request.locale].text}}"
  133.                                                                 data-copyrights="{{image.Translation[app.request.locale].copyrights}}"
  134.                                                                 data-start="{{key}}"
  135.                                                                         data-imagestyle="{% if image.imageBorderColor and image.imageBorderWidth %}border: {{image.imageBorderColor}} solid {{image.imageBorderWidth}}px;{% endif %}"
  136.                                                             >
  137.                                                                 {{fullscreen(('T_FULLSCREEN')|trans({}, 'openform_front', app.request.locale))}}
  138.                                                             </button>
  139.                                                             <button class="collection-gallery__buttons__btn js-zoom-out">{{zoomout(('T_ZOOMOUT')|trans({}, 'openform_front', app.request.locale))}}</button>
  140.                                                             <button class="collection-gallery__buttons__btn js-zoom-in">{{zoomin(('T_ZOOMIN')|trans({}, 'openform_front', app.request.locale))}}</button>
  141.                                                         </div>
  142.                                                     </div>
  143.                                                 </div>
  144.                                             </li>    
  146.                                             
  147.                                         {% endfor %}                               
  148.                                     </ul>
  149.                                     
  150.                                 </div>
  151.                             </div>
  152.                             
  153.                         </div>
  154.                     {% endif %}
  155.     </div> 
  156.                             
  157.     
  158. </div>
  159.                                             </div>
  160.                                       
  161.                          
  165. </div>