Update votes when creating or refreshing notes

Riyad Preukschas
1 parent b8113334
Showing 1 changed file with 40 additions and 3 deletions Show diff stats
app/assets/javascripts/notes.js
@@ -21,15 +21,18 @@ var NoteList = {
       this.getContent();
  
       $("#notes-list, #new-notes-list").on("ajax:success", ".delete-note", function() {
-        $(this).closest('li').fadeOut();
+        $(this).closest('li').fadeOut(function() {
+          $(this).remove();
+          NoteList.updateVotes();
+        });
       });
  
       $(".note-form-holder").on("ajax:before", function(){
-        $(".submit_note").disable()
+        $(".submit_note").disable();
       })
  
       $(".note-form-holder").on("ajax:complete", function(){
-        $(".submit_note").enable()
+        $(".submit_note").enable();
       })
  
       disableButtonIfEmptyField(".note-text", ".submit_note");
@@ -154,6 +157,8 @@ var NoteList = {
       if (!this.reversed) {
         this.initRefreshNew();
       }
+      // make sure we are up to date
+      this.updateVotes();
     },
  
  
@@ -193,6 +198,7 @@ var NoteList = {
   replaceNewNotes:
     function(html) {
       $("#new-notes-list").html(html);
+      this.updateVotes();
     },
  
   /**
@@ -205,6 +211,37 @@ var NoteList = {
       } else {
         $("#new-notes-list").append(html);
       }
+      this.updateVotes();
+    },
+
+  /**
+   * Recalculates the votes and updates them (if they are displayed at all).
+   *
+   * Assumes all relevant notes are displayed (i.e. there are no more notes to
+   * load via getMore()).
+   * Might produce inaccurate results when not all notes have been loaded and a
+   * recalculation is triggered (e.g. when deleting a note).
+   */
+  updateVotes:
+    function() {
+      var votes = $("#votes .votes");
+      var notes = $("#notes-list, #new-notes-list").find(".note.vote");
+
+      // only update if there is a vote display
+      if (votes.size()) {
+        var upvotes = notes.filter(".upvote").size();
+        var downvotes = notes.filter(".downvote").size();
+        var votesCount = upvotes + downvotes;
+        var upvotesPercent = votesCount ? (100.0 / votesCount * upvotes) : 0;
+        var downvotesPercent = votesCount ? (100.0 - upvotesPercent) : 0;
+
+        // change vote bar lengths
+        votes.find(".bar-success").css("width", upvotesPercent+"%");
+        votes.find(".bar-danger").css("width", downvotesPercent+"%");
+        // replace vote numbers
+        votes.find(".upvotes").text(votes.find(".upvotes").text().replace(/\d+/, upvotes));
+        votes.find(".downvotes").text(votes.find(".downvotes").text().replace(/\d+/, downvotes));
+      }
     }
 };
...	...	@@ -21,15 +21,18 @@ var NoteList = {
21	21	this.getContent();
22	22
23	23	$("#notes-list, #new-notes-list").on("ajax:success", ".delete-note", function() {
24		- $(this).closest('li').fadeOut();
	24	+ $(this).closest('li').fadeOut(function() {
	25	+ $(this).remove();
	26	+ NoteList.updateVotes();
	27	+ });
25	28	});
26	29
27	30	$(".note-form-holder").on("ajax:before", function(){
28		- $(".submit_note").disable()
	31	+ $(".submit_note").disable();
29	32	})
30	33
31	34	$(".note-form-holder").on("ajax:complete", function(){
32		- $(".submit_note").enable()
	35	+ $(".submit_note").enable();
33	36	})
34	37
35	38	disableButtonIfEmptyField(".note-text", ".submit_note");
...	...	@@ -154,6 +157,8 @@ var NoteList = {
154	157	if (!this.reversed) {
155	158	this.initRefreshNew();
156	159	}
	160	+ // make sure we are up to date
	161	+ this.updateVotes();
157	162	},
158	163
159	164
...	...	@@ -193,6 +198,7 @@ var NoteList = {
193	198	replaceNewNotes:
194	199	function(html) {
195	200	$("#new-notes-list").html(html);
	201	+ this.updateVotes();
196	202	},
197	203
198	204	/**
...	...	@@ -205,6 +211,37 @@ var NoteList = {
205	211	} else {
206	212	$("#new-notes-list").append(html);
207	213	}
	214	+ this.updateVotes();
	215	+ },
	216	+
	217	+ /**
	218	+ * Recalculates the votes and updates them (if they are displayed at all).
	219	+ *
	220	+ * Assumes all relevant notes are displayed (i.e. there are no more notes to
	221	+ * load via getMore()).
	222	+ * Might produce inaccurate results when not all notes have been loaded and a
	223	+ * recalculation is triggered (e.g. when deleting a note).
	224	+ */
	225	+ updateVotes:
	226	+ function() {
	227	+ var votes = $("#votes .votes");
	228	+ var notes = $("#notes-list, #new-notes-list").find(".note.vote");
	229	+
	230	+ // only update if there is a vote display
	231	+ if (votes.size()) {
	232	+ var upvotes = notes.filter(".upvote").size();
	233	+ var downvotes = notes.filter(".downvote").size();
	234	+ var votesCount = upvotes + downvotes;
	235	+ var upvotesPercent = votesCount ? (100.0 / votesCount * upvotes) : 0;
	236	+ var downvotesPercent = votesCount ? (100.0 - upvotesPercent) : 0;
	237	+
	238	+ // change vote bar lengths
	239	+ votes.find(".bar-success").css("width", upvotesPercent+"%");
	240	+ votes.find(".bar-danger").css("width", downvotesPercent+"%");
	241	+ // replace vote numbers
	242	+ votes.find(".upvotes").text(votes.find(".upvotes").text().replace(/\d+/, upvotes));
	243	+ votes.find(".downvotes").text(votes.find(".downvotes").text().replace(/\d+/, downvotes));
	244	+ }
208	245	}
209	246	};
210	247
...	...