{# @var \Contao\CoreBundle\Image\Studio\Figure figure #}
{#
Studio Macros
-------------
This collection of Twig macros is intended to help you render figure/image
markup directly from a Studio\Figure. You can use these macros as building
blocks for your own figure template or to render the whole thing and pass
some options.
Options
-------
By setting options, the default output can be altered. There are two places
where this can be done:
1) By constructing a Studio\Figure object with $options
2) By passing the $options argument to the macros
If the same keys are defined in both 1) and 2), the template options
will have precedence.
Currently, options allow you to extend/overwrite HTML attributes for all
tags that are output. Attributes defined under the 'attr' key will be
placed inside the tag while those defined under the '%tag%_attr'
key will end up inside the <%tag%> tag.
Example:
{{ _self.figure(figure, {
attr: { data-foo: 'a' },
figcaption_attr: { class: 'bar' }
} }}
:
: ...
:
: ...
:
:
#}
{#
Build a including a picture and - if available - a caption from
Studio\Figure data.
If a link is defined the picture will be wrapped in an tag.
#}
{%- macro figure(figure, options = {}, addSchemaOrg = true) -%}
{%- set figure_attributes = figure.options.attr|default({})|merge(options.attr|default({})) %}
{%- set link_attributes = figure.options.link_attr|default({})|merge(options.link_attr|default({})) ~%}
{% if figure.linkHref -%}
{%- set base_attributes = {
'href': figure.linkHref,
'title': figure.hasLightbox and figure.hasMetadata ? figure.metadata.title : null,
}|merge(figure.linkAttributes) -%}
{{~ _self.picture(figure, options) }}
{%- else %}
{{- _self.picture(figure, options) -}}
{% endif %}
{{ _self.caption(figure, options) }}
{% if addSchemaOrg %}
{%- do add_schema_org(figure.schemaOrgData) -%}
{% endif %}
{%- endmacro -%}
{#
Build a from Studio\Figure data.
This falls back to only creating a single if no sources are present.
#}
{% macro picture(figure, options = {}) %}
{%- set picture_attributes = figure.options.picture_attr|default({})|merge(options.picture_attr|default({})) %}
{%- set source_attributes = figure.options.source_attr|default({})|merge(options.source_attr|default({})) %}
{%- if figure.image.sources -%}
{% for source in figure.image.sources %}
{%- set defineProportions = source.width|default(false) and source.height|default(false) -%}
{%- set base_attributes = {
'srcset': source.srcset,
'sizes': source.sizes|default(null),
'media': source.media|default(null),
'type': source.type|default(null),
'width': defineProportions ? source.width : null,
'height': defineProportions ? source.height : null,
} -%}
{%- endfor %}
{{ _self.img(figure, options) }}
{%- else %}
{{ _self.img(figure, options) }}
{%- endif %}
{% endmacro %}
{#
Build an from Studio\Figure data.
#}
{%- macro img(figure, options = {}) -%}
{% apply spaceless %}
{% set img_attributes = figure.options.img_attr|default({})|merge(options.img_attr|default({})) %}
{% set img = figure.image.img %}
{% set defineProportions = img.width|default(false) and img.height|default(false) %}
{% set base_attributes = {
'src': img.src,
'alt': figure.hasMetadata ? figure.metadata.alt : '',
'title': figure.hasMetadata ? (figure.metadata.title ?: null) : null,
'srcset': img.srcset is defined and img.srcset != img.src ? img.srcset : null,
'sizes': img.sizes|default(null),
'width': defineProportions ? img.width : null,
'height': defineProportions ? img.height : null,
'loading': img.loading|default(null),
'class': img.class|default(null),
} %}
{% endapply %}
{%- endmacro -%}
{#
Build a from Studio\Figure data.
If no metadata is present, nothing will be output.
#}
{%- macro caption(figure, options = {}) -%}
{% apply spaceless %}
{% if figure.hasMetadata and figure.metadata.caption %}
{% set caption_attributes = figure.options.caption_attr|default({})|merge(options.caption_attr|default({})) %}
{{- figure.metadata.caption|raw -}}
{% endif %}
{% endapply %}
{%- endmacro -%}
{#
Helper: Expand an associative mapping into HTML attributes.
- Values that are null won't be included
- The output will contain a leading space
Example:
{ 'foo': 'a', 'bar': 'b', 'foobar': null } --> ' foo="a" bar="b"'
#}
{%- macro html_attributes(attributes) -%}
{%- for attr, value in attributes|filter(v => v is not null) -%}
{{ ' ' ~ attr }}{% if value %}="{{ value }}"{% endif %}
{%- endfor -%}
{%- endmacro -%}