From b42ce65a54326fee1d72373488f6da67ae609c39 Mon Sep 17 00:00:00 2001
From: nightwing <amirjanyan@gmail.com>
Date: Sun, 17 Nov 2013 16:30:57 +0400
Subject: [PATCH] use css counter for static highlight gutter

---
 lib/ace/ext/static.css               | 11 ++++++++++-
 lib/ace/ext/static_highlight.js      |  4 ++--
 lib/ace/ext/static_highlight_test.js | 14 +++++++-------
 3 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/lib/ace/ext/static.css b/lib/ace/ext/static.css
index bd479780..f82359da 100644
--- a/lib/ace/ext/static.css
+++ b/lib/ace/ext/static.css
@@ -20,4 +20,13 @@
   -khtml-user-select: none;
   -webkit-user-select: none;
   user-select: none;
-}
\ No newline at end of file
+}
+
+
+.ace_static_highlight .ace_gutter-cell:before {
+    content: counter(ace_line, decimal);
+    counter-increment: ace_line;
+}
+.ace_static_highlight {
+    counter-reset: ace_line;
+}
diff --git a/lib/ace/ext/static_highlight.js b/lib/ace/ext/static_highlight.js
index 56588f14..a3461424 100644
--- a/lib/ace/ext/static_highlight.js
+++ b/lib/ace/ext/static_highlight.js
@@ -160,14 +160,14 @@ highlight.renderSync = function(input, mode, theme, lineStart, disableGutter) {
     for(var ix = 0; ix < length; ix++) {
         stringBuilder.push("<div class='ace_line'>");
         if (!disableGutter)
-            stringBuilder.push("<span class='ace_gutter ace_gutter-cell' unselectable='on'>" + (ix + lineStart) + "</span>");
+            stringBuilder.push("<span class='ace_gutter ace_gutter-cell' unselectable='on'>" + /*(ix + lineStart) + */ "</span>");
         textLayer.$renderLine(stringBuilder, ix, true, false);
         stringBuilder.push("\n</div>");
     }
 
     // let's prepare the whole html
     var html = "<div class='" + theme.cssClass + "'>" +
-        "<div class='ace_static_highlight'>" +
+        "<div class='ace_static_highlight' style='counter-reset:ace_line " + (lineStart - 1) + "'>" +
             stringBuilder.join("") +
         "</div>" +
     "</div>";
diff --git a/lib/ace/ext/static_highlight_test.js b/lib/ace/ext/static_highlight_test.js
index 63f0ebc3..075cea7b 100644
--- a/lib/ace/ext/static_highlight_test.js
+++ b/lib/ace/ext/static_highlight_test.js
@@ -28,13 +28,13 @@ module.exports = {
         var mode = new JavaScriptMode();
 
         var result = highlighter.render(snippet, mode, theme);
-        assert.equal(result.html, "<div class='ace-tomorrow'><div class='ace_static_highlight'>" 
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>1</span><span class='ace_comment ace_doc'>/**\xa0this\xa0is\xa0a\xa0function</span>\n</div>"
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>2</span><span class='ace_comment ace_doc'>*</span>\n</div>"
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>3</span><span class='ace_comment ace_doc'>*/</span>\n</div>"
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>4</span><span class='ace_storage ace_type'>function</span>\xa0<span class='ace_entity ace_name ace_function'>hello</span>\xa0<span class='ace_paren ace_lparen'>(</span><span class='ace_variable ace_parameter'>a</span><span class='ace_punctuation ace_operator'>,\xa0</span><span class='ace_variable ace_parameter'>b</span><span class='ace_punctuation ace_operator'>,\xa0</span><span class='ace_variable ace_parameter'>c</span><span class='ace_paren ace_rparen'>)</span>\xa0<span class='ace_paren ace_lparen'>{</span>\n</div>"
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>5</span>\xa0\xa0\xa0\xa0<span class='ace_storage ace_type'>console</span><span class='ace_punctuation ace_operator'>.</span><span class='ace_support ace_function ace_firebug'>log</span><span class='ace_paren ace_lparen'>(</span><span class='ace_identifier'>a</span>\xa0<span class='ace_keyword ace_operator'>*</span>\xa0<span class='ace_identifier'>b</span>\xa0<span class='ace_keyword ace_operator'>+</span>\xa0<span class='ace_identifier'>c</span>\xa0<span class='ace_keyword ace_operator'>+</span>\xa0<span class='ace_string'>'sup$'</span><span class='ace_paren ace_rparen'>)</span><span class='ace_punctuation ace_operator'>;</span>\n</div>"
-            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'>6</span><span class='ace_paren ace_rparen'>}</span>\n</div>"
+        assert.equal(result.html, "<div class='ace-tomorrow'><div class='ace_static_highlight' style='counter-reset:ace_line 0'>" 
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span><span class='ace_comment ace_doc'>/**\xa0this\xa0is\xa0a\xa0function</span>\n</div>"
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span><span class='ace_comment ace_doc'>*</span>\n</div>"
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span><span class='ace_comment ace_doc'>*/</span>\n</div>"
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span><span class='ace_storage ace_type'>function</span>\xa0<span class='ace_entity ace_name ace_function'>hello</span>\xa0<span class='ace_paren ace_lparen'>(</span><span class='ace_variable ace_parameter'>a</span><span class='ace_punctuation ace_operator'>,\xa0</span><span class='ace_variable ace_parameter'>b</span><span class='ace_punctuation ace_operator'>,\xa0</span><span class='ace_variable ace_parameter'>c</span><span class='ace_paren ace_rparen'>)</span>\xa0<span class='ace_paren ace_lparen'>{</span>\n</div>"
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span>\xa0\xa0\xa0\xa0<span class='ace_storage ace_type'>console</span><span class='ace_punctuation ace_operator'>.</span><span class='ace_support ace_function ace_firebug'>log</span><span class='ace_paren ace_lparen'>(</span><span class='ace_identifier'>a</span>\xa0<span class='ace_keyword ace_operator'>*</span>\xa0<span class='ace_identifier'>b</span>\xa0<span class='ace_keyword ace_operator'>+</span>\xa0<span class='ace_identifier'>c</span>\xa0<span class='ace_keyword ace_operator'>+</span>\xa0<span class='ace_string'>'sup$'</span><span class='ace_paren ace_rparen'>)</span><span class='ace_punctuation ace_operator'>;</span>\n</div>"
+            + "<div class='ace_line'><span class='ace_gutter ace_gutter-cell' unselectable='on'></span><span class='ace_paren ace_rparen'>}</span>\n</div>"
             + "</div></div>");
         assert.ok(!!result.css);
         next();