www.aleph1.co.uk Git - yaffs-website/blob - web/modules/contrib/blazy/templates/blazy.html.twig

   1 {#
   2 /**
   3  * @file
   4  * Default theme implementation to display a formatted blazy image/media field.
   5  *
   6  * The Blazy supports core image, responsive image and media entity.
   7  * If iframe switcher is enabled, audio/video iframe will be hidden below image
   8  * overlay, and only visible when toggled. Otherwise iframe only, and image is
   9  * emptied.
  10  *
  11  * Available variables:
  12  *   - image: A collection of image data.
  13  *   - attributes: An array of attributes applied to .media container.
  14  *   - iframe_attributes: An array of iframe attributes, including iframe SRC.
  15  *   - settings: An array containing the given settings.
  16  *   - url: An optional URL the image can be linked to, can be any of
  17  *       audio/video, or entity URLs, when using Colorbox/Photobox, or Link to
  18  *       content options.
  19  *   - url_attributes: An array of URL attributes, lightbox or content links.
  20  *
  21  * @see template_preprocess_blazy()
  22  *
  23  * @ingroup themeable
  24  */
  25 #}
  26 {%
  27   set classes = [
  28     'media',
  29     settings.namespace ? 'media--' ~ settings.namespace,
  30     settings.lazy ? 'media--loading',
  31     settings.media_switch ? 'media--switch media--switch--' ~ settings.media_switch|clean_class,
  32     settings.player ? 'media--player',
  33     settings.ratio ? 'media--ratio media--ratio--' ~ settings.ratio,
  34     settings.responsive_image_style_id ? 'media--responsive',
  35     settings.type ? 'media--' ~ settings.type,
  36   ]
  37 %}
  38 {%
  39   set iframe_classes = [
  40     'media__iframe',
  41     settings.ratio ? 'media__element'
  42   ]
  43 %}
  44
  45 {% set player %}
  46   {% if settings.player %}
  47     {% block blazy_player %}
  48       <iframe{{ iframe_attributes.addClass(iframe_classes) }} allowfullscreen></iframe>
  49       {% if settings.media_switch %}
  50         <span class="media__icon media__icon--close"></span>
  51         <span class="media__icon media__icon--play" data-url="{{ settings.autoplay_url }}"></span>
  52       {% endif %}
  53     {% endblock %}
  54   {% endif %}
  55 {% endset %}
  56
  57 {% set media %}
  58   {% block blazy_media %}
  59     <div{{ attributes.addClass(classes) }}>
  60       {{ image }}
  61       {{ player }}
  62       {{ settings.icon }}
  63     </div>
  64   {% endblock %}
  65 {% endset %}
  66
  67 {% set blazy %}
  68   {% block blazy_content %}
  69     {% if media_attributes %}<div{{ media_attributes }}>{% endif %}
  70       {% if url and not settings.player %}
  71         <a href="{{ url }}"{{ url_attributes }}>{{ media }}</a>
  72
  73         {# Allows fieldable captions with A tag, such as social share. #}
  74         {% if captions and captions.lightbox is not empty %}
  75           <div class="litebox-caption visually-hidden">
  76             {{- captions.lightbox -}}
  77           </div>
  78         {% endif %}
  79
  80       {% else %}
  81         {{- media -}}
  82       {% endif %}
  83     {% if media_attributes %}</div>{% endif %}
  84   {% endblock %}
  85
  86   {% if captions and captions.inline is defined %}
  87     {% block blazy_caption %}
  88       <div{{ caption_attributes }}>
  89         {% for caption in captions.inline %}
  90           {% if caption.content %}
  91             <{{ caption.tag }} {{ caption.attributes }}>{{ caption.content }}</{{ caption.tag }}>
  92           {% endif %}
  93         {% endfor %}
  94       </div>
  95     {% endblock %}
  96   {% endif %}
  97 {% endset %}
  98
  99 {% if wrapper_attributes %}
 100   <div{{ wrapper_attributes }}>
 101     {{ blazy }}
 102   </div>
 103 {% else %}
 104   {{ blazy }}
 105 {% endif %}