codeninjasllc/discourse
1
0
Fork 0
mirror of https://github.com/codeninjasllc/discourse.git synced 2024-11-23 23:58:31 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Speech bubble waiting for an ajax response prior to rendering

Browse source
This commit is contained in:
Arpit Jalan 2014-05-09 22:23:27 +05:30
parent aa9a8aa217
commit 93cff8deb5
7 changed files with 46 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
app/assets/javascripts/discourse/controllers/header.js.es6
View file

@ -10,6 +10,7 @@ export default Discourse.Controller.extend({
topic: null, topic: null,
showExtraInfo: null, showExtraInfo: null,
notifications: null, notifications: null,
loading_notifications: null,
showStarButton: function() { showStarButton: function() {
return Discourse.User.current() && !this.get('topic.isPrivateMessage'); return Discourse.User.current() && !this.get('topic.isPrivateMessage');
@ -25,11 +26,17 @@ export default Discourse.Controller.extend({
showNotifications: function(headerView) { showNotifications: function(headerView) {
var self = this; var self = this;
Discourse.ajax("/notifications").then(function(result) { if (self.get('currentUser.unread_notifications') || self.get('currentUser.unread_private_messages') || !self.get('notifications')) {
self.set("notifications", result); self.set("loading_notifications", true);
self.set("currentUser.unread_notifications", 0); Discourse.ajax("/notifications").then(function(result) {
headerView.showDropdownBySelector("#user-notifications"); self.setProperties({
}); notifications: result,
loading_notifications: false,
'currentUser.unread_notifications': 0
});
});
}
headerView.showDropdownBySelector("#user-notifications");
}, },
jumpToTopPost: function () { jumpToTopPost: function () {
@ -41,5 +48,3 @@ export default Discourse.Controller.extend({
} }
}); });

1
app/assets/javascripts/discourse/controllers/notifications_controller.js
View file

@ -1,3 +1,4 @@
Discourse.NotificationsController = Ember.ArrayController.extend(Discourse.HasCurrentUser, { Discourse.NotificationsController = Ember.ArrayController.extend(Discourse.HasCurrentUser, {
needs: ['header'],
itemController: "notification" itemController: "notification"
}); });

26
app/assets/javascripts/discourse/templates/notifications.js.handlebars
View file

@ -1,14 +1,18 @@
<section class="d-dropdown" id="notifications-dropdown"> <section class="d-dropdown" id="notifications-dropdown">
{{#if content}} {{#unless controllers.header.loading_notifications}}
<ul> {{#if content}}
{{#each}} <ul>
<li {{bind-attr class="read"}}>{{unbound boundI18n scope linkBinding="link" usernameBinding="username"}}</li> {{#each}}
{{/each}} <li {{bind-attr class="read"}}>{{unbound boundI18n scope linkBinding="link" usernameBinding="username"}}</li>
<li class="read last"> {{/each}}
<a {{bind-attr href="currentUser.path"}}>{{i18n notifications.more}} &hellip;</a> <li class="read last">
</li> <a {{bind-attr href="currentUser.path"}}>{{i18n notifications.more}} &hellip;</a>
</ul> </li>
</ul>
{{else}}
<div class="none">{{i18n notifications.none}}</div>
{{/if}}
{{else}} {{else}}
<div class="none">{{i18n notifications.none}}</div> <div class='loading'><i class='fa fa-spinner fa-spin'></i></div>
{{/if}} {{/unless}}
</section> </section>

7
app/assets/stylesheets/desktop/header.scss
View file

@ -204,6 +204,13 @@
.none { .none {
padding: 5px; padding: 5px;
} }
.loading {
padding: 10px;
display: block;
color: scale-color($primary, $lightness: 50%);
font-size: 24px;
text-align: center;
}
} }
// Search // Search

7
app/assets/stylesheets/mobile/header.scss
View file

@ -194,6 +194,13 @@
.none { .none {
padding: 5px; padding: 5px;
} }
.loading {
padding: 10px;
display: block;
color: #777;
font-size: 24px;
text-align: center;
}
} }
// Search // Search

2
test/javascripts/controllers/header_controller_test.js
View file

@ -23,7 +23,7 @@ test("showNotifications action", function() {
equal(controller.get("notifications"), null, "notifications are null before data has finished loading"); equal(controller.get("notifications"), null, "notifications are null before data has finished loading");
equal(Discourse.User.current().get("unread_notifications"), 1, "current user's unread notifications count is not zeroed before data has finished loading"); equal(Discourse.User.current().get("unread_notifications"), 1, "current user's unread notifications count is not zeroed before data has finished loading");
ok(viewSpy.showDropdownBySelector.notCalled, "dropdown with notifications is not shown before data has finished loading"); ok(viewSpy.showDropdownBySelector.calledWith("#user-notifications"), "dropdown with loading glyph is shown before data has finished loading");
Ember.run(function() { Ember.run(function() {

4
test/javascripts/controllers/notifications_controller_test.js
View file

@ -17,7 +17,9 @@ module("Discourse.NotificationsController", {
return [scope, options.username, options.link].join(" ").trim(); return [scope, options.username, options.link].join(" ").trim();
}); });
controller = Discourse.NotificationsController.create(); controller = Discourse.NotificationsController.create({
container: Discourse.__container__
});
view = Ember.View.create({ view = Ember.View.create({
container: Discourse.__container__, container: Discourse.__container__,