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

automatically resize gutter for high line numbers

Browse source
This commit is contained in:
Fabian Jakobs 2011-12-13 15:53:41 +01:00
commit 2bd85c163d
4 changed files with 30 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

19
lib/ace/css/editor.css
View file

@ -35,24 +35,35 @@
z-index: 4;
}
.ace_gutter .ace_layer {
position: relative;
min-width: 54px;
text-align: right;
}
.ace_gutter {
position: absolute;
overflow-x: hidden;
overflow-y: hidden;
overflow : hidden;
height: 100%;
width: auto;
cursor: default;
}
.ace_gutter-cell {
padding-left: 19px;
padding-right: 6px;
}
.ace_gutter-cell.ace_error {
background-image: url("data:image/gif,GIF89a%10%00%10%00%D5%00%00%F5or%F5%87%88%F5nr%F4ns%EBmq%F5z%7F%DDJT%DEKS%DFOW%F1Yc%F2ah%CE(7%CE)8%D18E%DD%40M%F2KZ%EBU%60%F4%60m%DCir%C8%16(%C8%19*%CE%255%F1%3FR%F1%3FS%E6%AB%B5%CA%5DI%CEn%5E%F7%A2%9A%C9G%3E%E0a%5B%F7%89%85%F5yy%F6%82%80%ED%82%80%FF%BF%BF%E3%C4%C4%FF%FF%FF%FF%FF%FF%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00!%F9%04%01%00%00%25%00%2C%00%00%00%00%10%00%10%00%00%06p%C0%92pH%2C%1A%8F%C8%D2H%93%E1d4%23%E4%88%D3%09mB%1DN%B48%F5%90%40%60%92G%5B%94%20%3E%22%D2%87%24%FA%20%24%C5%06A%00%20%B1%07%02B%A38%89X.v%17%82%11%13q%10%0Fi%24%0F%8B%10%7BD%12%0Ei%09%92%09%0EpD%18%15%24%0A%9Ci%05%0C%18F%18%0B%07%04%01%04%06%A0H%18%12%0D%14%0D%12%A1I%B3%B4%B5IA%00%3B");
background-repeat: no-repeat;
background-position: 4px center;
background-position: 2px center;
}
.ace_gutter-cell.ace_warning {
background-image: url("data:image/gif,GIF89a%10%00%10%00%D5%00%00%FF%DBr%FF%DE%81%FF%E2%8D%FF%E2%8F%FF%E4%96%FF%E3%97%FF%E5%9D%FF%E6%9E%FF%EE%C1%FF%C8Z%FF%CDk%FF%D0s%FF%D4%81%FF%D5%82%FF%D5%83%FF%DC%97%FF%DE%9D%FF%E7%B8%FF%CCl%7BQ%13%80U%15%82W%16%81U%16%89%5B%18%87%5B%18%8C%5E%1A%94d%1D%C5%83-%C9%87%2F%C6%84.%C6%85.%CD%8B2%C9%871%CB%8A3%CD%8B5%DC%98%3F%DF%9BB%E0%9CC%E1%A5U%CB%871%CF%8B5%D1%8D6%DB%97%40%DF%9AB%DD%99B%E3%B0p%E7%CC%AE%FF%FF%FF%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00%00!%F9%04%01%00%00%2F%00%2C%00%00%00%00%10%00%10%00%00%06a%C0%97pH%2C%1A%8FH%A1%ABTr%25%87%2B%04%82%F4%7C%B9X%91%08%CB%99%1C!%26%13%84*iJ9(%15G%CA%84%14%01%1A%97%0C%03%80%3A%9A%3E%81%84%3E%11%08%B1%8B%20%02%12%0F%18%1A%0F%0A%03'F%1C%04%0B%10%16%18%10%0B%05%1CF%1D-%06%07%9A%9A-%1EG%1B%A0%A1%A0U%A4%A5%A6BA%00%3B");
background-repeat: no-repeat;
background-position: 4px center;
background-position: 2px center;
}
.ace_editor .ace_sb {

13
lib/ace/layer/gutter.js
View file

@ -40,12 +40,16 @@
define(function(require, exports, module) {
var dom = require("../lib/dom");
var oop = require("../lib/oop");
var EventEmitter = require("../lib/event_emitter").EventEmitter;
var Gutter = function(parentEl) {
this.element = dom.createElement("div");
this.element.className = "ace_layer ace_gutter-layer";
parentEl.appendChild(this.element);
this.setShowFoldWidgets(this.$showFoldWidgets);
this.gutterWidth = 0;
this.$breakpoints = [];
this.$annotations = [];
@ -54,6 +58,8 @@ var Gutter = function(parentEl) {
(function() {
oop.implement(this, EventEmitter);
this.setSession = function(session) {
this.session = session;
};
@ -151,6 +157,12 @@ var Gutter = function(parentEl) {
}
this.element = dom.setInnerHtml(this.element, html.join(""));
this.element.style.height = config.minHeight + "px";
var gutterWidth = this.element.offsetWidth;
if (gutterWidth !== this.gutterWidth) {
this.gutterWidth = gutterWidth;
this._emit("changeGutterWidth", gutterWidth);
}
};
this.$showFoldWidgets = true;
@ -162,6 +174,7 @@ var Gutter = function(parentEl) {
this.$showFoldWidgets = show;
};
this.getShowFoldWidgets = function() {
return this.$showFoldWidgets;
};

2
lib/ace/virtual_renderer.js
View file

@ -82,6 +82,8 @@ var VirtualRenderer = function(container, theme) {
this.scroller.appendChild(this.content);
this.$gutterLayer = new GutterLayer(this.$gutter);
this.$gutterLayer.on("changeGutterWidth", this.onResize.bind(this, true));
this.$markerBack = new MarkerLayer(this.content);
var textLayer = this.$textLayer = new TextLayer(this.content);

11
tool/Theme.tmpl.css
View file

@ -8,19 +8,8 @@
}
.%cssClass% .ace_gutter {
width: 50px;
background: #e8e8e8;
color: #333;
overflow : hidden;
}
.%cssClass% .ace_gutter-layer {
width: 100%;
text-align: right;
}
.%cssClass% .ace_gutter-layer .ace_gutter-cell {
padding-right: 6px;
}
.%cssClass% .ace_print_margin {