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

Deduplicate notification dropdown view

closes #7270
parent abe7ef3d
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
* Fix background color of year on notifications page with dark theme [#7263](https://github.com/diaspora/diaspora/pull/7263) * 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) * 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) * 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 ## Features
* Add links to the aspects and followed tags pages on mobile [#7265](https://github.com/diaspora/diaspora/pull/7265) * Add links to the aspects and followed tags pages on mobile [#7265](https://github.com/diaspora/diaspora/pull/7265)
......
...@@ -77,22 +77,26 @@ app.views.NotificationDropdown = app.views.Base.extend({ ...@@ -77,22 +77,26 @@ app.views.NotificationDropdown = app.views.Base.extend({
}, },
onPushBack: function(notification) { onPushBack: function(notification) {
var node = this.dropdownNotifications.append(notification.get("note_html")); var node = $(notification.get("note_html"));
$(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip(); this.dropdownNotifications.append(node);
$(node).find(this.avatars.selector).error(this.avatars.fallback); this.afterNotificationChanges(node);
}, },
onPushFront: function(notification) { onPushFront: function(notification) {
var node = this.dropdownNotifications.prepend(notification.get("note_html")); var node = $(notification.get("note_html"));
$(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip(); this.dropdownNotifications.prepend(node);
$(node).find(this.avatars.selector).error(this.avatars.fallback); this.afterNotificationChanges(node);
}, },
onNotificationChange: function(notification) { onNotificationChange: function(notification) {
var node = this.dropdownNotifications.find("[data-guid=" + notification.get("id") + "]"); var node = $(notification.get("note_html"));
$(node).replaceWith(notification.get("note_html")); this.dropdownNotifications.find("[data-guid=" + notification.get("id") + "]").replaceWith(node);
$(node).find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip(); this.afterNotificationChanges(node);
$(node).find(this.avatars.selector).error(this.avatars.fallback); },
afterNotificationChanges: function(node) {
node.find(".unread-toggle .entypo-eye").tooltip("destroy").tooltip();
node.find(this.avatars.selector).error(this.avatars.fallback);
}, },
finishLoading: function() { finishLoading: function() {
......
...@@ -110,4 +110,77 @@ describe("app.views.NotificationDropdown", function() { ...@@ -110,4 +110,77 @@ describe("app.views.NotificationDropdown", function() {
expect($.fn.perfectScrollbar).not.toHaveBeenCalled(); 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");
});
});
});
}); });
...@@ -55,6 +55,23 @@ var factory = { ...@@ -55,6 +55,23 @@ var factory = {
return new app.models.Contact(_.extend(attrs, overrides)); 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) { user : function(overrides) {
return new app.models.User(factory.userAttrs(overrides)); return new app.models.User(factory.userAttrs(overrides));
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment