jyapayne/ace
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

highlight full gutter line for wrapped lines too

Browse source
This commit is contained in:
nightwing 2012-05-13 15:08:48 +04:00
commit acc3faf42c
2 changed files with 34 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

6
lib/ace/css/editor.css
View file

@ -27,12 +27,6 @@
z-index: 4; z-index: 4;
} }
.ace_gutter_active_line {
position: absolute;
left: 0;
right: 0;
}
.ace_scroller.horscroll { .ace_scroller.horscroll {
box-shadow: 17px 0 16px -16px rgba(0, 0, 0, 0.4) inset; box-shadow: 17px 0 16px -16px rgba(0, 0, 0, 0.4) inset;
} }

50
lib/ace/virtual_renderer.js
View file

@ -102,7 +102,6 @@ var VirtualRenderer = function(container, theme) {
this.content.className = "ace_content"; this.content.className = "ace_content";
this.scroller.appendChild(this.content); this.scroller.appendChild(this.content);
this.setHighlightGutterLine(true);
this.$gutterLayer = new GutterLayer(this.$gutter); this.$gutterLayer = new GutterLayer(this.$gutter);
this.$gutterLayer.on("changeGutterWidth", this.onResize.bind(this, true)); this.$gutterLayer.on("changeGutterWidth", this.onResize.bind(this, true));
this.setFadeFoldWidgets(true); this.setFadeFoldWidgets(true);
@ -449,31 +448,38 @@ var VirtualRenderer = function(container, theme) {
dom.removeCssClass(this.$gutter, "ace_fade-fold-widgets"); dom.removeCssClass(this.$gutter, "ace_fade-fold-widgets");
}; };
this.$highlightGutterLine = false; this.$highlightGutterLine = true;
this.setHighlightGutterLine = function(shouldHighlight) { this.setHighlightGutterLine = function(shouldHighlight) {
if (this.$highlightGutterLine == shouldHighlight) if (this.$highlightGutterLine == shouldHighlight)
return; return;
this.$highlightGutterLine = shouldHighlight; this.$highlightGutterLine = shouldHighlight;
this.$loop.schedule(this.CHANGE_GUTTER);
if (!this.$gutterLineHighlight) {
this.$gutterLineHighlight = dom.createElement("div");
this.$gutterLineHighlight.className = "ace_gutter_active_line";
this.$gutter.appendChild(this.$gutterLineHighlight);
return;
}
this.$gutterLineHighlight.style.display = shouldHighlight ? "" : "none";
this.$updateGutterLineHighlight();
}; };
this.getHighlightGutterLine = function() { this.getHighlightGutterLine = function() {
return this.$highlightGutterLine; return this.$highlightGutterLine;
}; };
this.$updateGutterLineHighlight = function() { this.$updateGutterLineHighlight = function(gutterReady) {
this.$gutterLineHighlight.style.top = this.$cursorLayer.$pixelPos.top - this.layerConfig.offset + "px"; var i = this.session.selection.lead.row;
this.$gutterLineHighlight.style.height = this.layerConfig.lineHeight + "px"; if (i == this.$gutterLineHighlight)
return;
if (!gutterReady) {
var ch = this.$gutterLayer.element.children
var oldEl = ch[this.$gutterLineHighlight - this.layerConfig.firstRow];
if (oldEl)
dom.removeCssClass(oldEl, "ace_gutter_active_line");
var newEl = ch[i - this.layerConfig.firstRow];
if (newEl)
dom.addCssClass(newEl, "ace_gutter_active_line");
}
this.$gutterLayer.removeGutterDecoration(this.$gutterLineHighlight, "ace_gutter_active_line");
this.$gutterLayer.addGutterDecoration(i, "ace_gutter_active_line");
this.$gutterLineHighlight = i;
}; };
this.$updatePrintMargin = function() { this.$updatePrintMargin = function() {
@ -667,13 +673,15 @@ var VirtualRenderer = function(container, theme) {
// update scrollbar first to not lose scroll position when gutter calls resize // update scrollbar first to not lose scroll position when gutter calls resize
this.$updateScrollBar(); this.$updateScrollBar();
this.$textLayer.update(this.layerConfig); this.$textLayer.update(this.layerConfig);
if (this.showGutter) if (this.showGutter) {
if (this.$highlightGutterLine)
this.$updateGutterLineHighlight(true);
this.$gutterLayer.update(this.layerConfig); this.$gutterLayer.update(this.layerConfig);
}
this.$markerBack.update(this.layerConfig); this.$markerBack.update(this.layerConfig);
this.$markerFront.update(this.layerConfig); this.$markerFront.update(this.layerConfig);
this.$cursorLayer.update(this.layerConfig); this.$cursorLayer.update(this.layerConfig);
this.$moveTextAreaToCursor(); this.$moveTextAreaToCursor();
this.$highlightGutterLine && this.$updateGutterLineHighlight();
return; return;
} }
@ -685,13 +693,15 @@ var VirtualRenderer = function(container, theme) {
else else
this.$textLayer.scrollLines(this.layerConfig); this.$textLayer.scrollLines(this.layerConfig);
if (this.showGutter) if (this.showGutter) {
if (this.$highlightGutterLine)
this.$updateGutterLineHighlight(true);
this.$gutterLayer.update(this.layerConfig); this.$gutterLayer.update(this.layerConfig);
}
this.$markerBack.update(this.layerConfig); this.$markerBack.update(this.layerConfig);
this.$markerFront.update(this.layerConfig); this.$markerFront.update(this.layerConfig);
this.$cursorLayer.update(this.layerConfig); this.$cursorLayer.update(this.layerConfig);
this.$moveTextAreaToCursor(); this.$moveTextAreaToCursor();
this.$highlightGutterLine && this.$updateGutterLineHighlight();
return; return;
} }
@ -714,7 +724,7 @@ var VirtualRenderer = function(container, theme) {
if (changes & this.CHANGE_CURSOR) { if (changes & this.CHANGE_CURSOR) {
this.$cursorLayer.update(this.layerConfig); this.$cursorLayer.update(this.layerConfig);
this.$moveTextAreaToCursor(); this.$moveTextAreaToCursor();
this.$highlightGutterLine && this.$updateGutterLineHighlight(); this.$highlightGutterLine && this.$updateGutterLineHighlight(false);
} }
if (changes & (this.CHANGE_MARKER | this.CHANGE_MARKER_FRONT)) { if (changes & (this.CHANGE_MARKER | this.CHANGE_MARKER_FRONT)) {