Feature/3676 Conduct Polls

.gitignore

@@ -65,3 +65,6 @@ dump.rdb
 
 #Rubinius's JIT
 *.rbc
+
+#IDE
+diaspora.iml

Changelog.md

@@ -40,6 +40,7 @@
 * Added comment count to statistic to enable calculations of posts/comments ratios [#4799](https://github.com/diaspora/diaspora/pull/4799)
 * Add filters to notifications controller [#4814](https://github.com/diaspora/diaspora/pull/4814)
 * Activate hovercards in SPV and conversations [#4870](https://github.com/diaspora/diaspora/pull/4870)
+* Added possibility to conduct polls [#4861](https://github.com/diaspora/diaspora/pull/4861)
 
 # 0.3.0.3
 
@@ -58,6 +59,7 @@
 ## Bug fixes
 * Fix regression caused by using after_commit with nested '#save' which lead to an infinite recursion [#4715](https://github.com/diaspora/diaspora/issues/4715)
 * Save textarea value before rendering comments when clicked 'show more...' [#4514](https://github.com/diaspora/diaspora/issues/4514)
+
 # 0.3.0.0
 
 ## Pod statistics

app/assets/javascripts/app/models/poll_participation.js

@@ -0,0 +1,5 @@
+app.models.PollParticipation = Backbone.Model.extend({
+  url : function(){
+    "/poll_participations"
+  }
+});

app/assets/javascripts/app/models/status_message.js

@@ -13,7 +13,8 @@ app.models.StatusMessage = app.models.Post.extend({
       status_message : _.clone(this.attributes),
       aspect_ids : this.get("aspect_ids"),
       photos : this.photos && this.photos.pluck("id"),
-      services : this.get("services")
+      services : this.get("services"),
+      poll : this.get("poll")
     }
   }
 });

app/assets/javascripts/app/views/poll_view.js

@@ -0,0 +1,94 @@
+app.views.Poll = app.views.Base.extend({
+  templateName : "poll",
+
+  events : {
+    "click .submit" : "vote",
+    "click .toggle_result" : "toggleResult"
+  },
+
+  initialize : function(options) {
+    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}));
+    var answers = this.poll.poll_answers;
+    for(index = 0; index < answers.length; ++index) {
+      if(answers[index].id == answerId) {
+        answers[index].vote_count++;
+        return;
+      }
+    }
+  },
+
+  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);
+        }
+
+      }
+    });
+    return false;
+  }
+
+});

app/assets/javascripts/app/views/publisher_view.js

@@ -23,12 +23,16 @@ app.views.Publisher = Backbone.View.extend({
     "click .post_preview_button" : "createPostPreview",
     "textchange #status_message_fake_text": "handleTextchange",
     "click #locator" : "showLocation",
+    "click #poll_creator" : "showPollCreator",
+    "click #add_poll_answer" : "addPollAnswer",
+    "click .remove_poll_answer" : "removePollAnswer",
     "click #hide_location" : "destroyLocation",
     "keypress #location_address" : "avoidEnter"
   },
 
   initialize : function(opts){
     this.standalone = opts ? opts.standalone : false;
+    this.option_counter = 1;
 
     // init shortcut references to the various elements
     this.el_input = this.$('#status_message_fake_text');
@@ -37,6 +41,8 @@ app.views.Publisher = Backbone.View.extend({
     this.el_submit = this.$('input[type=submit], button#submit');
     this.el_preview = this.$('button.post_preview_button');
     this.el_photozone = this.$('#photodropzone');
+    this.el_poll_creator = this.$('#poll_creator_wrapper');
+    this.el_poll_answer = this.$('#poll_creator_wrapper .poll_answer');
 
     // init mentions plugin
     Mentions.initialize(this.el_input);
@@ -69,7 +75,7 @@ app.views.Publisher = Backbone.View.extend({
     });
 
     this.initSubviews();
-
+    this.addPollAnswer();
     return this;
   },
 
@@ -136,7 +142,9 @@ app.views.Publisher = Backbone.View.extend({
       "photos" : serializedForm["photos[]"],
       "services" : serializedForm["services[]"],
       "location_address" : $("#location_address").val(),
-      "location_coords" : serializedForm["location[coords]"]
+      "location_coords" : serializedForm["location[coords]"],
+      "poll_question" : serializedForm["poll_question"],
+      "poll_answers" : serializedForm["poll_answers[]"]
     }, {
       url : "/status_messages",
       success : function() {
@@ -171,6 +179,36 @@ app.views.Publisher = Backbone.View.extend({
     }
   },
 
+  showPollCreator: function(){
+    this.el_poll_creator.toggle();
+  },
+
+  addPollAnswer: function(){
+    if($(".poll_answer").size() == 1) {
+      $(".remove_poll_answer").css("visibility","visible");
+    }
+
+    this.option_counter++;
+    var clone = this.el_poll_answer.clone();
+
+    var answer = clone.find('.poll_answer_input');
+    answer.val("");
+
+    var placeholder = answer.attr("placeholder");
+    var expression = /[^0-9]+/;
+    answer.attr("placeholder", expression.exec(placeholder) + this.option_counter);
+
+    $('#poll_creator_wrapper .poll_answer').last().after(clone);
+  },
+
+  removePollAnswer: function(evt){
+    $(evt.currentTarget).parent().remove();
+    if($(".poll_answer").size() == 1) {
+       $(".remove_poll_answer").css("visibility","hidden");;
+    }
+
+    return false;
+  },
   // avoid submitting form when pressing Enter key
   avoidEnter: function(evt){
     if(evt.keyCode == 13)
@@ -295,13 +333,21 @@ app.views.Publisher = Backbone.View.extend({
     // clear location
     this.destroyLocation();
 
+    // clear poll form
+    this.clearPollForm();
+
     // force textchange plugin to update lastValue
     this.el_input.data('lastValue', '');
     this.el_hiddenInput.data('lastValue', '');
 
     return this;
   },
 
+  clearPollForm : function(){
+    this.$('#poll_question').val('');
+    this.$('.poll_answer_input').val('');
+  },
+
   tryClose : function(){
     // if it is not submittable, close it.
     if( !this._submittable() ){
@@ -323,7 +369,7 @@ app.views.Publisher = Backbone.View.extend({
     $(this.el).addClass("closed");
     this.el_wrapper.removeClass("active");
     this.el_input.css('height', '');
-
+    this.el_poll_creator.hide();
     return this;
   },
 

app/assets/javascripts/app/views/stream_post_views.js

@@ -9,6 +9,7 @@ app.views.StreamPost = app.views.Post.extend({
     ".post-content" : "postContentView",
     ".oembed" : "oEmbedView",
     ".opengraph" : "openGraphView",
+    ".poll" : "pollView",
     ".status-message-location" : "postLocationStreamView"
   },
 
@@ -31,6 +32,7 @@ app.views.StreamPost = app.views.Post.extend({
     this.commentStreamView = new app.views.CommentStream({model : this.model});
     this.oEmbedView = new app.views.OEmbed({model : this.model});
     this.openGraphView = new app.views.OpenGraph({model : this.model});
+    this.pollView = new app.views.Poll({model : this.model});
   },
 
 

app/assets/stylesheets/application.css.sass

@@ -10,6 +10,7 @@
 @import 'header'
 @import 'footer'
 @import 'opengraph'
+@import 'poll'
 @import 'help'
 @import 'profile'
 @import 'publisher_blueprint'

app/assets/stylesheets/poll.css.scss

@@ -0,0 +1,45 @@
+.poll_form {
+  display: block;
+  margin: 10px 0px 10px 0px;
+  border-top: solid 1px $border-grey;
+  border-bottom: solid 1px $border-grey;
+  padding: 10px 0px 5px 0px;
+  overflow: hidden;
+  width: 100%;
+}
+
+.poll_form input[type="radio"] {
+  display:inline !important;  
+}
+
+.poll_result {
+  width:100%px;
+}
+
+.poll_progress_bar {
+  position:absolute;
+  width:0px;
+  height:15px;
+  top:-12px;
+  z-index:-1;
+  background-color:$background-grey;
+}
+
+.poll_statistic{
+  float:right;
+}
+
+.poll_progress_bar_wrapper {
+  position: relative;
+  width: 0;
+  height: 0;
+  display:inline-block;
+}
+
+.poll_answer_entry{
+  width:100%;
+}
+
+.percentage {
+  display:inline;
+}

app/assets/stylesheets/publisher.css.scss

@@ -82,6 +82,16 @@
       &.with_attachments .row-fluid#photodropzone_container {
         border-top: 1px dashed $border-grey; 
       }
+
+      #poll_creator_wrapper {
+        display:none;
+        border-top: 1px dashed $border-grey;
+        padding:4px 6px 4px 6px;
+        box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        -webkit-box-sizing: border-box;
+      }
+
       &.with_location .row-fluid#location_container {
         height: 30px;
         #hide_location { display: none !important; }
@@ -162,6 +172,7 @@
         margin-right: 5px;
         #file-upload,
         #locator,
+        #poll_creator,
         #hide_location {
           text-decoration: none !important;
           font-size: 16px;