templates/partials/home/blocks/welcome.html.twig line 1

Open in your IDE?
  1. {% set banners = get_banners_by_zone(block.bannerZone) %}
  2. <section class="main-block home-welcome home-section is-light" data-load-gallery="true" data-gallery-delay="5"
  3.          data-fullpage-scroll="1">
  4.     <div class="home-welcome--bg">
  5.         {% for banner in banners %}
  6.             {% if banner.creativity is defined and banner.creativity is not null %}
  7.                 {% set creativity = banner.creativity %}
  8.             {% else %}
  9.                 {% set creativity = banner.creativity %}
  10.             {% endif %}
  12.             {% if banner.creativityMobile is defined and banner.creativityMobile is not null %}
  13.                 {% set creativityMobile = banner.creativityMobile %}
  14.             {% else %}
  15.                 {% set creativityMobile = creativity %}
  16.             {% endif %}
  18.             {% if banner.creativityTablet is defined and banner.creativityTablet is not null %}
  19.                 {% set creativityTablet = banner.creativityTablet %}
  20.             {% else %}
  21.                 {% set creativityTablet = creativity %}
  22.             {% endif %}
  24.             {% if creativity is youtubeVideo %}
  26.                 {% if not is_mobile() and not is_tablet() %}
  27.                     <div class="js-home-welcome--bg-item home-welcome--bg-item has-video" data-time="{{ banner.time }}">
  28.                         <video id="video-welcome-{{ loop.index0 }}"
  29.                                preload
  30.                                autoplay
  31.                                class="js-responsive-video preload-video"
  32.                                data-desktop=""
  33.                                data-tablet="{{ creativityTablet | resize(900)|file_url }}"
  34.                                data-mobile="{{ creativityMobile | resize(700)|file_url }}"
  35.                                controls="false"
  36.                                muted
  37.                                data-setup='{"techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "{{ 'https://www.youtube.com/watch?v='~creativity.reference }}"}] }'
  38.                         >
  39.                         </video>
  40.                     </div>
  41.                 {% else %}
  43.                     {% if is_mobile() %}
  44.                         {% set alternateCreativityForVideo = creativityMobile %}
  45.                     {% endif %}
  46.                     {% if is_tablet() %}
  47.                         {% set alternateCreativityForVideo = creativityTablet %}
  48.                     {% endif %}
  50.                     {% set mobilePicture = false %}
  51.                     {% if banner.creativityMobile %}
  52.                         {% set mobilePicture = picture_data(creativityMobile, 700) | json_decode %}
  53.                     {% endif %}
  55.                     {% set tabletPicture = false %}
  56.                     {% if banner.creativityTablet %}
  57.                         {% set mobilePicture = picture_data(creativityTablet, 700) | json_decode %}
  58.                     {% endif %}
  60.                     <div class="js-home-welcome--bg-item home-welcome--bg-item" data-time="{{ banner.time }}">
  61.                         <div class="home-welcome--bg-image js-responsive-image"
  62.                              data-desktop="{{ alternateCreativityForVideo | resize(1920)|file_url }}"
  63.                              data-tablet="{{ tabletPicture ? tabletPicture.url : creativityTablet | resize(900)|file_url }}"
  64.                              data-mobile="{{ mobilePicture ? mobilePicture.url : creativityMobile | resize(700)|file_url }}">
  65.                         </div>
  66.                     </div>
  67.                 {% endif %}
  68.             {% else %}
  69.                 <div class="js-home-welcome--bg-item home-welcome--bg-item" data-time="{{ banner.time }}">
  70.                     <div class="home-welcome--bg-image">
  71.                         <picture-component class="js-picture-component"
  72.                             :image="{{ picture_data(creativityMobile, null, null, null, [{'file': creativity, 'width': 1920, 'min': 960}, {'file': creativityTablet, 'width': 900, 'min': 600}]) }}">
  73.                         </picture-component>
  74.                     </div>
  75.                 </div>
  76.             {% endif %}
  78.         {% endfor %}
  79.     </div>
  80.     {% for banner in banners %}
  81.         {% if banner.creativity is defined and banner.creativity is not null %}
  82.             {% set creativity = banner.creativity %}
  83.         {% else %}
  84.             {% set creativity = banner.creativity %}
  85.         {% endif %}
  86.         <div class="home-welcome--item {{ loop.index == 1 ? 'is-active': '' }} banner-{{ loop.index }}" data-time="{{ banner.time }}">
  87.              <div class="container">
  88.                 <div class="main-content position-relative {% if banner.textWhite %}is-text--white{% endif %}">
  89.                     <div class="main-content--title title-l title-l {% if creativity is youtubeVideo %}is-video{% endif %}">{{ banner.text | raw }}</div>
  90.                     <div class="main-content--text {% if creativity is youtubeVideo %}is-video{% endif %}">{{ banner.author  | raw }}</div>
  91.                     {% if banner.showCta %}
  92.                         <a class="main-content--cta button white" href="{{ banner.link == null ? path(banner.route) : banner.link }}" {% if banner.openNewWindow %} target="_blank" {% endif %}>
  93.                             <span>{{ banner.linkName }}</span>
  94.                         </a>
  95.                     {% endif %}
  96.                     {{ full_admin_edit(banner, 'edit', {}, 'banner-'~loop.index~ 'icon-edit-inline', '', 'esi' ) }}
  97.                 </div>
  98.              </div>
  99.         </div>
  100.     {% endfor %}
  101.     <div class="slider-progress">
  102.         <div class="progress"></div>
  103.     </div>
  104.     <div class="home-welcome-buttons">
  105.         <div class="home-welcome-buttons--left">
  106.             {% include 'partials/global/svg/angle-left.svg.twig' %}
  107.         </div>
  108.         <div class="home-welcome-buttons--right">
  109.             {% include 'partials/global/svg/angle-right.svg.twig' %}
  110.         </div>
  111.     </div>
  112.     <ol class="flickity-page-dots">
  113.     </ol>
  114. </section>