kallithea Changeset - 3a139a5500dd

Changeset - 3a139a5500dd

Parent rev.

Child rev.

[Not reviewed]

stable

0 2 0

Andrew Shadura - 11 years ago 2015-05-05 18:13:00
andrew@shadura.me

diff view: improve appearance of line numbers

* display the ellipsis just once and centered
instead of showing in twice in both - and + columns
* expand column width as needed to accomodate longer numbers
(previously, the column width was fixed)
* enable box-sizing: border-box for the number links to
make it easier to set paddings

2 files changed with 22 insertions and 14 deletions:

kallithea/lib/diffs.py

kallithea/public/css/style.css

0 comments (0 inline, 0 general)

kallithea/lib/diffs.py

➞

Show inline comments

@@ @@ -597,154 +597,159 @@ class DiffProcessor(object): @@
                         raise Exception('error parsing diff - more than %s "+" lines at -%s+%s' % (new_end, old_line, new_line))
         except StopIteration:
             pass
         if old_line != old_end or new_line != new_end:
             raise Exception('diff processing broken when old %s<>%s or new %s<>%s line %r' % (old_line, old_end, new_line, new_end, line))
         return chunks, stats
     def _safe_id(self, idstring):
         """Make a string safe for including in an id attribute.
         The HTML spec says that id attributes 'must begin with
         a letter ([A-Za-z]) and may be followed by any number
         of letters, digits ([0-9]), hyphens ("-"), underscores
         ("_"), colons (":"), and periods (".")'. These regexps
         are slightly over-zealous, in that they remove colons
         and periods unnecessarily.
         Whitespace is transformed into underscores, and then
         anything which is not a hyphen or a character that
         matches \w (alphanumerics and underscore) is removed.
         """
         # Transform all whitespace to underscore
         idstring = re.sub(r'\s', "_", '%s' % idstring)
         # Remove everything that is not a hyphen or a member of \w
         idstring = re.sub(r'(?!-)\W', "", idstring).lower()
         return idstring
     def prepare(self, inline_diff=True):
         """
         Prepare the passed udiff for HTML rendering. It'l return a list
         of dicts with diff information
         """
         parsed = self._parser(inline_diff=inline_diff)
         self.parsed = True
         self.parsed_diff = parsed
         return parsed
     def as_raw(self, diff_lines=None):
         """
         Returns raw string diff
         """
         return self._diff
         #return u''.join(imap(self._line_counter, self._diff.splitlines(1)))
     def as_html(self, table_class='code-difftable', line_class='line',
                 old_lineno_class='lineno old', new_lineno_class='lineno new',
                 no_lineno_class='lineno',
                 code_class='code', enable_comments=False, parsed_lines=None):
         """
         Return given diff as html table with customized css classes
         """
         def _link_to_if(condition, label, url):
             """
             Generates a link if condition is meet or just the label if not.
             """
             if condition:
                 return '''<a href="%(url)s">%(label)s</a>''' % {
                     'url': url,
                     'label': label
+                }
             else:
                 return label
         if not self.parsed:
             self.prepare()
         diff_lines = self.parsed_diff
         if parsed_lines:
             diff_lines = parsed_lines
         _html_empty = True
         _html = []
         _html.append('''<table class="%(table_class)s">\n''' % {
             'table_class': table_class
         })
         for diff in diff_lines:
             for line in diff['chunks']:
                 _html_empty = False
                 for change in line:
                     _html.append('''<tr class="%(lc)s %(action)s">\n''' % {
                         'lc': line_class,
                         'action': change['action']
                     })
                     anchor_old_id = ''
                     anchor_new_id = ''
                     anchor_old = "%(filename)s_o%(oldline_no)s" % {
                         'filename': self._safe_id(diff['filename']),
                         'oldline_no': change['old_lineno']
+                    }
                     anchor_new = "%(filename)s_n%(oldline_no)s" % {
                         'filename': self._safe_id(diff['filename']),
                         'oldline_no': change['new_lineno']
+                    }
                     cond_old = (change['old_lineno'] != '...' and
                                 change['old_lineno'])
                     cond_new = (change['new_lineno'] != '...' and
                                 change['new_lineno'])
                     no_lineno = (change['old_lineno'] == '...' and
                                  change['new_lineno'] == '...')
                     if cond_old:
                         anchor_old_id = 'id="%s"' % anchor_old
                     if cond_new:
                         anchor_new_id = 'id="%s"' % anchor_new
                     ###########################################################
                     # OLD LINE NUMBER
                     ###########################################################
                     _html.append('''\t<td %(a_id)s class="%(olc)s">''' % {
+                    _html.append('''\t<td %(a_id)s class="%(olc)s" %(colspan)s>''' % {
                         'a_id': anchor_old_id,
                         'olc': old_lineno_class
                         'olc': no_lineno_class if no_lineno else old_lineno_class,
                         'colspan': 'colspan="2"' if no_lineno else ''
                     })
                     _html.append('''%(link)s''' % {
                         'link': _link_to_if(True, change['old_lineno'],
                                             '#%s' % anchor_old)
                     })
                     _html.append('''</td>\n''')
                     ###########################################################
                     # NEW LINE NUMBER
                     ###########################################################
                     _html.append('''\t<td %(a_id)s class="%(nlc)s">''' % {
                         'a_id': anchor_new_id,
                         'nlc': new_lineno_class
                     })
                     if not no_lineno:
                         _html.append('''\t<td %(a_id)s class="%(nlc)s">''' % {
                             'a_id': anchor_new_id,
                             'nlc': new_lineno_class
                         })
                     _html.append('''%(link)s''' % {
                         'link': _link_to_if(True, change['new_lineno'],
                                             '#%s' % anchor_new)
                     })
                     _html.append('''</td>\n''')
                         _html.append('''%(link)s''' % {
                             'link': _link_to_if(True, change['new_lineno'],
                                                 '#%s' % anchor_new)
                         })
                         _html.append('''</td>\n''')
                     ###########################################################
                     # CODE
                     ###########################################################
                     comments = '' if enable_comments else 'no-comment'
                     _html.append('''\t<td class="%(cc)s %(inc)s">''' % {
                         'cc': code_class,
                         'inc': comments
                     })
                     _html.append('''\n\t\t<div class="add-bubble"><div>&nbsp;</div></div><pre>%(code)s</pre>\n''' % {
                         'code': change['line']
                     })
                     _html.append('''\t</td>''')
                     _html.append('''\n</tr>\n''')
         _html.append('''</table>''')
         if _html_empty:
             return None
         return ''.join(_html)
     def stat(self):
         """
         Returns tuple of added, and removed lines for this instance
         """
         return self.adds, self.removes

kallithea/public/css/style.css

➞

Show inline comments

@@ @@ -4856,119 +4856,122 @@ table.code-difftable td { @@
     vertical-align: baseline !important
+}
 table.code-difftable .context {
     background: none repeat scroll 0 0 #DDE7EF;
     color: #999;
+}
 table.code-difftable .add {
     background: none repeat scroll 0 0 #DDFFDD;
+}
 table.code-difftable .add ins {
     background: none repeat scroll 0 0 #AAFFAA;
     text-decoration: none;
+}
 table.code-difftable .del {
     background: none repeat scroll 0 0 #FFDDDD;
+}
 table.code-difftable .del del {
     background: none repeat scroll 0 0 #FFAAAA;
     text-decoration: none;
+}
 table.code-highlighttable div.code-highlight pre u:before,
 table.code-difftable td.code pre u:before {
     content: "\21a6";
     display: inline-block;
     width: 0;
+}
 table.code-highlighttable div.code-highlight pre u.cr:before,
 table.code-difftable td.code pre u.cr:before {
     content: "\21a4";
     display: inline-block;
     color: rgba(0,0,0,0.5);
+}
 table.code-highlighttable div.code-highlight pre u,
 table.code-difftable td.code pre u {
     color: rgba(0,0,0,0.15);
+}
 table.code-highlighttable div.code-highlight pre i,
 table.code-difftable td.code pre i {
     border-style: solid;
     border-left-width: 1px;
     color: rgba(0,0,0,0.5);
+}
 /** LINE NUMBERS **/
 table.code-difftable .lineno {
     padding-left: 2px;
     padding-right: 2px !important;
     text-align: right;
     width: 30px;
     -moz-user-select: none;
     -webkit-user-select: none;
     border-right: 1px solid #CCC !important;
     border-left: 0px solid #CCC !important;
     border-top: 0px solid #CCC !important;
     border-bottom: none !important;
     vertical-align: middle !important;
     text-align: center;
+}
 table.code-difftable .lineno.new {
     text-align: right;
+}
 table.code-difftable .lineno.old {
     text-align: right;
+}
 table.code-difftable .lineno a {
     color: #aaa !important;
     font: 11px Consolas, Monaco, Inconsolata, Liberation Mono, monospace !important;
     letter-spacing: -1px;
-    text-align: right;
+    padding-left: 10px;
     padding-right: 8px;
     box-sizing: border-box;
     cursor: pointer;
     display: block;
-    width: 30px;
+    width: 100%;
+}
 table.code-difftable .lineno-inline {
     background: none repeat scroll 0 0 #FFF !important;
     padding-left: 2px;
     padding-right: 2px;
     text-align: right;
     width: 30px;
     -moz-user-select: none;
     -webkit-user-select: none;
+}
 /** CODE **/
 table.code-difftable .code {
     display: block;
     width: 100%;
+}
 table.code-difftable .code td {
     margin: 0;
     padding: 0;
+}
 table.code-difftable .code pre {
     margin: 0 0 0 12px;
     padding: 0;
     min-height: 17px;
     line-height: 17px;
     white-space: pre-wrap;
+}
 table.code-difftable .del .code pre:before {
     content: "-";
     color: #800;
     float: left;
     left: -1em;
     position: relative;
     width: 0;
+}
 table.code-difftable .add .code pre:before {
     content: "+";
     color: #080;
     float: left;
     left: -1em;
     position: relative;
     width: 0;
+}
 table.code-difftable .unmod .code pre:before {

0 comments (0 inline, 0 general)