Update templates & add filters

gallery/templates/gallery/photo_detail.html

@@ -1,4 +1,5 @@
 {% extends "base_dark.html" %}
+{% load exif_filters %}
 
 <!-- Title -->
 {% block title %} Gallery : Photo : {{ photo.slug }} {% endblock %}
@@ -7,9 +8,9 @@
 <!-- Content -->
 {% block content %}
 
-    <div uk-grid>
+    <div class="uk-align-center uk-container-large uk-background-secondary uk-light">
         
-        <div class="uk-width-1-1 uk-width-3-4@m">
+        <div class="uk-position-relative">
             <div uk-lightbox>
                 <a href="{{ photo.photo_bg.url }}" data-alt="{{ photo.slug }}">
                     <img 
@@ -23,12 +24,26 @@
                                (max-width: 960px) 720px, 
                                1920px" 
                         alt="{{ photo.slug }}" 
+                        class="uk-display-block uk-margin-auto"
                         style="max-width: 100%; max-height: 90vh; object-fit: contain;" />
                 </a>
             </div>
+        
+            <!-- Navigointinuolet -->
+            {% if photo.get_prev %}
+            <a href="{{ photo.get_prev.get_absolute_url }}" class="uk-position-center-left uk-hidden-hover" uk-slidenav-previous></a>
+            {% endif %}
+        
+            {% if photo.get_next %}
+            <a href="{{ photo.get_next.get_absolute_url }}" class="uk-position-center-right uk-hidden-hover" uk-slidenav-next></a>
+            {% endif %}
         </div>
+        
     
-        <div class="uk-margin-top uk-width-1-4@m uk-visible@m">
+    </div>
+
+    <div class="uk-align-center uk-container-large">
+
 
             <div class="uk-grid-small" uk-grid>
                 <div class="uk-width-expand" uk-leader>Album name</div>
@@ -57,6 +72,36 @@
                 <div><a href="{{ photo.photo.url }}">{{ photo.width }}x{{ photo.height }}</a></div>
             </div>
 
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Camera</div>
+                <div>{{ photo.exif.Model }}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Lens</div>
+                <div>{{ photo.exif.LensModel }}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Shutter Speed</div>
+                <div>{{ photo.exif.ExposureTime|exif_exposuretime }}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Aperture</div>
+                <div>{{ photo.exif.FNumber|exif_fnumber }}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>ISO</div>
+                <div>{{ photo.exif.ISOSpeedRatings|exif_isospeedratings }}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Focal Length</div>
+                <div>{{ photo.exif.FocalLength|exif_focallength}}</div>
+            </div>
+            <div class="uk-grid-small" uk-grid>
+                <div class="uk-width-expand" uk-leader>Focal Length</div>
+                <div>{{ photo.exif.FocalLengthIn35mmFilm|exif_focallength }}</div>
+            </div>
+        
+
             <div class="uk-grid-small" uk-grid>
                 <div class="uk-width-expand" uk-leader>
                 {% if prev %}
@@ -80,7 +125,7 @@
                 </button>
             </form>
 
-        </div>
-    </div>
+     </div>
+    
 
 {% endblock %}

gallery/templates/gallery/photo_list.html

@@ -14,7 +14,7 @@
 
 {% load link_tags %}
 
-<ul class="uk-subnav uk-subnav-divider uk-margin-remove-top" uk-margin>
+<ul class="uk-subnav uk-subnav-divider uk-margin-remove-top uk-flex-right" uk-margin>
     <li {% if order == 'latest' %}class="uk-active" {% endif %}><a href="{% search_link 'latest' request.GET %}">Latest</a></li>
     <li {% if order == 'liked' %}class="uk-active" {% endif %}><a href="{% search_link 'liked' request.GET %}">Liked</a></li>
     <li {% if order == 'popular' %}class="uk-active" {% endif %}><a href="{% search_link 'popular' request.GET %}">Popular</a></li>

gallery/templatetags/exif_filters.py

@@ -0,0 +1,47 @@
+from django import template
+from django.utils.text import slugify
+from unidecode import unidecode
+
+register = template.Library()
+
+
+@register.filter(name="unislugify")
+def unislugify(value):
+    """Convert to ASCII"""
+    return slugify(unidecode(value))
+
+
+@register.filter(name="exif_exposuretime")
+def exif_exposuretime(value):
+    """Convert ExposureTime"""
+    try:
+        return f"1/{int(1/float(value))} sec"
+    except:
+        return ""
+
+
+@register.filter(name="exif_fnumber")
+def exif_fnumber(value):
+    """Convert FNumber"""
+    try:
+        return f"ƒ/{float(value)}"
+    except:
+        return ""
+
+
+@register.filter(name="exif_focallength")
+def exif_focallength(value):
+    """Convert Focal Length"""
+    try:
+        return f"{int(value)} mm"
+    except:
+        return ""
+
+
+@register.filter(name="exif_isospeedratings")
+def exif_isospeedratings(value):
+    """Convert ISO Speed Ratings"""
+    try:
+        return f"{int(value)}"
+    except:
+        return ""