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

have two marker layers. One in front and one behind the text.

Browse source
This commit is contained in:
Fabian Jakobs 2011-02-12 15:25:14 +01:00
commit e37dc3f7e4
1 changed files with 37 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

52
lib/ace/virtual_renderer.js
View file

@ -75,19 +75,19 @@ var VirtualRenderer = function(container, theme) {
this.scroller.appendChild(this.content);
this.$gutterLayer = new GutterLayer(this.$gutter);
this.$markerLayer = new MarkerLayer(this.content);
this.$markerBack = new MarkerLayer(this.content);
var textLayer = this.$textLayer = new TextLayer(this.content);
this.canvas = textLayer.element;
this.$markerFront = new MarkerLayer(this.content);
this.characterWidth = textLayer.getCharacterWidth();
this.lineHeight = textLayer.getLineHeight();
this.$cursorLayer = new CursorLayer(this.content);
this.$cursorPadding = 8;
this.layers = [ this.$markerLayer, textLayer, this.$cursorLayer ];
this.scrollBar = new ScrollBar(container);
this.scrollBar.addEventListener("scroll", this.onScroll.bind(this));
@ -133,14 +133,17 @@ var VirtualRenderer = function(container, theme) {
this.CHANGE_LINES = 16;
this.CHANGE_TEXT = 32;
this.CHANGE_SIZE = 64;
this.CHANGE_FULL = 128;
this.CHANGE_MARKER_BACK = 128;
this.CHANGE_MARKER_FRONT = 256;
this.CHANGE_FULL = 512;
oop.implement(this, EventEmitter);
this.setSession = function(session) {
this.session = session;
this.$cursorLayer.setSession(session);
this.$markerLayer.setSession(session);
this.$markerBack.setSession(session);
this.$markerFront.setSession(session);
this.$gutterLayer.setSession(session);
this.$textLayer.setSession(session);
this.$loop.schedule(this.CHANGE_FULL);
@ -384,7 +387,8 @@ var VirtualRenderer = function(container, theme) {
if (changes & this.CHANGE_FULL) {
this.$textLayer.update(this.layerConfig);
this.showGutter && this.$gutterLayer.update(this.layerConfig);
this.$markerLayer.update(this.layerConfig);
this.$markerBack.update(this.layerConfig);
this.$markerFront.update(this.layerConfig);
this.$cursorLayer.update(this.layerConfig);
this.$updateScrollBar();
this.scrollCursorIntoView();
@ -398,7 +402,8 @@ var VirtualRenderer = function(container, theme) {
else
this.$textLayer.scrollLines(this.layerConfig);
this.showGutter && this.$gutterLayer.update(this.layerConfig);
this.$markerLayer.update(this.layerConfig);
this.$markerBack.update(this.layerConfig);
this.$markerFront.update(this.layerConfig);
this.$cursorLayer.update(this.layerConfig);
this.$updateScrollBar();
return;
@ -419,8 +424,12 @@ var VirtualRenderer = function(container, theme) {
if (changes & this.CHANGE_CURSOR)
this.$cursorLayer.update(this.layerConfig);
if (changes & this.CHANGE_MARKER) {
this.$markerLayer.update(this.layerConfig);
if (changes & (this.CHANGE_MARKER | this.CHANGE_MARKER_FRONT)) {
this.$markerFront.update(this.layerConfig);
}
if (changes & (this.CHANGE_MARKER | this.CHANGE_MARKER_BACK)) {
this.$markerBack.update(this.layerConfig);
}
if (changes & this.CHANGE_SIZE)
@ -505,15 +514,28 @@ var VirtualRenderer = function(container, theme) {
return Math.max(this.$size.scrollerWidth - this.$padding * 2, Math.round(charCount * this.characterWidth));
};
this.addMarker = function(range, clazz, type) {
var id = this.$markerLayer.addMarker(range, clazz, type);
this.$loop.schedule(this.CHANGE_MARKER);
return id;
this.addMarker = function(range, clazz, type, inFront) {
if (inFront) {
var id = this.$markerFront.addMarker(range, clazz, type);
this.$loop.schedule(this.CHANGE_MARKER_FRONT);
}
else {
var id = this.$markerBack.addMarker(range, clazz, type);
this.$loop.schedule(this.CHANGE_MARKER_BACK);
}
return [id, !!inFront];
};
this.removeMarker = function(markerId) {
this.$markerLayer.removeMarker(markerId);
this.$loop.schedule(this.CHANGE_MARKER);
if (markerId[1]) {
this.$markerFront.removeMarker(markerId[0]);
this.$loop.schedule(this.CHANGE_MARKER_FRONT);
}
else {
this.$markerBack.removeMarker(markerId[0]);
this.$loop.schedule(this.CHANGE_MARKER_BACK);
}
};
this.addGutterDecoration = function(row, className){