From 1421bbc6752f7a8eeeb25da1c5edf6f99bd301cd Mon Sep 17 00:00:00 2001 From: Gabor Javorszky Date: Fri, 19 Jul 2013 00:53:08 +0100 Subject: [PATCH] Adding notifications to settings and content pages Closes #290. In theory. * moved flashviews to base.js, renamed to notifications * added failures to post editor screen * added notifications to settings (success, failure) * added notifications when deleting posts Most of these are not visible due to CSS rules, as overhauling that is a task in and of itself. The notifications do show up in the inspector though, so all is well. --- ghost/admin/views/base.js | 48 ++++++++++++++++++++++ ghost/admin/views/blog.js | 22 +++++++++- ghost/admin/views/editor.js | 75 ++++++++++------------------------- ghost/admin/views/settings.js | 37 +++++++++++++++-- 4 files changed, 124 insertions(+), 58 deletions(-) diff --git a/ghost/admin/views/base.js b/ghost/admin/views/base.js index 2511f38375..e4abf234ba 100644 --- a/ghost/admin/views/base.js +++ b/ghost/admin/views/base.js @@ -72,4 +72,52 @@ } }); + /** + * This is the view to generate the markup for the individual + * notification. Will be included into #flashbar. + * + * States can be + * - persistent + * - passive + * + * Types can be + * - error + * - success + * - alert + * - (empty) + * + */ + Ghost.Views.Notification = Ghost.View.extend({ + templateName: 'notification', + className: 'js-bb-notification', + template: function (data) { + return JST[this.templateName](data); + }, + render: function() { + var html = this.template(this.model); + this.$el.html(html); + return this; + } + }); + + + /** + * This handles Notification groups + */ + Ghost.Views.NotificationCollection = Ghost.View.extend({ + el: '#flashbar', + initialize: function() { + this.render(); + }, + render: function() { + _.each(this.model, function (item) { + this.renderItem(item); + }, this); + }, + renderItem: function (item) { + var itemView = new Ghost.Views.Notification({ model: item }); + this.$el.html(itemView.render().el); + } + }); + }()); diff --git a/ghost/admin/views/blog.js b/ghost/admin/views/blog.js index a08920e4e3..fba02d7222 100644 --- a/ghost/admin/views/blog.js +++ b/ghost/admin/views/blog.js @@ -148,8 +148,26 @@ deletePost: function (e) { e.preventDefault(); if (window.confirm('Are you sure you want to delete this post?')) { - this.model.destroy({ + var self = this; + + self.model.destroy({ wait: true + }).then(function () { + self.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'success', + message: 'Your post: ' + self.model.get('title') + ' has been deleted', + status: 'passive' + }] + })); + }, function () { + self.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'error', + message: 'Your post: ' + self.model.get('title') + ' has not been deleted.', + status: 'passive' + }] + })); }); } }, @@ -181,4 +199,4 @@ }); -}()); \ No newline at end of file +}()); diff --git a/ghost/admin/views/editor.js b/ghost/admin/views/editor.js index 732973bd45..4cbb37e084 100644 --- a/ghost/admin/views/editor.js +++ b/ghost/admin/views/editor.js @@ -93,14 +93,21 @@ this.savePost({ status: keys[newIndex] }).then(function () { - this.addSubview(new Ghost.Views.FlashCollectionView({ + this.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'success', message: 'Your post: ' + model.get('title') + ' has been ' + keys[newIndex], status: 'passive' }] })); - // window.alert('Your post: ' + model.get('title') + ' has been ' + keys[newIndex]); + }, function () { + this.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'error', + message: 'Your post: ' + model.get('title') + ' has not been ' + keys[newIndex], + status: 'passive' + }] + })); }); }, @@ -111,7 +118,7 @@ self = this; if (status === 'publish-on') { - this.addSubview(new Ghost.Views.FlashCollectionView({ + this.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'alert', message: 'Scheduled publishing not supported yet.', @@ -121,7 +128,7 @@ // return window.alert('Scheduled publishing not supported yet.'); } if (status === 'queue') { - this.addSubview(new Ghost.Views.FlashCollectionView({ + this.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'alert', message: 'Scheduled publishing not supported yet.', @@ -134,7 +141,7 @@ this.savePost({ status: status }).then(function () { - self.addSubview(new Ghost.Views.FlashCollectionView({ + self.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'success', message: 'Your post: ' + model.get('title') + ' has been ' + status, @@ -142,6 +149,14 @@ }] })); // window.alert('Your post: ' + model.get('title') + ' has been ' + status); + }, function () { + self.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'error', + message: 'Your post: ' + model.get('title') + ' has not been ' + status, + status: 'passive' + }] + })); }); }, @@ -152,7 +167,7 @@ var model = this.model, self = this; this.savePost().then(function () { - self.addSubview(new Ghost.Views.FlashCollectionView({ + self.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'success', message: 'Your post was saved as ' + model.get('status'), @@ -161,7 +176,7 @@ })); // window.alert('Your post was saved as ' + model.get('status')); }, function () { - self.addSubview(new Ghost.Views.FlashCollectionView({ + self.addSubview(new Ghost.Views.NotificationCollection({ model: [{ type: 'error', message: model.validationError, @@ -298,52 +313,6 @@ } }); - /** - * This is the view to generate the markup for the individual - * notification. Will be included into #flashbar. - * - * States can be - * - persistent - * - passive - * - * Types can be - * - error - * - success - * - alert - * - (empty) - * - */ - Ghost.Views.FlashView = Ghost.View.extend({ - templateName: 'notification', - className: 'js-bb-notification', - template: function (data) { - return JST[this.templateName](data); - }, - render: function() { - var html = this.template(this.model); - this.$el.html(html); - return this; - } - }); - /** - * This handles Notification groups - */ - Ghost.Views.FlashCollectionView = Ghost.View.extend({ - el: '#flashbar', - initialize: function() { - this.render(); - }, - render: function() { - _.each(this.model, function (item) { - this.renderItem(item); - }, this); - }, - renderItem: function (item) { - var itemView = new Ghost.Views.FlashView({ model: item }); - this.$el.prepend(itemView.render().el); - } - }); - }()); diff --git a/ghost/admin/views/settings.js b/ghost/admin/views/settings.js index 841a568425..5a32259e10 100644 --- a/ghost/admin/views/settings.js +++ b/ghost/admin/views/settings.js @@ -86,7 +86,22 @@ email: this.$('#email-address').val() }, { success: function () { - window.alert('Saved'); + this.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'success', + message: 'Saved', + status: 'passive' + }] + })); + }, + error: function () { + this.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'error', + message: 'Something went wrong, not saved :(', + status: 'passive' + }] + })); } }); }, @@ -110,7 +125,23 @@ description: this.$('#blog-description').val() }, { success: function () { - window.alert('Saved'); + this.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'success', + message: 'Saved', + status: 'passive' + }] + })); + + }, + error: function () { + this.addSubview(new Ghost.Views.NotificationCollection({ + model: [{ + type: 'error', + message: 'Something went wrong, not saved :(', + status: 'passive' + }] + })); } }); }, @@ -150,4 +181,4 @@ } }); -}()); \ No newline at end of file +}());