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

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