Commit aa5f306d1101be3212bd578763467d282242ec87
Exists in
spb-stable
and in
2 other branches
Merge pull request #6860 from hszcg/dev
Add support for side-by-side inline comments
Showing
4 changed files
with
52 additions
and
78 deletions
Show diff stats
app/assets/stylesheets/sections/diff.scss
| @@ -63,23 +63,14 @@ | @@ -63,23 +63,14 @@ | ||
| 63 | } | 63 | } |
| 64 | } | 64 | } |
| 65 | 65 | ||
| 66 | - .text-file-parallel div { | ||
| 67 | - display: inline-block; | ||
| 68 | - padding-bottom: 16px; | ||
| 69 | - } | ||
| 70 | - .diff-side { | ||
| 71 | - overflow-x: scroll; | ||
| 72 | - width: 508px; | ||
| 73 | - } | ||
| 74 | - .diff-side.diff-side-left{ | ||
| 75 | - overflow-y:hidden; | ||
| 76 | - } | ||
| 77 | - .diff-side table, td.diff-middle table { | ||
| 78 | - } | ||
| 79 | - .diff-middle { | ||
| 80 | - width: 114px; | ||
| 81 | - vertical-align: top; | ||
| 82 | - overflow: hidden | 66 | + tr.line_holder.parallel{ |
| 67 | + .old_line, .new_line, .diff_line { | ||
| 68 | + min-width: 50px; | ||
| 69 | + } | ||
| 70 | + | ||
| 71 | + td.line_content.parallel{ | ||
| 72 | + width: 50%; | ||
| 73 | + } | ||
| 83 | } | 74 | } |
| 84 | 75 | ||
| 85 | .old_line, .new_line, .diff_line { | 76 | .old_line, .new_line, .diff_line { |
app/assets/stylesheets/sections/notes.scss
app/views/projects/commits/_parallel_view.html.haml
| @@ -2,54 +2,37 @@ | @@ -2,54 +2,37 @@ | ||
| 2 | - old_lines, new_lines = parallel_diff_lines(project, @commit, diff, file) | 2 | - old_lines, new_lines = parallel_diff_lines(project, @commit, diff, file) |
| 3 | - num_lines = old_lines.length | 3 | - num_lines = old_lines.length |
| 4 | 4 | ||
| 5 | -%div.text-file-parallel | ||
| 6 | - %div.diff-side.diff-side-left | ||
| 7 | - %table | ||
| 8 | - - old_lines.each do |line| | 5 | +%div.text-file |
| 6 | + %table | ||
| 7 | + - num_lines.times do |index| | ||
| 8 | + - new_line = new_lines[index] | ||
| 9 | + - old_line = old_lines[index] | ||
| 10 | + %tr.line_holder.parallel | ||
| 11 | + -# For old line | ||
| 12 | + - if old_line.type == :file_created | ||
| 13 | + %td.old_line= old_line.num | ||
| 14 | + %td.line_content.parallel= "File was created" | ||
| 15 | + - elsif old_line.type == :deleted | ||
| 16 | + %td.old_line.old= old_line.num | ||
| 17 | + %td.line_content{class: "parallel noteable_line old #{old_line.code}", "line_code" => old_line.code}= old_line.content | ||
| 18 | + - else old_line.type == :no_change | ||
| 19 | + %td.old_line= old_line.num | ||
| 20 | + %td.line_content.parallel= old_line.content | ||
| 21 | + | ||
| 22 | + -# For new line | ||
| 23 | + - if new_line.type == :file_deleted | ||
| 24 | + %td.new_line= new_line.num | ||
| 25 | + %td.line_content.parallel= "File was deleted" | ||
| 26 | + - elsif new_line.type == :added | ||
| 27 | + %td.new_line.new= new_line.num | ||
| 28 | + %td.line_content{class: "parallel noteable_line new #{new_line.code}", "line_code" => new_line.code}= new_line.content | ||
| 29 | + - else new_line.type == :no_change | ||
| 30 | + %td.new_line= new_line.num | ||
| 31 | + %td.line_content.parallel= new_line.content | ||
| 32 | + | ||
| 33 | + - if @reply_allowed | ||
| 34 | + - comments1 = @line_notes.select { |n| n.line_code == old_line.code }.sort_by(&:created_at) | ||
| 35 | + - comments2 = @line_notes.select { |n| n.line_code == new_line.code }.sort_by(&:created_at) | ||
| 36 | + - unless comments1.empty? and comments2.empty? | ||
| 37 | + = render "projects/notes/diff_notes_with_reply_parallel", notes1: comments1, notes2: comments2 | ||
| 9 | 38 | ||
| 10 | - %tr.line_holder.parallel | ||
| 11 | - - if line.type == :file_created | ||
| 12 | - %td.line_content.parallel= "File was created" | ||
| 13 | - - elsif line.type == :deleted | ||
| 14 | - %td.line_content{class: "parallel noteable_line old #{line.code}", "line_code" => line.code }= line.content | ||
| 15 | - - else line.type == :no_change | ||
| 16 | - %td.line_content.parallel= line.content | ||
| 17 | - | ||
| 18 | - %div.diff-middle | ||
| 19 | - %table | ||
| 20 | - - num_lines.times do |index| | ||
| 21 | - %tr | ||
| 22 | - - if old_lines[index].type == :deleted | ||
| 23 | - %td.old_line.old= old_lines[index].num | ||
| 24 | - - else | ||
| 25 | - %td.old_line= old_lines[index].num | ||
| 26 | - | ||
| 27 | - %td.diff_line="" | ||
| 28 | - | ||
| 29 | - - if new_lines[index].type == :added | ||
| 30 | - %td.new_line.new= new_lines[index].num | ||
| 31 | - - else | ||
| 32 | - %td.new_line= new_lines[index].num | ||
| 33 | - | ||
| 34 | - %div.diff-side.diff-side-right | ||
| 35 | - %table | ||
| 36 | - - new_lines.each do |line| | ||
| 37 | - | ||
| 38 | - %tr.line_holder.parallel | ||
| 39 | - - if line.type == :file_deleted | ||
| 40 | - %td.line_content.parallel= "File was deleted" | ||
| 41 | - - elsif line.type == :added | ||
| 42 | - %td.line_content{class: "parallel noteable_line new #{line.code}", "line_code" => line.code }= line.content | ||
| 43 | - - else line.type == :no_change | ||
| 44 | - %td.line_content.parallel= line.content | ||
| 45 | - | ||
| 46 | -:javascript | ||
| 47 | - $('.diff-side-right').on('scroll', function(){ | ||
| 48 | - $('.diff-side-left, .diff-middle').scrollTop($(this).scrollTop()); | ||
| 49 | - $('.diff-side-left').scrollLeft($(this).scrollLeft()); | ||
| 50 | - }); | ||
| 51 | - | ||
| 52 | - $('.diff-side-left').on('scroll', function(){ | ||
| 53 | - $('.diff-side-right, .diff-middle').scrollTop($(this).scrollTop()); // might never be relevant | ||
| 54 | - $('.diff-side-right').scrollLeft($(this).scrollLeft()); | ||
| 55 | - }); |
app/views/projects/notes/_diff_notes_with_reply_parallel.html.haml
| 1 | - note1 = notes1.first # example note | 1 | - note1 = notes1.first # example note |
| 2 | - note2 = notes2.first # example note | 2 | - note2 = notes2.first # example note |
| 3 | +-# Check if line want not changed since comment was left | ||
| 4 | +/- if !defined?(line) || line == note.diff_line | ||
| 3 | %tr.notes_holder.js-toggle-content | 5 | %tr.notes_holder.js-toggle-content |
| 4 | - -# Check if line want not changed since comment was left | ||
| 5 | - /- if !defined?(line1) || line1 == note1.diff_line | ||
| 6 | - if note1 | 6 | - if note1 |
| 7 | + %td.notes_line | ||
| 8 | + %span.btn.disabled | ||
| 9 | + %i.icon-comment | ||
| 10 | + = notes1.count | ||
| 7 | %td.notes_content | 11 | %td.notes_content |
| 8 | %ul.notes{ rel: note1.discussion_id } | 12 | %ul.notes{ rel: note1.discussion_id } |
| 9 | = render notes1 | 13 | = render notes1 |
| 14 | + | ||
| 10 | = render "projects/notes/discussion_reply_button", note: note1 | 15 | = render "projects/notes/discussion_reply_button", note: note1 |
| 11 | - %td.notes_line2 | ||
| 12 | - %span.btn.disabled.parallel-comment | ||
| 13 | - %i.icon-comment | ||
| 14 | - = notes1.count | ||
| 15 | - else | 16 | - else |
| 16 | %td= "" | 17 | %td= "" |
| 17 | %td= "" | 18 | %td= "" |
| 18 | 19 | ||
| 19 | - %td= "" | ||
| 20 | - | ||
| 21 | - -# Check if line want not changed since comment was left | ||
| 22 | - /- if !defined?(line2) || line2 == note2.diff_line | ||
| 23 | - if note2 | 20 | - if note2 |
| 24 | %td.notes_line | 21 | %td.notes_line |
| 25 | - %span.btn.disabled.parallel-comment | 22 | + %span.btn.disabled |
| 26 | %i.icon-comment | 23 | %i.icon-comment |
| 27 | = notes2.count | 24 | = notes2.count |
| 28 | %td.notes_content | 25 | %td.notes_content |
| 29 | %ul.notes{ rel: note2.discussion_id } | 26 | %ul.notes{ rel: note2.discussion_id } |
| 30 | = render notes2 | 27 | = render notes2 |
| 28 | + | ||
| 31 | = render "projects/notes/discussion_reply_button", note: note2 | 29 | = render "projects/notes/discussion_reply_button", note: note2 |
| 32 | - else | 30 | - else |
| 33 | %td= "" | 31 | %td= "" |
| 34 | %td= "" | 32 | %td= "" |
| 33 | + |