Merge pull request #249 from OpenUpSA/fix/people-page

Fix/people page
OpenUpSA · Dec 12, 2024 · 8e5ca54 · 8e5ca54
2 parents a5a84de + 1c4261d
commit 8e5ca54
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 11 deletions.
diff --git a/pombola/core/templatetags/safe_image.py b/pombola/core/templatetags/safe_image.py
@@ -0,0 +1,9 @@
+from django import template
+
+register = template.Library()
+
+@register.filter
+def safe_image_width(image):
+    if image and hasattr(image, 'width'):
+        return image.width
+    return None
diff --git a/pombola/settings/base.py b/pombola/settings/base.py
@@ -374,6 +374,7 @@
 BLOG_RSS_FEED = os.environ.get("BLOG_RSS_FEED", None)
 
 THUMBNAIL_DEBUG = True
+THUMBNAIL_FORMAT = 'PNG'
 
 # ZA Hansard settings
 HANSARD_CACHE = os.path.join(data_dir, "hansard_cache")

diff --git a/pombola/south_africa/templates/core/organisation_people.html b/pombola/south_africa/templates/core/organisation_people.html
@@ -2,6 +2,7 @@
 {% load pagination_tags %}
 {% load staticfiles %}
 {% load thumbnail %}
+{% load safe_image %}
 
 
 {% block title %}{{ object.name }} People{% endblock %}
@@ -45,7 +46,11 @@ <h3>Show</h3>
 
                   <a href="{{ person.get_absolute_url }}">
                       {% thumbnail person.primary_image "58x78" crop="center" as im %}
+                      {% if im|safe_image_width %}
                       <img src="{{ im.url }}" alt="{{ person.name }}" width="{{ im.width }}" height="{{ im.height }}" />
+                      {% else %}
+                      <img src="{% static 'images/person-90x90.jpg' %}" height="58" width="58"/>
+                      {% endif %}
                       {% empty %}
                       <img src="{% static 'images/person-90x90.jpg' %}" height="58" width="58"/>
                       {% endthumbnail %}

diff --git a/pombola/south_africa/templates/core/person_list_item.html b/pombola/south_africa/templates/core/person_list_item.html
@@ -1,20 +1,25 @@
 {% load staticfiles %}
 {% load thumbnail %}
 {% load za_people_display %}
+{% load safe_image %}
 
 <a href="{{ object.get_absolute_url }}">
-    {% thumbnail object.primary_image "58x78" crop="center" as im %}
-      {% if lazy_load_images %}
-        <img src="{% static 'images/person-58x78.jpg' %}"
-             data-src="{{ im.url }}"
-             width="{{ im.width }}"
-             height="{{ im.height }}"
-             alt="{{ object.name }}"
-             loading="lazy">
-
-        <noscript><img src="{{ im.url }}" alt="{{ object.name }}" width="{{ im.width }}" height="{{ im.height }}" loading="lazy"/></noscript>
+    {% thumbnail object.primary_image "58x78" crop="center" convert="RGBA" as im %}
+      {% if im|safe_image_width %}
+        {% if lazy_load_images %}
+          <img src="{% static 'images/person-58x78.jpg' %}"
+              data-src="{{ im.url }}"
+              width="{{ im.width }}"
+              height="{{ im.height }}"
+              alt="{{ object.name }}"
+              loading="lazy">
+
+          <noscript><img src="{{ im.url }}" alt="{{ object.name }}" width="{{ im.width }}" height="{{ im.height }}" loading="lazy"/></noscript>
+        {% else %}
+          <img src="{{ im.url }}" alt="{{ object.name }}" width="{{ im.width }}" height="{{ im.height }}" loading="lazy"/>
+        {% endif %}
       {% else %}
-        <img src="{{ im.url }}" alt="{{ object.name }}" width="{{ im.width }}" height="{{ im.height }}" loading="lazy"/>
+        <img src="{% static 'images/person-58x78.jpg' %}" height="58" width="58" loading="lazy"/>
       {% endif %}
     {% empty %}
       <img src="{% static 'images/person-58x78.jpg' %}" height="58" width="58" loading="lazy"/>