Make figure shortcode resize large images somwhat smart.

Images higher than 500px will be resized to not be any higher. Also we
check for images that will be less than 400px wide after resizing, and
float them to the left on wide displays.

1 files changed, 27 insertions, 2 deletions

diff --git a/templates/shortcodes/figure.html b/templates/shortcodes/figure.html
index 98332a0..e56957e 100644
--- a/templates/shortcodes/figure.html
+++ b/templates/shortcodes/figure.html
@@ -1,5 +1,30 @@
-<div class="figure">
-	<img src="{{ get_url(path=page.path ~ img) | safe }}" {% if alt %}alt="[{{ alt }}]"{% endif %}>
+{% if img is matching("\.(jpg|jpeg|png)$") -%}
+	{% for asset in page.assets %}
+		{% if asset is ending_with(img) %}
+			{% set_global img = asset %}
+			{% break %}
+		{% endif %}
+	{% endfor %}
+	{% set meta = get_image_metadata(path=img) %}
+	{% set scale = meta.height / 500 %}
+	{% if scale > 1 %}
+		{% set size_y = 500 %}
+		{% set size_x = meta.width / scale %}
+	{% else %}
+		{% set size_y = meta.height %}
+		{% set size_x = meta.width %}
+	{% endif %}
+	{% set img_url = resize_image(path=img, height=size_y, op="fit_height") %}
+	{% if size_x < 400 %}
+		{% set xclass = "prefer-left" %}
+	{% endif %}
+{% else %}
+	{% set img_url = get_url(path=page.path ~ img) %}
+{% endif %}
+<div class="figure {% if xclass %}{{ xclass }}{% endif %}">
+	<img src="{{ img_url | safe }}"
+			{% if alt %}alt="[{{ alt }}]"{% endif %}
+			>
 	<div class="caption">
 		{{ body | markdown | safe}}
 	</div>