show user avatar in /vcard

webapp/config.py

@@ -31,6 +31,7 @@ ldap_admin_password = os.getenv('LDAPWEB_ADMIN_PASSWORD', 'unused')
 # LDAP attribute configuration
 
 readable_names = {
+    'jpegphoto': 'Avatar',
     'commonname': 'Common Name',
     'givenname': 'Given Name',
     'gecos': 'GECOS (public name)',
@@ -53,12 +54,14 @@ full_name = {
 }
 
 can_add = set([
+    'jpegphoto',
     'telephonenumber',
     'mobiletelephonenumber',
     'sshpublickey',
 ])
 can_delete = can_add
 can_modify = can_add | set([
+    'jpegphoto',
     'givenname',
     'surname',
     'commonname',

webapp/templates/vcard.html

@@ -39,15 +39,36 @@
 </div>
 {%- endmacro %}
 
+{% macro avatarfield(name, width=4) -%}
+<div class="col-md-{{width}}" style="margin-bottom: 20px;">
+    <div style="background-color: #eee; padding: 10px 30px; border-radius: 12px; display: flex; flex-direction: row; gap: 20px">
+        <div>
+            <img src="/avatar/{{ profile.uid[0] }}" style="width: 70px; height: 70px; margin: 10px 0" />
+        </div>
+        <div>
+            <h4>{{ name|readable }}</h4>
+            {% if profile[name] %}
+            {% with field = profile[name]|first %}
+                {% if name in can_delete %}
+                <a class="modalLink" href="/vcard/delete/{{ field.uid }}"><span class="glyphicon glyphicon-minus-sign" aria-hidden="true"></span> Remove</a>
+                {% endif %}
+            {% endwith %}
+            {% endif %}
+        </div>
+    </div>
+</div>
+{%- endmacro %}
+
 
 {% extends 'basic.html' %}
 {% block content %}
 <div class="row">
+  {{ avatarfield('jpegphoto') }}
   {{ field('givenname') }}
-  {{ field('gecos', width=8) }}
   {{ field('surname') }}
-  {{ field('commonname', width=8) }}
+  {{ field('gecos', width=8) }}
   {{ field('loginshell') }}
+  {{ field('commonname', width=8) }}
   {{ multifield('telephonenumber') }}
   {{ multifield('mobiletelephonenumber') }}
   {{ multifield('mailroutingaddress', width=8) }}