changed poll result + some minor text improvements

app/assets/javascripts/app/views/poll.js

@@ -9,19 +9,21 @@ app.views.Poll = app.views.Base.extend({
   initialize : function(options) {
     this.poll = this.model.attributes.poll;
     this.progressBarFactor = 3;
+    this.toggleMode = 0;
   },
 
   postRenderTemplate : function() {
     if(this.poll) {
       this.setProgressBar();
-      this.hideResult();
     }
   },
 
-  hideResult : function() {
+  removeForm : function() {
-    if(!this.model.attributes.already_participated_in_poll) {
+      var cnt = this.$("form").contents();
-      this.$('.poll_result').hide();
+      this.$("form").replaceWith(cnt);
-    }
+      this.$('input').remove();
+      this.$('submit').remove();
+      this.$('.toggle_result_wrapper').remove();
   },
 
   setProgressBar : function() {
@@ -32,14 +34,23 @@ app.views.Poll = app.views.Base.extend({
         percentage = answers[index].vote_count / this.poll.participation_count * 100;
       }
       var progressBar = this.$(".poll_progress_bar[data-answerid="+answers[index].id+"]");
-      progressBar.parents().eq(1).find(".percentage").html(" - " + percentage + "%");
+      progressBar.parent().next().html(" - " + percentage + "%");
       var width = percentage * this.progressBarFactor;
       progressBar.css("width", width + "px");
     }
   },
 
   toggleResult : function(e) {
-    $('.poll_result').toggle();
+    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.toggleStringMode = 0;
+    }
+
     return false;
   },
 
@@ -50,7 +61,7 @@ app.views.Poll = app.views.Base.extend({
 
   updateCounter : function(answerId) {
     this.poll.participation_count++;
-    this.$('.poll_statistic').html(Diaspora.I18n.t("poll.count", {"votes" : this.poll.participation_count}));
+    this.$('.poll_statistic').html(Diaspora.I18n.t("poll.count", {"count" : this.poll.participation_count}));
     var answers = this.poll.poll_answers;
     for(index = 0; index < answers.length; ++index) {
       if(answers[index].id == answerId) {
@@ -70,10 +81,12 @@ app.views.Poll = app.views.Base.extend({
     },{
       url : "/posts/"+this.poll.post_id+"/poll_participations",
       success : function(model, response) {
-        parent.$('.poll_form form').remove();
+        parent.removeForm();
-        parent.$('.toggle_result_wrapper').remove();
-        parent.$('.poll_result').show();
         parent.refreshResult(result);
+        if(parent.toggleMode == 0) {
+          parent.toggleResult(null);
+        }
+
       }
     });
     return false;

app/assets/stylesheets/poll.css.scss

@@ -20,7 +20,7 @@
   position:absolute;
   width:0px;
   height:15px;
-  top:-10px;
+  top:-12px;
   z-index:-1;
   background-color:$background-grey;
 }

app/assets/templates/poll_tpl.jst.hbs

@@ -1,32 +1,32 @@
 {{#if poll}}
   <div class="poll_form">
-    <p class="poll_statistic">{{t "poll.count" votes=poll.participation_count}}</p>
+    <p class="poll_statistic">{{t "poll.count" count=poll.participation_count}}</p>
     <strong>{{poll.question}}</strong><br/>
     {{#unless already_participated_in_poll}}
       <form action="/posts/{{poll.post_id}}/poll_participations" method="POST">
         {{#poll.poll_answers}}
           <input type="radio" name="vote" value="{{id}}"/>
+          <div class="poll_progress_bar_wrapper" style="display:none;">
+            <div class="poll_progress_bar" data-answerid="{{id}}"></div>
+          </div>
           {{answer}}
+          <p class="percentage" style="display:none;"></p>
           <br/>
         {{/poll.poll_answers}}
         <input type="submit" class="button submit" style="float:right;" value="{{t "poll.vote"}}"/>
       </form>
       <p class="toggle_result_wrapper">
-        <br/><a href="#" class="toggle_result">{{t "poll.toggle_result"}}</a><br/>
+        <br/><a href="#" class="toggle_result">{{t "poll.show_result"}}</a><br/>
       </p>
-    {{/unless}}
+    {{else}}
-    <div class="poll_result">
-      <br/><strong>{{t "poll.result"}}</strong><br/>
       {{#poll.poll_answers}}
-        <div class="poll_answer_entry">
         <div class="poll_progress_bar_wrapper">
-            <div class="poll_progress_bar" data-answerid="{{id}}"> </div>
+          <div class="poll_progress_bar" data-answerid="{{id}}"></div>
         </div>
         {{answer}}
         <p class="percentage"></p>
-        </div>
+        <br/>
       {{/poll.poll_answers}}
-    </div>
+    {{/unless}}
-
   </div>
 {{/if}}

config/locales/javascript/javascript.en.yml

@@ -176,5 +176,8 @@ en:
     poll:
       vote: "Vote"
       result: "Result"
-      count: "<%=votes%> votes so far"
+      count:
-      toggle_result: "Toggle result"
+        one: "1 vote so far"
+        other: "<%=count%> votes so far"
+      show_result: "Show result"
+      close_result: "Close result"