diff --git a/lib/ace/css/editor.css b/lib/ace/css/editor.css index 32449578..c1825809 100644 --- a/lib/ace/css/editor.css +++ b/lib/ace/css/editor.css @@ -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 { diff --git a/lib/ace/layer/gutter.js b/lib/ace/layer/gutter.js index 538b3fe8..b12dbffc 100644 --- a/lib/ace/layer/gutter.js +++ b/lib/ace/layer/gutter.js @@ -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; }; diff --git a/lib/ace/virtual_renderer.js b/lib/ace/virtual_renderer.js index 835ca46d..095eeb21 100644 --- a/lib/ace/virtual_renderer.js +++ b/lib/ace/virtual_renderer.js @@ -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); diff --git a/tool/Theme.tmpl.css b/tool/Theme.tmpl.css index d2ed7969..34e8cbf3 100644 --- a/tool/Theme.tmpl.css +++ b/tool/Theme.tmpl.css @@ -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 {