{% load i18n cms_tags thumbnail staticfiles sekizai_tags %}
{% comment %}
DOCS: https://html.spec.whatwg.org/multipage/embedded-content.html#introduction-3:viewport-based-selection-2
the browser assumes size="100vw" by default, which means
"assume this image will be displayed at full width on the
current viewport and pick an image from srcset accordingly".
TODO: currently we're always upscaling the image physically.
would it be better to upscale it with css? img-response
does not seem to do that yet.
{% endcomment %}
{# only load js and css required for dnd upload if toolbar is available #}
{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %}
{% addtoblock "css" %}{% endaddtoblock %}
{% addtoblock "js" %}{% endaddtoblock %}
{% addtoblock "js" %}{% endaddtoblock %}
{% endif %}
{% spaceless %}
{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %}
{% if has_dnd_support %}
{% endif %}
{% endif %}
{% if request.toolbar and request.toolbar.show_toolbar and request.toolbar.edit_mode %}
{% if has_dnd_support %}
{% endif %}{# has_dnd_support #}
{% endif %}{# toolbar #}
{% endspaceless %}
{% if 0 %}
{% with main_src=instance.srcset.lg %} {% thumbnail instance.file main_src.size crop=main_src.crop upscale=main_src.upscale subject_location=main_src.subject_location as main_thumb %} src="{{ main_thumb.url }}" {% endwith %} alt="{{ instance.alt }}" title="{{ instance.title }}" class="img-responsive{% if instance.shape %} img-{{ instance.shape }}{% endif %}{% if instance.thumbnail %} img-thumbnail{% endif %}" srcset="{% for device, src in instance.srcset.items %} {% thumbnail instance.file src.size crop=src.crop upscale=src.upscale subject_location=src.subject_location as thumb %}{{ thumb.url }} {{ src.width_str }}{% if not forloop.last %},{% endif %} {% endfor %}"
{% for device, src in instance.srcset.items %} {{ src|pprint }} {% endfor %}{% endif %}