templates/PageParts/VideosGalleryPagePart/view.html.twig line 43

Open in your IDE?
  1. {% if (resource.videos | length > 1) %}
  3.     {% if resource.videos is defined and resource.videos %}
  5.             {% set videoImage = asset('frontend/img/general/video-pp--default.svg') %}
  6.             {% set imageType = 'jpg' %}
  8.     {% endif %}
  10.     <div class="gallery video-gallery video-pp" id="video-gallery-{{ resource.id }}">
  12.         <div class="gallery-boxes">
  14.             {% for video in resource.videos %}
  16.                 {% if video.media.contentType != 'video/mp4' %}
  18.                     {% set handler = mediamanager.getHandler(video.media) %}
  19.                     {% set helper = handler.getFormHelper(video.media) %}
  21.                     {% if helper.type == 'youtube' %}
  22.                         {% set videoEmbedUrl = "//www.youtube.com/embed/" ~ helper.code %}
  23.                     {% elseif helper.type == 'vimeo' %}
  24.                         {% set videoEmbedUrl = "//player.vimeo.com/video/" ~ helper.code %}
  25.                     {% elseif helper.type == 'dailymotion' %}
  26.                         {% set videoEmbedUrl = "//www.dailymotion.com/embed/video/" ~ helper.code %}
  27.                     {% endif %}
  29.                 {% endif %}
  31.                 <div class="gallery-box">
  32.                     <div class="videolink">
  34.                         {% if video.media.contentType != 'video/mp4' %}
  36.                             <a href="{{ videoEmbedUrl }}" target="_blank" rel="noopener" class="js-videolink-play-link videolink__video-link" data-video-provider="{{ helper.type }}" data-video-id="{{ helper.code }}" data-make-fluid="true">
  37.                                 <i class="videolink__video-link__icon fas fa-play"></i>
  39.                                 {% set img = video.preview ? video.preview : null %}
  41.                                 {% if img is not null and img is not empty %}
  43.                                     {% set fullSrc = croppedImgSrc(img.url, img.cropping, { w: 1400, q: 80 }) %}
  44.                                     {% set previewSrc = croppedImgSrc(img.url, img.cropping, jml_img_large.preview) %}
  46.                                     <img class="video-pp__link__img lazy"
  47.                                          src="{{ previewSrc }}" data-src="{{ fullSrc }}"
  48.                                          {% if video.media.name %}alt="{{ video.media.name }}"{% endif %} />
  50.                                 {% else %}
  52.                                     <img class="video-pp__link__img" src="{{ 'https://i.ytimg.com/vi/' ~ helper.code ~ '/maxresdefault.jpg' }}" alt="{{ video.media.name }}">
  54.                                 {% endif %}
  56.                             </a>
  57.                             <div class="js-videolink-container videolink__video-container"></div>
  59.                         {% else %}
  61.                             <video controls>
  62.                                 <source src="{{ asset(video.media.url) }}" type="video/mp4">
  63.                             </video>
  65.                         {% endif %}
  67.                     </div>
  68.                 </div>
  70.             {% endfor %}
  72.         </div>
  74.         <div class="gallery-nav">
  76.             {% for video in resource.videos %}
  78.                 {% if video.media.contentType != 'video/mp4' %}
  80.                     {% set handler = mediamanager.getHandler(video.media) %}
  81.                     {% set helper = handler.getFormHelper(video.media) %}
  83.                     {% if helper.type == 'youtube' %}
  84.                         {% set videoEmbedUrl = "//www.youtube.com/embed/" ~ helper.code %}
  85.                     {% elseif helper.type == 'vimeo' %}
  86.                         {% set videoEmbedUrl = "//player.vimeo.com/video/" ~ helper.code %}
  87.                     {% elseif helper.type == 'dailymotion' %}
  88.                         {% set videoEmbedUrl = "//www.dailymotion.com/embed/video/" ~ helper.code %}
  89.                     {% endif %}
  91.                 {% endif %}
  93.                 <div class="gallery-thumb">
  94.                     <div class="videolink">
  96.                         {% set img = video.preview ? video.preview : null %}
  98.                         {% if img is not null and img is not empty %}
  99.                             {% set fullSrc = croppedImgSrc(img.url, img.cropping, { w: 180, q: 80, fit: 'crop' }) %}
  100.                             {% set previewSrc = croppedImgSrc(img.url, img.cropping, jml_img_large.preview) %}
  102.                             <img class="video-pp__link__img lazy"
  103.                                  src="{{ previewSrc }}" data-src="{{ fullSrc }}"
  104.                                  {% if video.media.name %}alt="{{ video.media.name }}"{% endif %} />
  106.                         {% endif %}
  108.                     </div>
  109.                 </div>
  111.             {% endfor %}
  113.         </div>
  115.         <div class="gallery-clearfix"></div>
  116.     </div>
  118. {% else %}
  120.     <div class="gallery" id="video-gallery-{{ resource.id }}">
  121.         <div class="gallery-boxes">
  122.             {% for video in resource.videos %}
  124.                 {% set handler = mediamanager.getHandler(video.media) %}
  125.                 {% set helper = handler.getFormHelper(video.media) %}
  127.                 {% if helper.type == 'youtube' %}
  128.                     {% set videoEmbedUrl = "//www.youtube.com/embed/" ~ helper.code %}
  129.                 {% elseif helper.type == 'vimeo' %}
  130.                     {% set videoEmbedUrl = "//player.vimeo.com/video/" ~ helper.code %}
  131.                 {% elseif helper.type == 'dailymotion' %}
  132.                     {% set videoEmbedUrl = "//www.dailymotion.com/embed/video/" ~ helper.code %}
  133.                 {% endif %}
  135.                 <div class="gallery-box">
  136.                     <div class="videolink">
  137.                         <a href="{{ videoEmbedUrl }}" target="_blank" rel="noopener" class="js-videolink-play-link videolink__video-link" data-video-provider="{{ helper.type }}" data-video-id="{{ helper.code }}" data-make-fluid="true">
  138.                             <i class="videolink__video-link__icon fas fa-play"></i>
  140.                             {% set img = video.preview ? video.preview : null %}
  142.                             {% if img is not null and img is not empty %}
  144.                                 {% set fullSrc = croppedImgSrc(img.url, img.cropping, { w: 1400, q: 80 }) %}
  145.                                 {% set previewSrc = croppedImgSrc(img.url, img.cropping, jml_img_large.preview) %}
  147.                                 <img class="video-pp__link__img lazy"
  148.                                      src="{{ previewSrc }}" data-src="{{ fullSrc }}"
  149.                                      {% if video.media.name %}alt="{{ video.media.name }}"{% endif %} />
  151.                             {% else %}
  153.                                 <img class="video-pp__link__img" src="{{ 'https://i.ytimg.com/vi/' ~ helper.code ~ '/maxresdefault.jpg' }}" alt="{{ video.media.name }}">
  155.                             {% endif %}
  157.                         </a>
  158.                         <div class="js-videolink-container videolink__video-container"></div>
  159.                     </div>
  160.                 </div>
  162.             {% endfor %}
  163.         </div>
  164.     </div>
  166. {% endif %}