Add messages.html

and refactoring base.html, user.html

app/templates/base.html

@@ -43,6 +43,16 @@
               <a class="nav-link" aria-current="page" href="{{ url_for('auth.login') }}">{{ _('Login') }}</a>
             </li>
             {% else %}
+            <li class="nav-item">
+              <a class="nav-link" aria-current="page" href="{{ url_for('main.messages') }}">{{ _('Messages') }}
+                {% set unread_message_count = current_user.unread_message_count() %}
+                <span id="message_count" class="badge text-bg-danger"
+                      style="visibility: {% if unread_message_count %}visible
+                                         {% else %}hidden{% endif %};">
+                    {{ unread_message_count }}
+                </span>
+              </a>
+            </li>
             <li class="nav-item">
               <a class="nav-link" aria-current="page" href="{{ url_for('main.user', username=current_user.username) }}">{{ _('Profile') }}</a>
             </li>
@@ -117,6 +127,28 @@
         }
       }
       document.addEventListener('DOMContentLoaded', initialize_popovers);
+
+      function set_message_count(n) {
+        const count = document.getElementById('message_count');
+        count.innerText = n;
+        count.style.visibility = n ? 'visible' : 'hidden';
+      }
+
+      {% if current_user.is_authenticated %}
+      function initialize_notifications() {
+        let since = 0;
+        setInterval(async function() {
+          const response = await fetch('{{ url_for('main.notifications') }}?since=' + since);
+          const notifications = await response.json();
+          for (let i = 0; i < notifications.length; i++) {
+            if (notifications[i].name == 'unread_message_count')
+              set_message_count(notifications[i].data);
+            since = notifications[i].timestamp;
+          }
+        }, 10000);
+      }
+      document.addEventListener('DOMContentLoaded', initialize_notifications);
+      {% endif %}
     </script>
   </body>
 </html>

app/templates/messages.html

@@ -0,0 +1,22 @@
+{% extends "base.html" %}
+
+{% block content %}
+    <h1>{{ _('Messages') }}</h1>
+    {% for post in messages %}
+        {% include '_post.html' %}
+    {% endfor %}
+    <nav aria-label="Post navigation">
+        <ul class="pagination">
+            <li class="page-item{% if not prev_url %} disabled{% endif %}">
+                <a class="page-link" href="#">
+                    <span aria-hidden="true">&larr;</span> {{ _('Newer messages') }}
+                </a>
+            </li>
+            <li class="page-item{% if not next_url %} disabled{% endif %}">
+                <a class="page-link" href="#">
+                    {{ _('Older messages') }} <span aria-hidden="true">&rarr;</span>
+                </a>
+            </li>
+        </ul>
+    </nav>
+{% endblock %}

app/templates/user.html

@@ -28,6 +28,9 @@ <h1>{{ _('User') }}: {{ user.username }}</h1>
                     </form>
                 </p>
                 {% endif %}
+                {% if user != current_user %}
+                <p><a href="{{ url_for('main.send_message', recipient=user.username) }}">{{ _('Send private message') }}</a></p>
+                {% endif %}
             </td>
         </tr>
     </table>