From 4714a562d9f277ec26b22165445a8b35b739439e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?R=C3=A9gis=20Hanol?= Date: Tue, 3 Mar 2015 16:17:07 +0100 Subject: [PATCH] FIX: Poll requires logged in user to log in again FIX: Open/Closing the poll wasn't updating the UI REFACTOR: ES6 FTW --- .../javascripts/controllers/poll.js.es6 | 40 +++++----- .../javascripts/discourse/templates/poll.hbs | 38 ++++----- .../javascripts/initializers/poll.js.es6 | 78 ++++--------------- .../assets/javascripts/models/poll.js.es6 | 42 ++++++++++ .../poll/assets/javascripts/poll_bbcode.js | 2 +- .../poll/assets/javascripts/views/poll.js.es6 | 4 + plugins/poll/plugin.rb | 2 + 7 files changed, 100 insertions(+), 106 deletions(-) create mode 100644 plugins/poll/assets/javascripts/models/poll.js.es6 create mode 100644 plugins/poll/assets/javascripts/views/poll.js.es6 diff --git a/plugins/poll/assets/javascripts/controllers/poll.js.es6 b/plugins/poll/assets/javascripts/controllers/poll.js.es6 index f582c58f686..93330cf3fb8 100644 --- a/plugins/poll/assets/javascripts/controllers/poll.js.es6 +++ b/plugins/poll/assets/javascripts/controllers/poll.js.es6 @@ -4,42 +4,44 @@ export default DiscourseController.extend({ poll: null, showResults: Em.computed.oneWay('poll.closed'), disableRadio: Em.computed.any('poll.closed', 'loading'), - showToggleClosePoll: function() { - return this.get('poll.post.topic.details.can_edit'); - }.property('poll.post.topic.details.can_edit'), + showToggleClosePoll: Em.computed.alias('poll.post.topic.details.can_edit'), actions: { - selectOption: function(option) { + selectOption(option) { if (this.get('disableRadio')) { return; } - if (!this.get('currentUser.id')) { + if (!this.get('postController.currentUser.id')) { this.get('postController').send('showLogin'); return; } this.set('loading', true); + + const self = this; this.get('poll').saveVote(option).then(function() { - this.set('loading', false); - this.set('showResults', true); - }.bind(this)); + self.setProperties({ loading: false, showResults: true}); + }); }, - toggleShowResults: function() { - this.set('showResults', !this.get('showResults')); + toggleShowResults() { + this.toggleProperty('showResults'); }, - toggleClosePoll: function() { + toggleClosePoll() { + const self = this; + this.set('loading', true); - return Discourse.ajax("/poll/toggle_close", { - type: "PUT", - data: {post_id: this.get('poll.post.id')} - }).then(function(topicJson) { - this.set('poll.post.topic.title', topicJson.basic_topic.title); - this.set('poll.post.topic.fancy_title', topicJson.basic_topic.title); - this.set('loading', false); - }.bind(this)); + + return Discourse.ajax('/poll/toggle_close', { + type: 'PUT', + data: { post_id: this.get('poll.post.id') } + }).then(function(result) { + self.set('poll.post.topic.title', result.basic_topic.title); + self.set('poll.post.topic.fancy_title', result.basic_topic.title); + self.set('loading', false); + }); } } }); diff --git a/plugins/poll/assets/javascripts/discourse/templates/poll.hbs b/plugins/poll/assets/javascripts/discourse/templates/poll.hbs index 51dfd73c0b2..1df25e9f3c4 100644 --- a/plugins/poll/assets/javascripts/discourse/templates/poll.hbs +++ b/plugins/poll/assets/javascripts/discourse/templates/poll.hbs @@ -1,12 +1,12 @@ {{#each po in poll.options}} - + @@ -15,27 +15,23 @@
- +
{{{po.option}}}
- {{#if controller.showResults}} + {{#if showResults}}
{{i18n 'poll.voteCount' count=po.votes}}
{{/if}}
- - -{{#if showToggleClosePoll}} - -{{/if}} + + {{#if showToggleClosePoll}} + + {{/if}}
{{loading-spinner condition=loading}} diff --git a/plugins/poll/assets/javascripts/initializers/poll.js.es6 b/plugins/poll/assets/javascripts/initializers/poll.js.es6 index 701b6edad18..45b102311a9 100644 --- a/plugins/poll/assets/javascripts/initializers/poll.js.es6 +++ b/plugins/poll/assets/javascripts/initializers/poll.js.es6 @@ -1,65 +1,17 @@ +import Poll from "discourse/plugins/poll/models/poll"; +import PollView from "discourse/plugins/poll/views/poll"; import PollController from "discourse/plugins/poll/controllers/poll"; + import PostView from "discourse/views/post"; -var Poll = Discourse.Model.extend({ - post: null, - options: [], - closed: false, - - postObserver: function() { - this.updateFromJson(this.get('post.poll_details')); - }.observes('post.poll_details'), - - fetchNewPostDetails: Discourse.debounce(function() { - var self = this; - Discourse.debounce(function() { - self.get('post.topic.postStream').triggerChangedPost(self.get('post.id'), self.get('post.topic.updated_at')); - }, 500); - }).observes('post.topic.title'), - - updateFromJson: function(json) { - var selectedOption = json["selected"]; - - var options = []; - Object.keys(json["options"]).forEach(function(option) { - options.push(Ember.Object.create({ - option: option, - votes: json["options"][option], - checked: (option === selectedOption) - })); - }); - - this.set('options', options); - this.set('closed', json.closed); - }, - - saveVote: function(option) { - this.get('options').forEach(function(opt) { - opt.set('checked', opt.get('option') === option); - }); - - return Discourse.ajax("/poll", { - type: "PUT", - data: {post_id: this.get('post.id'), option: option} - }).then(function(newJSON) { - this.updateFromJson(newJSON); - }.bind(this)); - } -}); - -var PollView = Ember.View.extend({ - templateName: "poll", - classNames: ['poll-ui'], -}); - function initializePollView(self) { - var post = self.get('post'); - var pollDetails = post.get('poll_details'); + const post = self.get('post'), + pollDetails = post.get('poll_details'); - var poll = Poll.create({post: post}); + let poll = Poll.create({ post: post }); poll.updateFromJson(pollDetails); - var pollController = PollController.create({ + const pollController = PollController.create({ poll: poll, showResults: pollDetails["selected"], postController: self.get('controller') @@ -74,29 +26,25 @@ export default { initialize: function() { PostView.reopen({ createPollUI: function($post) { - var post = this.get('post'); - - if (!post.get('poll_details')) { + if (!this.get('post').get('poll_details')) { return; } - var view = initializePollView(this); - var pollContainer = $post.find(".poll-ui:first"); + let view = initializePollView(this), + pollContainer = $post.find(".poll-ui:first"); + if (pollContainer.length === 0) { pollContainer = $post.find("ul:first"); } - var $div = $('
'); + let $div = $('
'); pollContainer.replaceWith($div); view.constructor.renderer.appendTo(view, $div[0]); this.set('pollView', view); - }.on('postViewInserted'), clearPollView: function() { - if (this.get('pollView')) { - this.get('pollView').destroy(); - } + if (this.get('pollView')) { this.get('pollView').destroy(); } }.on('willClearRender') }); } diff --git a/plugins/poll/assets/javascripts/models/poll.js.es6 b/plugins/poll/assets/javascripts/models/poll.js.es6 new file mode 100644 index 00000000000..af5abdb9498 --- /dev/null +++ b/plugins/poll/assets/javascripts/models/poll.js.es6 @@ -0,0 +1,42 @@ +export default Discourse.Model.extend({ + post: null, + options: [], + closed: false, + + postObserver: function() { + this.updateFromJson(this.get('post.poll_details')); + }.observes('post.poll_details'), + + fetchNewPostDetails: Discourse.debounce(function() { + this.get('post.topic.postStream').triggerChangedPost(this.get('post.id'), this.get('post.topic.updated_at')); + }, 250).observes('post.topic.title'), + + updateFromJson(json) { + const selectedOption = json["selected"]; + let options = []; + + Object.keys(json["options"]).forEach(function(option) { + options.push(Ember.Object.create({ + option: option, + votes: json["options"][option], + checked: option === selectedOption + })); + }); + + this.setProperties({ options: options, closed: json.closed }); + }, + + saveVote(option) { + this.get('options').forEach(function(opt) { + opt.set('checked', opt.get('option') === option); + }); + + const self = this; + return Discourse.ajax("/poll", { + type: "PUT", + data: { post_id: this.get('post.id'), option: option } + }).then(function(newJSON) { + self.updateFromJson(newJSON); + }); + } +}); diff --git a/plugins/poll/assets/javascripts/poll_bbcode.js b/plugins/poll/assets/javascripts/poll_bbcode.js index f8d7c845aa0..4e0c6f86c5f 100644 --- a/plugins/poll/assets/javascripts/poll_bbcode.js +++ b/plugins/poll/assets/javascripts/poll_bbcode.js @@ -4,6 +4,6 @@ Discourse.Dialect.inlineBetween({ rawContents: true, emitter: function(contents) { var list = Discourse.Dialect.cook(contents, {}); - return ['div', {class: 'poll-ui'}, list]; + return ['div', { class: 'poll-ui' }, list]; } }); diff --git a/plugins/poll/assets/javascripts/views/poll.js.es6 b/plugins/poll/assets/javascripts/views/poll.js.es6 new file mode 100644 index 00000000000..74efb078ab3 --- /dev/null +++ b/plugins/poll/assets/javascripts/views/poll.js.es6 @@ -0,0 +1,4 @@ +export default Ember.View.extend({ + templateName: "poll", + classNames: ['poll-ui'], +}); diff --git a/plugins/poll/plugin.rb b/plugins/poll/plugin.rb index 56abf4f3029..884690e0fa7 100644 --- a/plugins/poll/plugin.rb +++ b/plugins/poll/plugin.rb @@ -145,7 +145,9 @@ after_initialize do end # Poll UI. +register_asset "javascripts/models/poll.js.es6" register_asset "javascripts/controllers/poll.js.es6" +register_asset "javascripts/views/poll.js.es6" register_asset "javascripts/discourse/templates/poll.hbs" register_asset "javascripts/initializers/poll.js.es6" register_asset "javascripts/poll_bbcode.js", :server_side