adapt better to ajax.org coding styles
This commit is contained in:
Fabian Jakobs
parent
2b88ca2c71
commit
8fe20516d4
13 changed files with 1556 additions and 1645 deletions
|
|
@ -1,206 +1,201 @@
|
|||
if (!window.ace) ace = {};
|
||||
if (!window.ace)
|
||||
ace = {};
|
||||
|
||||
ace.VirtualRenderer = function(container)
|
||||
{
|
||||
this.container = container;
|
||||
this.container.className += "editor";
|
||||
|
||||
this.scroller = document.createElement("div");
|
||||
this.scroller.className = "scroller";
|
||||
this.container.appendChild(this.scroller);
|
||||
|
||||
this.gutter = document.createElement("div");
|
||||
this.gutter.className = "gutter";
|
||||
this.container.appendChild(this.gutter);
|
||||
ace.VirtualRenderer = function(container) {
|
||||
this.container = container;
|
||||
this.container.className += "editor";
|
||||
|
||||
this.gutterLayer = new ace.GutterLayer(this.gutter);
|
||||
this.markerLayer = new ace.MarkerLayer(this.scroller);
|
||||
this.scroller = document.createElement("div");
|
||||
this.scroller.className = "scroller";
|
||||
this.container.appendChild(this.scroller);
|
||||
|
||||
var textLayer = this.textLayer = new ace.TextLayer(this.scroller);
|
||||
this.canvas = textLayer.element;
|
||||
|
||||
this.characterWidth = textLayer.getCharacterWidth();
|
||||
this.lineHeight = textLayer.getLineHeight();
|
||||
|
||||
this.cursorLayer = new ace.CursorLayer(this.scroller);
|
||||
|
||||
this.layers = [this.markerLayer, textLayer, this.cursorLayer];
|
||||
|
||||
this.scrollTop = 0;
|
||||
|
||||
this.cursorPos = {
|
||||
row: 0,
|
||||
column: 0
|
||||
};
|
||||
this.gutter = document.createElement("div");
|
||||
this.gutter.className = "gutter";
|
||||
this.container.appendChild(this.gutter);
|
||||
|
||||
this.gutterLayer = new ace.GutterLayer(this.gutter);
|
||||
this.markerLayer = new ace.MarkerLayer(this.scroller);
|
||||
|
||||
var textLayer = this.textLayer = new ace.TextLayer(this.scroller);
|
||||
this.canvas = textLayer.element;
|
||||
|
||||
this.characterWidth = textLayer.getCharacterWidth();
|
||||
this.lineHeight = textLayer.getLineHeight();
|
||||
|
||||
this.cursorLayer = new ace.CursorLayer(this.scroller);
|
||||
|
||||
this.layers = [ this.markerLayer, textLayer, this.cursorLayer ];
|
||||
|
||||
this.scrollTop = 0;
|
||||
|
||||
this.cursorPos = {
|
||||
row : 0,
|
||||
column : 0
|
||||
};
|
||||
}
|
||||
|
||||
ace.VirtualRenderer.prototype.setDocument = function(doc)
|
||||
{
|
||||
this.lines = doc.lines;
|
||||
this.doc = doc;
|
||||
ace.VirtualRenderer.prototype.setDocument = function(doc) {
|
||||
this.lines = doc.lines;
|
||||
this.doc = doc;
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.setTokenizer = function(tokenizer) {
|
||||
this.textLayer.setTokenizer(tokenizer);
|
||||
this.textLayer.setTokenizer(tokenizer);
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.getContainerElement = function() {
|
||||
return this.container;
|
||||
return this.container;
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.getFirstVisibleRow = function() {
|
||||
return this.layerConfig.firstRow || 0;
|
||||
return this.layerConfig.firstRow || 0;
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.getLastVisibleRow = function() {
|
||||
return this.layerConfig.lastRow || 0;
|
||||
return this.layerConfig.lastRow || 0;
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.updateLines = function(firstRow, lastRow)
|
||||
{
|
||||
var layerConfig = this.layerConfig;
|
||||
|
||||
// if the first row is below the viewport -> ignore it
|
||||
if (firstRow > layerConfig.lastRow+1) {
|
||||
return;
|
||||
}
|
||||
|
||||
// if the last row is unknow -> redraw everything
|
||||
if (lastRow === undefined)
|
||||
{
|
||||
this.draw()
|
||||
return;
|
||||
}
|
||||
|
||||
// else update only the changed rows
|
||||
this.textLayer.updateLines(layerConfig, firstRow, lastRow);
|
||||
ace.VirtualRenderer.prototype.updateLines = function(firstRow, lastRow) {
|
||||
var layerConfig = this.layerConfig;
|
||||
|
||||
// if the first row is below the viewport -> ignore it
|
||||
if (firstRow > layerConfig.lastRow + 1) { return; }
|
||||
|
||||
// if the last row is unknow -> redraw everything
|
||||
if (lastRow === undefined) {
|
||||
this.draw()
|
||||
return;
|
||||
}
|
||||
|
||||
// else update only the changed rows
|
||||
this.textLayer.updateLines(layerConfig, firstRow, lastRow);
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.draw = function()
|
||||
{
|
||||
var lines = this.lines;
|
||||
|
||||
var offset = this.scrollTop % this.lineHeight;
|
||||
var minHeight = this.scroller.clientHeight + offset;
|
||||
|
||||
var longestLine = Math.max(
|
||||
this.scroller.clientWidth,
|
||||
Math.round(this.doc.getWidth() * this.characterWidth)
|
||||
);
|
||||
|
||||
var lineCount = Math.ceil(minHeight / this.lineHeight);
|
||||
var firstRow = Math.round((this.scrollTop - offset) / this.lineHeight);
|
||||
var lastRow = Math.min(lines.length, firstRow+lineCount)-1;
|
||||
ace.VirtualRenderer.prototype.draw = function() {
|
||||
var lines = this.lines;
|
||||
|
||||
var layerConfig = this.layerConfig = {
|
||||
width: longestLine,
|
||||
firstRow: firstRow,
|
||||
lastRow: lastRow,
|
||||
lineHeight: this.lineHeight,
|
||||
characterWidth: this.characterWidth
|
||||
};
|
||||
|
||||
for (var i=0; i < this.layers.length; i++)
|
||||
{
|
||||
var layer = this.layers[i];
|
||||
var offset = this.scrollTop % this.lineHeight;
|
||||
var minHeight = this.scroller.clientHeight + offset;
|
||||
|
||||
var style = layer.element.style;
|
||||
style.marginTop = (-offset) + "px";
|
||||
style.height = minHeight + "px";
|
||||
style.width = longestLine + "px";
|
||||
var longestLine = Math.max(this.scroller.clientWidth, Math.round(this.doc
|
||||
.getWidth()
|
||||
* this.characterWidth));
|
||||
|
||||
layer.update(layerConfig);
|
||||
};
|
||||
|
||||
this.gutterLayer.element.style.marginTop = (-offset) + "px";
|
||||
this.gutterLayer.element.style.height = minHeight + "px";
|
||||
this.gutterLayer.update(layerConfig);
|
||||
var lineCount = Math.ceil(minHeight / this.lineHeight);
|
||||
var firstRow = Math.round((this.scrollTop - offset) / this.lineHeight);
|
||||
var lastRow = Math.min(lines.length, firstRow + lineCount) - 1;
|
||||
|
||||
var layerConfig = this.layerConfig = {
|
||||
width : longestLine,
|
||||
firstRow : firstRow,
|
||||
lastRow : lastRow,
|
||||
lineHeight : this.lineHeight,
|
||||
characterWidth : this.characterWidth
|
||||
};
|
||||
|
||||
for ( var i = 0; i < this.layers.length; i++) {
|
||||
var layer = this.layers[i];
|
||||
|
||||
var style = layer.element.style;
|
||||
style.marginTop = (-offset) + "px";
|
||||
style.height = minHeight + "px";
|
||||
style.width = longestLine + "px";
|
||||
|
||||
layer.update(layerConfig);
|
||||
}
|
||||
;
|
||||
|
||||
this.gutterLayer.element.style.marginTop = (-offset) + "px";
|
||||
this.gutterLayer.element.style.height = minHeight + "px";
|
||||
this.gutterLayer.update(layerConfig);
|
||||
}
|
||||
|
||||
ace.VirtualRenderer.prototype.addMarker = function(range, clazz) {
|
||||
return this.markerLayer.addMarker(range, clazz);
|
||||
return this.markerLayer.addMarker(range, clazz);
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.removeMarker = function(markerId) {
|
||||
this.markerLayer.removeMarker(markerId);
|
||||
this.markerLayer.removeMarker(markerId);
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.updateCursor = function(position)
|
||||
{
|
||||
this.cursorLayer.setCursor(position);
|
||||
this.cursorLayer.update(this.layerConfig);
|
||||
ace.VirtualRenderer.prototype.updateCursor = function(position) {
|
||||
this.cursorLayer.setCursor(position);
|
||||
this.cursorLayer.update(this.layerConfig);
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.hideCursor = function() {
|
||||
this.cursorLayer.hideCursor();
|
||||
this.cursorLayer.hideCursor();
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.showCursor = function() {
|
||||
this.cursorLayer.showCursor();
|
||||
this.cursorLayer.showCursor();
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.scrollCursorIntoView = function()
|
||||
{
|
||||
var pos = this.cursorLayer.getPixelPosition();
|
||||
|
||||
var left = pos.left
|
||||
var top = pos.top;
|
||||
|
||||
if (this.getScrollTop() > top) {
|
||||
this.scrollToY(top);
|
||||
}
|
||||
|
||||
if (this.getScrollTop() + this.scroller.clientHeight < top + this.lineHeight) {
|
||||
this.scrollToY(top + this.lineHeight - this.scroller.clientHeight);
|
||||
}
|
||||
|
||||
if (this.scroller.scrollLeft > left) {
|
||||
this.scroller.scrollLeft = left;
|
||||
}
|
||||
|
||||
if (this.scroller.scrollLeft + this.scroller.clientWidth < left + this.characterWidth) {
|
||||
this.scroller.scrollLeft = Math.round(left + this.characterWidth - this.scroller.clientWidth);
|
||||
}
|
||||
ace.VirtualRenderer.prototype.scrollCursorIntoView = function() {
|
||||
var pos = this.cursorLayer.getPixelPosition();
|
||||
|
||||
var left = pos.left
|
||||
var top = pos.top;
|
||||
|
||||
if (this.getScrollTop() > top) {
|
||||
this.scrollToY(top);
|
||||
}
|
||||
|
||||
if (this.getScrollTop() + this.scroller.clientHeight < top
|
||||
+ this.lineHeight) {
|
||||
this.scrollToY(top + this.lineHeight - this.scroller.clientHeight);
|
||||
}
|
||||
|
||||
if (this.scroller.scrollLeft > left) {
|
||||
this.scroller.scrollLeft = left;
|
||||
}
|
||||
|
||||
if (this.scroller.scrollLeft + this.scroller.clientWidth < left
|
||||
+ this.characterWidth) {
|
||||
this.scroller.scrollLeft = Math.round(left + this.characterWidth
|
||||
- this.scroller.clientWidth);
|
||||
}
|
||||
},
|
||||
|
||||
ace.VirtualRenderer.prototype.getScrollTop = function() {
|
||||
return this.scrollTop;
|
||||
return this.scrollTop;
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.scrollToRow = function(row) {
|
||||
this.scrollToY(row*this.lineHeight);
|
||||
this.scrollToY(row * this.lineHeight);
|
||||
}
|
||||
|
||||
ace.VirtualRenderer.prototype.scrollToY = function(scrollTop)
|
||||
{
|
||||
var maxHeight = this.lines.length * this.lineHeight - this.scroller.clientHeight;
|
||||
var scrollTop = Math.max(0, Math.min(maxHeight, scrollTop));
|
||||
|
||||
if (this.scrollTop !== scrollTop) {
|
||||
this.scrollTop = scrollTop;
|
||||
this.draw();
|
||||
}
|
||||
ace.VirtualRenderer.prototype.scrollToY = function(scrollTop) {
|
||||
var maxHeight = this.lines.length * this.lineHeight
|
||||
- this.scroller.clientHeight;
|
||||
var scrollTop = Math.max(0, Math.min(maxHeight, scrollTop));
|
||||
|
||||
if (this.scrollTop !== scrollTop) {
|
||||
this.scrollTop = scrollTop;
|
||||
this.draw();
|
||||
}
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.screenToTextCoordinates = function(pageX, pageY)
|
||||
{
|
||||
var canvasPos = this.scroller.getBoundingClientRect();
|
||||
|
||||
var col = Math.floor((pageX + this.scroller.scrollLeft - canvasPos.left) / this.characterWidth);
|
||||
var row = Math.floor((pageY + this.scrollTop - canvasPos.top) / this.lineHeight);
|
||||
|
||||
return {
|
||||
row: row,
|
||||
column: col
|
||||
}
|
||||
ace.VirtualRenderer.prototype.screenToTextCoordinates = function(pageX, pageY) {
|
||||
var canvasPos = this.scroller.getBoundingClientRect();
|
||||
|
||||
var col = Math.floor((pageX + this.scroller.scrollLeft - canvasPos.left)
|
||||
/ this.characterWidth);
|
||||
var row = Math.floor((pageY + this.scrollTop - canvasPos.top)
|
||||
/ this.lineHeight);
|
||||
|
||||
return {
|
||||
row : row,
|
||||
column : col
|
||||
}
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.visualizeFocus = function() {
|
||||
this.container.className = "editor focus";
|
||||
this.container.className = "editor focus";
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.visualizeBlur = function() {
|
||||
this.container.className = "editor";
|
||||
this.container.className = "editor";
|
||||
};
|
||||
|
||||
ace.VirtualRenderer.prototype.showComposition = function(position) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue