Commit cee230a158e72a973150a17034b58c869f7e9407

Authored by Riyad Preukschas
1 parent 653f7ec4

Update JS for adding and removing diff line notes

app/assets/javascripts/note.js
... ... @@ -17,8 +17,9 @@ var NoteList = {
17 17 // get initial set of notes
18 18 this.getContent();
19 19  
20   - $('.delete-note').live('ajax:success', function() {
21   - $(this).closest('li').fadeOut(); });
  20 + $("#notes-list, #new-notes-list").on("ajax:success", ".delete-note", function() {
  21 + $(this).closest('li').fadeOut();
  22 + });
22 23  
23 24 $(".note-form-holder").on("ajax:before", function(){
24 25 $(".submit_note").disable()
... ... @@ -197,13 +198,41 @@ var NoteList = {
197 198 var PerLineNotes = {
198 199 init:
199 200 function() {
200   - $(".line_note_link, .line_note_reply_link").on("click", function(e) {
  201 + /**
  202 + * Called when clicking on the "add note" or "reply" button for a diff line.
  203 + *
  204 + * Shows the note form below the line.
  205 + * Sets some hidden fields in the form.
  206 + */
  207 + $(".diff_file_content").on("click", ".line_note_link, .line_note_reply_link", function(e) {
201 208 var form = $(".per_line_form");
202 209 $(this).closest("tr").after(form);
203   - form.find("#note_line_code").val($(this).attr("line_code"));
  210 + form.find("#note_line_code").val($(this).data("lineCode"));
204 211 form.show();
205 212 return false;
206 213 });
  214 +
207 215 disableButtonIfEmptyField(".line-note-text", ".submit_inline_note");
  216 +
  217 + /**
  218 + * Called in response to successfully deleting a note on a diff line.
  219 + *
  220 + * Removes the actual note from view.
  221 + * Removes the reply button if the last note for that line has been removed.
  222 + */
  223 + $(".diff_file_content").on("ajax:success", ".delete-note", function() {
  224 + var trNote = $(this).closest("tr");
  225 + trNote.fadeOut(function() {
  226 + $(this).remove();
  227 + });
  228 +
  229 + // check if this is the last note for this line
  230 + // elements must really be removed for this to work reliably
  231 + var trLine = trNote.prev();
  232 + var trRpl = trNote.next();
  233 + if (trLine.hasClass("line_holder") && trRpl.hasClass("reply")) {
  234 + trRpl.fadeOut(function() { $(this).remove(); });
  235 + }
  236 + });
208 237 }
209 238 }
... ...
app/views/notes/_create_line.js.haml
1 1 - if note.valid?
2 2 :plain
  3 + // hide and reset the form
3 4 $(".per_line_form").hide();
4 5 $('.line-note-form-holder textarea').val("");
5   - $("a.line_note_reply_link[line_code='#{note.line_code}']").closest("tr").remove();
6   - var trEl = $(".#{note.line_code}").parent();
7   - trEl.after("#{escape_javascript(render partial: "notes/per_line_show", locals: {note: note})}");
8   - trEl.after("#{escape_javascript(render partial: "notes/reply_button", locals: {line_code: note.line_code})}");
  6 +
  7 + // find the reply button for this line
  8 + // (might not be there if this is the first note)
  9 + var trRpl = $("a.line_note_reply_link[data-line-code='#{note.line_code}']").closest("tr");
  10 + if (trRpl.size() == 0) {
  11 + // find the commented line ...
  12 + var trEl = $(".#{note.line_code}").parent();
  13 + // ... and insert the note and the reply button after it
  14 + trEl.after("#{escape_javascript(render "notes/reply_button", line_code: note.line_code)}");
  15 + trEl.after("#{escape_javascript(render "notes/per_line_show", note: note)}");
  16 + } else {
  17 + // instert new note before reply button
  18 + trRpl.before("#{escape_javascript(render "notes/per_line_show", note: note)}");
  19 + }
... ...