dashboard: get notifications with ajax

circle/dashboard/static/dashboard/dashboard.js

@@ -212,19 +212,8 @@ $(function () {
     return false;
   });
 
-  /* notification read */
   $("#notification-button").click(function() {
-    $.ajax({
-      type: "POST",
-      url: "/dashboard/notifications/",
-      headers: {"X-CSRFToken": getCookie('csrftoken')}, 
-      success: function(re, textStatus, xhr) { 
-        //console.log("success");
-      },
-      error: function(xhr, textStatus, error) {
-        addMessage('Uh oh :(', 'danger')
-      }
-    });
+      $('.notification-messages').load("/dashboard/notifications/");
   });
 });
 

circle/dashboard/templates/dashboard/_notifications-timeline.html

+{% load i18n %}
 {% for n in notifications %}
   <li class="notification-message">
     <span class="notification-message-subject">
@@ -12,4 +13,8 @@
       {{ n.message }}
     </div>
   </li>
+{% empty %}
+  <li class="notification-message">
+  {% trans "You have no notifications." %}
+  </li>
 {% endfor %}

circle/dashboard/templates/dashboard/index.html

@@ -6,10 +6,10 @@
 {% block navbar-ul %}
   <li class="dropdown" id="notification-button">
     <a href="{% url "dashboard.views.notifications" %}" style="color: white; font-size: 12px;" class="dropdown-toggle" data-toggle="dropdown">
-      Notifications{% if new_notifications > 0 %} <span class="badge">{{ new_notifications }}</span>{% endif %}
+      Notifications{% if new_notifications %} <span class="badge">{{ new_notifications }}</span>{% endif %}
     </a>
     <ul class="dropdown-menu notification-messages">
-      {% include "dashboard/_notifications-timeline.html" %}
+        <li>{% trans "Loading..." %}</li>
     </ul>
   </li>
 {% endblock %}

circle/dashboard/views.py

@@ -82,7 +82,6 @@ class IndexView(LoginRequiredMixin, TemplateView):
         })
 
         if user is not None:
-            context['notifications'] = user.notification_set.all()[:10]
             context['new_notifications'] = user.notification_set.filter(
                 status="new").count()
 
@@ -1660,7 +1659,12 @@ class NodeGraphView(SuperuserRequiredMixin, GraphViewBase):
 
 
 class NotificationView(LoginRequiredMixin, TemplateView):
-    template_name = "dashboard/notifications.html"
+
+    def get_template_names(self):
+        if self.request.is_ajax():
+            return ['dashboard/_notifications-timeline.html']
+        else:
+            return ['dashboard/notifications.html']
 
     def get_context_data(self, *args, **kwargs):
         context = super(NotificationView, self).get_context_data(
@@ -1668,8 +1672,9 @@ class NotificationView(LoginRequiredMixin, TemplateView):
         # we need to convert it to list, otherwise it's gonna be
         # similar to a QuerySet and update everything to
         # read status after get
+        n = 10 if self.request.is_ajax() else 1000
         context['notifications'] = list(
-            self.request.user.notification_set.values())
+            self.request.user.notification_set.values()[:n])
         return context
 
     def get(self, *args, **kwargs):
@@ -1679,15 +1684,3 @@ class NotificationView(LoginRequiredMixin, TemplateView):
             u.status = "read"
             u.save()
         return response
-
-    def post(self, request, *args, **kwargs):
-        # unread notifications
-        un = request.user.notification_set.filter(status="new")
-        for u in un:
-            u.status = "read"
-            u.save()
-
-        if request.is_ajax():
-            return HttpResponse({'result': 'ok'})
-        else:
-            pass