Symfony Profiler

{% block thumbnail_utility %}
{# activate load per default. If it is not activated only a data-src is set instead of the src tag. #}
{% if load is not defined %}
{% set load = true %}
{% endif %}
{# By default no original image will be loaded as soon as thumbnails are available. #}
{# When set to true the orginal image will be loaded when the viewport is greater than the largest available thumbnail. #}
{% if loadOriginalImage is not defined %}
{% set loadOriginalImage = false %}
{% endif %}
{# By default the srcset sizes will be calculated automatically if `columns` are present and no `sizes` are configured. #}
{# When set to false the sizes attribute will not be generated automatically. #}
{% if autoColumnSizes is not defined %}
{% set autoColumnSizes = true %}
{% endif %}
{% if attributes is not defined %}
{% set attributes = {} %}
{% endif %}
{% if config('WeedesignPageSpeed.config.lazy') %}
{% if attributes.class %}
{% set attributes = attributes|merge({'class': 'weedesign-lazy weedesign-lazy-hidden weedesign-lazy-effect ' ~ attributes.class}) %}
{% else %}
{% set attributes = attributes|merge({'class': 'weedesign-lazy weedesign-lazy-hidden weedesign-lazy-effect'}) %}
{% endif %}
{% endif %}
{% if attributes.alt is not defined and media.translated.alt is defined %}
{% set attributes = attributes|merge({'alt': media.translated.alt}) %}
{% endif %}
{% if attributes.title is not defined and media.translated.title is defined %}
{% set attributes = attributes|merge({'title': media.translated.title}) %}
{% endif %}
{# uses cms block column count and all available thumbnails to determine the correct image size for the current viewport #}
{% if media.thumbnails|length > 0 %}
{% if autoColumnSizes and columns and sizes is not defined %}
{# set image size for every viewport #}
{% set sizes = {
'xs': (theme_config('breakpoint.sm') - 1) ~'px',
'sm': (theme_config('breakpoint.md') - 1) ~'px',
'md': ((theme_config('breakpoint.lg') - 1) / columns)|round(0, 'ceil') ~'px',
'lg': ((theme_config('breakpoint.xl') - 1) / columns)|round(0, 'ceil') ~'px'
} %}
{# set image size for largest viewport depending on the cms block sizing mode (boxed or full-width) #}
{% if layout == 'full-width' %}
{% set container = 100 %}
{% set sizes = sizes|merge({ 'xl': (container / columns)|round(0, 'ceil') ~'vw'}) %}
{% else %}
{% set container = 1360 %}
{% set sizes = sizes|merge({ 'xl': (container / columns)|round(0, 'ceil') ~'px'}) %}
{% endif %}
{% endif %}
{% set thumbnails = media.thumbnails|sort|reverse %}
{# generate srcset with all available thumbnails #}
{% set srcsetValue %}{% apply spaceless %}
{% if config('WeedesignPageSpeed.config.webp') %}
{% if loadOriginalImage %}
{{ media | weedesign_pagespeed_webp_url_media }} {{ thumbnails|first.width + 1 }}w,
{% endif %}
{% for thumbnail in thumbnails %}
{{ thumbnail | weedesign_pagespeed_webp_url_thumbnail }} {{ thumbnail.width }}w{% if not loop.last %}, {% endif %}
{% endfor %}
{% else %}
{% if loadOriginalImage %}
{{ media | sw_encode_media_url }} {{ thumbnails|first.width + 1 }}w,
{% endif %}
{% for thumbnail in thumbnails %}
{{ thumbnail.url | sw_encode_url }} {{ thumbnail.width }}w{% if not loop.last %}, {% endif %}
{% endfor %}
{% endif %}
{% endapply %}{% endset %}
{# generate sizes #}
{% set sizesValue %}{% apply spaceless %}
{% set sizeFallback = 100 %}
{# set largest size depending on column count of cms block #}
{% if autoColumnSizes and columns %}
{% set sizeFallback = (sizeFallback / columns)|round(0, 'ceil') %}
{% endif %}
{% set breakpoint = {
'xs': theme_config('breakpoint.xs'),
'sm': theme_config('breakpoint.sm'),
'md': theme_config('breakpoint.md'),
'lg': theme_config('breakpoint.lg'),
'xl': theme_config('breakpoint.xl')
} %}
{% if thumbnails|first.width > breakpoint|reverse|first %}
{# @deprecated tag:v6.5.0 - Variable `maxWidth` and parent condition will be removed #}
{% set maxWidth = thumbnails|first.width %}
{% endif %}
{% for key, value in breakpoint|reverse %}(min-width: {{ value }}px) {{ sizes[key] }}{% if not loop.last %}, {% endif %}{% endfor %}, {{ sizeFallback }}vw
{% endapply %}{% endset %}
{% endif %}
{% block thumbnail_utility_img %}
{% if config('WeedesignPageSpeed.config.lazy') %}
{% if config('WeedesignPageSpeed.config.webp') %}
<img
src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
data-src="{{ media|weedesign_pagespeed_webp_url_media }}"
data-effect="{{ config('WeedesignPageSpeed.config.lazyEffect') }}"
{% if config('WeedesignPageSpeed.config.fallback') %}
data-fallback="{{ media.url|weedesign_pagespeed_webp_url_nope }}"
{% endif %}
{% if media.thumbnails|length > 0 %}
data-srcset="{{ srcsetValue }}"
{% if sizes['default'] %}
sizes="{{ sizes['default'] }}"
{% elseif sizes|length > 0 %}
sizes="{{ sizesValue }}"
{% endif %}
{% else %}
data-srcset="{{ media|weedesign_pagespeed_webp_url_media }}"
{% endif %}
{% for key, value in attributes %}
{% if value != '' %}
{% if key != 'itemprop' %}
{{ key }}="{{ value }}"
{% endif %}
{% endif %}
{% endfor %}
/>
{% else %}
<img
src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="
data-src="{{ media|sw_encode_media_url }}"
data-effect="{{ config('WeedesignPageSpeed.config.lazyEffect') }}"
{% if media.thumbnails|length > 0 %}
data-srcset="{{ srcsetValue }}"
{% if sizes['default'] %}
sizes="{{ sizes['default'] }}"
{% elseif sizes|length > 0 %}
sizes="{{ sizesValue }}"
{% endif %}
{% endif %}
{% for key, value in attributes %}
{% if value != '' %}
{% if key != 'itemprop' %}
{{ key }}="{{ value }}"
{% endif %}
{% endif %}
{% endfor %}
/>
{% endif %}
{% set noscript = false %}
{% for key, value in attributes %}
{% if value != '' %}
{% if key == 'itemprop' %}
{% set noscript = true %}
{% endif %}
{% endif %}
{% endfor %}
{% if noscript == true %}
<noscript>
<img
src="{{ media|sw_encode_media_url }}"
{% if media.thumbnails|length > 0 %}
{% if load %}
srcset="{{ srcsetValue }}"
{% else %}
data-srcset="{{ srcsetValue }}"
{% endif %}
{% if sizes['default'] %}
sizes="{{ sizes['default'] }}"
{% elseif sizes|length > 0 %}
sizes="{{ sizesValue }}"
{% endif %}
{% endif %}
{% for key, value in attributes %}
{% if value != '' %}
{{ key }}="{{ value }}"
{% endif %}
{% endfor %}
/>
</noscript>
{% endif %}
{% else %}
{% if config('WeedesignPageSpeed.config.webp') %}
<img
{% if load %}
src="{{ media|weedesign_pagespeed_webp_url_media }}"
{% else %}
data-src="{{ media|weedesign_pagespeed_webp_url_media }}"
{% endif %}
{% if config('WeedesignPageSpeed.config.fallback') %}
data-fallback="{{ media.url|weedesign_pagespeed_webp_url_nope }}"
{% endif %}
{% if media.thumbnails|length > 0 %}
{% if load %}
srcset="{{ srcsetValue }}"
{% else %}
data-srcset="{{ srcsetValue }}"
{% endif %}
{% if sizes['default'] %}
sizes="{{ sizes['default'] }}"
{% elseif sizes|length > 0 %}
sizes="{{ sizesValue }}"
{% endif %}
{% endif %}
{% for key, value in attributes %}
{% if value != '' %}
{{ key }}="{{ value }}"
{% endif %}
{% endfor %}
/>
{% else %}
<img
{% if load %}
src="{{ media|sw_encode_media_url }}"
{% else %}
data-src="{{ media|sw_encode_media_url }}"
{% endif %}
{% if media.thumbnails|length > 0 %}
{% if load %}
srcset="{{ srcsetValue }}"
{% else %}
data-srcset="{{ srcsetValue }}"
{% endif %}
{% if sizes['default'] %}
sizes="{{ sizes['default'] }}"
{% elseif sizes|length > 0 %}
sizes="{{ sizesValue }}"
{% endif %}
{% endif %}
{% for key, value in attributes %}
{% if value != '' %}
{{ key }}="{{ value }}"
{% endif %}
{% endfor %}
/>
{% endif %}
{% endif %}
{% endblock %}
{% endblock %}

custom/plugins/WeedesignPageSpeed/src/Resources/views/storefront/utilities/thumbnail.html.twig line 1