refactors header notifications (renders them via separate controller / template)

2013-11-08 21:06:27 +01:00
parent 965a0a91a2
commit 67a1da7af4
14 changed files with 244 additions and 75 deletions
@@ -9,6 +9,7 @@
 Discourse.HeaderController = Discourse.Controller.extend({
  topic: null,
  showExtraInfo: null,
+  notifications: null,

  categories: function() {
    return Discourse.Category.list();
@@ -39,6 +40,16 @@ Discourse.HeaderController = Discourse.Controller.extend({

    toggleMobileView: function() {
      Discourse.Mobile.toggleMobileView();
+    },
+
+    showNotifications: function(headerView) {
+      var self = this;
+
+      Discourse.ajax("/notifications").then(function(result) {
+        self.set("notifications", result);
+        self.set("currentUser.unread_notifications", 0);
+        headerView.showDropdownBySelector("#user-notifications");
+      });
    }
  }

@@ -0,0 +1,17 @@
+Discourse.NotificationController = Discourse.ObjectController.extend({
+  scope: function() {
+    return "notifications." + Discourse.Site.currentProp("notificationLookup")[this.get("notification_type")];
+  }.property(),
+
+  username: function() {
+    return this.get("data.display_username");
+  }.property(),
+
+  link: function() {
+    if (this.blank("data.topic_title")) {
+      return "";
+    }
+    var url = Discourse.Utilities.postUrl(this.get("slug"), this.get("topic_id"), this.get("post_number"));
+    return '<a href="' + url + '">' + this.get("data.topic_title") + '</a>';
+  }.property()
+});
@@ -0,0 +1,3 @@
+Discourse.NotificationsController = Ember.ArrayController.extend(Discourse.HasCurrentUser, {
+  itemController: "notification"
+});
@@ -34,6 +34,13 @@ Ember.Handlebars.registerHelper('i18n', function(property, options) {
  return I18n.t(property, params);
 });

+/**
+ Bound version of i18n helper.
+ **/
+Ember.Handlebars.registerBoundHelper("boundI18n", function(property, options) {
+  return new Handlebars.SafeString(I18n.t(property, options.hash));
+});
+
 /**
  Set up an i18n binding that will update as a count changes, complete with pluralization.

@@ -1,42 +0,0 @@
-/**
-  A data model representing a notification a user receives
-
-  @class Notification
-  @extends Discourse.Model
-  @namespace Discourse
-  @module Discourse
-**/
-Discourse.Notification = Discourse.Model.extend({
-
-  readClass: (function() {
-    if (this.read) return 'read';
-    return '';
-  }).property('read'),
-
-  url: function() {
-    if (this.blank('data.topic_title')) return "";
-    return Discourse.Utilities.postUrl(this.get('slug'), this.get('topic_id'), this.get('post_number'));
-  }.property(),
-
-  rendered: function() {
-    var notificationName = Discourse.Site.currentProp('notificationLookup')[this.notification_type];
-    return I18n.t("notifications." + notificationName, {
-      username: this.data.display_username,
-      link: "<a href='" + (this.get('url')) + "'>" + this.data.topic_title + "</a>"
-    });
-  }.property()
-
-});
-
-Discourse.Notification.reopenClass({
-  create: function(obj) {
-    obj = obj || {};
-
-    if (obj.data) {
-      obj.data = Em.Object.create(obj.data);
-    }
-    return this._super(obj);
-  }
-});
-
-
@@ -94,20 +94,7 @@

      {{render search}}

-      <section class='d-dropdown' id='notifications-dropdown'>
-        {{#if view.notifications}}
-          <ul>
-            {{#each view.notifications}}
-            <li class="{{unbound readClass}}">{{{unbound rendered}}}</li>
-            {{/each}}
-            <li class='read last'>
-              <a {{bindAttr href="currentUser.path"}}>{{i18n notifications.more}} &hellip;</a>
-            </li>
-          </ul>
-        {{else}}
-          <div class='none'>{{i18n notifications.none}}</div>
-        {{/if}}
-      </section>
+      {{render notifications notifications}}

      <section class='d-dropdown' id='site-map-dropdown'>
      <ul class="location-links">
@@ -0,0 +1,14 @@
+<section class="d-dropdown" id="notifications-dropdown">
+  {{#if content}}
+    <ul>
+      {{#each}}
+        <li {{bind-attr class="read"}}>{{unbound boundI18n scope linkBinding="link" usernameBinding="username"}}</li>
+      {{/each}}
+      <li class="read last">
+        <a {{bind-attr href="currentUser.path"}}>{{i18n notifications.more}} &hellip;</a>
+      </li>
+    </ul>
+  {{else}}
+    <div class="none">{{i18n notifications.none}}</div>
+  {{/if}}
+</section>
@@ -48,19 +48,12 @@ Discourse.HeaderView = Discourse.View.extend({
    return false;
  },

+  showDropdownBySelector: function(selector) {
+    this.showDropdown($(selector));
+  },
+
  showNotifications: function() {
-
-    var headerView = this;
-    Discourse.ajax('/notifications').then(function(result) {
-      headerView.set('notifications', result.map(function(n) {
-        return Discourse.Notification.create(n);
-      }));
-
-      // We've seen all the notifications now
-      Discourse.User.current().set('unread_notifications', 0);
-      headerView.showDropdown($('#user-notifications'));
-    });
-    return false;
+    this.get("controller").send("showNotifications", this);
  },

  examineDockHeader: function() {
@@ -106,7 +99,8 @@ Discourse.HeaderView = Discourse.View.extend({
      return headerView.showDropdown($(e.currentTarget));
    });
    this.$('a.unread-private-messages, a.unread-notifications, a[data-notifications]').on('click.notifications', function(e) {
-      return headerView.showNotifications(e);
+      headerView.showNotifications(e);
+      return false;
    });
    $(window).bind('scroll.discourse-dock', function() {
      headerView.examineDockHeader();