diff --git a/app/assets/javascripts/app/models/poll_participation.js b/app/assets/javascripts/app/models/poll_participation.js index a31c35779..99b73645c 100644 --- a/app/assets/javascripts/app/models/poll_participation.js +++ b/app/assets/javascripts/app/models/poll_participation.js @@ -1,5 +1,5 @@ app.models.PollParticipation = Backbone.Model.extend({ - url : function(){ - "/poll_participations" + urlRoot: function(){ + return 'posts/' + this.get('post_id') + "/poll_participations"; } -}); \ No newline at end of file +}); diff --git a/app/assets/javascripts/app/views/poll_view.js b/app/assets/javascripts/app/views/poll_view.js index 9a1df2a88..18990c88d 100644 --- a/app/assets/javascripts/app/views/poll_view.js +++ b/app/assets/javascripts/app/views/poll_view.js @@ -1,94 +1,81 @@ app.views.Poll = app.views.Base.extend({ - templateName : "poll", + templateName: "poll", - events : { - "click .submit" : "vote", + events: { + "click .submit" : "clickSubmit", "click .toggle_result" : "toggleResult" }, - initialize : function(options) { + initialize: function(options) { + this.model.bind('change', this.render, this); + }, + + postRenderTemplate: function() { this.poll = this.model.attributes.poll; this.progressBarFactor = 3; - this.toggleMode = 0; - }, - - postRenderTemplate : function() { - if(this.poll) { - this.setProgressBar(); - } - }, - - removeForm : function() { - var cnt = this.$("form").contents(); - this.$("form").replaceWith(cnt); - this.$('input').remove(); - this.$('submit').remove(); - this.$('.toggle_result_wrapper').remove(); - }, - - setProgressBar : function() { - var answers = this.poll.poll_answers; - for(index = 0; index < answers.length; ++index) { - var percentage = 0; - if(this.poll.participation_count != 0) { - percentage = Math.round(answers[index].vote_count / this.poll.participation_count * 100); - } - var progressBar = this.$(".poll_progress_bar[data-answerid="+answers[index].id+"]"); - progressBar.parent().next().html(" - " + percentage + "%"); - var width = percentage * this.progressBarFactor; - progressBar.css("width", width + "px"); - } - }, - - toggleResult : function(e) { - this.$('.poll_progress_bar_wrapper').toggle(); - this.$('.percentage').toggle(); - if(this.toggleMode == 0) { - this.$('.toggle_result').html(Diaspora.I18n.t("poll.close_result")); - this.toggleMode = 1; - }else{ - this.$('.toggle_result').html(Diaspora.I18n.t("poll.show_result")); - this.toggleMode = 0; - } - return false; - }, - - refreshResult : function(answerId) { - this.updateCounter(answerId); this.setProgressBar(); }, - updateCounter : function(answerId) { - this.poll.participation_count++; - this.$('.poll_statistic').html(Diaspora.I18n.t("poll.count", {"count" : this.poll.participation_count})); + setProgressBar: function() { + if(!this.poll) return; + var answers = this.poll.poll_answers; - for(index = 0; index < answers.length; ++index) { - if(answers[index].id == answerId) { - answers[index].vote_count++; - return; + var participation_count = this.poll.participation_count; + var _this = this; + + _.each(answers, function(answer){ + var percent = 0; + if(participation_count > 0) { + percent = Math.round(answer.vote_count / participation_count * 100); } + + var progressBar = _this.$(".poll_progress_bar[data-answerid="+answer.id+"]"); + var width = percent * _this.progressBarFactor; + + progressBar.parent().next().html(" - " + percent + "%"); + progressBar.css("width", width + "px"); + }); + }, + + toggleResult: function(e) { + if(e) + e.preventDefault(); + + this.$('.poll_progress_bar_wrapper').toggle(); + this.$('.percentage').toggle(); + + var toggle_result = this.$('.toggle_result'); + + if(!this.toggleMode) { + toggle_result.html(Diaspora.I18n.t("poll.close_result")); + this.toggleMode = 1; + } + else { + toggle_result.html(Diaspora.I18n.t("poll.show_result")); + this.toggleMode = 0; } }, - vote : function(evt){ - var result = parseInt($(evt.target).parent().find("input[name=vote]:checked").val()); - var pollParticipation = new app.models.PollParticipation(); - var parent = this; - pollParticipation.save({ - "poll_answer_id" : result, - "poll_id" : this.poll.poll_id - },{ - url : "/posts/"+this.poll.post_id+"/poll_participations", - success : function(model, response) { - parent.removeForm(); - parent.refreshResult(result); - if(parent.toggleMode == 0) { - parent.toggleResult(null); - } + clickSubmit: function(evt) { + evt.preventDefault(); + var answer_id = parseInt($(evt.target).parent().find("input[name=vote]:checked").val()); + this.vote(answer_id); + }, + + vote: function(answer_id){ + var pollParticipation = new app.models.PollParticipation({ + poll_answer_id: answer_id, + poll_id: this.poll.poll_id, + post_id: this.poll.post_id, + }); + var _this = this; + + pollParticipation.save({},{ + success : function() { + _this.model.fetch(); } }); - return false; } -}); \ No newline at end of file +}); diff --git a/features/desktop/post_with_a_poll.feature b/features/desktop/post_with_a_poll.feature index 5d8b7b277..faed7efdd 100644 --- a/features/desktop/post_with_a_poll.feature +++ b/features/desktop/post_with_a_poll.feature @@ -62,4 +62,18 @@ Feature: posting with a poll And I press "Vote" within ".stream_element" Then I should see an element ".poll_progress_bar" And I should see an element ".percentage" - And I should see "1 vote so far" within ".poll_statistic" \ No newline at end of file + And I should see "1 vote so far" within ".poll_statistic" + + Scenario: click to show result + Given I expand the publisher + And I press the element "#poll_creator" + When I fill in the following: + | status_message_fake_text | I am eating yogurt | + | poll_question | What kind of yogurt do you like? | + And I fill in the following for the options: + | normal | + | not normal | + And I press "Share" + + And I press the element ".toggle_result" + Then I should see an element ".percentage" diff --git a/features/step_definitions/post_with_poll_steps.rb b/features/step_definitions/post_with_poll_steps.rb index 2ae5a78ba..e2ea6631a 100644 --- a/features/step_definitions/post_with_poll_steps.rb +++ b/features/step_definitions/post_with_poll_steps.rb @@ -19,14 +19,15 @@ When /^I fill in the following for the options:$/ do |table| end When /^I check the first option$/ do - sleep 1 + page.should have_css('.poll_form input') first(".poll_form input").click end And /^I press the element "([^"]*)"$/ do |selector| + page.should have_css(selector) find(selector).click end Then /^I should see an element "([^"]*)"$/ do |selector| page.should have_css(selector) -end \ No newline at end of file +end diff --git a/spec/javascripts/app/views/poll_view_spec.js b/spec/javascripts/app/views/poll_view_spec.js index 4ee1a2ef8..668d8dd85 100644 --- a/spec/javascripts/app/views/poll_view_spec.js +++ b/spec/javascripts/app/views/poll_view_spec.js @@ -21,25 +21,17 @@ describe("app.views.Poll", function(){ }) }); - describe("updateCounter", function(){ - it("updates the counter after a vote", function(){ - var pc = this.view.poll.participation_count; - var answerCount = this.view.poll.poll_answers[0].vote_count; - this.view.updateCounter(1); - expect(this.view.poll.participation_count).toBe(pc+1); - expect(this.view.poll.poll_answers[0].vote_count).toBe(answerCount+1); - }) - }); - describe("vote", function(){ it("checks the ajax call for voting", function(){ spyOn($, "ajax"); - var radio = this.view.$('input[name="vote"]:first'); - radio.attr('checked', true); - this.view.vote({'target' : radio}); + var answer = this.view.poll.poll_answers[0]; + var poll = this.view.poll; + + this.view.vote(answer.id); + var obj = JSON.parse($.ajax.mostRecentCall.args[0].data); - expect(obj.poll_id).toBe(this.view.poll.poll_id); - expect(obj.poll_answer_id).toBe(this.view.poll.poll_answers[0].id); + expect(obj.poll_id).toBe(poll.poll_id); + expect(obj.poll_answer_id).toBe(answer.id); }) }) });