Commit 84870438f95092957c2ad5ca4581e2b95f98033d

Authored by Chenguang Zhang
1 parent 728bdfc5

Add support for side-by-side inline comments

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
@@ -139,6 +139,7 @@ ul.notes { @@ -139,6 +139,7 @@ ul.notes {
139 background-color: #fff; 139 background-color: #fff;
140 border-width: 1px 0; 140 border-width: 1px 0;
141 padding-top: 0; 141 padding-top: 0;
  142 + vertical-align: top;
142 143
143 li { 144 li {
144 padding: 5px; 145 padding: 5px;
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 +