Commit 6e7910b0 authored by Steffen van Bergerem's avatar Steffen van Bergerem Committed by Benjamin Neff
Browse files

Deduplicate notification dropdown view 

closes #7270
parent abe7ef3d

Changelog.md

+1 −0
Original line number Diff line number Diff line
@@ -9,6 +9,7 @@ 
* Fix background color of year on notifications page with dark theme [#7263](https://github.com/diaspora/diaspora/pull/7263)

* Fix jasmine tests in firefox [#7246](https://github.com/diaspora/diaspora/pull/7246)

* Prevent scroll to top when clicking 'mark all as read' in the notification dropdown [#7253](https://github.com/diaspora/diaspora/pull/7253)

* Update existing notifications in dropdown on fetch [#7270](https://github.com/diaspora/diaspora/pull/7270)



## Features

* Add links to the aspects and followed tags pages on mobile [#7265](https://github.com/diaspora/diaspora/pull/7265)

app/assets/javascripts/app/views/notification_dropdown_view.js

+14 −10
Original line number Diff line number Diff line
@@ -77,22 +77,26 @@ app.views.NotificationDropdown = app.views.Base.extend({ 
  },



  onPushBack: function(notification) {

    var node = this.dropdownNotifications.append(notification.get("note_html"));

    $(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip();

    $(node).find(this.avatars.selector).error(this.avatars.fallback);

    var node = $(notification.get("note_html"));

    this.dropdownNotifications.append(node);

    this.afterNotificationChanges(node);

  },



  onPushFront: function(notification) {

    var node = this.dropdownNotifications.prepend(notification.get("note_html"));

    $(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip();

    $(node).find(this.avatars.selector).error(this.avatars.fallback);

    var node = $(notification.get("note_html"));

    this.dropdownNotifications.prepend(node);

    this.afterNotificationChanges(node);

  },



  onNotificationChange: function(notification) {

    var node = this.dropdownNotifications.find("[data-guid=" + notification.get("id") + "]");

    $(node).replaceWith(notification.get("note_html"));

    $(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip();

    $(node).find(this.avatars.selector).error(this.avatars.fallback);

    var node = $(notification.get("note_html"));

    this.dropdownNotifications.find("[data-guid=" + notification.get("id") + "]").replaceWith(node);

    this.afterNotificationChanges(node);

  },



  afterNotificationChanges: function(node) {

    node.find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip();

    node.find(this.avatars.selector).error(this.avatars.fallback);

  },



  finishLoading: function() {

spec/javascripts/app/views/notification_dropdown_view_spec.js

+73 −0
Original line number Diff line number Diff line
@@ -110,4 +110,77 @@ describe("app.views.NotificationDropdown", function() { 
      expect($.fn.perfectScrollbar).not.toHaveBeenCalled();

    });

  });



  describe("notification changes", function() {

    beforeEach(function() {

      this.collection.fetch();

      jasmine.Ajax.requests.mostRecent().respondWith({

        status: 200,

        responseText: spec.readFixture("notifications_collection")

      });

      this.notification = factory.notification({

        "id": 1337,

        "note_html": "<div class='stream-element' data-guid='1337'>This is a notification</div>"

      });

      expect(this.collection.length).toBeGreaterThan(0);

      expect(this.view.$(".notifications .stream-element").length).toBe(this.collection.length);

    });



    describe("onPushBack", function() {

      it("adds the notification at the end of the rendered list", function() {

        this.view.onPushBack(this.notification);

        expect(this.view.$(".notifications .stream-element").length).toBe(this.collection.length + 1);

        expect(this.view.$(".notifications .stream-element").last().text()).toBe("This is a notification");

      });



      it("calls afterNotificationChanges", function() {

        spyOn(this.view, "afterNotificationChanges");

        this.view.onPushBack(this.notification);

        expect(this.view.afterNotificationChanges).toHaveBeenCalled();

        var node = this.view.afterNotificationChanges.calls.mostRecent().args[0];

        expect(node.text()).toBe("This is a notification");

      });

    });



    describe("onPushFront", function() {

      it("adds the notification to the beginning of the rendered list", function() {

        this.view.onPushFront(this.notification);

        expect(this.view.$(".notifications .stream-element").length).toBe(this.collection.length + 1);

        expect(this.view.$(".notifications .stream-element").first().text()).toBe("This is a notification");

      });



      it("calls afterNotificationChanges", function() {

        spyOn(this.view, "afterNotificationChanges");

        this.view.onPushFront(this.notification);

        expect(this.view.afterNotificationChanges).toHaveBeenCalled();

        var node = this.view.afterNotificationChanges.calls.mostRecent().args[0];

        expect(node.text()).toBe("This is a notification");

      });

    });



    describe("onNotificationChange", function() {

      beforeEach(function() {

        // create a notification which replaces the first in the collection

        var firstNoteId = this.collection.models[0].attributes.id;

        this.notification = factory.notification({

          "id": firstNoteId,

          "note_html": "<div class='stream-element' data-guid='" + firstNoteId + "'>This is a notification</div>"

        });

      });



      it("replaces the notification in the rendered list", function() {

        this.view.onNotificationChange(this.notification);

        expect(this.view.$(".notifications .stream-element").length).toBe(this.collection.length);

        expect(this.view.$(".notifications .stream-element").first().text()).toBe("This is a notification");

      });



      it("calls afterNotificationChanges", function() {

        spyOn(this.view, "afterNotificationChanges");

        this.view.onNotificationChange(this.notification);

        expect(this.view.afterNotificationChanges).toHaveBeenCalled();

        var node = this.view.afterNotificationChanges.calls.mostRecent().args[0];

        expect(node.text()).toBe("This is a notification");

      });

    });

  });

});

spec/javascripts/jasmine_helpers/factory.js

+17 −0
Original line number Diff line number Diff line
@@ -55,6 +55,23 @@ var factory = { 
    return new app.models.Contact(_.extend(attrs, overrides));

  },



  notification: function(overrides) {

    var noteId = this.id.next();

    var defaultAttrs = {

      "type": "reshared",

      "id": noteId,

      "target_type": "Post",

      "target_id": this.id.next(),

      "recipient_id": this.id.next(),

      "unread": true,

      "created_at": "2012-01-04T00:55:30Z",

      "updated_at": "2012-01-04T00:55:30Z",

      "note_html": "This is a notification!"

    };



    return new app.models.Notification(_.extend(defaultAttrs, overrides));

  },



  user : function(overrides) {

    return new app.models.User(factory.userAttrs(overrides));

  },