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

support dynamic change of selection style

Browse source
This commit is contained in:
Fabian Jakobs 2010-04-15 17:09:11 +02:00
commit e37af546d5
4 changed files with 47 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

34
demo/editor.html
View file

@ -55,16 +55,20 @@
<body>
<table id="controls">
<tr>
<td>
<label for="mode">Mode:</label>
<select id="mode" size="1">
<option value="text">Plain Text</option>
<option value="javascript">JavaScript</option>
<option value="xml">XML</option>
</select>
</td>
</tr>
<tr>
<td>
<label for="mode">Mode:</label>
<select id="mode" size="1">
<option value="text">Plain Text</option>
<option value="javascript">JavaScript</option>
<option value="xml">XML</option>
</select>
</td>
<td>
<label for="select_style">Full line selections</label>
<input type="checkbox" name="select_style" id="select_style" checked>
</td>
</tr>
</table>
<div id="container">
@ -87,6 +91,16 @@ function getMode() {
return modes[modeEl.value];
}
var selectEl = document.getElementById("select_style");
selectEl.onchange = function() {
if (selectEl.checked) {
editor.setSelectionStyle("line");
} else {
editor.setSelectionStyle("text");
}
};
var container = document.getElementById("container");
var editor = new ace.Editor(
new ace.VirtualRenderer(container),

22
src/Editor.js
View file

@ -21,6 +21,8 @@ ace.Editor = function(renderer, doc, mode) {
this.renderer.draw();
this.onCursorChange();
this.onSelectionChange();
this._initialized = true;
};
ace.Editor.prototype.setDocument = function(doc) {
@ -69,6 +71,10 @@ ace.Editor.prototype.setMode = function(mode) {
}
this.renderer.setTokenizer(this.bgTokenizer);
if (this._initialized) {
this.renderer.draw();
}
};
@ -79,7 +85,6 @@ ace.Editor.prototype.resize = function()
};
ace.Editor.prototype._highlightBrackets = function() {
if (this._bracketHighlight) {
this.renderer.removeMarker(this._bracketHighlight);
this._bracketHighlight = null;
@ -146,7 +151,8 @@ ace.Editor.prototype.onSelectionChange = function() {
if (!this.selection.isEmpty()) {
var range = this.selection.getRange();
this.selectionMarker = this.renderer.addMarker(range, "selection", "text");
var style = this.getSelectionStyle();
this.selectionMarker = this.renderer.addMarker(range, "selection", style);
}
this.onCursorChange();
@ -256,6 +262,18 @@ ace.Editor.prototype.onTextInput = function(text) {
this.renderer.scrollCursorIntoView();
};
ace.Editor.prototype._selectionStyle = "line";
ace.Editor.prototype.setSelectionStyle = function(style) {
if (this._selectionStyle == style) return;
this._selectionStyle = style;
this.onSelectionChange();
};
ace.Editor.prototype.getSelectionStyle = function() {
return this._selectionStyle;
};
ace.Editor.prototype.removeRight = function() {
if (this.selection.isEmpty()) {
this.selection.selectRight();

2
src/MarkerLayer.js
View file

@ -67,7 +67,7 @@ ace.MarkerLayer.prototype.update = function(config) {
}
if (range.start.row !== range.end.row) {
if (marker.type == "line") {
if (marker.type == "text") {
this.drawTextMarker(html, range, marker.clazz, config);
} else {
this.drawMultiLineMarker(html, range, marker.clazz, config);

4
src/VirtualRenderer.js
View file

@ -111,8 +111,8 @@ ace.VirtualRenderer.prototype.draw = function() {
this.gutterLayer.update(layerConfig);
};
ace.VirtualRenderer.prototype.addMarker = function(range, clazz) {
return this.markerLayer.addMarker(range, clazz);
ace.VirtualRenderer.prototype.addMarker = function(range, clazz, type) {
return this.markerLayer.addMarker(range, clazz, type);
};
ace.VirtualRenderer.prototype.removeMarker = function(markerId) {