From 7d711a54bc327ab16504a685991d95b1334c3aab Mon Sep 17 00:00:00 2001
From: Erik Kalkoken <erik.kalkoken@gmail.com>
Date: Thu, 4 Jun 2020 08:25:01 +0000
Subject: [PATCH] Add notifications auto refresh

---
 allianceauth/authentication/urls.py           |  6 ++++-
 allianceauth/authentication/views.py          | 12 ++++++++-
 allianceauth/static/js/base.js                | 27 +++++++++++++++++++
 allianceauth/templates/allianceauth/base.html |  1 +
 .../allianceauth/notifications_menu_item.html |  9 +++++++
 .../templates/allianceauth/top-menu.html      | 20 +++++++-------
 6 files changed, 63 insertions(+), 12 deletions(-)
 create mode 100644 allianceauth/static/js/base.js
 create mode 100644 allianceauth/templates/allianceauth/notifications_menu_item.html

diff --git a/allianceauth/authentication/urls.py b/allianceauth/authentication/urls.py
index 11fee0b9..60f89cdc 100644
--- a/allianceauth/authentication/urls.py
+++ b/allianceauth/authentication/urls.py
@@ -1,5 +1,4 @@
 from django.conf.urls import url
-from django.contrib.auth.decorators import login_required
 from django.views.generic.base import TemplateView
 
 from . import views
@@ -24,4 +23,9 @@ urlpatterns = [
         name='add_character'
     ),   
     url(r'^dashboard/$', views.dashboard, name='dashboard'),
+    url(
+        r'^notifications_render/$', 
+        views.notifications_render, 
+        name='notifications_render'
+    ),
 ]
diff --git a/allianceauth/authentication/views.py b/allianceauth/authentication/views.py
index 98b93a62..d50ba245 100644
--- a/allianceauth/authentication/views.py
+++ b/allianceauth/authentication/views.py
@@ -6,11 +6,13 @@ from django.contrib.auth import login, authenticate
 from django.contrib.auth.decorators import login_required
 from django.contrib.auth.models import User
 from django.core import signing
-from django.urls import reverse
+from django.http import HttpResponse
 from django.shortcuts import redirect, render
+from django.urls import reverse
 from django.utils.translation import gettext_lazy as _
 
 from allianceauth.eveonline.models import EveCharacter
+
 from esi.decorators import token_required
 from esi.models import Token
 
@@ -59,6 +61,14 @@ def dashboard(request):
     return render(request, 'authentication/dashboard.html', context)
 
 
+@login_required
+def notifications_render(request):
+    """returns html to render the notifications item in the top menu"""
+    unread_count = request.user.notification_set.filter(viewed=False).count()
+    context = {'notifications': unread_count}
+    return render(request, 'allianceauth/notifications_menu_item.html', context)
+
+
 @login_required
 @token_required(scopes=settings.LOGIN_TOKEN_SCOPES)
 def main_character_change(request, token):
diff --git a/allianceauth/static/js/base.js b/allianceauth/static/js/base.js
new file mode 100644
index 00000000..e8b64b45
--- /dev/null
+++ b/allianceauth/static/js/base.js
@@ -0,0 +1,27 @@
+/*
+    Javascript for the base template
+*/
+
+$(function() {
+    var elem = document.getElementById("dataExport");
+    var notificationsRenderUrl = elem.getAttribute("data-notificationsRenderUrl");
+    
+    // render the notifications item in the top menu
+    function render_notifications(){
+        $("#menu_item_notifications").load(
+            notificationsRenderUrl, 
+            function(responseTxt, statusTxt, xhr){
+                if(statusTxt == "error")
+                    console.log(
+                        "Failed to load HTMl to render notifications item. Error: " 
+                        + xhr.status 
+                        + ": " 
+                        + xhr.statusText
+                    );
+        });
+    }
+    render_notifications()
+    
+    // re-render notifications every x seconds
+    setInterval(render_notifications, 5000);
+});
diff --git a/allianceauth/templates/allianceauth/base.html b/allianceauth/templates/allianceauth/base.html
index ee7db14d..2a9b1633 100644
--- a/allianceauth/templates/allianceauth/base.html
+++ b/allianceauth/templates/allianceauth/base.html
@@ -45,6 +45,7 @@
 {% endif %}
 {% include 'bundles/bootstrap-js.html' %}
 {% block extra_javascript %}
+    <script src="{% static 'js/base.js' %}"></script>
 {% endblock extra_javascript %}
 <script>
     {% block extra_script %}
diff --git a/allianceauth/templates/allianceauth/notifications_menu_item.html b/allianceauth/templates/allianceauth/notifications_menu_item.html
new file mode 100644
index 00000000..a11a1ccc
--- /dev/null
+++ b/allianceauth/templates/allianceauth/notifications_menu_item.html
@@ -0,0 +1,9 @@
+{% if notifications %}
+    <a href="{% url 'notifications:list' %}">Notifications
+        <span class="badge">{{ notifications }}</span>
+    </a>    
+{% else %}
+    <a href="{% url 'notifications:list' %}">
+        <i class="fa fa-bell-o"></i>
+    </a>    
+{% endif %}
diff --git a/allianceauth/templates/allianceauth/top-menu.html b/allianceauth/templates/allianceauth/top-menu.html
index 85d459a9..06c74e07 100644
--- a/allianceauth/templates/allianceauth/top-menu.html
+++ b/allianceauth/templates/allianceauth/top-menu.html
@@ -20,17 +20,11 @@
                     <li>
                         {% include 'allianceauth/night-toggle.html' %}
                     </li>
-                {% if notifications %}
-                    <li class="{% navactive request 'notifications:' %}">
-                        <a href="{% url 'notifications:list' %}">Notifications
-                            <span class="badge">{{ notifications }}</span>
-                        </a>
+                    <li 
+                        class="{% navactive request 'notifications:' %}" id="menu_item_notifications"
+                    >
+                        {% include 'allianceauth/notifications_menu_item.html' %}
                     </li>
-                {% else %}
-                    <li><a href="{% url 'notifications:list' %}">
-                        <i class="fa fa-bell-o"></i></a>
-                    </li>
-                {% endif %}
                 {% if user.is_authenticated %}
                     {% if user.is_staff %}
                         <li><a href="{% url 'admin:index' %}">{% trans "Admin" %}</a></li>
@@ -64,3 +58,9 @@
         </div>
     </div>
 </nav>
+<!-- share data with JS part -->
+<div 
+    id="dataExport"     
+    data-notificationsRenderUrl="{% url 'authentication:notifications_render' %}"
+>
+</div>