##// END OF EJS Templates
diffs: ui improvements over the sticky header.
dan -
r3128:814ba1c1 default
parent child Browse files
Show More
@@ -1,1221 +1,1228 b''
1 // Default styles
1 // Default styles
2
2
3 .diff-collapse {
3 .diff-collapse {
4 margin: @padding 0;
4 margin: @padding 0;
5 text-align: right;
5 text-align: right;
6 }
6 }
7
7
8 .diff-container {
8 .diff-container {
9 margin-bottom: @space;
9 margin-bottom: @space;
10
10
11 .diffblock {
11 .diffblock {
12 margin-bottom: @space;
12 margin-bottom: @space;
13 }
13 }
14
14
15 &.hidden {
15 &.hidden {
16 display: none;
16 display: none;
17 overflow: hidden;
17 overflow: hidden;
18 }
18 }
19 }
19 }
20
20
21
21
22 div.diffblock .sidebyside {
22 div.diffblock .sidebyside {
23 background: #ffffff;
23 background: #ffffff;
24 }
24 }
25
25
26 div.diffblock {
26 div.diffblock {
27 overflow-x: auto;
27 overflow-x: auto;
28 overflow-y: hidden;
28 overflow-y: hidden;
29 clear: both;
29 clear: both;
30 padding: 0px;
30 padding: 0px;
31 background: @grey6;
31 background: @grey6;
32 border: @border-thickness solid @grey5;
32 border: @border-thickness solid @grey5;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
35
35
36
36
37 .comments-number {
37 .comments-number {
38 float: right;
38 float: right;
39 }
39 }
40
40
41 // BEGIN CODE-HEADER STYLES
41 // BEGIN CODE-HEADER STYLES
42
42
43 .code-header {
43 .code-header {
44 background: @grey6;
44 background: @grey6;
45 padding: 10px 0 10px 0;
45 padding: 10px 0 10px 0;
46 height: auto;
46 height: auto;
47 width: 100%;
47 width: 100%;
48
48
49 .hash {
49 .hash {
50 float: left;
50 float: left;
51 padding: 2px 0 0 2px;
51 padding: 2px 0 0 2px;
52 }
52 }
53
53
54 .date {
54 .date {
55 float: left;
55 float: left;
56 text-transform: uppercase;
56 text-transform: uppercase;
57 padding: 4px 0px 0px 2px;
57 padding: 4px 0px 0px 2px;
58 }
58 }
59
59
60 div {
60 div {
61 margin-left: 4px;
61 margin-left: 4px;
62 }
62 }
63
63
64 div.compare_header {
64 div.compare_header {
65 min-height: 40px;
65 min-height: 40px;
66 margin: 0;
66 margin: 0;
67 padding: 0 @padding;
67 padding: 0 @padding;
68
68
69 .drop-menu {
69 .drop-menu {
70 float:left;
70 float:left;
71 display: block;
71 display: block;
72 margin:0 0 @padding 0;
72 margin:0 0 @padding 0;
73 }
73 }
74
74
75 .compare-label {
75 .compare-label {
76 float: left;
76 float: left;
77 clear: both;
77 clear: both;
78 display: inline-block;
78 display: inline-block;
79 min-width: 5em;
79 min-width: 5em;
80 margin: 0;
80 margin: 0;
81 padding: @button-padding @button-padding @button-padding 0;
81 padding: @button-padding @button-padding @button-padding 0;
82 font-family: @text-semibold;
82 font-family: @text-semibold;
83 }
83 }
84
84
85 .compare-buttons {
85 .compare-buttons {
86 float: left;
86 float: left;
87 margin: 0;
87 margin: 0;
88 padding: 0 0 @padding;
88 padding: 0 0 @padding;
89
89
90 .btn {
90 .btn {
91 margin: 0 @padding 0 0;
91 margin: 0 @padding 0 0;
92 }
92 }
93 }
93 }
94 }
94 }
95
95
96 }
96 }
97
97
98 .parents {
98 .parents {
99 float: left;
99 float: left;
100 width: 100px;
100 width: 100px;
101 font-weight: 400;
101 font-weight: 400;
102 vertical-align: middle;
102 vertical-align: middle;
103 padding: 0px 2px 0px 2px;
103 padding: 0px 2px 0px 2px;
104 background-color: @grey6;
104 background-color: @grey6;
105
105
106 #parent_link {
106 #parent_link {
107 margin: 00px 2px;
107 margin: 00px 2px;
108
108
109 &.double {
109 &.double {
110 margin: 0px 2px;
110 margin: 0px 2px;
111 }
111 }
112
112
113 &.disabled{
113 &.disabled{
114 margin-right: @padding;
114 margin-right: @padding;
115 }
115 }
116 }
116 }
117 }
117 }
118
118
119 .children {
119 .children {
120 float: right;
120 float: right;
121 width: 100px;
121 width: 100px;
122 font-weight: 400;
122 font-weight: 400;
123 vertical-align: middle;
123 vertical-align: middle;
124 text-align: right;
124 text-align: right;
125 padding: 0px 2px 0px 2px;
125 padding: 0px 2px 0px 2px;
126 background-color: @grey6;
126 background-color: @grey6;
127
127
128 #child_link {
128 #child_link {
129 margin: 0px 2px;
129 margin: 0px 2px;
130
130
131 &.double {
131 &.double {
132 margin: 0px 2px;
132 margin: 0px 2px;
133 }
133 }
134
134
135 &.disabled{
135 &.disabled{
136 margin-right: @padding;
136 margin-right: @padding;
137 }
137 }
138 }
138 }
139 }
139 }
140
140
141 .changeset_header {
141 .changeset_header {
142 height: 16px;
142 height: 16px;
143
143
144 & > div{
144 & > div{
145 margin-right: @padding;
145 margin-right: @padding;
146 }
146 }
147 }
147 }
148
148
149 .changeset_file {
149 .changeset_file {
150 text-align: left;
150 text-align: left;
151 float: left;
151 float: left;
152 padding: 0;
152 padding: 0;
153
153
154 a{
154 a{
155 display: inline-block;
155 display: inline-block;
156 margin-right: 0.5em;
156 margin-right: 0.5em;
157 }
157 }
158
158
159 #selected_mode{
159 #selected_mode{
160 margin-left: 0;
160 margin-left: 0;
161 }
161 }
162 }
162 }
163
163
164 .diff-menu-wrapper {
164 .diff-menu-wrapper {
165 float: left;
165 float: left;
166 }
166 }
167
167
168 .diff-menu {
168 .diff-menu {
169 position: absolute;
169 position: absolute;
170 background: none repeat scroll 0 0 #FFFFFF;
170 background: none repeat scroll 0 0 #FFFFFF;
171 border-color: #003367 @grey3 @grey3;
171 border-color: #003367 @grey3 @grey3;
172 border-right: 1px solid @grey3;
172 border-right: 1px solid @grey3;
173 border-style: solid solid solid;
173 border-style: solid solid solid;
174 border-width: @border-thickness;
174 border-width: @border-thickness;
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
176 margin-top: 5px;
176 margin-top: 5px;
177 margin-left: 1px;
177 margin-left: 1px;
178 }
178 }
179
179
180 .diff-actions, .editor-actions {
180 .diff-actions, .editor-actions {
181 float: left;
181 float: left;
182
182
183 input{
183 input{
184 margin: 0 0.5em 0 0;
184 margin: 0 0.5em 0 0;
185 }
185 }
186 }
186 }
187
187
188 // END CODE-HEADER STYLES
188 // END CODE-HEADER STYLES
189
189
190 // BEGIN CODE-BODY STYLES
190 // BEGIN CODE-BODY STYLES
191
191
192 .code-body {
192 .code-body {
193 padding: 0;
193 padding: 0;
194 background-color: #ffffff;
194 background-color: #ffffff;
195 position: relative;
195 position: relative;
196 max-width: none;
196 max-width: none;
197 box-sizing: border-box;
197 box-sizing: border-box;
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
199 // to have the intended size and to scroll. Should be simplified.
199 // to have the intended size and to scroll. Should be simplified.
200 width: 100%;
200 width: 100%;
201 overflow-x: auto;
201 overflow-x: auto;
202 }
202 }
203
203
204 pre.raw {
204 pre.raw {
205 background: white;
205 background: white;
206 color: @grey1;
206 color: @grey1;
207 }
207 }
208 // END CODE-BODY STYLES
208 // END CODE-BODY STYLES
209
209
210 }
210 }
211
211
212
212
213 table.code-difftable {
213 table.code-difftable {
214 border-collapse: collapse;
214 border-collapse: collapse;
215 width: 99%;
215 width: 99%;
216 border-radius: 0px !important;
216 border-radius: 0px !important;
217
217
218 td {
218 td {
219 padding: 0 !important;
219 padding: 0 !important;
220 background: none !important;
220 background: none !important;
221 border: 0 !important;
221 border: 0 !important;
222 }
222 }
223
223
224 .context {
224 .context {
225 background: none repeat scroll 0 0 #DDE7EF;
225 background: none repeat scroll 0 0 #DDE7EF;
226 }
226 }
227
227
228 .add {
228 .add {
229 background: none repeat scroll 0 0 #DDFFDD;
229 background: none repeat scroll 0 0 #DDFFDD;
230
230
231 ins {
231 ins {
232 background: none repeat scroll 0 0 #AAFFAA;
232 background: none repeat scroll 0 0 #AAFFAA;
233 text-decoration: none;
233 text-decoration: none;
234 }
234 }
235 }
235 }
236
236
237 .del {
237 .del {
238 background: none repeat scroll 0 0 #FFDDDD;
238 background: none repeat scroll 0 0 #FFDDDD;
239
239
240 del {
240 del {
241 background: none repeat scroll 0 0 #FFAAAA;
241 background: none repeat scroll 0 0 #FFAAAA;
242 text-decoration: none;
242 text-decoration: none;
243 }
243 }
244 }
244 }
245
245
246 /** LINE NUMBERS **/
246 /** LINE NUMBERS **/
247 .lineno {
247 .lineno {
248 padding-left: 2px !important;
248 padding-left: 2px !important;
249 padding-right: 2px;
249 padding-right: 2px;
250 text-align: right;
250 text-align: right;
251 width: 32px;
251 width: 32px;
252 -moz-user-select: none;
252 -moz-user-select: none;
253 -webkit-user-select: none;
253 -webkit-user-select: none;
254 border-right: @border-thickness solid @grey5 !important;
254 border-right: @border-thickness solid @grey5 !important;
255 border-left: 0px solid #CCC !important;
255 border-left: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
257 border-bottom: none !important;
257 border-bottom: none !important;
258
258
259 a {
259 a {
260 &:extend(pre);
260 &:extend(pre);
261 text-align: right;
261 text-align: right;
262 padding-right: 2px;
262 padding-right: 2px;
263 cursor: pointer;
263 cursor: pointer;
264 display: block;
264 display: block;
265 width: 32px;
265 width: 32px;
266 }
266 }
267 }
267 }
268
268
269 .context {
269 .context {
270 cursor: auto;
270 cursor: auto;
271 &:extend(pre);
271 &:extend(pre);
272 }
272 }
273
273
274 .lineno-inline {
274 .lineno-inline {
275 background: none repeat scroll 0 0 #FFF !important;
275 background: none repeat scroll 0 0 #FFF !important;
276 padding-left: 2px;
276 padding-left: 2px;
277 padding-right: 2px;
277 padding-right: 2px;
278 text-align: right;
278 text-align: right;
279 width: 30px;
279 width: 30px;
280 -moz-user-select: none;
280 -moz-user-select: none;
281 -webkit-user-select: none;
281 -webkit-user-select: none;
282 }
282 }
283
283
284 /** CODE **/
284 /** CODE **/
285 .code {
285 .code {
286 display: block;
286 display: block;
287 width: 100%;
287 width: 100%;
288
288
289 td {
289 td {
290 margin: 0;
290 margin: 0;
291 padding: 0;
291 padding: 0;
292 }
292 }
293
293
294 pre {
294 pre {
295 margin: 0;
295 margin: 0;
296 padding: 0;
296 padding: 0;
297 margin-left: .5em;
297 margin-left: .5em;
298 }
298 }
299 }
299 }
300 }
300 }
301
301
302
302
303 // Comments
303 // Comments
304
304
305 div.comment:target {
305 div.comment:target {
306 border-left: 6px solid @comment-highlight-color !important;
306 border-left: 6px solid @comment-highlight-color !important;
307 padding-left: 3px;
307 padding-left: 3px;
308 margin-left: -9px;
308 margin-left: -9px;
309 }
309 }
310
310
311 //TODO: anderson: can't get an absolute number out of anything, so had to put the
311 //TODO: anderson: can't get an absolute number out of anything, so had to put the
312 //current values that might change. But to make it clear I put as a calculation
312 //current values that might change. But to make it clear I put as a calculation
313 @comment-max-width: 1065px;
313 @comment-max-width: 1065px;
314 @pr-extra-margin: 34px;
314 @pr-extra-margin: 34px;
315 @pr-border-spacing: 4px;
315 @pr-border-spacing: 4px;
316 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
316 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
317
317
318 // Pull Request
318 // Pull Request
319 .cs_files .code-difftable {
319 .cs_files .code-difftable {
320 border: @border-thickness solid @grey5; //borders only on PRs
320 border: @border-thickness solid @grey5; //borders only on PRs
321
321
322 .comment-inline-form,
322 .comment-inline-form,
323 div.comment {
323 div.comment {
324 width: @pr-comment-width;
324 width: @pr-comment-width;
325 }
325 }
326 }
326 }
327
327
328 // Changeset
328 // Changeset
329 .code-difftable {
329 .code-difftable {
330 .comment-inline-form,
330 .comment-inline-form,
331 div.comment {
331 div.comment {
332 width: @comment-max-width;
332 width: @comment-max-width;
333 }
333 }
334 }
334 }
335
335
336 //Style page
336 //Style page
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
338 #style-page .code-difftable{
338 #style-page .code-difftable{
339 .comment-inline-form,
339 .comment-inline-form,
340 div.comment {
340 div.comment {
341 width: @comment-max-width - @style-extra-margin;
341 width: @comment-max-width - @style-extra-margin;
342 }
342 }
343 }
343 }
344
344
345 #context-bar > h2 {
345 #context-bar > h2 {
346 font-size: 20px;
346 font-size: 20px;
347 }
347 }
348
348
349 #context-bar > h2> a {
349 #context-bar > h2> a {
350 font-size: 20px;
350 font-size: 20px;
351 }
351 }
352 // end of defaults
352 // end of defaults
353
353
354 .file_diff_buttons {
354 .file_diff_buttons {
355 padding: 0 0 @padding;
355 padding: 0 0 @padding;
356
356
357 .drop-menu {
357 .drop-menu {
358 float: left;
358 float: left;
359 margin: 0 @padding 0 0;
359 margin: 0 @padding 0 0;
360 }
360 }
361 .btn {
361 .btn {
362 margin: 0 @padding 0 0;
362 margin: 0 @padding 0 0;
363 }
363 }
364 }
364 }
365
365
366 .code-body.textarea.editor {
366 .code-body.textarea.editor {
367 max-width: none;
367 max-width: none;
368 padding: 15px;
368 padding: 15px;
369 }
369 }
370
370
371 td.injected_diff{
371 td.injected_diff{
372 max-width: 1178px;
372 max-width: 1178px;
373 overflow-x: auto;
373 overflow-x: auto;
374 overflow-y: hidden;
374 overflow-y: hidden;
375
375
376 div.diff-container,
376 div.diff-container,
377 div.diffblock{
377 div.diffblock{
378 max-width: 100%;
378 max-width: 100%;
379 }
379 }
380
380
381 div.code-body {
381 div.code-body {
382 max-width: 1124px;
382 max-width: 1124px;
383 overflow-x: auto;
383 overflow-x: auto;
384 overflow-y: hidden;
384 overflow-y: hidden;
385 padding: 0;
385 padding: 0;
386 }
386 }
387 div.diffblock {
387 div.diffblock {
388 border: none;
388 border: none;
389 }
389 }
390
390
391 &.inline-form {
391 &.inline-form {
392 width: 99%
392 width: 99%
393 }
393 }
394 }
394 }
395
395
396
396
397 table.code-difftable {
397 table.code-difftable {
398 width: 100%;
398 width: 100%;
399 }
399 }
400
400
401 /** PYGMENTS COLORING **/
401 /** PYGMENTS COLORING **/
402 div.codeblock {
402 div.codeblock {
403
403
404 // TODO: johbo: Added interim to get rid of the margin around
404 // TODO: johbo: Added interim to get rid of the margin around
405 // Select2 widgets. This needs further cleanup.
405 // Select2 widgets. This needs further cleanup.
406 margin-top: @padding;
406 margin-top: @padding;
407
407
408 overflow: auto;
408 overflow: auto;
409 padding: 0px;
409 padding: 0px;
410 border: @border-thickness solid @grey5;
410 border: @border-thickness solid @grey5;
411 background: @grey6;
411 background: @grey6;
412 .border-radius(@border-radius);
412 .border-radius(@border-radius);
413
413
414 #remove_gist {
414 #remove_gist {
415 float: right;
415 float: right;
416 }
416 }
417
417
418 .gist_url {
418 .gist_url {
419 padding: 0px 0px 10px 0px;
419 padding: 0px 0px 10px 0px;
420 }
420 }
421
421
422 .author {
422 .author {
423 clear: both;
423 clear: both;
424 vertical-align: middle;
424 vertical-align: middle;
425 font-family: @text-bold;
425 font-family: @text-bold;
426 }
426 }
427
427
428 .btn-mini {
428 .btn-mini {
429 float: left;
429 float: left;
430 margin: 0 5px 0 0;
430 margin: 0 5px 0 0;
431 }
431 }
432
432
433 .code-header {
433 .code-header {
434 padding: @padding;
434 padding: @padding;
435 border-bottom: @border-thickness solid @grey5;
435 border-bottom: @border-thickness solid @grey5;
436
436
437 .rc-user {
437 .rc-user {
438 min-width: 0;
438 min-width: 0;
439 margin-right: .5em;
439 margin-right: .5em;
440 }
440 }
441
441
442 .stats {
442 .stats {
443 clear: both;
443 clear: both;
444 margin: 0 0 @padding 0;
444 margin: 0 0 @padding 0;
445 padding: 0;
445 padding: 0;
446 .left {
446 .left {
447 float: left;
447 float: left;
448 clear: left;
448 clear: left;
449 max-width: 75%;
449 max-width: 75%;
450 margin: 0 0 @padding 0;
450 margin: 0 0 @padding 0;
451
451
452 &.item {
452 &.item {
453 margin-right: @padding;
453 margin-right: @padding;
454 &.last { border-right: none; }
454 &.last { border-right: none; }
455 }
455 }
456 }
456 }
457 .buttons { float: right; }
457 .buttons { float: right; }
458 .author {
458 .author {
459 height: 25px; margin-left: 15px; font-weight: bold;
459 height: 25px; margin-left: 15px; font-weight: bold;
460 }
460 }
461 }
461 }
462
462
463 .commit {
463 .commit {
464 margin: 5px 0 0 26px;
464 margin: 5px 0 0 26px;
465 font-weight: normal;
465 font-weight: normal;
466 white-space: pre-wrap;
466 white-space: pre-wrap;
467 }
467 }
468 }
468 }
469
469
470 .message {
470 .message {
471 position: relative;
471 position: relative;
472 margin: @padding;
472 margin: @padding;
473
473
474 .codeblock-label {
474 .codeblock-label {
475 margin: 0 0 1em 0;
475 margin: 0 0 1em 0;
476 }
476 }
477 }
477 }
478
478
479 .code-body {
479 .code-body {
480 padding: @padding;
480 padding: @padding;
481 background-color: #ffffff;
481 background-color: #ffffff;
482 min-width: 100%;
482 min-width: 100%;
483 box-sizing: border-box;
483 box-sizing: border-box;
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
485 // to have the intended size and to scroll. Should be simplified.
485 // to have the intended size and to scroll. Should be simplified.
486 width: 100%;
486 width: 100%;
487 overflow-x: auto;
487 overflow-x: auto;
488
488
489 img.rendered-binary {
489 img.rendered-binary {
490 height: auto;
490 height: auto;
491 width: 100%;
491 width: 100%;
492 }
492 }
493 }
493 }
494 }
494 }
495
495
496 .code-highlighttable,
496 .code-highlighttable,
497 div.codeblock {
497 div.codeblock {
498
498
499 &.readme {
499 &.readme {
500 background-color: white;
500 background-color: white;
501 }
501 }
502
502
503 .markdown-block table {
503 .markdown-block table {
504 border-collapse: collapse;
504 border-collapse: collapse;
505
505
506 th,
506 th,
507 td {
507 td {
508 padding: .5em;
508 padding: .5em;
509 border: @border-thickness solid @border-default-color;
509 border: @border-thickness solid @border-default-color;
510 }
510 }
511 }
511 }
512
512
513 table {
513 table {
514 border: 0px;
514 border: 0px;
515 margin: 0;
515 margin: 0;
516 letter-spacing: normal;
516 letter-spacing: normal;
517
517
518
518
519 td {
519 td {
520 border: 0px;
520 border: 0px;
521 vertical-align: top;
521 vertical-align: top;
522 }
522 }
523 }
523 }
524 }
524 }
525
525
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
527 div.search-code-body {
527 div.search-code-body {
528 background-color: #ffffff; padding: 5px 0 5px 10px;
528 background-color: #ffffff; padding: 5px 0 5px 10px;
529 pre {
529 pre {
530 .match { background-color: #faffa6;}
530 .match { background-color: #faffa6;}
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
532 }
532 }
533 .code-highlighttable {
533 .code-highlighttable {
534 border-collapse: collapse;
534 border-collapse: collapse;
535
535
536 tr:hover {
536 tr:hover {
537 background: #fafafa;
537 background: #fafafa;
538 }
538 }
539 td.code {
539 td.code {
540 padding-left: 10px;
540 padding-left: 10px;
541 }
541 }
542 td.line {
542 td.line {
543 border-right: 1px solid #ccc !important;
543 border-right: 1px solid #ccc !important;
544 padding-right: 10px;
544 padding-right: 10px;
545 text-align: right;
545 text-align: right;
546 font-family: "Lucida Console",Monaco,monospace;
546 font-family: "Lucida Console",Monaco,monospace;
547 span {
547 span {
548 white-space: pre-wrap;
548 white-space: pre-wrap;
549 color: #666666;
549 color: #666666;
550 }
550 }
551 }
551 }
552 }
552 }
553 }
553 }
554
554
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
556 .code-highlight {
556 .code-highlight {
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
559 pre div:target {background-color: @comment-highlight-color !important;}
559 pre div:target {background-color: @comment-highlight-color !important;}
560 }
560 }
561
561
562 .linenos a { text-decoration: none; }
562 .linenos a { text-decoration: none; }
563
563
564 .CodeMirror-selected { background: @rchighlightblue; }
564 .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
568
568
569 .code { display: block; border:0px !important; }
569 .code { display: block; border:0px !important; }
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
571 .codehilite {
571 .codehilite {
572 .hll { background-color: #ffffcc }
572 .hll { background-color: #ffffcc }
573 .c { color: #408080; font-style: italic } /* Comment */
573 .c { color: #408080; font-style: italic } /* Comment */
574 .err, .codehilite .err { border: none } /* Error */
574 .err, .codehilite .err { border: none } /* Error */
575 .k { color: #008000; font-weight: bold } /* Keyword */
575 .k { color: #008000; font-weight: bold } /* Keyword */
576 .o { color: #666666 } /* Operator */
576 .o { color: #666666 } /* Operator */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
581 .gd { color: #A00000 } /* Generic.Deleted */
581 .gd { color: #A00000 } /* Generic.Deleted */
582 .ge { font-style: italic } /* Generic.Emph */
582 .ge { font-style: italic } /* Generic.Emph */
583 .gr { color: #FF0000 } /* Generic.Error */
583 .gr { color: #FF0000 } /* Generic.Error */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
585 .gi { color: #00A000 } /* Generic.Inserted */
585 .gi { color: #00A000 } /* Generic.Inserted */
586 .go { color: #808080 } /* Generic.Output */
586 .go { color: #808080 } /* Generic.Output */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
588 .gs { font-weight: bold } /* Generic.Strong */
588 .gs { font-weight: bold } /* Generic.Strong */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
590 .gt { color: #0040D0 } /* Generic.Traceback */
590 .gt { color: #0040D0 } /* Generic.Traceback */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
594 .kp { color: #008000 } /* Keyword.Pseudo */
594 .kp { color: #008000 } /* Keyword.Pseudo */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
596 .kt { color: #B00040 } /* Keyword.Type */
596 .kt { color: #B00040 } /* Keyword.Type */
597 .m { color: #666666 } /* Literal.Number */
597 .m { color: #666666 } /* Literal.Number */
598 .s { color: #BA2121 } /* Literal.String */
598 .s { color: #BA2121 } /* Literal.String */
599 .na { color: #7D9029 } /* Name.Attribute */
599 .na { color: #7D9029 } /* Name.Attribute */
600 .nb { color: #008000 } /* Name.Builtin */
600 .nb { color: #008000 } /* Name.Builtin */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
602 .no { color: #880000 } /* Name.Constant */
602 .no { color: #880000 } /* Name.Constant */
603 .nd { color: #AA22FF } /* Name.Decorator */
603 .nd { color: #AA22FF } /* Name.Decorator */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
606 .nf { color: #0000FF } /* Name.Function */
606 .nf { color: #0000FF } /* Name.Function */
607 .nl { color: #A0A000 } /* Name.Label */
607 .nl { color: #A0A000 } /* Name.Label */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
610 .nv { color: #19177C } /* Name.Variable */
610 .nv { color: #19177C } /* Name.Variable */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
612 .w { color: #bbbbbb } /* Text.Whitespace */
612 .w { color: #bbbbbb } /* Text.Whitespace */
613 .mf { color: #666666 } /* Literal.Number.Float */
613 .mf { color: #666666 } /* Literal.Number.Float */
614 .mh { color: #666666 } /* Literal.Number.Hex */
614 .mh { color: #666666 } /* Literal.Number.Hex */
615 .mi { color: #666666 } /* Literal.Number.Integer */
615 .mi { color: #666666 } /* Literal.Number.Integer */
616 .mo { color: #666666 } /* Literal.Number.Oct */
616 .mo { color: #666666 } /* Literal.Number.Oct */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
618 .sc { color: #BA2121 } /* Literal.String.Char */
618 .sc { color: #BA2121 } /* Literal.String.Char */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
624 .sx { color: #008000 } /* Literal.String.Other */
624 .sx { color: #008000 } /* Literal.String.Other */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
627 .ss { color: #19177C } /* Literal.String.Symbol */
627 .ss { color: #19177C } /* Literal.String.Symbol */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
629 .vc { color: #19177C } /* Name.Variable.Class */
629 .vc { color: #19177C } /* Name.Variable.Class */
630 .vg { color: #19177C } /* Name.Variable.Global */
630 .vg { color: #19177C } /* Name.Variable.Global */
631 .vi { color: #19177C } /* Name.Variable.Instance */
631 .vi { color: #19177C } /* Name.Variable.Instance */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
633 }
633 }
634
634
635 /* customized pre blocks for markdown/rst */
635 /* customized pre blocks for markdown/rst */
636 pre.literal-block, .codehilite pre{
636 pre.literal-block, .codehilite pre{
637 padding: @padding;
637 padding: @padding;
638 border: 1px solid @grey6;
638 border: 1px solid @grey6;
639 .border-radius(@border-radius);
639 .border-radius(@border-radius);
640 background-color: @grey7;
640 background-color: @grey7;
641 }
641 }
642
642
643
643
644 /* START NEW CODE BLOCK CSS */
644 /* START NEW CODE BLOCK CSS */
645
645
646 @cb-line-height: 18px;
646 @cb-line-height: 18px;
647 @cb-line-code-padding: 10px;
647 @cb-line-code-padding: 10px;
648 @cb-text-padding: 5px;
648 @cb-text-padding: 5px;
649
649
650 @pill-padding: 2px 7px;
650 @pill-padding: 2px 7px;
651 @pill-padding-small: 2px 2px 1px 2px;
651 @pill-padding-small: 2px 2px 1px 2px;
652
652
653 input.filediff-collapse-state {
653 input.filediff-collapse-state {
654 display: none;
654 display: none;
655
655
656 &:checked + .filediff { /* file diff is collapsed */
656 &:checked + .filediff { /* file diff is collapsed */
657 .cb {
657 .cb {
658 display: none
658 display: none
659 }
659 }
660 .filediff-collapse-indicator {
660 .filediff-collapse-indicator {
661 width: 0;
661 width: 0;
662 height: 0;
662 height: 0;
663 border-style: solid;
663 border-style: solid;
664 border-width: 4.5px 0 4.5px 9.3px;
664 border-width: 4.5px 0 4.5px 9.3px;
665 border-color: transparent transparent transparent #aaa;
665 border-color: transparent transparent transparent #aaa;
666 margin: 6px 0px;
666 margin: 6px 0px;
667 }
667 }
668 .filediff-menu {
668 .filediff-menu {
669 display: none;
669 display: none;
670 }
670 }
671
671
672 }
672 }
673
673
674 &+ .filediff { /* file diff is expanded */
674 &+ .filediff { /* file diff is expanded */
675 .filediff-collapse-indicator {
675 .filediff-collapse-indicator {
676 width: 0;
676 width: 0;
677 height: 0;
677 height: 0;
678 border-style: solid;
678 border-style: solid;
679 border-width: 9.3px 4.5px 0 4.5px;
679 border-width: 9.3px 4.5px 0 4.5px;
680 border-color: #aaa transparent transparent transparent;
680 border-color: #aaa transparent transparent transparent;
681 margin: 6px 0px;
681 margin: 6px 0px;
682
682
683 }
683 }
684 .filediff-menu {
684 .filediff-menu {
685 display: block;
685 display: block;
686 }
686 }
687 margin: 10px 0;
687 margin: 10px 0;
688 &:nth-child(2) {
688 &:nth-child(2) {
689 margin: 0;
689 margin: 0;
690 }
690 }
691 }
691 }
692 }
692 }
693
693
694 .filediffs .anchor {
694 .filediffs .anchor {
695 display: block;
695 display: block;
696 height: 40px;
696 height: 40px;
697 margin-top: -40px;
697 margin-top: -40px;
698 visibility: hidden;
698 visibility: hidden;
699 }
699 }
700
700
701 .filediffs .anchor:nth-of-type(1) {
701 .filediffs .anchor:nth-of-type(1) {
702 display: block;
702 display: block;
703 height: 80px;
703 height: 80px;
704 margin-top: -80px;
704 margin-top: -80px;
705 visibility: hidden;
705 visibility: hidden;
706 }
706 }
707
707
708 .cs_files {
708 .cs_files {
709 clear: both;
709 clear: both;
710 }
710 }
711
711
712 #diff-file-sticky{
712 #diff-file-sticky{
713 will-change: min-height;
713 will-change: min-height;
714 }
714 }
715
715
716 .sidebar__inner{
716 .sidebar__inner{
717 transform: translate(0, 0); /* For browsers don't support translate3d. */
717 transform: translate(0, 0); /* For browsers don't support translate3d. */
718 transform: translate3d(0, 0, 0);
718 transform: translate3d(0, 0, 0);
719 will-change: position, transform;
719 will-change: position, transform;
720 height: 60px;
720 height: 70px;
721 z-index: 30;
722 background-color: #fff;
723 padding: 5px 0px;
724 }
725
726 .sidebar__bar {
727 padding: 5px 0px 0px 0px
721 }
728 }
722
729
723 .fpath-placeholder {
730 .fpath-placeholder {
724 clear: both;
731 clear: both;
725 visibility: hidden
732 visibility: hidden
726 }
733 }
727
734
728 .is-affixed {
735 .is-affixed {
729 .sidebar_inner_shadow {
736 .sidebar_inner_shadow {
730 position: fixed;
737 position: fixed;
731 top: 43px;
738 top: 75px;
732 right: 0;
739 right: -100%;
733 left: 0;
740 left: -100%;
734 z-index: 28;
741 z-index: 28;
735 display: block;
742 display: block;
736 height: 5px;
743 height: 5px;
737 content: "";
744 content: "";
738 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
745 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
739 border-top: 1px solid rgba(0, 0, 0, 0.15);
746 border-top: 1px solid rgba(0, 0, 0, 0.15);
740 }
747 }
741 .fpath-placeholder {
748 .fpath-placeholder {
742 visibility: visible !important;
749 visibility: visible !important;
743 }
750 }
744 }
751 }
745
752
746 .diffset-menu {
753 .diffset-menu {
747 margin-bottom: 20px;
754 margin-bottom: 20px;
748 }
755 }
749 .diffset {
756 .diffset {
750 margin: 20px auto;
757 margin: 20px auto;
751 .diffset-heading {
758 .diffset-heading {
752 border: 1px solid @grey5;
759 border: 1px solid @grey5;
753 margin-bottom: -1px;
760 margin-bottom: -1px;
754 // margin-top: 20px;
761 // margin-top: 20px;
755 h2 {
762 h2 {
756 margin: 0;
763 margin: 0;
757 line-height: 38px;
764 line-height: 38px;
758 padding-left: 10px;
765 padding-left: 10px;
759 }
766 }
760 .btn {
767 .btn {
761 margin: 0;
768 margin: 0;
762 }
769 }
763 background: @grey6;
770 background: @grey6;
764 display: block;
771 display: block;
765 padding: 5px;
772 padding: 5px;
766 }
773 }
767 .diffset-heading-warning {
774 .diffset-heading-warning {
768 background: @alert3-inner;
775 background: @alert3-inner;
769 border: 1px solid @alert3;
776 border: 1px solid @alert3;
770 }
777 }
771 &.diffset-comments-disabled {
778 &.diffset-comments-disabled {
772 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
779 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
773 display: none !important;
780 display: none !important;
774 }
781 }
775 }
782 }
776 }
783 }
777
784
778 .filelist {
785 .filelist {
779 .pill {
786 .pill {
780 display: block;
787 display: block;
781 float: left;
788 float: left;
782 padding: @pill-padding-small;
789 padding: @pill-padding-small;
783 }
790 }
784 }
791 }
785
792
786 .pill {
793 .pill {
787 display: block;
794 display: block;
788 float: left;
795 float: left;
789 padding: @pill-padding;
796 padding: @pill-padding;
790 }
797 }
791
798
792 .pill-group {
799 .pill-group {
793 .pill {
800 .pill {
794 opacity: .8;
801 opacity: .8;
795 margin-right: 3px;
802 margin-right: 3px;
796
803
797 &:first-child {
804 &:first-child {
798 border-radius: @border-radius 0 0 @border-radius;
805 border-radius: @border-radius 0 0 @border-radius;
799 }
806 }
800 &:last-child {
807 &:last-child {
801 border-radius: 0 @border-radius @border-radius 0;
808 border-radius: 0 @border-radius @border-radius 0;
802 }
809 }
803 &:only-child {
810 &:only-child {
804 border-radius: @border-radius;
811 border-radius: @border-radius;
805 margin-right: 0;
812 margin-right: 0;
806 }
813 }
807 }
814 }
808 }
815 }
809
816
810 /* Main comments*/
817 /* Main comments*/
811 #comments {
818 #comments {
812 .comment-selected {
819 .comment-selected {
813 border-left: 6px solid @comment-highlight-color;
820 border-left: 6px solid @comment-highlight-color;
814 padding-left: 3px;
821 padding-left: 3px;
815 margin-left: -9px;
822 margin-left: -9px;
816 }
823 }
817 }
824 }
818
825
819 .filediff {
826 .filediff {
820 border: 1px solid @grey5;
827 border: 1px solid @grey5;
821
828
822 /* START OVERRIDES */
829 /* START OVERRIDES */
823 .code-highlight {
830 .code-highlight {
824 border: none; // TODO: remove this border from the global
831 border: none; // TODO: remove this border from the global
825 // .code-highlight, it doesn't belong there
832 // .code-highlight, it doesn't belong there
826 }
833 }
827 label {
834 label {
828 margin: 0; // TODO: remove this margin definition from global label
835 margin: 0; // TODO: remove this margin definition from global label
829 // it doesn't belong there - if margin on labels
836 // it doesn't belong there - if margin on labels
830 // are needed for a form they should be defined
837 // are needed for a form they should be defined
831 // in the form's class
838 // in the form's class
832 }
839 }
833 /* END OVERRIDES */
840 /* END OVERRIDES */
834
841
835 * {
842 * {
836 box-sizing: border-box;
843 box-sizing: border-box;
837 }
844 }
838 .filediff-anchor {
845 .filediff-anchor {
839 visibility: hidden;
846 visibility: hidden;
840 }
847 }
841 &:hover {
848 &:hover {
842 .filediff-anchor {
849 .filediff-anchor {
843 visibility: visible;
850 visibility: visible;
844 }
851 }
845 }
852 }
846
853
847 .filediff-collapse-indicator {
854 .filediff-collapse-indicator {
848 border-style: solid;
855 border-style: solid;
849 float: left;
856 float: left;
850 margin: 4px 0px 0 0;
857 margin: 4px 0px 0 0;
851 cursor: pointer;
858 cursor: pointer;
852 }
859 }
853
860
854 .filediff-heading {
861 .filediff-heading {
855 background: @grey7;
862 background: @grey7;
856 cursor: pointer;
863 cursor: pointer;
857 display: block;
864 display: block;
858 padding: 5px 10px;
865 padding: 5px 10px;
859 }
866 }
860 .filediff-heading:after {
867 .filediff-heading:after {
861 content: "";
868 content: "";
862 display: table;
869 display: table;
863 clear: both;
870 clear: both;
864 }
871 }
865 .filediff-heading:hover {
872 .filediff-heading:hover {
866 background: #e1e9f4 !important;
873 background: #e1e9f4 !important;
867 }
874 }
868
875
869 .filediff-menu {
876 .filediff-menu {
870 float: right;
877 float: right;
871 text-align: right;
878 text-align: right;
872 padding: 5px 5px 5px 0px;
879 padding: 5px 5px 5px 0px;
873
880
874 &> a,
881 &> a,
875 &> span {
882 &> span {
876 padding: 1px;
883 padding: 1px;
877 }
884 }
878 }
885 }
879
886
880 .filediff-collapse-button, .filediff-expand-button {
887 .filediff-collapse-button, .filediff-expand-button {
881 cursor: pointer;
888 cursor: pointer;
882 }
889 }
883 .filediff-collapse-button {
890 .filediff-collapse-button {
884 display: inline;
891 display: inline;
885 }
892 }
886 .filediff-expand-button {
893 .filediff-expand-button {
887 display: none;
894 display: none;
888 }
895 }
889 .filediff-collapsed .filediff-collapse-button {
896 .filediff-collapsed .filediff-collapse-button {
890 display: none;
897 display: none;
891 }
898 }
892 .filediff-collapsed .filediff-expand-button {
899 .filediff-collapsed .filediff-expand-button {
893 display: inline;
900 display: inline;
894 }
901 }
895
902
896 /**** COMMENTS ****/
903 /**** COMMENTS ****/
897
904
898 .filediff-menu {
905 .filediff-menu {
899 .show-comment-button {
906 .show-comment-button {
900 display: none;
907 display: none;
901 }
908 }
902 }
909 }
903 &.hide-comments {
910 &.hide-comments {
904 .inline-comments {
911 .inline-comments {
905 display: none;
912 display: none;
906 }
913 }
907 .filediff-menu {
914 .filediff-menu {
908 .show-comment-button {
915 .show-comment-button {
909 display: inline;
916 display: inline;
910 }
917 }
911 .hide-comment-button {
918 .hide-comment-button {
912 display: none;
919 display: none;
913 }
920 }
914 }
921 }
915 }
922 }
916
923
917 .hide-line-comments {
924 .hide-line-comments {
918 .inline-comments {
925 .inline-comments {
919 display: none;
926 display: none;
920 }
927 }
921 }
928 }
922
929
923 /**** END COMMENTS ****/
930 /**** END COMMENTS ****/
924
931
925 }
932 }
926
933
927
934
928
935
929 .filediff, .filelist {
936 .filediff, .filelist {
930 .pill {
937 .pill {
931 &[op="name"] {
938 &[op="name"] {
932 background: none;
939 background: none;
933 opacity: 1;
940 opacity: 1;
934 color: white;
941 color: white;
935 }
942 }
936 &[op="limited"] {
943 &[op="limited"] {
937 background: @grey2;
944 background: @grey2;
938 color: white;
945 color: white;
939 }
946 }
940 &[op="binary"] {
947 &[op="binary"] {
941 background: @color7;
948 background: @color7;
942 color: white;
949 color: white;
943 }
950 }
944 &[op="modified"] {
951 &[op="modified"] {
945 background: @alert1;
952 background: @alert1;
946 color: white;
953 color: white;
947 }
954 }
948 &[op="renamed"] {
955 &[op="renamed"] {
949 background: @color4;
956 background: @color4;
950 color: white;
957 color: white;
951 }
958 }
952 &[op="copied"] {
959 &[op="copied"] {
953 background: @color4;
960 background: @color4;
954 color: white;
961 color: white;
955 }
962 }
956 &[op="mode"] {
963 &[op="mode"] {
957 background: @grey3;
964 background: @grey3;
958 color: white;
965 color: white;
959 }
966 }
960 &[op="symlink"] {
967 &[op="symlink"] {
961 background: @color8;
968 background: @color8;
962 color: white;
969 color: white;
963 }
970 }
964
971
965 &[op="added"] { /* added lines */
972 &[op="added"] { /* added lines */
966 background: @alert1;
973 background: @alert1;
967 color: white;
974 color: white;
968 }
975 }
969 &[op="deleted"] { /* deleted lines */
976 &[op="deleted"] { /* deleted lines */
970 background: @alert2;
977 background: @alert2;
971 color: white;
978 color: white;
972 }
979 }
973
980
974 &[op="created"] { /* created file */
981 &[op="created"] { /* created file */
975 background: @alert1;
982 background: @alert1;
976 color: white;
983 color: white;
977 }
984 }
978 &[op="removed"] { /* deleted file */
985 &[op="removed"] { /* deleted file */
979 background: @color5;
986 background: @color5;
980 color: white;
987 color: white;
981 }
988 }
982 }
989 }
983 }
990 }
984
991
985
992
986 .filediff-outdated {
993 .filediff-outdated {
987 padding: 8px 0;
994 padding: 8px 0;
988
995
989 .filediff-heading {
996 .filediff-heading {
990 opacity: .5;
997 opacity: .5;
991 }
998 }
992 }
999 }
993
1000
994 table.cb {
1001 table.cb {
995 width: 100%;
1002 width: 100%;
996 border-collapse: collapse;
1003 border-collapse: collapse;
997
1004
998 .cb-text {
1005 .cb-text {
999 padding: @cb-text-padding;
1006 padding: @cb-text-padding;
1000 }
1007 }
1001 .cb-hunk {
1008 .cb-hunk {
1002 padding: @cb-text-padding;
1009 padding: @cb-text-padding;
1003 }
1010 }
1004 .cb-expand {
1011 .cb-expand {
1005 display: none;
1012 display: none;
1006 }
1013 }
1007 .cb-collapse {
1014 .cb-collapse {
1008 display: inline;
1015 display: inline;
1009 }
1016 }
1010 &.cb-collapsed {
1017 &.cb-collapsed {
1011 .cb-line {
1018 .cb-line {
1012 display: none;
1019 display: none;
1013 }
1020 }
1014 .cb-expand {
1021 .cb-expand {
1015 display: inline;
1022 display: inline;
1016 }
1023 }
1017 .cb-collapse {
1024 .cb-collapse {
1018 display: none;
1025 display: none;
1019 }
1026 }
1020 }
1027 }
1021
1028
1022 /* intentionally general selector since .cb-line-selected must override it
1029 /* intentionally general selector since .cb-line-selected must override it
1023 and they both use !important since the td itself may have a random color
1030 and they both use !important since the td itself may have a random color
1024 generated by annotation blocks. TLDR: if you change it, make sure
1031 generated by annotation blocks. TLDR: if you change it, make sure
1025 annotated block selection and line selection in file view still work */
1032 annotated block selection and line selection in file view still work */
1026 .cb-line-fresh .cb-content {
1033 .cb-line-fresh .cb-content {
1027 background: white !important;
1034 background: white !important;
1028 }
1035 }
1029 .cb-warning {
1036 .cb-warning {
1030 background: #fff4dd;
1037 background: #fff4dd;
1031 }
1038 }
1032
1039
1033 &.cb-diff-sideside {
1040 &.cb-diff-sideside {
1034 td {
1041 td {
1035 &.cb-content {
1042 &.cb-content {
1036 width: 50%;
1043 width: 50%;
1037 }
1044 }
1038 }
1045 }
1039 }
1046 }
1040
1047
1041 tr {
1048 tr {
1042 &.cb-annotate {
1049 &.cb-annotate {
1043 border-top: 1px solid #eee;
1050 border-top: 1px solid #eee;
1044 }
1051 }
1045
1052
1046 &.cb-comment-info {
1053 &.cb-comment-info {
1047 border-top: 1px solid #eee;
1054 border-top: 1px solid #eee;
1048 color: rgba(0, 0, 0, 0.3);
1055 color: rgba(0, 0, 0, 0.3);
1049 background: #edf2f9;
1056 background: #edf2f9;
1050
1057
1051 td {
1058 td {
1052
1059
1053 }
1060 }
1054 }
1061 }
1055
1062
1056 &.cb-hunk {
1063 &.cb-hunk {
1057 font-family: @font-family-monospace;
1064 font-family: @font-family-monospace;
1058 color: rgba(0, 0, 0, 0.3);
1065 color: rgba(0, 0, 0, 0.3);
1059
1066
1060 td {
1067 td {
1061 &:first-child {
1068 &:first-child {
1062 background: #edf2f9;
1069 background: #edf2f9;
1063 }
1070 }
1064 &:last-child {
1071 &:last-child {
1065 background: #f4f7fb;
1072 background: #f4f7fb;
1066 }
1073 }
1067 }
1074 }
1068 }
1075 }
1069 }
1076 }
1070
1077
1071
1078
1072 td {
1079 td {
1073 vertical-align: top;
1080 vertical-align: top;
1074 padding: 0;
1081 padding: 0;
1075
1082
1076 &.cb-content {
1083 &.cb-content {
1077 font-size: 12.35px;
1084 font-size: 12.35px;
1078
1085
1079 &.cb-line-selected .cb-code {
1086 &.cb-line-selected .cb-code {
1080 background: @comment-highlight-color !important;
1087 background: @comment-highlight-color !important;
1081 }
1088 }
1082
1089
1083 span.cb-code {
1090 span.cb-code {
1084 line-height: @cb-line-height;
1091 line-height: @cb-line-height;
1085 padding-left: @cb-line-code-padding;
1092 padding-left: @cb-line-code-padding;
1086 padding-right: @cb-line-code-padding;
1093 padding-right: @cb-line-code-padding;
1087 display: block;
1094 display: block;
1088 white-space: pre-wrap;
1095 white-space: pre-wrap;
1089 font-family: @font-family-monospace;
1096 font-family: @font-family-monospace;
1090 word-break: break-all;
1097 word-break: break-all;
1091 .nonl {
1098 .nonl {
1092 color: @color5;
1099 color: @color5;
1093 }
1100 }
1094 }
1101 }
1095
1102
1096 &> button.cb-comment-box-opener {
1103 &> button.cb-comment-box-opener {
1097
1104
1098 padding: 2px 2px 1px 3px;
1105 padding: 2px 2px 1px 3px;
1099 margin-left: -6px;
1106 margin-left: -6px;
1100 margin-top: -1px;
1107 margin-top: -1px;
1101
1108
1102 border-radius: @border-radius;
1109 border-radius: @border-radius;
1103 position: absolute;
1110 position: absolute;
1104 display: none;
1111 display: none;
1105 }
1112 }
1106 .cb-comment {
1113 .cb-comment {
1107 margin-top: 10px;
1114 margin-top: 10px;
1108 white-space: normal;
1115 white-space: normal;
1109 }
1116 }
1110 }
1117 }
1111 &:hover {
1118 &:hover {
1112 button.cb-comment-box-opener {
1119 button.cb-comment-box-opener {
1113 display: block;
1120 display: block;
1114 }
1121 }
1115 &+ td button.cb-comment-box-opener {
1122 &+ td button.cb-comment-box-opener {
1116 display: block
1123 display: block
1117 }
1124 }
1118 }
1125 }
1119
1126
1120 &.cb-data {
1127 &.cb-data {
1121 text-align: right;
1128 text-align: right;
1122 width: 30px;
1129 width: 30px;
1123 font-family: @font-family-monospace;
1130 font-family: @font-family-monospace;
1124
1131
1125 .icon-comment {
1132 .icon-comment {
1126 cursor: pointer;
1133 cursor: pointer;
1127 }
1134 }
1128 &.cb-line-selected > div {
1135 &.cb-line-selected > div {
1129 display: block;
1136 display: block;
1130 background: @comment-highlight-color !important;
1137 background: @comment-highlight-color !important;
1131 line-height: @cb-line-height;
1138 line-height: @cb-line-height;
1132 color: rgba(0, 0, 0, 0.3);
1139 color: rgba(0, 0, 0, 0.3);
1133 }
1140 }
1134 }
1141 }
1135
1142
1136 &.cb-lineno {
1143 &.cb-lineno {
1137 padding: 0;
1144 padding: 0;
1138 width: 50px;
1145 width: 50px;
1139 color: rgba(0, 0, 0, 0.3);
1146 color: rgba(0, 0, 0, 0.3);
1140 text-align: right;
1147 text-align: right;
1141 border-right: 1px solid #eee;
1148 border-right: 1px solid #eee;
1142 font-family: @font-family-monospace;
1149 font-family: @font-family-monospace;
1143 -webkit-user-select: none;
1150 -webkit-user-select: none;
1144 -moz-user-select: none;
1151 -moz-user-select: none;
1145 user-select: none;
1152 user-select: none;
1146
1153
1147 a::before {
1154 a::before {
1148 content: attr(data-line-no);
1155 content: attr(data-line-no);
1149 }
1156 }
1150 &.cb-line-selected a {
1157 &.cb-line-selected a {
1151 background: @comment-highlight-color !important;
1158 background: @comment-highlight-color !important;
1152 }
1159 }
1153
1160
1154 a {
1161 a {
1155 display: block;
1162 display: block;
1156 padding-right: @cb-line-code-padding;
1163 padding-right: @cb-line-code-padding;
1157 padding-left: @cb-line-code-padding;
1164 padding-left: @cb-line-code-padding;
1158 line-height: @cb-line-height;
1165 line-height: @cb-line-height;
1159 color: rgba(0, 0, 0, 0.3);
1166 color: rgba(0, 0, 0, 0.3);
1160 }
1167 }
1161 }
1168 }
1162
1169
1163 &.cb-empty {
1170 &.cb-empty {
1164 background: @grey7;
1171 background: @grey7;
1165 }
1172 }
1166
1173
1167 ins {
1174 ins {
1168 color: black;
1175 color: black;
1169 background: #a6f3a6;
1176 background: #a6f3a6;
1170 text-decoration: none;
1177 text-decoration: none;
1171 }
1178 }
1172 del {
1179 del {
1173 color: black;
1180 color: black;
1174 background: #f8cbcb;
1181 background: #f8cbcb;
1175 text-decoration: none;
1182 text-decoration: none;
1176 }
1183 }
1177 &.cb-addition {
1184 &.cb-addition {
1178 background: #ecffec;
1185 background: #ecffec;
1179
1186
1180 &.blob-lineno {
1187 &.blob-lineno {
1181 background: #ddffdd;
1188 background: #ddffdd;
1182 }
1189 }
1183 }
1190 }
1184 &.cb-deletion {
1191 &.cb-deletion {
1185 background: #ffecec;
1192 background: #ffecec;
1186
1193
1187 &.blob-lineno {
1194 &.blob-lineno {
1188 background: #ffdddd;
1195 background: #ffdddd;
1189 }
1196 }
1190 }
1197 }
1191 &.cb-annotate-message-spacer {
1198 &.cb-annotate-message-spacer {
1192 width:8px;
1199 width:8px;
1193 padding: 1px 0px 0px 3px;
1200 padding: 1px 0px 0px 3px;
1194 }
1201 }
1195 &.cb-annotate-info {
1202 &.cb-annotate-info {
1196 width: 320px;
1203 width: 320px;
1197 min-width: 320px;
1204 min-width: 320px;
1198 max-width: 320px;
1205 max-width: 320px;
1199 padding: 5px 2px;
1206 padding: 5px 2px;
1200 font-size: 13px;
1207 font-size: 13px;
1201
1208
1202 .cb-annotate-message {
1209 .cb-annotate-message {
1203 padding: 2px 0px 0px 0px;
1210 padding: 2px 0px 0px 0px;
1204 white-space: pre-line;
1211 white-space: pre-line;
1205 overflow: hidden;
1212 overflow: hidden;
1206 }
1213 }
1207 .rc-user {
1214 .rc-user {
1208 float: none;
1215 float: none;
1209 padding: 0 6px 0 17px;
1216 padding: 0 6px 0 17px;
1210 min-width: unset;
1217 min-width: unset;
1211 min-height: unset;
1218 min-height: unset;
1212 }
1219 }
1213 }
1220 }
1214
1221
1215 &.cb-annotate-revision {
1222 &.cb-annotate-revision {
1216 cursor: pointer;
1223 cursor: pointer;
1217 text-align: right;
1224 text-align: right;
1218 padding: 1px 3px 0px 3px;
1225 padding: 1px 3px 0px 3px;
1219 }
1226 }
1220 }
1227 }
1221 }
1228 }
@@ -1,967 +1,969 b''
1 <%namespace name="commentblock" file="/changeset/changeset_file_comment.mako"/>
1 <%namespace name="commentblock" file="/changeset/changeset_file_comment.mako"/>
2
2
3 <%def name="diff_line_anchor(filename, line, type)"><%
3 <%def name="diff_line_anchor(filename, line, type)"><%
4 return '%s_%s_%i' % (h.safeid(filename), type, line)
4 return '%s_%s_%i' % (h.safeid(filename), type, line)
5 %></%def>
5 %></%def>
6
6
7 <%def name="action_class(action)">
7 <%def name="action_class(action)">
8 <%
8 <%
9 return {
9 return {
10 '-': 'cb-deletion',
10 '-': 'cb-deletion',
11 '+': 'cb-addition',
11 '+': 'cb-addition',
12 ' ': 'cb-context',
12 ' ': 'cb-context',
13 }.get(action, 'cb-empty')
13 }.get(action, 'cb-empty')
14 %>
14 %>
15 </%def>
15 </%def>
16
16
17 <%def name="op_class(op_id)">
17 <%def name="op_class(op_id)">
18 <%
18 <%
19 return {
19 return {
20 DEL_FILENODE: 'deletion', # file deleted
20 DEL_FILENODE: 'deletion', # file deleted
21 BIN_FILENODE: 'warning' # binary diff hidden
21 BIN_FILENODE: 'warning' # binary diff hidden
22 }.get(op_id, 'addition')
22 }.get(op_id, 'addition')
23 %>
23 %>
24 </%def>
24 </%def>
25
25
26
26
27
27
28 <%def name="render_diffset(diffset, commit=None,
28 <%def name="render_diffset(diffset, commit=None,
29
29
30 # collapse all file diff entries when there are more than this amount of files in the diff
30 # collapse all file diff entries when there are more than this amount of files in the diff
31 collapse_when_files_over=20,
31 collapse_when_files_over=20,
32
32
33 # collapse lines in the diff when more than this amount of lines changed in the file diff
33 # collapse lines in the diff when more than this amount of lines changed in the file diff
34 lines_changed_limit=500,
34 lines_changed_limit=500,
35
35
36 # add a ruler at to the output
36 # add a ruler at to the output
37 ruler_at_chars=0,
37 ruler_at_chars=0,
38
38
39 # show inline comments
39 # show inline comments
40 use_comments=False,
40 use_comments=False,
41
41
42 # disable new comments
42 # disable new comments
43 disable_new_comments=False,
43 disable_new_comments=False,
44
44
45 # special file-comments that were deleted in previous versions
45 # special file-comments that were deleted in previous versions
46 # it's used for showing outdated comments for deleted files in a PR
46 # it's used for showing outdated comments for deleted files in a PR
47 deleted_files_comments=None,
47 deleted_files_comments=None,
48
48
49 # for cache purpose
49 # for cache purpose
50 inline_comments=None,
50 inline_comments=None,
51
51
52 )">
52 )">
53 %if use_comments:
53 %if use_comments:
54 <div id="cb-comments-inline-container-template" class="js-template">
54 <div id="cb-comments-inline-container-template" class="js-template">
55 ${inline_comments_container([], inline_comments)}
55 ${inline_comments_container([], inline_comments)}
56 </div>
56 </div>
57 <div class="js-template" id="cb-comment-inline-form-template">
57 <div class="js-template" id="cb-comment-inline-form-template">
58 <div class="comment-inline-form ac">
58 <div class="comment-inline-form ac">
59
59
60 %if c.rhodecode_user.username != h.DEFAULT_USER:
60 %if c.rhodecode_user.username != h.DEFAULT_USER:
61 ## render template for inline comments
61 ## render template for inline comments
62 ${commentblock.comment_form(form_type='inline')}
62 ${commentblock.comment_form(form_type='inline')}
63 %else:
63 %else:
64 ${h.form('', class_='inline-form comment-form-login', method='get')}
64 ${h.form('', class_='inline-form comment-form-login', method='get')}
65 <div class="pull-left">
65 <div class="pull-left">
66 <div class="comment-help pull-right">
66 <div class="comment-help pull-right">
67 ${_('You need to be logged in to leave comments.')} <a href="${h.route_path('login', _query={'came_from': h.current_route_path(request)})}">${_('Login now')}</a>
67 ${_('You need to be logged in to leave comments.')} <a href="${h.route_path('login', _query={'came_from': h.current_route_path(request)})}">${_('Login now')}</a>
68 </div>
68 </div>
69 </div>
69 </div>
70 <div class="comment-button pull-right">
70 <div class="comment-button pull-right">
71 <button type="button" class="cb-comment-cancel" onclick="return Rhodecode.comments.cancelComment(this);">
71 <button type="button" class="cb-comment-cancel" onclick="return Rhodecode.comments.cancelComment(this);">
72 ${_('Cancel')}
72 ${_('Cancel')}
73 </button>
73 </button>
74 </div>
74 </div>
75 <div class="clearfix"></div>
75 <div class="clearfix"></div>
76 ${h.end_form()}
76 ${h.end_form()}
77 %endif
77 %endif
78 </div>
78 </div>
79 </div>
79 </div>
80
80
81 %endif
81 %endif
82 <%
82 <%
83 collapse_all = len(diffset.files) > collapse_when_files_over
83 collapse_all = len(diffset.files) > collapse_when_files_over
84 %>
84 %>
85
85
86 %if c.user_session_attrs["diffmode"] == 'sideside':
86 %if c.user_session_attrs["diffmode"] == 'sideside':
87 <style>
87 <style>
88 .wrapper {
88 .wrapper {
89 max-width: 1600px !important;
89 max-width: 1600px !important;
90 }
90 }
91 </style>
91 </style>
92 %endif
92 %endif
93
93
94 %if ruler_at_chars:
94 %if ruler_at_chars:
95 <style>
95 <style>
96 .diff table.cb .cb-content:after {
96 .diff table.cb .cb-content:after {
97 content: "";
97 content: "";
98 border-left: 1px solid blue;
98 border-left: 1px solid blue;
99 position: absolute;
99 position: absolute;
100 top: 0;
100 top: 0;
101 height: 18px;
101 height: 18px;
102 opacity: .2;
102 opacity: .2;
103 z-index: 10;
103 z-index: 10;
104 //## +5 to account for diff action (+/-)
104 //## +5 to account for diff action (+/-)
105 left: ${ruler_at_chars + 5}ch;
105 left: ${ruler_at_chars + 5}ch;
106 </style>
106 </style>
107 %endif
107 %endif
108
108
109 <div class="diffset ${disable_new_comments and 'diffset-comments-disabled'}">
109 <div class="diffset ${disable_new_comments and 'diffset-comments-disabled'}">
110 <div class="diffset-heading ${diffset.limited_diff and 'diffset-heading-warning' or ''}">
110 <div class="diffset-heading ${diffset.limited_diff and 'diffset-heading-warning' or ''}">
111 %if commit:
111 %if commit:
112 <div class="pull-right">
112 <div class="pull-right">
113 <a class="btn tooltip" title="${h.tooltip(_('Browse Files at revision {}').format(commit.raw_id))}" href="${h.route_path('repo_files',repo_name=diffset.repo_name, commit_id=commit.raw_id, f_path='')}">
113 <a class="btn tooltip" title="${h.tooltip(_('Browse Files at revision {}').format(commit.raw_id))}" href="${h.route_path('repo_files',repo_name=diffset.repo_name, commit_id=commit.raw_id, f_path='')}">
114 ${_('Browse Files')}
114 ${_('Browse Files')}
115 </a>
115 </a>
116 </div>
116 </div>
117 %endif
117 %endif
118 <h2 class="clearinner">
118 <h2 class="clearinner">
119 ## invidual commit
119 ## invidual commit
120 % if commit:
120 % if commit:
121 <a class="tooltip revision" title="${h.tooltip(commit.message)}" href="${h.route_path('repo_commit',repo_name=diffset.repo_name,commit_id=commit.raw_id)}">${('r%s:%s' % (commit.idx,h.short_id(commit.raw_id)))}</a> -
121 <a class="tooltip revision" title="${h.tooltip(commit.message)}" href="${h.route_path('repo_commit',repo_name=diffset.repo_name,commit_id=commit.raw_id)}">${('r%s:%s' % (commit.idx,h.short_id(commit.raw_id)))}</a> -
122 ${h.age_component(commit.date)}
122 ${h.age_component(commit.date)}
123 % if diffset.limited_diff:
123 % if diffset.limited_diff:
124 - ${_('The requested commit is too big and content was truncated.')}
124 - ${_('The requested commit is too big and content was truncated.')}
125 ${_ungettext('%(num)s file changed.', '%(num)s files changed.', diffset.changed_files) % {'num': diffset.changed_files}}
125 ${_ungettext('%(num)s file changed.', '%(num)s files changed.', diffset.changed_files) % {'num': diffset.changed_files}}
126 <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
126 <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
127 % elif hasattr(c, 'commit_ranges') and len(c.commit_ranges) > 1:
127 % elif hasattr(c, 'commit_ranges') and len(c.commit_ranges) > 1:
128 ## compare diff, has no file-selector and we want to show stats anyway
128 ## compare diff, has no file-selector and we want to show stats anyway
129 ${_ungettext('{num} file changed: {linesadd} inserted, ''{linesdel} deleted',
129 ${_ungettext('{num} file changed: {linesadd} inserted, ''{linesdel} deleted',
130 '{num} files changed: {linesadd} inserted, {linesdel} deleted', diffset.changed_files) \
130 '{num} files changed: {linesadd} inserted, {linesdel} deleted', diffset.changed_files) \
131 .format(num=diffset.changed_files, linesadd=diffset.lines_added, linesdel=diffset.lines_deleted)}
131 .format(num=diffset.changed_files, linesadd=diffset.lines_added, linesdel=diffset.lines_deleted)}
132 % endif
132 % endif
133 % else:
133 % else:
134 ## pull requests/compare
134 ## pull requests/compare
135 ${_('File Changes')}
135 ${_('File Changes')}
136 % endif
136 % endif
137
137
138 </h2>
138 </h2>
139 </div>
139 </div>
140
140
141 %if diffset.has_hidden_changes:
141 %if diffset.has_hidden_changes:
142 <p class="empty_data">${_('Some changes may be hidden')}</p>
142 <p class="empty_data">${_('Some changes may be hidden')}</p>
143 %elif not diffset.files:
143 %elif not diffset.files:
144 <p class="empty_data">${_('No files')}</p>
144 <p class="empty_data">${_('No files')}</p>
145 %endif
145 %endif
146
146
147 <div class="filediffs">
147 <div class="filediffs">
148
148
149 ## initial value could be marked as False later on
149 ## initial value could be marked as False later on
150 <% over_lines_changed_limit = False %>
150 <% over_lines_changed_limit = False %>
151 %for i, filediff in enumerate(diffset.files):
151 %for i, filediff in enumerate(diffset.files):
152
152
153 <%
153 <%
154 lines_changed = filediff.patch['stats']['added'] + filediff.patch['stats']['deleted']
154 lines_changed = filediff.patch['stats']['added'] + filediff.patch['stats']['deleted']
155 over_lines_changed_limit = lines_changed > lines_changed_limit
155 over_lines_changed_limit = lines_changed > lines_changed_limit
156 %>
156 %>
157 ## anchor with support of sticky header
157 ## anchor with support of sticky header
158 <div class="anchor" id="a_${h.FID(filediff.raw_id, filediff.patch['filename'])}"></div>
158 <div class="anchor" id="a_${h.FID(filediff.raw_id, filediff.patch['filename'])}"></div>
159
159
160 <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox" onchange="Waypoint.refreshAll();">
160 <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filediff)}" type="checkbox" onchange="Waypoint.refreshAll();">
161 <div
161 <div
162 class="filediff"
162 class="filediff"
163 data-f-path="${filediff.patch['filename']}"
163 data-f-path="${filediff.patch['filename']}"
164 data-anchor-id="${h.FID(filediff.raw_id, filediff.patch['filename'])}"
164 data-anchor-id="${h.FID(filediff.raw_id, filediff.patch['filename'])}"
165 >
165 >
166 <label for="filediff-collapse-${id(filediff)}" class="filediff-heading">
166 <label for="filediff-collapse-${id(filediff)}" class="filediff-heading">
167 <div class="filediff-collapse-indicator"></div>
167 <div class="filediff-collapse-indicator"></div>
168 ${diff_ops(filediff)}
168 ${diff_ops(filediff)}
169 </label>
169 </label>
170
170
171 ${diff_menu(filediff, use_comments=use_comments)}
171 ${diff_menu(filediff, use_comments=use_comments)}
172 <table data-f-path="${filediff.patch['filename']}" data-anchor-id="${h.FID(filediff.raw_id, filediff.patch['filename'])}" class="code-visible-block cb cb-diff-${c.user_session_attrs["diffmode"]} code-highlight ${(over_lines_changed_limit and 'cb-collapsed' or '')}">
172 <table data-f-path="${filediff.patch['filename']}" data-anchor-id="${h.FID(filediff.raw_id, filediff.patch['filename'])}" class="code-visible-block cb cb-diff-${c.user_session_attrs["diffmode"]} code-highlight ${(over_lines_changed_limit and 'cb-collapsed' or '')}">
173
173
174 ## new/deleted/empty content case
174 ## new/deleted/empty content case
175 % if not filediff.hunks:
175 % if not filediff.hunks:
176 ## Comment container, on "fakes" hunk that contains all data to render comments
176 ## Comment container, on "fakes" hunk that contains all data to render comments
177 ${render_hunk_lines(c.user_session_attrs["diffmode"], filediff.hunk_ops, use_comments=use_comments, inline_comments=inline_comments)}
177 ${render_hunk_lines(c.user_session_attrs["diffmode"], filediff.hunk_ops, use_comments=use_comments, inline_comments=inline_comments)}
178 % endif
178 % endif
179
179
180 %if filediff.limited_diff:
180 %if filediff.limited_diff:
181 <tr class="cb-warning cb-collapser">
181 <tr class="cb-warning cb-collapser">
182 <td class="cb-text" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=6')}>
182 <td class="cb-text" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=6')}>
183 ${_('The requested commit is too big and content was truncated.')} <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
183 ${_('The requested commit is too big and content was truncated.')} <a href="${h.current_route_path(request, fulldiff=1)}" onclick="return confirm('${_("Showing a big diff might take some time and resources, continue?")}')">${_('Show full diff')}</a>
184 </td>
184 </td>
185 </tr>
185 </tr>
186 %else:
186 %else:
187 %if over_lines_changed_limit:
187 %if over_lines_changed_limit:
188 <tr class="cb-warning cb-collapser">
188 <tr class="cb-warning cb-collapser">
189 <td class="cb-text" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=6')}>
189 <td class="cb-text" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=6')}>
190 ${_('This diff has been collapsed as it changes many lines, (%i lines changed)' % lines_changed)}
190 ${_('This diff has been collapsed as it changes many lines, (%i lines changed)' % lines_changed)}
191 <a href="#" class="cb-expand"
191 <a href="#" class="cb-expand"
192 onclick="$(this).closest('table').removeClass('cb-collapsed'); return false;">${_('Show them')}
192 onclick="$(this).closest('table').removeClass('cb-collapsed'); return false;">${_('Show them')}
193 </a>
193 </a>
194 <a href="#" class="cb-collapse"
194 <a href="#" class="cb-collapse"
195 onclick="$(this).closest('table').addClass('cb-collapsed'); return false;">${_('Hide them')}
195 onclick="$(this).closest('table').addClass('cb-collapsed'); return false;">${_('Hide them')}
196 </a>
196 </a>
197 </td>
197 </td>
198 </tr>
198 </tr>
199 %endif
199 %endif
200 %endif
200 %endif
201
201
202 % for hunk in filediff.hunks:
202 % for hunk in filediff.hunks:
203 <tr class="cb-hunk">
203 <tr class="cb-hunk">
204 <td ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=3' or '')}>
204 <td ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=3' or '')}>
205 ## TODO: dan: add ajax loading of more context here
205 ## TODO: dan: add ajax loading of more context here
206 ## <a href="#">
206 ## <a href="#">
207 <i class="icon-more"></i>
207 <i class="icon-more"></i>
208 ## </a>
208 ## </a>
209 </td>
209 </td>
210 <td ${(c.user_session_attrs["diffmode"] == 'sideside' and 'colspan=5' or '')}>
210 <td ${(c.user_session_attrs["diffmode"] == 'sideside' and 'colspan=5' or '')}>
211 @@
211 @@
212 -${hunk.source_start},${hunk.source_length}
212 -${hunk.source_start},${hunk.source_length}
213 +${hunk.target_start},${hunk.target_length}
213 +${hunk.target_start},${hunk.target_length}
214 ${hunk.section_header}
214 ${hunk.section_header}
215 </td>
215 </td>
216 </tr>
216 </tr>
217 ${render_hunk_lines(c.user_session_attrs["diffmode"], hunk, use_comments=use_comments, inline_comments=inline_comments)}
217 ${render_hunk_lines(c.user_session_attrs["diffmode"], hunk, use_comments=use_comments, inline_comments=inline_comments)}
218 % endfor
218 % endfor
219
219
220 <% unmatched_comments = (inline_comments or {}).get(filediff.patch['filename'], {}) %>
220 <% unmatched_comments = (inline_comments or {}).get(filediff.patch['filename'], {}) %>
221
221
222 ## outdated comments that do not fit into currently displayed lines
222 ## outdated comments that do not fit into currently displayed lines
223 % for lineno, comments in unmatched_comments.items():
223 % for lineno, comments in unmatched_comments.items():
224
224
225 %if c.user_session_attrs["diffmode"] == 'unified':
225 %if c.user_session_attrs["diffmode"] == 'unified':
226 % if loop.index == 0:
226 % if loop.index == 0:
227 <tr class="cb-hunk">
227 <tr class="cb-hunk">
228 <td colspan="3"></td>
228 <td colspan="3"></td>
229 <td>
229 <td>
230 <div>
230 <div>
231 ${_('Unmatched inline comments below')}
231 ${_('Unmatched inline comments below')}
232 </div>
232 </div>
233 </td>
233 </td>
234 </tr>
234 </tr>
235 % endif
235 % endif
236 <tr class="cb-line">
236 <tr class="cb-line">
237 <td class="cb-data cb-context"></td>
237 <td class="cb-data cb-context"></td>
238 <td class="cb-lineno cb-context"></td>
238 <td class="cb-lineno cb-context"></td>
239 <td class="cb-lineno cb-context"></td>
239 <td class="cb-lineno cb-context"></td>
240 <td class="cb-content cb-context">
240 <td class="cb-content cb-context">
241 ${inline_comments_container(comments, inline_comments)}
241 ${inline_comments_container(comments, inline_comments)}
242 </td>
242 </td>
243 </tr>
243 </tr>
244 %elif c.user_session_attrs["diffmode"] == 'sideside':
244 %elif c.user_session_attrs["diffmode"] == 'sideside':
245 % if loop.index == 0:
245 % if loop.index == 0:
246 <tr class="cb-comment-info">
246 <tr class="cb-comment-info">
247 <td colspan="2"></td>
247 <td colspan="2"></td>
248 <td class="cb-line">
248 <td class="cb-line">
249 <div>
249 <div>
250 ${_('Unmatched inline comments below')}
250 ${_('Unmatched inline comments below')}
251 </div>
251 </div>
252 </td>
252 </td>
253 <td colspan="2"></td>
253 <td colspan="2"></td>
254 <td class="cb-line">
254 <td class="cb-line">
255 <div>
255 <div>
256 ${_('Unmatched comments below')}
256 ${_('Unmatched comments below')}
257 </div>
257 </div>
258 </td>
258 </td>
259 </tr>
259 </tr>
260 % endif
260 % endif
261 <tr class="cb-line">
261 <tr class="cb-line">
262 <td class="cb-data cb-context"></td>
262 <td class="cb-data cb-context"></td>
263 <td class="cb-lineno cb-context"></td>
263 <td class="cb-lineno cb-context"></td>
264 <td class="cb-content cb-context">
264 <td class="cb-content cb-context">
265 % if lineno.startswith('o'):
265 % if lineno.startswith('o'):
266 ${inline_comments_container(comments, inline_comments)}
266 ${inline_comments_container(comments, inline_comments)}
267 % endif
267 % endif
268 </td>
268 </td>
269
269
270 <td class="cb-data cb-context"></td>
270 <td class="cb-data cb-context"></td>
271 <td class="cb-lineno cb-context"></td>
271 <td class="cb-lineno cb-context"></td>
272 <td class="cb-content cb-context">
272 <td class="cb-content cb-context">
273 % if lineno.startswith('n'):
273 % if lineno.startswith('n'):
274 ${inline_comments_container(comments, inline_comments)}
274 ${inline_comments_container(comments, inline_comments)}
275 % endif
275 % endif
276 </td>
276 </td>
277 </tr>
277 </tr>
278 %endif
278 %endif
279
279
280 % endfor
280 % endfor
281
281
282 </table>
282 </table>
283 </div>
283 </div>
284 %endfor
284 %endfor
285
285
286 ## outdated comments that are made for a file that has been deleted
286 ## outdated comments that are made for a file that has been deleted
287 % for filename, comments_dict in (deleted_files_comments or {}).items():
287 % for filename, comments_dict in (deleted_files_comments or {}).items():
288 <%
288 <%
289 display_state = 'display: none'
289 display_state = 'display: none'
290 open_comments_in_file = [x for x in comments_dict['comments'] if x.outdated is False]
290 open_comments_in_file = [x for x in comments_dict['comments'] if x.outdated is False]
291 if open_comments_in_file:
291 if open_comments_in_file:
292 display_state = ''
292 display_state = ''
293 %>
293 %>
294 <div class="filediffs filediff-outdated" style="${display_state}">
294 <div class="filediffs filediff-outdated" style="${display_state}">
295 <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox" onchange="Waypoint.refreshAll();">
295 <input ${(collapse_all and 'checked' or '')} class="filediff-collapse-state" id="filediff-collapse-${id(filename)}" type="checkbox" onchange="Waypoint.refreshAll();">
296 <div class="filediff" data-f-path="${filename}" id="a_${h.FID(filediff.raw_id, filename)}">
296 <div class="filediff" data-f-path="${filename}" id="a_${h.FID(filediff.raw_id, filename)}">
297 <label for="filediff-collapse-${id(filename)}" class="filediff-heading">
297 <label for="filediff-collapse-${id(filename)}" class="filediff-heading">
298 <div class="filediff-collapse-indicator"></div>
298 <div class="filediff-collapse-indicator"></div>
299 <span class="pill">
299 <span class="pill">
300 ## file was deleted
300 ## file was deleted
301 <strong>${filename}</strong>
301 <strong>${filename}</strong>
302 </span>
302 </span>
303 <span class="pill-group" style="float: left">
303 <span class="pill-group" style="float: left">
304 ## file op, doesn't need translation
304 ## file op, doesn't need translation
305 <span class="pill" op="removed">removed in this version</span>
305 <span class="pill" op="removed">removed in this version</span>
306 </span>
306 </span>
307 <a class="pill filediff-anchor" href="#a_${h.FID(filediff.raw_id, filename)}">ΒΆ</a>
307 <a class="pill filediff-anchor" href="#a_${h.FID(filediff.raw_id, filename)}">ΒΆ</a>
308 <span class="pill-group" style="float: right">
308 <span class="pill-group" style="float: right">
309 <span class="pill" op="deleted">-${comments_dict['stats']}</span>
309 <span class="pill" op="deleted">-${comments_dict['stats']}</span>
310 </span>
310 </span>
311 </label>
311 </label>
312
312
313 <table class="cb cb-diff-${c.user_session_attrs["diffmode"]} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
313 <table class="cb cb-diff-${c.user_session_attrs["diffmode"]} code-highlight ${over_lines_changed_limit and 'cb-collapsed' or ''}">
314 <tr>
314 <tr>
315 % if c.user_session_attrs["diffmode"] == 'unified':
315 % if c.user_session_attrs["diffmode"] == 'unified':
316 <td></td>
316 <td></td>
317 %endif
317 %endif
318
318
319 <td></td>
319 <td></td>
320 <td class="cb-text cb-${op_class(BIN_FILENODE)}" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=5')}>
320 <td class="cb-text cb-${op_class(BIN_FILENODE)}" ${(c.user_session_attrs["diffmode"] == 'unified' and 'colspan=4' or 'colspan=5')}>
321 ${_('File was deleted in this version. There are still outdated/unresolved comments attached to it.')}
321 ${_('File was deleted in this version. There are still outdated/unresolved comments attached to it.')}
322 </td>
322 </td>
323 </tr>
323 </tr>
324 %if c.user_session_attrs["diffmode"] == 'unified':
324 %if c.user_session_attrs["diffmode"] == 'unified':
325 <tr class="cb-line">
325 <tr class="cb-line">
326 <td class="cb-data cb-context"></td>
326 <td class="cb-data cb-context"></td>
327 <td class="cb-lineno cb-context"></td>
327 <td class="cb-lineno cb-context"></td>
328 <td class="cb-lineno cb-context"></td>
328 <td class="cb-lineno cb-context"></td>
329 <td class="cb-content cb-context">
329 <td class="cb-content cb-context">
330 ${inline_comments_container(comments_dict['comments'], inline_comments)}
330 ${inline_comments_container(comments_dict['comments'], inline_comments)}
331 </td>
331 </td>
332 </tr>
332 </tr>
333 %elif c.user_session_attrs["diffmode"] == 'sideside':
333 %elif c.user_session_attrs["diffmode"] == 'sideside':
334 <tr class="cb-line">
334 <tr class="cb-line">
335 <td class="cb-data cb-context"></td>
335 <td class="cb-data cb-context"></td>
336 <td class="cb-lineno cb-context"></td>
336 <td class="cb-lineno cb-context"></td>
337 <td class="cb-content cb-context"></td>
337 <td class="cb-content cb-context"></td>
338
338
339 <td class="cb-data cb-context"></td>
339 <td class="cb-data cb-context"></td>
340 <td class="cb-lineno cb-context"></td>
340 <td class="cb-lineno cb-context"></td>
341 <td class="cb-content cb-context">
341 <td class="cb-content cb-context">
342 ${inline_comments_container(comments_dict['comments'], inline_comments)}
342 ${inline_comments_container(comments_dict['comments'], inline_comments)}
343 </td>
343 </td>
344 </tr>
344 </tr>
345 %endif
345 %endif
346 </table>
346 </table>
347 </div>
347 </div>
348 </div>
348 </div>
349 % endfor
349 % endfor
350
350
351 </div>
351 </div>
352 </div>
352 </div>
353 </%def>
353 </%def>
354
354
355 <%def name="diff_ops(filediff)">
355 <%def name="diff_ops(filediff)">
356 <%
356 <%
357 from rhodecode.lib.diffs import NEW_FILENODE, DEL_FILENODE, \
357 from rhodecode.lib.diffs import NEW_FILENODE, DEL_FILENODE, \
358 MOD_FILENODE, RENAMED_FILENODE, CHMOD_FILENODE, BIN_FILENODE, COPIED_FILENODE
358 MOD_FILENODE, RENAMED_FILENODE, CHMOD_FILENODE, BIN_FILENODE, COPIED_FILENODE
359 %>
359 %>
360 <span class="pill">
360 <span class="pill">
361 %if filediff.source_file_path and filediff.target_file_path:
361 %if filediff.source_file_path and filediff.target_file_path:
362 %if filediff.source_file_path != filediff.target_file_path:
362 %if filediff.source_file_path != filediff.target_file_path:
363 ## file was renamed, or copied
363 ## file was renamed, or copied
364 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
364 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
365 <strong>${filediff.target_file_path}</strong> β¬… <del>${filediff.source_file_path}</del>
365 <strong>${filediff.target_file_path}</strong> β¬… <del>${filediff.source_file_path}</del>
366 <% final_path = filediff.target_file_path %>
366 <% final_path = filediff.target_file_path %>
367 %elif COPIED_FILENODE in filediff.patch['stats']['ops']:
367 %elif COPIED_FILENODE in filediff.patch['stats']['ops']:
368 <strong>${filediff.target_file_path}</strong> β¬… ${filediff.source_file_path}
368 <strong>${filediff.target_file_path}</strong> β¬… ${filediff.source_file_path}
369 <% final_path = filediff.target_file_path %>
369 <% final_path = filediff.target_file_path %>
370 %endif
370 %endif
371 %else:
371 %else:
372 ## file was modified
372 ## file was modified
373 <strong>${filediff.source_file_path}</strong>
373 <strong>${filediff.source_file_path}</strong>
374 <% final_path = filediff.source_file_path %>
374 <% final_path = filediff.source_file_path %>
375 %endif
375 %endif
376 %else:
376 %else:
377 %if filediff.source_file_path:
377 %if filediff.source_file_path:
378 ## file was deleted
378 ## file was deleted
379 <strong>${filediff.source_file_path}</strong>
379 <strong>${filediff.source_file_path}</strong>
380 <% final_path = filediff.source_file_path %>
380 <% final_path = filediff.source_file_path %>
381 %else:
381 %else:
382 ## file was added
382 ## file was added
383 <strong>${filediff.target_file_path}</strong>
383 <strong>${filediff.target_file_path}</strong>
384 <% final_path = filediff.target_file_path %>
384 <% final_path = filediff.target_file_path %>
385 %endif
385 %endif
386 %endif
386 %endif
387 <i style="color: #aaa" class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${final_path}" title="${_('Copy the full path')}" onclick="return false;"></i>
387 <i style="color: #aaa" class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${final_path}" title="${_('Copy the full path')}" onclick="return false;"></i>
388 </span>
388 </span>
389 ## anchor link
389 ## anchor link
390 <a class="pill filediff-anchor" href="#a_${h.FID(filediff.raw_id, filediff.patch['filename'])}">ΒΆ</a>
390 <a class="pill filediff-anchor" href="#a_${h.FID(filediff.raw_id, filediff.patch['filename'])}">ΒΆ</a>
391
391
392 <span class="pill-group" style="float: right">
392 <span class="pill-group" style="float: right">
393
393
394 ## ops pills
394 ## ops pills
395 %if filediff.limited_diff:
395 %if filediff.limited_diff:
396 <span class="pill tooltip" op="limited" title="The stats for this diff are not complete">limited diff</span>
396 <span class="pill tooltip" op="limited" title="The stats for this diff are not complete">limited diff</span>
397 %endif
397 %endif
398
398
399 %if NEW_FILENODE in filediff.patch['stats']['ops']:
399 %if NEW_FILENODE in filediff.patch['stats']['ops']:
400 <span class="pill" op="created">created</span>
400 <span class="pill" op="created">created</span>
401 %if filediff['target_mode'].startswith('120'):
401 %if filediff['target_mode'].startswith('120'):
402 <span class="pill" op="symlink">symlink</span>
402 <span class="pill" op="symlink">symlink</span>
403 %else:
403 %else:
404 <span class="pill" op="mode">${nice_mode(filediff['target_mode'])}</span>
404 <span class="pill" op="mode">${nice_mode(filediff['target_mode'])}</span>
405 %endif
405 %endif
406 %endif
406 %endif
407
407
408 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
408 %if RENAMED_FILENODE in filediff.patch['stats']['ops']:
409 <span class="pill" op="renamed">renamed</span>
409 <span class="pill" op="renamed">renamed</span>
410 %endif
410 %endif
411
411
412 %if COPIED_FILENODE in filediff.patch['stats']['ops']:
412 %if COPIED_FILENODE in filediff.patch['stats']['ops']:
413 <span class="pill" op="copied">copied</span>
413 <span class="pill" op="copied">copied</span>
414 %endif
414 %endif
415
415
416 %if DEL_FILENODE in filediff.patch['stats']['ops']:
416 %if DEL_FILENODE in filediff.patch['stats']['ops']:
417 <span class="pill" op="removed">removed</span>
417 <span class="pill" op="removed">removed</span>
418 %endif
418 %endif
419
419
420 %if CHMOD_FILENODE in filediff.patch['stats']['ops']:
420 %if CHMOD_FILENODE in filediff.patch['stats']['ops']:
421 <span class="pill" op="mode">
421 <span class="pill" op="mode">
422 ${nice_mode(filediff['source_mode'])} ➑ ${nice_mode(filediff['target_mode'])}
422 ${nice_mode(filediff['source_mode'])} ➑ ${nice_mode(filediff['target_mode'])}
423 </span>
423 </span>
424 %endif
424 %endif
425
425
426 %if BIN_FILENODE in filediff.patch['stats']['ops']:
426 %if BIN_FILENODE in filediff.patch['stats']['ops']:
427 <span class="pill" op="binary">binary</span>
427 <span class="pill" op="binary">binary</span>
428 %if MOD_FILENODE in filediff.patch['stats']['ops']:
428 %if MOD_FILENODE in filediff.patch['stats']['ops']:
429 <span class="pill" op="modified">modified</span>
429 <span class="pill" op="modified">modified</span>
430 %endif
430 %endif
431 %endif
431 %endif
432
432
433 <span class="pill" op="added">${('+' if filediff.patch['stats']['added'] else '')}${filediff.patch['stats']['added']}</span>
433 <span class="pill" op="added">${('+' if filediff.patch['stats']['added'] else '')}${filediff.patch['stats']['added']}</span>
434 <span class="pill" op="deleted">${((h.safe_int(filediff.patch['stats']['deleted']) or 0) * -1)}</span>
434 <span class="pill" op="deleted">${((h.safe_int(filediff.patch['stats']['deleted']) or 0) * -1)}</span>
435
435
436 </span>
436 </span>
437
437
438 </%def>
438 </%def>
439
439
440 <%def name="nice_mode(filemode)">
440 <%def name="nice_mode(filemode)">
441 ${(filemode.startswith('100') and filemode[3:] or filemode)}
441 ${(filemode.startswith('100') and filemode[3:] or filemode)}
442 </%def>
442 </%def>
443
443
444 <%def name="diff_menu(filediff, use_comments=False)">
444 <%def name="diff_menu(filediff, use_comments=False)">
445 <div class="filediff-menu">
445 <div class="filediff-menu">
446 %if filediff.diffset.source_ref:
446 %if filediff.diffset.source_ref:
447 %if filediff.operation in ['D', 'M']:
447 %if filediff.operation in ['D', 'M']:
448 <a
448 <a
449 class="tooltip"
449 class="tooltip"
450 href="${h.route_path('repo_files',repo_name=filediff.diffset.repo_name,commit_id=filediff.diffset.source_ref,f_path=filediff.source_file_path)}"
450 href="${h.route_path('repo_files',repo_name=filediff.diffset.repo_name,commit_id=filediff.diffset.source_ref,f_path=filediff.source_file_path)}"
451 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
451 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
452 >
452 >
453 ${_('Show file before')}
453 ${_('Show file before')}
454 </a> |
454 </a> |
455 %else:
455 %else:
456 <span
456 <span
457 class="tooltip"
457 class="tooltip"
458 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
458 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.source_ref[:12]})}"
459 >
459 >
460 ${_('Show file before')}
460 ${_('Show file before')}
461 </span> |
461 </span> |
462 %endif
462 %endif
463 %if filediff.operation in ['A', 'M']:
463 %if filediff.operation in ['A', 'M']:
464 <a
464 <a
465 class="tooltip"
465 class="tooltip"
466 href="${h.route_path('repo_files',repo_name=filediff.diffset.source_repo_name,commit_id=filediff.diffset.target_ref,f_path=filediff.target_file_path)}"
466 href="${h.route_path('repo_files',repo_name=filediff.diffset.source_repo_name,commit_id=filediff.diffset.target_ref,f_path=filediff.target_file_path)}"
467 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
467 title="${h.tooltip(_('Show file at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
468 >
468 >
469 ${_('Show file after')}
469 ${_('Show file after')}
470 </a> |
470 </a> |
471 %else:
471 %else:
472 <span
472 <span
473 class="tooltip"
473 class="tooltip"
474 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
474 title="${h.tooltip(_('File no longer present at commit: %(commit_id)s') % {'commit_id': filediff.diffset.target_ref[:12]})}"
475 >
475 >
476 ${_('Show file after')}
476 ${_('Show file after')}
477 </span> |
477 </span> |
478 %endif
478 %endif
479 <a
479 <a
480 class="tooltip"
480 class="tooltip"
481 title="${h.tooltip(_('Raw diff'))}"
481 title="${h.tooltip(_('Raw diff'))}"
482 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='raw'))}"
482 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='raw'))}"
483 >
483 >
484 ${_('Raw diff')}
484 ${_('Raw diff')}
485 </a> |
485 </a> |
486 <a
486 <a
487 class="tooltip"
487 class="tooltip"
488 title="${h.tooltip(_('Download diff'))}"
488 title="${h.tooltip(_('Download diff'))}"
489 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='download'))}"
489 href="${h.route_path('repo_files_diff',repo_name=filediff.diffset.repo_name,f_path=filediff.target_file_path, _query=dict(diff2=filediff.diffset.target_ref,diff1=filediff.diffset.source_ref,diff='download'))}"
490 >
490 >
491 ${_('Download diff')}
491 ${_('Download diff')}
492 </a>
492 </a>
493 % if use_comments:
493 % if use_comments:
494 |
494 |
495 % endif
495 % endif
496
496
497 ## TODO: dan: refactor ignorews_url and context_url into the diff renderer same as diffmode=unified/sideside. Also use ajax to load more context (by clicking hunks)
497 ## TODO: dan: refactor ignorews_url and context_url into the diff renderer same as diffmode=unified/sideside. Also use ajax to load more context (by clicking hunks)
498 %if hasattr(c, 'ignorews_url'):
498 %if hasattr(c, 'ignorews_url'):
499 ${c.ignorews_url(request, h.FID(filediff.raw_id, filediff.patch['filename']))}
499 ${c.ignorews_url(request, h.FID(filediff.raw_id, filediff.patch['filename']))}
500 %endif
500 %endif
501 %if hasattr(c, 'context_url'):
501 %if hasattr(c, 'context_url'):
502 ${c.context_url(request, h.FID(filediff.raw_id, filediff.patch['filename']))}
502 ${c.context_url(request, h.FID(filediff.raw_id, filediff.patch['filename']))}
503 %endif
503 %endif
504
504
505 %if use_comments:
505 %if use_comments:
506 <a href="#" onclick="return Rhodecode.comments.toggleComments(this);">
506 <a href="#" onclick="return Rhodecode.comments.toggleComments(this);">
507 <span class="show-comment-button">${_('Show comments')}</span><span class="hide-comment-button">${_('Hide comments')}</span>
507 <span class="show-comment-button">${_('Show comments')}</span><span class="hide-comment-button">${_('Hide comments')}</span>
508 </a>
508 </a>
509 %endif
509 %endif
510 %endif
510 %endif
511 </div>
511 </div>
512 </%def>
512 </%def>
513
513
514
514
515 <%def name="inline_comments_container(comments, inline_comments)">
515 <%def name="inline_comments_container(comments, inline_comments)">
516 <div class="inline-comments">
516 <div class="inline-comments">
517 %for comment in comments:
517 %for comment in comments:
518 ${commentblock.comment_block(comment, inline=True)}
518 ${commentblock.comment_block(comment, inline=True)}
519 %endfor
519 %endfor
520 % if comments and comments[-1].outdated:
520 % if comments and comments[-1].outdated:
521 <span class="btn btn-secondary cb-comment-add-button comment-outdated}"
521 <span class="btn btn-secondary cb-comment-add-button comment-outdated}"
522 style="display: none;}">
522 style="display: none;}">
523 ${_('Add another comment')}
523 ${_('Add another comment')}
524 </span>
524 </span>
525 % else:
525 % else:
526 <span onclick="return Rhodecode.comments.createComment(this)"
526 <span onclick="return Rhodecode.comments.createComment(this)"
527 class="btn btn-secondary cb-comment-add-button">
527 class="btn btn-secondary cb-comment-add-button">
528 ${_('Add another comment')}
528 ${_('Add another comment')}
529 </span>
529 </span>
530 % endif
530 % endif
531
531
532 </div>
532 </div>
533 </%def>
533 </%def>
534
534
535 <%!
535 <%!
536 def get_comments_for(diff_type, comments, filename, line_version, line_number):
536 def get_comments_for(diff_type, comments, filename, line_version, line_number):
537 if hasattr(filename, 'unicode_path'):
537 if hasattr(filename, 'unicode_path'):
538 filename = filename.unicode_path
538 filename = filename.unicode_path
539
539
540 if not isinstance(filename, basestring):
540 if not isinstance(filename, basestring):
541 return None
541 return None
542
542
543 line_key = '{}{}'.format(line_version, line_number) ## e.g o37, n12
543 line_key = '{}{}'.format(line_version, line_number) ## e.g o37, n12
544
544
545 if comments and filename in comments:
545 if comments and filename in comments:
546 file_comments = comments[filename]
546 file_comments = comments[filename]
547 if line_key in file_comments:
547 if line_key in file_comments:
548 data = file_comments.pop(line_key)
548 data = file_comments.pop(line_key)
549 return data
549 return data
550 %>
550 %>
551
551
552 <%def name="render_hunk_lines_sideside(hunk, use_comments=False, inline_comments=None)">
552 <%def name="render_hunk_lines_sideside(hunk, use_comments=False, inline_comments=None)">
553
553
554 %for i, line in enumerate(hunk.sideside):
554 %for i, line in enumerate(hunk.sideside):
555 <%
555 <%
556 old_line_anchor, new_line_anchor = None, None
556 old_line_anchor, new_line_anchor = None, None
557 if line.original.lineno:
557 if line.original.lineno:
558 old_line_anchor = diff_line_anchor(hunk.source_file_path, line.original.lineno, 'o')
558 old_line_anchor = diff_line_anchor(hunk.source_file_path, line.original.lineno, 'o')
559 if line.modified.lineno:
559 if line.modified.lineno:
560 new_line_anchor = diff_line_anchor(hunk.target_file_path, line.modified.lineno, 'n')
560 new_line_anchor = diff_line_anchor(hunk.target_file_path, line.modified.lineno, 'n')
561 %>
561 %>
562
562
563 <tr class="cb-line">
563 <tr class="cb-line">
564 <td class="cb-data ${action_class(line.original.action)}"
564 <td class="cb-data ${action_class(line.original.action)}"
565 data-line-no="${line.original.lineno}"
565 data-line-no="${line.original.lineno}"
566 >
566 >
567 <div>
567 <div>
568
568
569 <% line_old_comments = None %>
569 <% line_old_comments = None %>
570 %if line.original.get_comment_args:
570 %if line.original.get_comment_args:
571 <% line_old_comments = get_comments_for('side-by-side', inline_comments, *line.original.get_comment_args) %>
571 <% line_old_comments = get_comments_for('side-by-side', inline_comments, *line.original.get_comment_args) %>
572 %endif
572 %endif
573 %if line_old_comments:
573 %if line_old_comments:
574 <% has_outdated = any([x.outdated for x in line_old_comments]) %>
574 <% has_outdated = any([x.outdated for x in line_old_comments]) %>
575 % if has_outdated:
575 % if has_outdated:
576 <i title="${_('comments including outdated')}:${len(line_old_comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
576 <i title="${_('comments including outdated')}:${len(line_old_comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
577 % else:
577 % else:
578 <i title="${_('comments')}: ${len(line_old_comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
578 <i title="${_('comments')}: ${len(line_old_comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
579 % endif
579 % endif
580 %endif
580 %endif
581 </div>
581 </div>
582 </td>
582 </td>
583 <td class="cb-lineno ${action_class(line.original.action)}"
583 <td class="cb-lineno ${action_class(line.original.action)}"
584 data-line-no="${line.original.lineno}"
584 data-line-no="${line.original.lineno}"
585 %if old_line_anchor:
585 %if old_line_anchor:
586 id="${old_line_anchor}"
586 id="${old_line_anchor}"
587 %endif
587 %endif
588 >
588 >
589 %if line.original.lineno:
589 %if line.original.lineno:
590 <a name="${old_line_anchor}" href="#${old_line_anchor}">${line.original.lineno}</a>
590 <a name="${old_line_anchor}" href="#${old_line_anchor}">${line.original.lineno}</a>
591 %endif
591 %endif
592 </td>
592 </td>
593 <td class="cb-content ${action_class(line.original.action)}"
593 <td class="cb-content ${action_class(line.original.action)}"
594 data-line-no="o${line.original.lineno}"
594 data-line-no="o${line.original.lineno}"
595 >
595 >
596 %if use_comments and line.original.lineno:
596 %if use_comments and line.original.lineno:
597 ${render_add_comment_button()}
597 ${render_add_comment_button()}
598 %endif
598 %endif
599 <span class="cb-code">${line.original.action} ${line.original.content or '' | n}</span>
599 <span class="cb-code">${line.original.action} ${line.original.content or '' | n}</span>
600
600
601 %if use_comments and line.original.lineno and line_old_comments:
601 %if use_comments and line.original.lineno and line_old_comments:
602 ${inline_comments_container(line_old_comments, inline_comments)}
602 ${inline_comments_container(line_old_comments, inline_comments)}
603 %endif
603 %endif
604
604
605 </td>
605 </td>
606 <td class="cb-data ${action_class(line.modified.action)}"
606 <td class="cb-data ${action_class(line.modified.action)}"
607 data-line-no="${line.modified.lineno}"
607 data-line-no="${line.modified.lineno}"
608 >
608 >
609 <div>
609 <div>
610
610
611 %if line.modified.get_comment_args:
611 %if line.modified.get_comment_args:
612 <% line_new_comments = get_comments_for('side-by-side', inline_comments, *line.modified.get_comment_args) %>
612 <% line_new_comments = get_comments_for('side-by-side', inline_comments, *line.modified.get_comment_args) %>
613 %else:
613 %else:
614 <% line_new_comments = None%>
614 <% line_new_comments = None%>
615 %endif
615 %endif
616 %if line_new_comments:
616 %if line_new_comments:
617 <% has_outdated = any([x.outdated for x in line_new_comments]) %>
617 <% has_outdated = any([x.outdated for x in line_new_comments]) %>
618 % if has_outdated:
618 % if has_outdated:
619 <i title="${_('comments including outdated')}:${len(line_new_comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
619 <i title="${_('comments including outdated')}:${len(line_new_comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
620 % else:
620 % else:
621 <i title="${_('comments')}: ${len(line_new_comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
621 <i title="${_('comments')}: ${len(line_new_comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
622 % endif
622 % endif
623 %endif
623 %endif
624 </div>
624 </div>
625 </td>
625 </td>
626 <td class="cb-lineno ${action_class(line.modified.action)}"
626 <td class="cb-lineno ${action_class(line.modified.action)}"
627 data-line-no="${line.modified.lineno}"
627 data-line-no="${line.modified.lineno}"
628 %if new_line_anchor:
628 %if new_line_anchor:
629 id="${new_line_anchor}"
629 id="${new_line_anchor}"
630 %endif
630 %endif
631 >
631 >
632 %if line.modified.lineno:
632 %if line.modified.lineno:
633 <a name="${new_line_anchor}" href="#${new_line_anchor}">${line.modified.lineno}</a>
633 <a name="${new_line_anchor}" href="#${new_line_anchor}">${line.modified.lineno}</a>
634 %endif
634 %endif
635 </td>
635 </td>
636 <td class="cb-content ${action_class(line.modified.action)}"
636 <td class="cb-content ${action_class(line.modified.action)}"
637 data-line-no="n${line.modified.lineno}"
637 data-line-no="n${line.modified.lineno}"
638 >
638 >
639 %if use_comments and line.modified.lineno:
639 %if use_comments and line.modified.lineno:
640 ${render_add_comment_button()}
640 ${render_add_comment_button()}
641 %endif
641 %endif
642 <span class="cb-code">${line.modified.action} ${line.modified.content or '' | n}</span>
642 <span class="cb-code">${line.modified.action} ${line.modified.content or '' | n}</span>
643 %if use_comments and line.modified.lineno and line_new_comments:
643 %if use_comments and line.modified.lineno and line_new_comments:
644 ${inline_comments_container(line_new_comments, inline_comments)}
644 ${inline_comments_container(line_new_comments, inline_comments)}
645 %endif
645 %endif
646 </td>
646 </td>
647 </tr>
647 </tr>
648 %endfor
648 %endfor
649 </%def>
649 </%def>
650
650
651
651
652 <%def name="render_hunk_lines_unified(hunk, use_comments=False, inline_comments=None)">
652 <%def name="render_hunk_lines_unified(hunk, use_comments=False, inline_comments=None)">
653 %for old_line_no, new_line_no, action, content, comments_args in hunk.unified:
653 %for old_line_no, new_line_no, action, content, comments_args in hunk.unified:
654 <%
654 <%
655 old_line_anchor, new_line_anchor = None, None
655 old_line_anchor, new_line_anchor = None, None
656 if old_line_no:
656 if old_line_no:
657 old_line_anchor = diff_line_anchor(hunk.source_file_path, old_line_no, 'o')
657 old_line_anchor = diff_line_anchor(hunk.source_file_path, old_line_no, 'o')
658 if new_line_no:
658 if new_line_no:
659 new_line_anchor = diff_line_anchor(hunk.target_file_path, new_line_no, 'n')
659 new_line_anchor = diff_line_anchor(hunk.target_file_path, new_line_no, 'n')
660 %>
660 %>
661 <tr class="cb-line">
661 <tr class="cb-line">
662 <td class="cb-data ${action_class(action)}">
662 <td class="cb-data ${action_class(action)}">
663 <div>
663 <div>
664
664
665 %if comments_args:
665 %if comments_args:
666 <% comments = get_comments_for('unified', inline_comments, *comments_args) %>
666 <% comments = get_comments_for('unified', inline_comments, *comments_args) %>
667 %else:
667 %else:
668 <% comments = None %>
668 <% comments = None %>
669 %endif
669 %endif
670
670
671 % if comments:
671 % if comments:
672 <% has_outdated = any([x.outdated for x in comments]) %>
672 <% has_outdated = any([x.outdated for x in comments]) %>
673 % if has_outdated:
673 % if has_outdated:
674 <i title="${_('comments including outdated')}:${len(comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
674 <i title="${_('comments including outdated')}:${len(comments)}" class="icon-comment_toggle" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
675 % else:
675 % else:
676 <i title="${_('comments')}: ${len(comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
676 <i title="${_('comments')}: ${len(comments)}" class="icon-comment" onclick="return Rhodecode.comments.toggleLineComments(this)"></i>
677 % endif
677 % endif
678 % endif
678 % endif
679 </div>
679 </div>
680 </td>
680 </td>
681 <td class="cb-lineno ${action_class(action)}"
681 <td class="cb-lineno ${action_class(action)}"
682 data-line-no="${old_line_no}"
682 data-line-no="${old_line_no}"
683 %if old_line_anchor:
683 %if old_line_anchor:
684 id="${old_line_anchor}"
684 id="${old_line_anchor}"
685 %endif
685 %endif
686 >
686 >
687 %if old_line_anchor:
687 %if old_line_anchor:
688 <a name="${old_line_anchor}" href="#${old_line_anchor}">${old_line_no}</a>
688 <a name="${old_line_anchor}" href="#${old_line_anchor}">${old_line_no}</a>
689 %endif
689 %endif
690 </td>
690 </td>
691 <td class="cb-lineno ${action_class(action)}"
691 <td class="cb-lineno ${action_class(action)}"
692 data-line-no="${new_line_no}"
692 data-line-no="${new_line_no}"
693 %if new_line_anchor:
693 %if new_line_anchor:
694 id="${new_line_anchor}"
694 id="${new_line_anchor}"
695 %endif
695 %endif
696 >
696 >
697 %if new_line_anchor:
697 %if new_line_anchor:
698 <a name="${new_line_anchor}" href="#${new_line_anchor}">${new_line_no}</a>
698 <a name="${new_line_anchor}" href="#${new_line_anchor}">${new_line_no}</a>
699 %endif
699 %endif
700 </td>
700 </td>
701 <td class="cb-content ${action_class(action)}"
701 <td class="cb-content ${action_class(action)}"
702 data-line-no="${(new_line_no and 'n' or 'o')}${(new_line_no or old_line_no)}"
702 data-line-no="${(new_line_no and 'n' or 'o')}${(new_line_no or old_line_no)}"
703 >
703 >
704 %if use_comments:
704 %if use_comments:
705 ${render_add_comment_button()}
705 ${render_add_comment_button()}
706 %endif
706 %endif
707 <span class="cb-code">${action} ${content or '' | n}</span>
707 <span class="cb-code">${action} ${content or '' | n}</span>
708 %if use_comments and comments:
708 %if use_comments and comments:
709 ${inline_comments_container(comments, inline_comments)}
709 ${inline_comments_container(comments, inline_comments)}
710 %endif
710 %endif
711 </td>
711 </td>
712 </tr>
712 </tr>
713 %endfor
713 %endfor
714 </%def>
714 </%def>
715
715
716
716
717 <%def name="render_hunk_lines(diff_mode, hunk, use_comments, inline_comments)">
717 <%def name="render_hunk_lines(diff_mode, hunk, use_comments, inline_comments)">
718 % if diff_mode == 'unified':
718 % if diff_mode == 'unified':
719 ${render_hunk_lines_unified(hunk, use_comments=use_comments, inline_comments=inline_comments)}
719 ${render_hunk_lines_unified(hunk, use_comments=use_comments, inline_comments=inline_comments)}
720 % elif diff_mode == 'sideside':
720 % elif diff_mode == 'sideside':
721 ${render_hunk_lines_sideside(hunk, use_comments=use_comments, inline_comments=inline_comments)}
721 ${render_hunk_lines_sideside(hunk, use_comments=use_comments, inline_comments=inline_comments)}
722 % else:
722 % else:
723 <tr class="cb-line">
723 <tr class="cb-line">
724 <td>unknown diff mode</td>
724 <td>unknown diff mode</td>
725 </tr>
725 </tr>
726 % endif
726 % endif
727 </%def>file changes
727 </%def>file changes
728
728
729
729
730 <%def name="render_add_comment_button()">
730 <%def name="render_add_comment_button()">
731 <button class="btn btn-small btn-primary cb-comment-box-opener" onclick="return Rhodecode.comments.createComment(this)">
731 <button class="btn btn-small btn-primary cb-comment-box-opener" onclick="return Rhodecode.comments.createComment(this)">
732 <span><i class="icon-comment"></i></span>
732 <span><i class="icon-comment"></i></span>
733 </button>
733 </button>
734 </%def>
734 </%def>
735
735
736 <%def name="render_diffset_menu(diffset=None, range_diff_on=None)">
736 <%def name="render_diffset_menu(diffset=None, range_diff_on=None)">
737
737
738 <div id="diff-file-sticky" class="diffset-menu clearinner">
738 <div id="diff-file-sticky" class="diffset-menu clearinner">
739 ## auto adjustable
739 ## auto adjustable
740 <div class="sidebar__inner" style="z-index: 30;background-color: #fff; padding: 5px 0px;">
740 <div class="sidebar__inner">
741 <div class="sidebar__bar">
741 <div class="pull-right">
742 <div class="pull-right">
742 <div class="btn-group">
743 <div class="btn-group">
743
744
744 <a
745 <a
745 class="btn ${(c.user_session_attrs["diffmode"] == 'sideside' and 'btn-primary')} tooltip"
746 class="btn ${(c.user_session_attrs["diffmode"] == 'sideside' and 'btn-primary')} tooltip"
746 title="${h.tooltip(_('View side by side'))}"
747 title="${h.tooltip(_('View side by side'))}"
747 href="${h.current_route_path(request, diffmode='sideside')}">
748 href="${h.current_route_path(request, diffmode='sideside')}">
748 <span>${_('Side by Side')}</span>
749 <span>${_('Side by Side')}</span>
749 </a>
750 </a>
750 <a
751 <a
751 class="btn ${(c.user_session_attrs["diffmode"] == 'unified' and 'btn-primary')} tooltip"
752 class="btn ${(c.user_session_attrs["diffmode"] == 'unified' and 'btn-primary')} tooltip"
752 title="${h.tooltip(_('View unified'))}" href="${h.current_route_path(request, diffmode='unified')}">
753 title="${h.tooltip(_('View unified'))}" href="${h.current_route_path(request, diffmode='unified')}">
753 <span>${_('Unified')}</span>
754 <span>${_('Unified')}</span>
754 </a>
755 </a>
755 % if range_diff_on is True:
756 % if range_diff_on is True:
756 <a
757 <a
757 title="${_('Turn off: Show the diff as commit range')}"
758 title="${_('Turn off: Show the diff as commit range')}"
758 class="btn btn-primary"
759 class="btn btn-primary"
759 href="${h.current_route_path(request, **{"range-diff":"0"})}">
760 href="${h.current_route_path(request, **{"range-diff":"0"})}">
760 <span>${_('Range Diff')}</span>
761 <span>${_('Range Diff')}</span>
761 </a>
762 </a>
762 % elif range_diff_on is False:
763 % elif range_diff_on is False:
763 <a
764 <a
764 title="${_('Show the diff as commit range')}"
765 title="${_('Show the diff as commit range')}"
765 class="btn"
766 class="btn"
766 href="${h.current_route_path(request, **{"range-diff":"1"})}">
767 href="${h.current_route_path(request, **{"range-diff":"1"})}">
767 <span>${_('Range Diff')}</span>
768 <span>${_('Range Diff')}</span>
768 </a>
769 </a>
769 % endif
770 % endif
770 </div>
771 </div>
771 </div>
772 </div>
772 <div class="pull-left">
773 <div class="pull-left">
773 <div class="btn-group">
774 <div class="btn-group">
774 <div class="pull-left">
775 <div class="pull-left">
775 ${h.hidden('file_filter')}
776 ${h.hidden('file_filter')}
776 </div>
777 </div>
777 <a
778 <a
778 class="btn"
779 class="btn"
779 href="#"
780 href="#"
780 onclick="$('input[class=filediff-collapse-state]').prop('checked', false); Waypoint.refreshAll(); return false">${_('Expand All Files')}</a>
781 onclick="$('input[class=filediff-collapse-state]').prop('checked', false); Waypoint.refreshAll(); return false">${_('Expand All Files')}</a>
781 <a
782 <a
782 class="btn"
783 class="btn"
783 href="#"
784 href="#"
784 onclick="$('input[class=filediff-collapse-state]').prop('checked', true); Waypoint.refreshAll(); return false">${_('Collapse All Files')}</a>
785 onclick="$('input[class=filediff-collapse-state]').prop('checked', true); Waypoint.refreshAll(); return false">${_('Collapse All Files')}</a>
785 <a
786 <a
786 class="btn"
787 class="btn"
787 href="#"
788 href="#"
788 onclick="updateSticky();return Rhodecode.comments.toggleWideMode(this)">${_('Wide Mode Diff')}</a>
789 onclick="updateSticky();return Rhodecode.comments.toggleWideMode(this)">${_('Wide Mode Diff')}</a>
789
790
790 </div>
791 </div>
791 </div>
792 </div>
793 </div>
792 <div class="fpath-placeholder">
794 <div class="fpath-placeholder">
793 <i class="icon-file-text"></i>
795 <i class="icon-file-text"></i>
794 <strong class="fpath-placeholder-text">
796 <strong class="fpath-placeholder-text">
795
797 Context file:
796 </strong>
798 </strong>
797 </div>
799 </div>
798 <div class="sidebar_inner_shadow"></div>
800 <div class="sidebar_inner_shadow"></div>
799 </div>
801 </div>
800 </div>
802 </div>
801
803
802 % if diffset:
804 % if diffset:
803
805
804 %if diffset.limited_diff:
806 %if diffset.limited_diff:
805 <% file_placeholder = _ungettext('%(num)s file changed', '%(num)s files changed', diffset.changed_files) % {'num': diffset.changed_files} %>
807 <% file_placeholder = _ungettext('%(num)s file changed', '%(num)s files changed', diffset.changed_files) % {'num': diffset.changed_files} %>
806 %else:
808 %else:
807 <% file_placeholder = _ungettext('%(num)s file changed: %(linesadd)s inserted, ''%(linesdel)s deleted', '%(num)s files changed: %(linesadd)s inserted, %(linesdel)s deleted', diffset.changed_files) % {'num': diffset.changed_files, 'linesadd': diffset.lines_added, 'linesdel': diffset.lines_deleted}%>
809 <% file_placeholder = _ungettext('%(num)s file changed: %(linesadd)s inserted, ''%(linesdel)s deleted', '%(num)s files changed: %(linesadd)s inserted, %(linesdel)s deleted', diffset.changed_files) % {'num': diffset.changed_files, 'linesadd': diffset.lines_added, 'linesdel': diffset.lines_deleted}%>
808 %endif
810 %endif
809 ## case on range-diff placeholder needs to be updated
811 ## case on range-diff placeholder needs to be updated
810 % if range_diff_on is True:
812 % if range_diff_on is True:
811 <% file_placeholder = _('Disabled on range diff') %>
813 <% file_placeholder = _('Disabled on range diff') %>
812 % endif
814 % endif
813
815
814 <script>
816 <script>
815
817
816 var feedFilesOptions = function (query, initialData) {
818 var feedFilesOptions = function (query, initialData) {
817 var data = {results: []};
819 var data = {results: []};
818 var isQuery = typeof query.term !== 'undefined';
820 var isQuery = typeof query.term !== 'undefined';
819
821
820 var section = _gettext('Changed files');
822 var section = _gettext('Changed files');
821 var filteredData = [];
823 var filteredData = [];
822
824
823 //filter results
825 //filter results
824 $.each(initialData.results, function (idx, value) {
826 $.each(initialData.results, function (idx, value) {
825
827
826 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
828 if (!isQuery || query.term.length === 0 || value.text.toUpperCase().indexOf(query.term.toUpperCase()) >= 0) {
827 filteredData.push({
829 filteredData.push({
828 'id': this.id,
830 'id': this.id,
829 'text': this.text,
831 'text': this.text,
830 "ops": this.ops,
832 "ops": this.ops,
831 })
833 })
832 }
834 }
833
835
834 });
836 });
835
837
836 data.results = filteredData;
838 data.results = filteredData;
837
839
838 query.callback(data);
840 query.callback(data);
839 };
841 };
840
842
841 var formatFileResult = function(result, container, query, escapeMarkup) {
843 var formatFileResult = function(result, container, query, escapeMarkup) {
842 return function(data, escapeMarkup) {
844 return function(data, escapeMarkup) {
843 var container = '<div class="filelist" style="padding-right:100px">{0}</div>';
845 var container = '<div class="filelist" style="padding-right:100px">{0}</div>';
844 var tmpl = '<span style="margin-right:-50px"><strong>{0}</strong></span>'.format(escapeMarkup(data['text']));
846 var tmpl = '<span style="margin-right:-50px"><strong>{0}</strong></span>'.format(escapeMarkup(data['text']));
845 var pill = '<span class="pill-group" style="float: right;margin-right: -100px">' +
847 var pill = '<span class="pill-group" style="float: right;margin-right: -100px">' +
846 '<span class="pill" op="added">{0}</span>' +
848 '<span class="pill" op="added">{0}</span>' +
847 '<span class="pill" op="deleted">{1}</span>' +
849 '<span class="pill" op="deleted">{1}</span>' +
848 '</span>'
850 '</span>'
849 ;
851 ;
850 var added = data['ops']['added'];
852 var added = data['ops']['added'];
851 if (added === 0) {
853 if (added === 0) {
852 // don't show +0
854 // don't show +0
853 added = 0;
855 added = 0;
854 } else {
856 } else {
855 added = '+' + added;
857 added = '+' + added;
856 }
858 }
857
859
858 var deleted = -1*data['ops']['deleted'];
860 var deleted = -1*data['ops']['deleted'];
859
861
860 tmpl += pill.format(added, deleted);
862 tmpl += pill.format(added, deleted);
861 return container.format(tmpl);
863 return container.format(tmpl);
862
864
863 }(result, escapeMarkup);
865 }(result, escapeMarkup);
864 };
866 };
865 var preloadData = {
867 var preloadData = {
866 results: [
868 results: [
867 % for filediff in diffset.files:
869 % for filediff in diffset.files:
868 {id:"a_${h.FID(filediff.raw_id, filediff.patch['filename'])}",
870 {id:"a_${h.FID(filediff.raw_id, filediff.patch['filename'])}",
869 text:"${filediff.patch['filename']}",
871 text:"${filediff.patch['filename']}",
870 ops:${h.json.dumps(filediff.patch['stats'])|n}}${('' if loop.last else ',')}
872 ops:${h.json.dumps(filediff.patch['stats'])|n}}${('' if loop.last else ',')}
871 % endfor
873 % endfor
872 ]
874 ]
873 };
875 };
874
876
875 $(document).ready(function () {
877 $(document).ready(function () {
876
878
877 var fileFilter = $("#file_filter").select2({
879 var fileFilter = $("#file_filter").select2({
878 'dropdownAutoWidth': true,
880 'dropdownAutoWidth': true,
879 'width': 'auto',
881 'width': 'auto',
880 'placeholder': "${file_placeholder}",
882 'placeholder': "${file_placeholder}",
881 containerCssClass: "drop-menu",
883 containerCssClass: "drop-menu",
882 dropdownCssClass: "drop-menu-dropdown",
884 dropdownCssClass: "drop-menu-dropdown",
883 data: preloadData,
885 data: preloadData,
884 query: function(query) {
886 query: function(query) {
885 feedFilesOptions(query, preloadData);
887 feedFilesOptions(query, preloadData);
886 },
888 },
887 formatResult: formatFileResult
889 formatResult: formatFileResult
888 });
890 });
889 % if range_diff_on is True:
891 % if range_diff_on is True:
890 fileFilter.select2("enable", false);
892 fileFilter.select2("enable", false);
891
893
892 % endif
894 % endif
893
895
894 $("#file_filter").on('click', function (e) {
896 $("#file_filter").on('click', function (e) {
895 e.preventDefault();
897 e.preventDefault();
896 var selected = $('#file_filter').select2('data');
898 var selected = $('#file_filter').select2('data');
897 var idSelector = "#"+selected.id;
899 var idSelector = "#"+selected.id;
898 window.location.hash = idSelector;
900 window.location.hash = idSelector;
899 // expand the container if we quick-select the field
901 // expand the container if we quick-select the field
900 $(idSelector).next().prop('checked', false);
902 $(idSelector).next().prop('checked', false);
901 Waypoint.refreshAll()
903 Waypoint.refreshAll()
902 });
904 });
903
905
904 var contextPrefix = _gettext('Context file: ');
906 var contextPrefix = _gettext('Context file: ');
905 ## sticky sidebar
907 ## sticky sidebar
906 var sidebarElement = document.getElementById('diff-file-sticky');
908 var sidebarElement = document.getElementById('diff-file-sticky');
907 sidebar = new StickySidebar(sidebarElement, {
909 sidebar = new StickySidebar(sidebarElement, {
908 topSpacing: 0,
910 topSpacing: 0,
909 bottomSpacing: 0,
911 bottomSpacing: 0,
910 innerWrapperSelector: '.sidebar__inner'
912 innerWrapperSelector: '.sidebar__inner'
911 });
913 });
912 sidebarElement.addEventListener('affixed.static.stickySidebar', function () {
914 sidebarElement.addEventListener('affixed.static.stickySidebar', function () {
913 // reset our file so it's not holding new value
915 // reset our file so it's not holding new value
914 $('.fpath-placeholder-text').html(contextPrefix)
916 $('.fpath-placeholder-text').html(contextPrefix)
915 });
917 });
916
918
917 updateSticky = function () {
919 updateSticky = function () {
918 sidebar.updateSticky()
920 sidebar.updateSticky()
919 };
921 };
920
922
921 var animateText = $.debounce(100, function(fPath, anchorId) {
923 var animateText = $.debounce(100, function(fPath, anchorId) {
922 // animate setting the text
924 // animate setting the text
923 var callback = function () {
925 var callback = function () {
924 $('.fpath-placeholder-text').animate({'opacity': 1.00}, 200)
926 $('.fpath-placeholder-text').animate({'opacity': 1.00}, 200)
925 $('.fpath-placeholder-text').html(contextPrefix + '<a href="#a_' + anchorId + '">' + fPath + '</a>')
927 $('.fpath-placeholder-text').html(contextPrefix + '<a href="#a_' + anchorId + '">' + fPath + '</a>')
926 };
928 };
927 $('.fpath-placeholder-text').animate({'opacity': 0.15}, 200, callback);
929 $('.fpath-placeholder-text').animate({'opacity': 0.15}, 200, callback);
928 });
930 });
929
931
930 ## dynamic file waypoints
932 ## dynamic file waypoints
931 var setFPathInfo = function(fPath, anchorId){
933 var setFPathInfo = function(fPath, anchorId){
932 animateText(fPath, anchorId)
934 animateText(fPath, anchorId)
933 };
935 };
934
936
935 var codeBlock = $('.filediff');
937 var codeBlock = $('.filediff');
936 // forward waypoint
938 // forward waypoint
937 codeBlock.waypoint(
939 codeBlock.waypoint(
938 function(direction) {
940 function(direction) {
939 if (direction === "down"){
941 if (direction === "down"){
940 setFPathInfo($(this.element).data('fPath'), $(this.element).data('anchorId'))
942 setFPathInfo($(this.element).data('fPath'), $(this.element).data('anchorId'))
941 }
943 }
942 }, {
944 }, {
943 offset: 60,
945 offset: 70,
944 context: '.fpath-placeholder'
946 context: '.fpath-placeholder'
945 }
947 }
946 );
948 );
947
949
948 // backward waypoint
950 // backward waypoint
949 codeBlock.waypoint(
951 codeBlock.waypoint(
950 function(direction) {
952 function(direction) {
951 if (direction === "up"){
953 if (direction === "up"){
952 setFPathInfo($(this.element).data('fPath'), $(this.element).data('anchorId'))
954 setFPathInfo($(this.element).data('fPath'), $(this.element).data('anchorId'))
953 }
955 }
954 }, {
956 }, {
955 offset: function () {
957 offset: function () {
956 return -this.element.clientHeight + 80
958 return -this.element.clientHeight + 90
957 },
959 },
958 context: '.fpath-placeholder'
960 context: '.fpath-placeholder'
959 }
961 }
960 );
962 );
961
963
962 });
964 });
963
965
964 </script>
966 </script>
965 % endif
967 % endif
966
968
967 </%def> No newline at end of file
969 </%def>
General Comments 0
You need to be logged in to leave comments. Login now