Have linenumbers in blob displays
Dennis Kaarsemaker [Sun, 29 Jul 2012 18:12:02 +0000 (20:12 +0200)]
Steal some code from the blob template and adapt the syntax highlighting
code to cope with it.

lib/Gitalist/View/SyntaxHighlight.pm
root/fragment/ref/blob.tt2
root/ref/blob.tt2
root/static/css/core.css

index de745ab..f0b8f6e 100644 (file)
@@ -52,6 +52,30 @@ sub render {
             );
 
             my $hltxt = $hl->highlightText($blob);
+
+            # Line numbering breaks <span class="Other">#define foo\nbar</span>
+            # So let's fix that by closing all spans at end-of-line and opening
+            # new ones on the next, if needed.
+
+            my @lines = split(/\n/, $hltxt);
+            my $last_class = undef;
+            map {
+                unless($_ =~ s/^<\/span>//) {
+                    if($last_class) {
+                        $_ = "<span class=\"$last_class\">" . $_;
+                    }
+                }
+                $last_class = undef;
+                if($_ =~ /<span class="(.*?)">(?!.*<\/span>)/) {
+                    $last_class = $1;
+                }
+                if($_ !~ /<\/span>$/) {
+                    $_ .= "</span>";
+                }
+                $_;
+            } @lines;
+
+            $hltxt = join("\n", @lines);
             $hltxt =~ s/([^[:ascii:]])/encode_entities($1)/eg;
             $hltxt;
         };
index cb6097a..f527abb 100644 (file)
@@ -3,7 +3,14 @@
 [%- ELSIF is_binary -%]
 <div class='blob'>This is a binary file which won't render natively on the web, but you can get it here all the same: <a href="[% c.uri_for_action('/ref/raw', c.req.captures, filename) %]" title="[% filename %]">[% filename %]</a></div>
 [%- ELSE -%]
-[%- INCLUDE inc/syntax_highlight_css.tt2 -%]
 [%- USE UTF8Decode -%]
-<pre class='blob'>[% IF mangled; blob; ELSE; blob | utf8_decode | html; END; %]</pre>
+[%- IF mangled; INCLUDE inc/syntax_highlight_css.tt2; END -%]
+[% FOR line IN blob.split("\n") %]
+ <tr class=''>
+   <td nowrap class='lineno' id='l[% loop.index+1 %]'><tt><a href='[% c.uri_for_action('/ref/blame', [Repository.name, info.commit.sha1], filename.to_path ) %]#l[% lopo.index %]'>[% loop.index+1 %]</a></tt></td>
+   <td nowrap class='data'><pre>[%-
+     IF mangled; line; ELSE; line | utf8_decode | html; END
+   -%]</pre></td>
+ </tr>
+[% END %]
 [%- END -%]
index 9de554c..ee8b007 100755 (executable)
@@ -6,7 +6,12 @@
    </div>
   [% END %]
 
+<div id="blob">
+<table class="listing">
+<tbody>
 [% subinclude('/fragment/ref/blob', c.req.captures, c.req.args.to_path) %]
-
+</tbody>
+</table>
+</div>
 
 
index 98411b1..f98df2b 100755 (executable)
@@ -493,21 +493,21 @@ BUT the final width needs to be set with javascript based on the parent element
 
 
 /* /blame */
-#blame pre, #blame tt {
+#blame pre, #blame tt, #blob pre, #blob tt {
   margin: 0;
   font-size: 12px;
 }
 #blame .commit-info {
 
 }
-#blame .lineno {
+#blame .lineno, #blob .lineno {
   text-align: right;
   padding: 0 8px;
 }
-#blame a {
+#blame a, #blob a {
  text-decoration: none;
 }
-#blame {
+#blame, #blob {
     overflow-x: scroll;
 }
 #blame tr.alt {
@@ -516,37 +516,21 @@ BUT the final width needs to be set with javascript based on the parent element
 #blame tbody tr:hover {
   background-color: #fefeaa;
 }
-#blame td {
+#blame td, #blob td {
        vertical-align:middle;
        padding: 3px;
 }
-#blame td.lineno {
+#blame td.lineno, #blob td.lineno {
   background-color: #eee;
 }
 #blame td.date, #blame td.author, #blame td.commit-info {
 }
-#blame tbody td.data {
+#blame tbody td.data, #blob tbody td.data {
   padding-left: 5px;
   background-color: #333;
   color: #ddd;
 }
 
-/* /blob */
-pre.blob {
-  background-color: #333;
-  color: #ddd;
-  border-left: solid 3px #c33;
-  padding: 5px;
-  padding-left: 15px;
-  margin: 20px 15px 20px;
-  overflow:auto;
-  font-size:12px;
-}
-div.blob {
-    text-align: center;
-    margin: 30px;
-}
-
 /* /blobdiff etc */
 
 .commit-message {