summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorluxagraf <sng@luxagraf.net>2016-04-02 22:10:17 -0400
committerluxagraf <sng@luxagraf.net>2016-04-02 22:10:17 -0400
commit3272a1f724c74936322c6a0042921b7ece405138 (patch)
tree64cffa9eb9f8f97467d16092435f190f5408f55b
parent062a09fc40049f2d7de58834556dc3e8b80870ff (diff)
added some template tweaks for video in galleries
-rw-r--r--design/templates/details/photo_gallery.html12
1 files changed, 9 insertions, 3 deletions
diff --git a/design/templates/details/photo_gallery.html b/design/templates/details/photo_gallery.html
index 5b69edd..b452f35 100644
--- a/design/templates/details/photo_gallery.html
+++ b/design/templates/details/photo_gallery.html
@@ -13,6 +13,7 @@
<script src="/media/js/leaflet-master/leaflet-mod.js"></script>
<style>
#map-canvas img{ border: none;}
+ video { max-width: 50%;}
</style>
{% endblock %}
{%block bodyid%}class="image_gallery"{%endblock%}
@@ -28,11 +29,16 @@
<article id="image-{{forloop.counter}}">
<h6><a href="#image-{{forloop.counter}}" class="permalink" title="link to this image">&#8734; {{forloop.counter|number_to_word}} &#8734;</a></h6>
<figure class="fig">
- <a href="{% get_image_by_size photo "original" %}">
+ {% if not photo.is_video %}<a href="{% get_image_by_size photo "original" %}">{%endif%}
+ {% if photo.is_video %}<video src="{% get_image_by_size photo "original" %}" controls>
+ Your browser does not support the <code>video</code> element.
+ </video>
+ {% else %}
<img sizes="(max-width: 1170px) 100vw"
srcset="{% for size in photo.sizes.all %}{%spaceless%}
- {% get_image_by_size photo size.width %} {{size.width}}w{% if forloop.last%}"{%else%}, {%endif%}{%endspaceless%}{%endfor%}
- {% for size in photo.sizes.all %}{%spaceless%}{% if size.width > 720 and size.width < 2000 %}src="{% get_image_by_size photo size.width %}"{%endif%}{%endspaceless%}{%endfor%} alt="{% if photo.alt %}{{photo.alt}}{%else%}{{photo.title}}{%endif%}" {%if photo.is_portait %}class="v"{%endif%} ></a>
+ {% get_image_by_size photo size.width %} {{size.width}}w{% if forloop.last%}"{%else%},{%endif%}{%endspaceless%} {%endfor%}
+ {% for size in photo.sizes.all %}{%spaceless%}{% if size.width > 720 and size.width < 2000 %}src="{% get_image_by_size photo size.width %}"{%endif%}{%endspaceless%}{%endfor%} alt="{% if photo.alt %}{{photo.alt}}{%else%}{{photo.title}}{%endif%}" {%if photo.is_portait %}class="v"{%endif%} >
+ {%endif%}{% if not photo.is_video %}</a>{%endif%}
<figcaption class="figcaption">
<div class="caption" id="id-{{photo.id}}">
<h3 class="figcaption--title">{{photo.title}}</h3>