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

proper display of tabs and add option to show invisible characters

Browse source
This commit is contained in:
Fabian Jakobs 2010-04-22 18:38:04 +02:00
commit 61f0cb63d9
5 changed files with 164 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/layer/Text.js
View file

@ -6,11 +6,14 @@ ace.layer.Text = function(parentEl) {
parentEl.appendChild(this.element);
this.$measureSizes();
this.$tabString = " ";
};
(function() {
// this.ENTER_CHAR = "¶";
this.ENTER_CHAR = "¬";
this.TAB_CHAR = "‣";
this.setTokenizer = function(tokenizer) {
this.tokenizer = tokenizer;
};
@ -44,11 +47,27 @@ ace.layer.Text = function(parentEl) {
this.element.removeChild(measureNode);
};
this.setTabSize = function(tabSize) {
this.$tabString = new Array(tabSize+1).join(" ");
this.setDocument = function(doc) {
this.doc = doc;
};
this.$showInvisibles = true;
this.setShowInvisibles = function(showInvisibles) {
this.$showInvisibles = showInvisibles;
};
this.$computeTabString = function() {
var tabSize = this.doc.getTabSize();
if (this.$showInvisibles) {
this.$tabString = "<span class='invisible'>" + this.TAB_CHAR + new Array(tabSize).join("&nbsp;") + "</span>";
} else {
this.$tabString = new Array(tabSize+1).join("&nbsp;");
}
};
this.updateLines = function(layerConfig, firstRow, lastRow) {
this.$computeTabString();
var first = Math.max(firstRow, layerConfig.firstRow);
var last = Math.min(lastRow, layerConfig.lastRow);
@ -64,6 +83,8 @@ ace.layer.Text = function(parentEl) {
};
this.update = function(config) {
this.$computeTabString();
var html = [];
for ( var i = config.firstRow; i <= config.lastRow; i++) {
html.push("<div class='line' style='height:" + this.lineHeight + "px;", "width:",
@ -82,20 +103,20 @@ ace.layer.Text = function(parentEl) {
var output = token.value
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
//.replace(/\t/g, "&#x2023; ")
.replace(/\t/g, this.$tabString)
.replace(/\s/g, "&nbsp;");
.replace(/ /g, "&nbsp;")
.replace(/\t/g, this.$tabString);
// TODO: proper space matching!
if (token.type !== "text") {
stringBuilder.push("<span class='", token.type, "'>", output,
"</span>");
stringBuilder.push("<span class='", token.type, "'>", output, "</span>");
}
else {
stringBuilder.push(output);
}
};
// TODO: show invisibles
//stringBuilder.push("&para;");
if (this.$showInvisibles)
stringBuilder.push("<span class='invisible'>" + this.ENTER_CHAR + "</span>");
};
}).call(ace.layer.Text.prototype);