{% load thumbnail filer_tags filer_image_tags %}{% spaceless %}

{% comment %}
  You may change the image size for special cases in your project by overriding
  this template. There are a few size manipulation filters for this in
  `filer_image_tags`:

  {% if placeholder == 'my_special_sidebar' %}
    {% thumbnail instance.image opts.size|extra_padding_y:10 crop=opts.crop upscale=opts.upscale as thumbnail %}
  {% else %}
    {% thumbnail instance.image opts.size crop=opts.crop upscale=opts.upscale as thumbnail %}
  {% endif %}
  {% if link %}<a href="{{ link }}"{% if instance.target_blank %} target="_blank"{% endif %} {{ instance.link_attributes_str }}>{% endif %}<img{% if instance.alignment %} class="{{ instance.alignment }}"{% endif %} alt="{% if instance.alt %}{{ instance.alt }}{% endif %}" src="{{ thumbnail.url }}"{% if instance.caption %} title="{{ instance.caption }}"{% endif %}>{% if link %}</a>{% endif %}
{% endcomment %}

{% if link %}<a href="{{ link }}"{% if instance.target_blank %} target="_blank"{% endif %} class="filer_image_link" {{ instance.link_attributes_str }}>{% endif %}
{% if in_unite %}
  {% include "ripiu/djangocms_aoxomoxoa/picture.html" with picture=instance.image external_picture=instance.image_url alt_text=instance.alt caption_text=instance.caption %}
{% else %}
  {% if instance.image %}
    {% if instance.use_original_image %}
      <img class="filer_image{% if instance.alignment %} {{ instance.alignment }}{% endif %}{% if instance.use_autoscale %} img-responsive{% endif %}"
           alt="{% if instance.alt %}{{ instance.alt }}{% endif %}" src="{{ instance.image.url }}"{% if instance.width %}
           width="{{ instance.width }}"{% endif %}{% if instance.height %}
           height="{{ instance.height }}"{% endif %}{% if instance.caption %}
           title="{{ instance.caption }}"{% endif %}>
    {% else %}
      {% thumbnail instance.image size crop=opts.crop upscale=opts.upscale subject_location=opts.subject_location as thumbnail %}
      <img class="filer_image {% if instance.alignment %}{{ instance.alignment }}{% endif %}{% if instance.use_autoscale %} img-responsive{% endif %}"
           alt="{% if instance.alt %}{{ instance.alt }}{% endif %}"
           src="{{ thumbnail.url }}"{% if instance.width %}
           width="{{ instance.width }}"{% endif %}{% if instance.height %}
           height="{{ instance.height }}"{% endif %}{% if instance.caption %}
           title="{{ instance.caption }}"{% endif %}>
    {% endif %}
  {% else %}
    {# just a plain link to some external image #}
    <img class="filer_image {% if instance.alignment %}{{ instance.alignment }}{% endif %}{% if instance.use_autoscale %} img-responsive{% endif %}"
         alt="{% if instance.alt %}{{ instance.alt }}{% endif %}"
         src="{{ instance.image_url }}"{% if size.0 %}
         width="{{ size.0 }}"{% endif %}{% if size.1 %}
         height="{{ size.1 }}"{% endif %}{% if instance.caption %}
         title="{{ instance.caption }}"{% endif %}>
  {% endif %}
  {% if instance.caption or instance.description %}
    <span class="filer_image_info">
      {% if instance.caption %}<span class="title">{{ instance.caption }}</span>{% endif %}
      {% if instance.description %}<span class="desc">{{ instance.description }}</span>{% endif %}
    </span>
  {% endif %}
{% endif %}
{% if link %}</a>{% endif %}

{% endspaceless %}