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

optimize selection rendering. Use at most 3 DIVs

Browse source
This commit is contained in:
Fabian Jakobs 2010-04-28 09:40:46 +02:00
commit f703a386e6
1 changed files with 14 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/ace/layer/Marker.js
View file

@ -112,6 +112,7 @@ ace.layer.Marker = function(parentEl) {
this.drawMultiLineMarker = function(stringBuilder, range, clazz, layerConfig) { this.drawMultiLineMarker = function(stringBuilder, range, clazz, layerConfig) {
// from selection start to the end of the line
var height = layerConfig.lineHeight; var height = layerConfig.lineHeight;
var width = Math.round(layerConfig.width - (range.start.column * layerConfig.characterWidth)); var width = Math.round(layerConfig.width - (range.start.column * layerConfig.characterWidth));
var top = (range.start.row - layerConfig.firstRow) * layerConfig.lineHeight; var top = (range.start.row - layerConfig.firstRow) * layerConfig.lineHeight;
@ -125,6 +126,7 @@ ace.layer.Marker = function(parentEl) {
"left:", left, "px;'></div>" "left:", left, "px;'></div>"
); );
// from start of the last line to the selection end
var top = (range.end.row - layerConfig.firstRow) * layerConfig.lineHeight; var top = (range.end.row - layerConfig.firstRow) * layerConfig.lineHeight;
var width = Math.round(range.end.column * layerConfig.characterWidth); var width = Math.round(range.end.column * layerConfig.characterWidth);
@ -135,15 +137,18 @@ ace.layer.Marker = function(parentEl) {
"width:", width, "px;'></div>" "width:", width, "px;'></div>"
); );
for (var row = range.start.row + 1; row < range.end.row; row++) { // all the complete lines
var top = (row - layerConfig.firstRow) * layerConfig.lineHeight; var height = (range.end.row - range.start.row - 1) * layerConfig.lineHeight;
stringBuilder.push( if (height < 0)
"<div class='", clazz, "' style='", return;
"height:", height, "px;", var top = (range.start.row + 1 - layerConfig.firstRow) * layerConfig.lineHeight;
"width:", layerConfig.width, "px;",
"top:", top, "px;'></div>" stringBuilder.push(
); "<div class='", clazz, "' style='",
} "height:", height, "px;",
"width:", layerConfig.width, "px;",
"top:", top, "px;'></div>"
);
}; };
this.drawSingleLineMarker = function(stringBuilder, range, clazz, layerConfig) { this.drawSingleLineMarker = function(stringBuilder, range, clazz, layerConfig) {