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

Open in your IDE?
  1. {% from '@openform_front_templates/_includes/_icons.html.twig' import fullscreen, zoomin, zoomout, arrowObjectPrev, arrowObjectNext, arrowright, info, copyrights, infoClose %}
  2. {% set ImageSlides = entity.ImageSlide|filterVisibles(app.request.locale) %}
  3. <div style="{% if not entity.showHeader %}height:100vh; padding-top:{{rootParent is defined and rootParent.headerHeight is defined and rootParent.headerHeight ? rootParent.headerHeight : 90}}px; {% elseif rootParent is defined and rootParent.headerHeight is defined and rootParent.headerHeight %}height: calc(100vh - {{rootParent.headerHeight}}px);{% else %} height: calc( 100vh - 90px );{% endif %}">
  4.     <div class="collections__container" style="height: {{entity.lineHeight ? 100 - entity.lineHeight : 91}}%; padding: 2% 0;">
  5.     <div class="collections__container__wrapper" style="margin:{{entity.isInvertedTemplate is defined and entity.isInvertedTemplate ? '0 1.75% 0 0' : '0 0 0 1.75%' }}; width: {{entity.imageColumnWidth ? 100 - entity.imageColumnWidth  : '51'}}%">
  6.         {% if ImageSlides|length > 0 %}
  7.          <div class="collections__wrapper" style="height: {{entity.heightTop|default('61') }}%; background: {{entity.imageBackgroundColor|default('#F8F7F0') }};r">                    
  8.                                         {% set data = ImageSlides[0] %}   
  9.                                         {% set img = openform_front_util.getImagePathByType(data.Thumb ?? '','original') %}
  10.                                         {# {% set img = openform_front_util.getImagePathByType(data.Thumb ?? '','detal') %}
  11.                                         {% set imgPagination = openform_front_util.getImagePathByType(data.Thumb ?? '','list') %} #}
  13.                                                <div class="js-zoom" data-alt="{{data.Translation[app.request.locale].alt}}" style="height: 100%; display:flex; justify-content: center; align-items: center;">
  14.                                                 <div class="collection-gallery__item" style="{{data.imageWidth ? 'width:' ~ data.imageWidth ~ '%;' : 'width: 100%;'}}
  15.                                                 {{data.imageHeight ? 'height:' ~ data.imageHeight ~ '%;' : 'height: 100%;'}}
  16.                                                 {{data.imageWidth ? 'max-width:' ~ data.imageWidth ~ '%;' : 'max-width: 100%;'}}
  17.                                                 {{data.imageHeight ? 'max-height:' ~ data.imageHeight ~ '%;' : 'max-height: 100%;'}}">
  18.                                                     <style>
  19.                                                         .my-zoomist-1 img{
  20.                                                             {% if data.imageBorderColor and data.imageBorderWidth %}border: {{data.imageBorderColor}} solid {{data.imageBorderWidth}}px;{% endif %}"
  21.                                                         }
  22.                                                         .my-zoomist-1 .zoomist-wrapper{
  23.                                                             background:{{data.imageBackgroundColor ? data.imageBackgroundColor : entity.imageBackgroundColor ? entity.imageBackgroundColor : '#F8F7F0' }};
  24.                                                         }
  25.                                                     </style>
  26.                                                     <div class="my-zoomist my-zoomist-1" data-zoomist-src="{{img}}"></div>
  27.                                                 </div>
  28.                                                 
  29.                                                 <div class="collection-gallery__wrap">
  30.                                                     <div class="collection-gallery__content block__text">
  31.                                                     </div>
  32.                                                     <style>
  33.                                                             {% if not data.Translation[app.request.locale].copyrights %}
  34.                                                                     .collection-gallery-buttons{{data.id}} .object__info--info::before {
  35.                                                                         left: 0px;
  36.                                                                     }
  37.                                                                 {% endif %}
  38.                                                             
  39.                                                     </style>
  40.                                                     <div class="collection-gallery__buttons collection-gallery-buttons{{data.id}}">
  41.                                                         {% if data.Translation[app.request.locale].text is defined and data.Translation[app.request.locale].text %}
  42.                                                                 <div class="object__info-wrap">
  43.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-info-1" tabindex="0">{{info(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  44.                                                                     <div class="object__info object__info--info js-info-1" data-lenis-prevent>
  45.                                                                         <div class="object__info__text block__text">{{data.Translation[app.request.locale].text|raw}}</div>
  46.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  47.                                                                     </div>
  48.                                                                 </div>
  49.                                                         {% endif %}
  50.                                                         {% if data.Translation[app.request.locale].copyrights %}
  51.                                                                 <div class="object__info-wrap">
  52.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-copyright-1" tabindex="0">{{copyrights(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  53.                                                                     <div class="object__info object__info--copyright js-copyright-1" data-lenis-prevent>
  54.                                                                         <div class="object__info__text block__text">{{data.Translation[app.request.locale].copyrights|raw}}</div>
  55.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  56.                                                                     </div>
  57.                                                                 </div>
  58.                                                         {% endif %}
  59.                                                         <button class="collection-gallery__buttons__btn js-fullscreen" data-alt="{{data.Translation[app.request.locale].alt}}" tabindex="0" data-color="{{data.imageBackgroundColor is defined and data.imageBackgroundColor ? data.imageBackgroundColor }}"
  60.                                                         data-image="{{img}}"
  61.                                                         data-description="{{data.Translation[app.request.locale].text}}"
  62.                                                         data-copyrights="{{data.Translation[app.request.locale].copyrights}}"
  63.                                                         data-start="0"
  64.                                                         data-imagestyle="{% if data.imageBorderColor and data.imageBorderWidth %}border: {{data.imageBorderColor}} solid {{data.imageBorderWidth}}px;{% endif %}"
  65.                                                         >
  66.                                                             {{fullscreen(('T_FULLSCREEN')|trans({}, 'openform_front', app.request.locale))}}
  67.                                                         </button>
  68.                                                         <button class="collection-gallery__buttons__btn js-zoom-out">{{zoomout(('T_ZOOMOUT')|trans({}, 'openform_front', app.request.locale))}}</button>
  69.                                                         <button class="collection-gallery__buttons__btn js-zoom-in">{{zoomin(('T_ZOOMIN')|trans({}, 'openform_front', app.request.locale))}}</button>
  70.                                                     </div>
  71.                                                 </div>
  72.                                             </div>
  73.         </div>
  74.         {% endif %}
  75.         <div class="collections__wrapper-content" style="background: {{entity.background|default('#F5DB7B') }}; width: 100%; height: {{entity.heightTop ? 100 - entity.heightTop : 39 }}%;" data-lenis-prevent>
  76.             <div class="collections__content">
  77.                 {% if entity.Translation[app.request.locale].titleHtml is defined and entity.Translation[app.request.locale].titleHtml %}
  78.                     <div class="collections__content__title block__h3">
  79.                         {{ entity.Translation[app.request.locale].titleHtml|raw }}
  80.                     </div>
  81.                 {% endif %}
  82.                 
  83.                 {% if entity.link is defined and entity.link %}
  84.                         <a href="{{entity.link}}" class="block-text__btns__btn button-read-more button-read-more--black">
  85.                             <span>{{('T_RELICT_LINK')|trans({}, 'openform_front', app.request.locale)}}</span>
  86.                             {{arrowright()}}
  87.                         </a>
  88.                 {% endif %}
  89.                 {% if entity.Translation[app.request.locale].text is defined and entity.Translation[app.request.locale].text %}
  90.                     <div class="collections__content__text block__text">
  91.                         {{ entity.Translation[app.request.locale].text|raw }}
  92.                     </div>
  93.                 {% endif %}
  94.                 {% if entity.filePath is defined and entity.filePath and openform_front_util.isMp3File(entity.filePath) %}
  95.                     <div class="block-image__image__audio">
  96.                         <div class="block-audio__player">
  97.                             <audio controls class="js-audio-player block-audio__inner">
  98.                                 <source src="{{ entity.filePath }}">
  99.                                 Your browser does not support the audio element.
  100.                             </audio>
  101.                         </div>
  102.                     </div>
  103.                 {% endif %}
  104.                 {% if entity.Translation[app.request.locale].description is defined and entity.Translation[app.request.locale].description %}
  105.                     <div class="collections__content__text block__text">
  106.                         {{ entity.Translation[app.request.locale].description|raw }}
  107.                     </div>
  108.                 {% endif %}
  109.                 {% if entity.Translation[app.request.locale].attributesText is defined and entity.Translation[app.request.locale].attributesText %}
  110.                     <div class="collections__content__text block__text">
  111.                         {{ entity.Translation[app.request.locale].attributesText|raw }}
  112.                     </div>
  113.                 {% endif %}
  114.                 
  115.             </div>
  116.         </div> 
  117.     </div>
  118.         {% if ImageSlides|length > 1 %}
  119.         <div class="collections__wrapper" style="width: {{entity.imageColumnWidth ? 100 - entity.imageColumnWidth : '49'}}%; background: {{entity.imageBackgroundColor|default('#F8F7F0') }}; margin: 0 1.75%;">                    
  120.                                         {% set data = ImageSlides[1] %}   
  121.                                         {% set img = openform_front_util.getImagePathByType(data.Thumb ?? '','original') %}
  122.                                         {# {% set img = openform_front_util.getImagePathByType(data.Thumb ?? '','detal') %}
  123.                                         {% set imgPagination = openform_front_util.getImagePathByType(data.Thumb ?? '','list') %} #}
  125.                                                <div class="js-zoom" data-alt="{{data.Translation[app.request.locale].alt}}" style="height: 100%; display:flex; justify-content: center; align-items: center;">
  126.                                                 <div class="collection-gallery__item" style="{{data.imageWidth ? 'width:' ~ data.imageWidth ~ '%;' : 'width: 100%;'}}
  127.                                                 {{data.imageHeight ? 'height:' ~ data.imageHeight ~ '%;' : 'height: 100%;'}}
  128.                                                 {{data.imageWidth ? 'max-width:' ~ data.imageWidth ~ '%;' : 'max-width: 100%;'}}
  129.                                                 {{data.imageHeight ? 'max-height:' ~ data.imageHeight ~ '%;' : 'max-height: 100%;'}}">
  130.                                                 <style>
  131.                                                     .my-zoomist-2 img{
  132.                                                         {% if data.imageBorderColor and data.imageBorderWidth %}border: {{data.imageBorderColor}} solid {{data.imageBorderWidth}}px;{% endif %}"
  133.                                                     }
  134.                                                     .my-zoomist-2 .zoomist-wrapper{
  135.                                                         background:{{data.imageBackgroundColor ? data.imageBackgroundColor : entity.imageBackgroundColor ? entity.imageBackgroundColor : '#F8F7F0' }};
  136.                                                     }
  137.                                                  </style>
  138.                                                     <div class="my-zoomist my-zoomist-2" data-zoomist-src="{{img}}"></div>
  139.                                                 </div>
  140.                                                 
  141.                                                 <div class="collection-gallery__wrap">
  142.                                                     <div class="collection-gallery__content block__text">
  143.                                                     </div>
  144.                                                     <style>
  145.                                                             {% if not data.Translation[app.request.locale].copyrights %}
  146.                                                                     .collection-gallery-buttons{{data.id}} .object__info--info::before {
  147.                                                                         left: 0px;
  148.                                                                     }
  149.                                                                 {% endif %}
  150.                                                             
  151.                                                     </style>
  152.                                                     <div class="collection-gallery__buttons collection-gallery-buttons{{data.id}}">
  153.                                                         {% if data.Translation[app.request.locale].text is defined and data.Translation[app.request.locale].text %}
  154.                                                                 <div class="object__info-wrap">
  155.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-info-2" tabindex="0">{{info(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  156.                                                                     <div class="object__info object__info--info js-info-2" data-lenis-prevent>
  157.                                                                         <div class="object__info__text block__text">{{data.Translation[app.request.locale].text|raw}}</div>
  158.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  159.                                                                     </div>
  160.                                                                 </div>
  161.                                                         {% endif %}
  162.                                                         {% if data.Translation[app.request.locale].copyrights %}
  163.                                                                 <div class="object__info-wrap">
  164.                                                                     <button class="collection-gallery__buttons__btn" type="button" aria-expanded="false" data-expanded="js-copyright-2" tabindex="0">{{copyrights(('T_INFO')|trans({}, 'openform_front', app.request.locale))}}</button>
  165.                                                                     <div class="object__info object__info--copyright js-copyright-2" data-lenis-prevent>
  166.                                                                         <div class="object__info__text block__text">{{data.Translation[app.request.locale].copyrights|raw}}</div>
  167.                                                                         <button class="object__info__close js-expanded-close" type="button">{{infoClose()}}</button>
  168.                                                                     </div>
  169.                                                                 </div>
  170.                                                         {% endif %}
  171.                                                         <button class="collection-gallery__buttons__btn js-fullscreen" data-alt="{{data.Translation[app.request.locale].alt}}" tabindex="0" data-color="{{data.imageBackgroundColor is defined and data.imageBackgroundColor ? data.imageBackgroundColor }}"
  172.                                                         data-image="{{img}}"
  173.                                                         data-description="{{data.Translation[app.request.locale].text}}"
  174.                                                         data-copyrights="{{data.Translation[app.request.locale].copyrights}}"
  175.                                                         data-start="1"
  176.                                                         data-imagestyle="{% if data.imageBorderColor and data.imageBorderWidth %}border: {{data.imageBorderColor}} solid {{data.imageBorderWidth}}px;{% endif %}"
  177.                                                         >
  178.                                                             {{fullscreen(('T_FULLSCREEN')|trans({}, 'openform_front', app.request.locale))}}
  179.                                                         </button>
  180.                                                         <button class="collection-gallery__buttons__btn js-zoom-out">{{zoomout(('T_ZOOMOUT')|trans({}, 'openform_front', app.request.locale))}}</button>
  181.                                                         <button class="collection-gallery__buttons__btn js-zoom-in">{{zoomin(('T_ZOOMIN')|trans({}, 'openform_front', app.request.locale))}}</button>
  182.                                                     </div>
  183.                                                 </div>
  184.                                             </div>
  185.         </div>
  186.         {% endif %}
  187.     </div>
  188.     {% if entity.imageFooterTextColor %}
  189.         <style>
  190.             .object__nav__button{
  191.                 color: {{entity.imageFooterTextColor}};
  192.             }
  193.             .object__nav__button path{
  194.                 fill: {{entity.imageFooterTextColor}};
  195.             }
  196.         </style>
  197.     {% endif %}
  198.     
  199.     <div class="collections__arrows" style="background: {{entity.imageFooterBackgroundColor|default('#F8F4DC') }}; height: {{entity.lineHeight|default('9') }}%; color:{{entity.imageFooterTextColor|default('#231F17') }} !important;">
  200.         {% for key, Relict in entity.RelictPack.getVisibleRelicts(app.request.locale) %}
  201.                     {% if entity.id == Relict.id  %}
  202.                         {% if entity.RelictPack.getVisibleRelicts(app.request.locale)[key - 1] is defined %}
  203.                             {% set prevElement = entity.RelictPack.getVisibleRelicts(app.request.locale)[key - 1] %}
  204.                             {% set href = toolkit_route_localizer.generate('relict_item',{ slug : prevElement.Translation[app.request.locale].slug }, app.request.locale) %}
  205.                             <a href="{{href}}" class="object__nav__button">{{arrowObjectPrev(('T_RELICT_PREV')|trans({}, 'openform_front', app.request.locale))}}{{ ('T_RELICT_PREV')|trans({}, 'openform_front', app.request.locale) }}</a>
  206.                         {% endif%}
  207.                         {% if entity.RelictPack.getVisibleRelicts(app.request.locale)|length > 0 %}
  208.                             <div class="collections__arrows__numbers">
  209.                                 <span>{{ key + 1 }}</span>/{{ entity.RelictPack.getVisibleRelicts(app.request.locale) is defined ? entity.RelictPack.getVisibleRelicts(app.request.locale)|length }}
  210.                             </div>
  211.                         {% endif %}
  212.                         {% if entity.RelictPack.getVisibleRelicts(app.request.locale)[key + 1] is defined %}
  213.                             {% set nextElement = entity.RelictPack.getVisibleRelicts(app.request.locale)[key + 1] %}
  214.                             {% set href = toolkit_route_localizer.generate('relict_item',{ slug : nextElement.Translation[app.request.locale].slug }, app.request.locale) %}
  215.                             <a href="{{href}}" class="object__nav__button object__nav__button--right">{{ ('T_RELICT_NEXT')|trans({}, 'openform_front', app.request.locale) }}{{arrowObjectNext(('T_RELICT_NEXT')|trans({}, 'openform_front', app.request.locale))}}</a>
  216.                         {% endif%}
  217.                     {% endif %}
  218.         {% endfor %}
  219.     </div>
  220. </div>