Merge pull request #988 from ajaxorg/fix/line-highlight

Fix/line highlight

lib/ace/edit_session.js

@@ -376,13 +376,6 @@ var EditSession = function(text, mode) {
         return token;
     };
  
-    this.highlight = function(re) {
-        if (!this.$searchHighlight) {
-            var highlight = new SearchHighlight(null, "ace_selected-word", "text");
-            this.$searchHighlight = this.addDynamicMarker(highlight);
-        }
-        this.$searchHighlight.setRegexp(re);
-    }
     /**
     * EditSession.setUndoManager(undoManager)
     * - undoManager (UndoManager): The new undo manager
@@ -736,6 +729,30 @@ var EditSession = function(text, mode) {
         return inFront ? this.$frontMarkers : this.$backMarkers;
     };
 
+    this.highlight = function(re) {
+        if (!this.$searchHighlight) {
+            var highlight = new SearchHighlight(null, "ace_selected-word", "text");
+            this.$searchHighlight = this.addDynamicMarker(highlight);
+        }
+        this.$searchHighlight.setRegexp(re);
+    }
+    
+    // experimental
+    this.highlightLines = function(startRow, endRow, clazz, inFront) {
+        if (typeof endRow != "number") {
+            clazz = endRow;
+            endRow = startRow;
+        }
+        if (!clazz)
+            clazz = "ace_step";
+        
+        var range = new Range(startRow, 0, endRow, Infinity);
+        
+        var id = this.addMarker(range, clazz, "fullLine", inFront);
+        range.id = id;
+        return range;
+    },
+   
     /*
      * Error:
      *  {

lib/ace/editor.js

@@ -481,28 +481,24 @@ var Editor = function(renderer, session) {
     this.$updateHighlightActiveLine = function() {
         var session = this.getSession();
 
-        if (session.$highlightLineMarker)
+        var highlight;
-            session.removeMarker(session.$highlightLineMarker);
-
-        session.$highlightLineMarker = null;
-
         if (this.$highlightActiveLine) {
-            var cursor = this.getCursorPosition();
+            if ((this.$selectionStyle != "line" || !this.selection.isMultiLine()))
-            var foldLine = this.session.getFoldLine(cursor.row);
+                highlight = this.getCursorPosition();
+        }
 
-            if ((this.getSelectionStyle() != "line" || !this.selection.isMultiLine())) {
+        if (session.$highlightLineMarker && !highlight) {
-                var range;
+            session.removeMarker(session.$highlightLineMarker.id);
-                if (foldLine) {
+            session.$highlightLineMarker = null;
-                    range = new Range(foldLine.start.row, 0, foldLine.end.row + 1, 0);
+        } else if (!session.$highlightLineMarker && highlight) {
-                } else {
+            session.$highlightLineMarker = session.highlightLines(highlight.row, highlight.row, "ace_active-line");
-                    range = new Range(cursor.row, 0, cursor.row+1, 0);
+        } else if (highlight) {
-                }
+            session.$highlightLineMarker.start.row = highlight.row;
-                session.$highlightLineMarker = session.addMarker(range, "ace_active-line", "background");
+            session.$highlightLineMarker.end.row = highlight.row;
-            }
+            session._emit("changeBackMarker");
         }
     };
 
-
     this.onSelectionChange = function(e) {
         var session = this.session;
 

lib/ace/layer/cursor.js

@@ -153,8 +153,7 @@ var Cursor = function(parentEl) {
         if (!position)
             position = this.session.selection.getCursor();
         var pos = this.session.documentToScreenPosition(position);
-        var cursorLeft = Math.round(this.$padding +
+        var cursorLeft = this.$padding + pos.column * this.config.characterWidth;
-                                    pos.column * this.config.characterWidth);
         var cursorTop = (pos.row - (onScreen ? this.config.firstRowScreen : 0)) *
             this.config.lineHeight;
 

lib/ace/layer/marker.js

@@ -78,26 +78,20 @@ var Marker = function(parentEl) {
             range = range.toScreenRange(this.session);
             if (marker.renderer) {
                 var top = this.$getTop(range.start.row, config);
-                var left = Math.round(
+                var left = this.$padding + range.start.column * config.characterWidth;
-                    this.$padding + range.start.column * config.characterWidth
-                );
                 marker.renderer(html, range, left, top, config);
             }
-            else if (range.isMultiLine()) {
+            if (marker.type == "fullLine") {
-                if (marker.type == "text") {
+                this.drawFullLineMarker(html, range, marker.clazz, config);
-                    this.drawTextMarker(html, range, marker.clazz, config);
-                } else {
-                    this.drawMultiLineMarker(
-                        html, range, marker.clazz, config,
-                        marker.type
-                    );
             }
+            else if (range.isMultiLine()) {
+                if (marker.type == "text")
+                    this.drawTextMarker(html, range, marker.clazz, config);
+                else
+                    this.drawMultiLineMarker(html, range, marker.clazz, config);
             }
             else {
-                this.drawSingleLineMarker(
+                this.drawSingleLineMarker(html, range, marker.clazz + " ace_start", config);
-                    html, range, marker.clazz + " ace_start", config,
-                    null, marker.type
-                );
             }
         }
         this.element = dom.setInnerHtml(this.element, html.join(""));
@@ -133,11 +127,11 @@ var Marker = function(parentEl) {
 
     // Draws a multi line marker, where lines span the full width
     this.drawMultiLineMarker = function(stringBuilder, range, clazz, config, type) {
-        var padding = type === "background" ? 0 : this.$padding;
         // from selection start to the end of the line
+        var padding = this.$padding;
         var height = config.lineHeight;
         var top = this.$getTop(range.start.row, config);
-        var left = Math.round(padding + range.start.column * config.characterWidth);
+        var left = padding + range.start.column * config.characterWidth;
 
         stringBuilder.push(
             "<div class='", clazz, " ace_start' style='",
@@ -149,7 +143,7 @@ var Marker = function(parentEl) {
 
         // from start of the last line to the selection end
         top = this.$getTop(range.end.row, config);
-        var width = Math.round(range.end.column * config.characterWidth);
+        var width = range.end.column * config.characterWidth;
 
         stringBuilder.push(
             "<div class='", clazz, "' style='",
@@ -175,19 +169,12 @@ var Marker = function(parentEl) {
     };
 
     // Draws a marker which covers part or whole width of a single screen line
-    this.drawSingleLineMarker = function(stringBuilder, range, clazz, layerConfig, extraLength, type) {
+    this.drawSingleLineMarker = function(stringBuilder, range, clazz, config, extraLength) {
-        var padding = type === "background" ? 0 : this.$padding;
+        var height = config.lineHeight;
-        var height = layerConfig.lineHeight;
+        var width = (range.end.column + (extraLength || 0) - range.start.column) * config.characterWidth;
 
-        if (type === "background")
+        var top = this.$getTop(range.start.row, config);
-            var width = layerConfig.width;
+        var left = this.$padding + range.start.column * config.characterWidth;
-        else
-            width = Math.round((range.end.column + (extraLength || 0) - range.start.column) * layerConfig.characterWidth);
-
-        var top = this.$getTop(range.start.row, layerConfig);
-        var left = Math.round(
-            padding + range.start.column * layerConfig.characterWidth
-        );
 
         stringBuilder.push(
             "<div class='", clazz, "' style='",
@@ -198,6 +185,20 @@ var Marker = function(parentEl) {
         );
     };
 
+    this.drawFullLineMarker = function(stringBuilder, range, clazz, config) {
+        var top = this.$getTop(range.start.row, config);
+        var height = config.lineHeight;
+        if (range.start.row != range.end.row)
+            height += this.$getTop(range.end.row, config) - top;
+
+        stringBuilder.push(
+            "<div class='", clazz, "' style='",
+            "height:", height, "px;",
+            "top:", top, "px;",
+            "left:0;right:0;'></div>"
+        );
+    }
+
 }).call(Marker.prototype);
 
 exports.Marker = Marker;