diff --git a/lib/ace/model/window.js b/lib/ace/model/window.js index a4b873ba..1169d8f5 100644 --- a/lib/ace/model/window.js +++ b/lib/ace/model/window.js @@ -59,8 +59,6 @@ var Window = exports.Window = function(theme) { firstRow : 0, firstRowScreen: 0, lastRow : 0, - lineHeight : 1, - characterWidth : 1, minHeight : 1, maxHeight : 1, offset : 0, @@ -74,9 +72,9 @@ var Window = exports.Window = function(theme) { scrollerWidth: 0 }; - this.characterSize = { - height: 0, - width: 0 + this.charSize = { + height: 1, + width: 1 }; this.scrollLeft = 0; @@ -109,7 +107,7 @@ var Window = exports.Window = function(theme) { }; this.getLastFullyVisibleRow = function() { - var flint = Math.floor((this.layerConfig.height + this.layerConfig.offset) / this.characterSize.height); + var flint = Math.floor((this.layerConfig.height + this.layerConfig.offset) / this.charSize.height); return this.layerConfig.firstRow - 1 + flint; }; @@ -123,10 +121,10 @@ var Window = exports.Window = function(theme) { var position = this.buffer.selection.getCursor(); var pos = this.buffer.documentToScreenPosition(position); var cursorLeft = Math.round( - this.padding + pos.column * this.characterSize.width + this.padding + pos.column * this.charSize.width ); var cursorTop = (pos.row - (onScreen ? this.layerConfig.firstRowScreen : 0)) - * this.characterSize.height; + * this.charSize.height; return { left : cursorLeft, @@ -138,7 +136,7 @@ var Window = exports.Window = function(theme) { * Returns the height in pixels required to render this row on the screen **/ this.getRowHeight = function(row) { - return this.buffer.getRowLength(row) * this.characterSize.height; + return this.buffer.getRowLength(row) * this.charSize.height; }; // SCROLLING @@ -177,15 +175,15 @@ var Window = exports.Window = function(theme) { }; this.getScrollTopRow = function() { - return this.scrollTop / this.characterSize.height; + return this.scrollTop / this.charSize.height; }; this.getScrollBottomRow = function() { - return Math.max(0, Math.floor((this.scrollTop + this.size.scrollerHeight) / this.characterSize.height) - 1); + return Math.max(0, Math.floor((this.scrollTop + this.size.scrollerHeight) / this.charSize.height) - 1); }; this.scrollToRow = function(row) { - this.scrollToY(row * this.characterSize.height); + this.scrollToY(row * this.charSize.height); }; this.scrollToLine = function(line, center) { @@ -213,8 +211,8 @@ var Window = exports.Window = function(theme) { this.scrollToY(top); } - if (this.scrollTop + this.size.scrollerHeight < top + this.characterSize.height) - this.scrollToY(top + this.characterSize.height - this.size.scrollerHeight); + if (this.scrollTop + this.size.scrollerHeight < top + this.charSize.height) + this.scrollToY(top + this.charSize.height - this.size.scrollerHeight); var scrollLeft = this.scrollLeft; @@ -222,8 +220,8 @@ var Window = exports.Window = function(theme) { this.scrollToX(left); } - if (scrollLeft + this.size.scrollerWidth < left + this.characterSize.width) - this.scrollToX(Math.round(left + this.characterSize.width - this.size.scrollerWidth)); + if (scrollLeft + this.size.scrollerWidth < left + this.charSize.width) + this.scrollToX(Math.round(left + this.charSize.width - this.size.scrollerWidth)); }; // SETTINGS @@ -336,10 +334,10 @@ var Window = exports.Window = function(theme) { }; this.setComputedCharacterSize = function(size) { - if (this.characterSize.height == size.height && this.characterSize.width == size.width) + if (this.charSize.height == size.height && this.charSize.width == size.width) return; - this.characterSize = size; + this.charSize = size; this._emit("changeCharacterSize") } diff --git a/lib/ace/view/layer/cursor.js b/lib/ace/view/layer/cursor.js index e892c5db..ee6e1aab 100644 --- a/lib/ace/view/layer/cursor.js +++ b/lib/ace/view/layer/cursor.js @@ -88,7 +88,7 @@ var Cursor = function(model, parentEl) { this.update = function(config) { this.pixelPos = this.model.getCursorPixelPosition(true); - var charSize = this.model.characterSize; + var charSize = this.model.charSize; this.cursor.style.left = this.pixelPos.left + "px"; this.cursor.style.top = this.pixelPos.top + "px"; diff --git a/lib/ace/view/layer/gutter.js b/lib/ace/view/layer/gutter.js index 38e590be..2303a1cf 100644 --- a/lib/ace/view/layer/gutter.js +++ b/lib/ace/view/layer/gutter.js @@ -104,6 +104,7 @@ var Gutter = function(model, parentEl) { var buffer = this.model.buffer; var fold = buffer.getNextFold(i); var foldStart = fold ? fold.start.row : Infinity; + var lineHeight = this.model.charSize.height; while (true) { if(i > foldStart) { @@ -120,12 +121,11 @@ var Gutter = function(model, parentEl) { this.$breakpoints[i] ? " ace_breakpoint " : " ", annotation.className, "' title='", annotation.text.join("\n"), - "' style='height:", config.lineHeight, "px;'>", (i+1)); + "' style='height:", lineHeight, "px;'>", (i+1)); var wrappedRowLength = buffer.getRowLength(i) - 1; - while (wrappedRowLength--) { - html.push("
¦
"); - } + while (wrappedRowLength--) + html.push("
¦
"); html.push(""); diff --git a/lib/ace/view/layer/marker.js b/lib/ace/view/layer/marker.js index 28694aa4..4b3d2f09 100644 --- a/lib/ace/view/layer/marker.js +++ b/lib/ace/view/layer/marker.js @@ -62,7 +62,7 @@ var Marker = function(model, parentEl) { return; this.config = config; - + var model = this.model; var html = []; for ( var key in this.markers) { @@ -73,9 +73,9 @@ var Marker = function(model, parentEl) { range = range.toScreenRange(this.model.buffer); if (marker.renderer) { - var top = this.$getTop(range.start.row, config); + var top = this.$getTop(range.start.row); var left = Math.round( - this.model.padding + range.start.column * config.characterWidth + this.model.padding + range.start.column * model.charSize.width ); marker.renderer(html, range, left, top, config); } @@ -99,8 +99,8 @@ var Marker = function(model, parentEl) { this.element = dom.setInnerHtml(this.element, html.join("")); }; - this.$getTop = function(row, layerConfig) { - return (row - layerConfig.firstRowScreen) * layerConfig.lineHeight; + this.$getTop = function(row) { + return (row - this.model.layerConfig.firstRowScreen) * this.model.charSize.height; }; /** @@ -134,13 +134,12 @@ var Marker = function(model, parentEl) { */ this.drawMultiLineMarker = function(stringBuilder, range, clazz, layerConfig, type) { // from selection start to the end of the line + var charSize = this.model.charSize; var padding = type === "background" ? 0 : this.model.padding; - var height = layerConfig.lineHeight; - var width = Math.round(layerConfig.width - (range.start.column * layerConfig.characterWidth)); - var top = this.$getTop(range.start.row, layerConfig); - var left = Math.round( - padding + range.start.column * layerConfig.characterWidth - ); + var height = charSize.height; + var width = Math.round(layerConfig.width - (range.start.column * charSize.width)); + var top = this.$getTop(range.start.row); + var left = Math.round(padding + range.start.column * charSize.width); stringBuilder.push( "
" + c + ""; } }; @@ -304,8 +304,8 @@ var Text = function(model, parentEl) { var chars = 0; var split = 0; var splitChars; - var characterWidth = this.config.characterWidth; var screenColumn = 0; + var charSize = this.model.charSize; var self = this; if (!splits || splits.length == 0) @@ -315,7 +315,7 @@ var Text = function(model, parentEl) { if (!onlyContents) { stringBuilder.push("
" ); } @@ -342,7 +342,7 @@ var Text = function(model, parentEl) { if (!onlyContents) { stringBuilder.push("
", "
" ); } diff --git a/lib/ace/view/layer/text_text.js b/lib/ace/view/layer/text_text.js index b15125e2..0be74ead 100644 --- a/lib/ace/view/layer/text_text.js +++ b/lib/ace/view/layer/text_text.js @@ -55,6 +55,7 @@ module.exports = { var textLayer = new TextLayer(document.createElement("div")); textLayer.setSession(session); textLayer.$computeTabString(); + // TODO refactor textLayer.config = { characterWidth: 10, lineHeight: 20 diff --git a/lib/ace/view/measure_text.js b/lib/ace/view/measure_text.js index 72480f1e..72da1e4f 100644 --- a/lib/ace/view/measure_text.js +++ b/lib/ace/view/measure_text.js @@ -46,7 +46,7 @@ var EventEmitter = require("ace/lib/event_emitter").EventEmitter; var MeasureText = exports.MeasureText = function(parentEl, interval) { this.parentEl = parentEl; - this.$characterSize = this.$measureSizes() || {width: 0, height: 0}; + this.$charSize = this.$measureSizes() || {width: 0, height: 0}; this.$pollSizeChanges(interval); }; @@ -56,15 +56,15 @@ var MeasureText = exports.MeasureText = function(parentEl, interval) { this.getCharacterSize = function() { return { - height: this.$characterSize.height || 1, - width: this.$characterSize.width || 1 + height: this.$charSize.height || 1, + width: this.$charSize.width || 1 } }; this.checkForSizeChanges = function() { var size = this.$measureSizes(); - if (size && (this.$characterSize.width !== size.width || this.$characterSize.height !== size.height)) { - this.$characterSize = size; + if (size && (this.$charSize.width !== size.width || this.$charSize.height !== size.height)) { + this.$charSize = size; this._emit("changeCharacterSize", {data: size}); } }; diff --git a/lib/ace/view/window_view.js b/lib/ace/view/window_view.js index c27f4f37..221452d4 100644 --- a/lib/ace/view/window_view.js +++ b/lib/ace/view/window_view.js @@ -218,7 +218,7 @@ var WindowView = function(windowModel, container) { this.adjustWrapLimit = function(){ var availableWidth = this.model.size.scrollerWidth - this.model.padding * 2; - var limit = Math.floor(availableWidth / this.characterWidth) - 1; + var limit = Math.floor(availableWidth / this.model.charSize.width) - 1; return this.session.adjustWrapLimit(limit); }; @@ -257,7 +257,7 @@ var WindowView = function(windowModel, container) { } var style = this.$printMarginEl.style; - style.left = ((this.characterWidth * this.model.printMarginColumn) + this.model.padding * 2) + "px"; + style.left = ((this.model.charSize.width * this.model.printMarginColumn) + this.model.padding * 2) + "px"; style.visibility = this.model.showPrintMargin ? "visible" : "hidden"; }; @@ -301,10 +301,6 @@ var WindowView = function(windowModel, container) { }; this.updateCharacterSize = function() { - var size = this.$measureText.getCharacterSize(); - this.characterWidth = size.width; - this.lineHeight = size.height; - this.updatePrintMargin(); this.onResize(true); this.$loop.schedule(this.CHANGE_FULL); @@ -389,8 +385,9 @@ var WindowView = function(windowModel, container) { this.$computeLayerConfig = function() { var session = this.session; - var offset = this.model.scrollTop % this.lineHeight; - var minHeight = this.model.size.scrollerHeight + this.lineHeight; + var charSize = this.model.charSize; + var offset = this.model.scrollTop % charSize.height; + var minHeight = this.model.size.scrollerHeight + charSize.height; var longestLine = this.$getLongestLine(); var widthChanged = this.model.layerConfig.width != longestLine; @@ -401,11 +398,11 @@ var WindowView = function(windowModel, container) { if (horizScrollChanged) this.scroller.style.overflowX = horizScroll ? "scroll" : "hidden"; - var maxHeight = this.session.getScreenLength() * this.lineHeight; + var maxHeight = this.session.getScreenLength() * charSize.height; this.model.scrollToY(Math.max(0, Math.min(this.model.scrollTop, maxHeight - this.model.size.scrollerHeight))); - var lineCount = Math.ceil(minHeight / this.lineHeight) - 1; - var firstRow = Math.max(0, Math.round((this.model.scrollTop - offset) / this.lineHeight)); + var lineCount = Math.ceil(minHeight / charSize.height) - 1; + var firstRow = Math.max(0, Math.round((this.model.scrollTop - offset) / charSize.height)); var lastRow = firstRow + lineCount; // Map lines on the screen to lines in the document. @@ -427,7 +424,7 @@ var WindowView = function(windowModel, container) { + this.model.getRowHeight(lastRow) + firstRowHeight; - offset = this.model.scrollTop - firstRowScreen * this.lineHeight; + offset = this.model.scrollTop - firstRowScreen * charSize.height; this.model.layerConfig = { width : longestLine, @@ -435,8 +432,6 @@ var WindowView = function(windowModel, container) { firstRow : firstRow, firstRowScreen: firstRowScreen, lastRow : lastRow, - lineHeight : this.lineHeight, - characterWidth : this.characterWidth, minHeight : minHeight, maxHeight : maxHeight, offset : offset, @@ -488,7 +483,7 @@ var WindowView = function(windowModel, container) { if (this.model.showInvisibles) charCount += 1; - return Math.max(this.model.size.scrollerWidth, Math.round(charCount * this.characterWidth)); + return Math.max(this.model.size.scrollerWidth, Math.round(charCount * this.model.charSize.width)); }; this.updateFrontMarkers = function() { @@ -545,19 +540,20 @@ var WindowView = function(windowModel, container) { var canvasPos = this.scroller.getBoundingClientRect(); var col = Math.round((pageX + this.model.scrollLeft - canvasPos.left - this.model.padding - dom.getPageScrollLeft()) - / this.characterWidth); + / this.model.charSize.width); var row = Math.floor((pageY + this.model.scrollTop - canvasPos.top - dom.getPageScrollTop()) - / this.lineHeight); + / this.model.charSize.height); return this.session.screenToDocumentPosition(row, Math.max(col, 0)); }; this.textToScreenCoordinates = function(row, column) { + var charSize = this.model.charSize; var canvasPos = this.scroller.getBoundingClientRect(); var pos = this.session.documentToScreenPosition(row, column); - var x = this.model.padding + Math.round(pos.column * this.characterWidth); - var y = pos.row * this.lineHeight; + var x = this.model.padding + Math.round(pos.column * charSize.width); + var y = pos.row * charSize.height; return { pageX: canvasPos.left + x - this.model.scrollLeft, @@ -586,7 +582,7 @@ var WindowView = function(windowModel, container) { var style = this.$composition.style; style.top = pos.top + "px"; style.left = (pos.left + this.model.padding) + "px"; - style.height = this.lineHeight + "px"; + style.height = this.model.charSize.height + "px"; this.hideCursor(); }; diff --git a/lib/ace/view/window_view_test.js b/lib/ace/view/window_view_test.js index 8a59e820..454960e8 100644 --- a/lib/ace/view/window_view_test.js +++ b/lib/ace/view/window_view_test.js @@ -69,9 +69,6 @@ module.exports = { renderer.setPadding(0); renderer.setSession(new Buffer("1234")); - renderer.characterWidth = 10; - renderer.lineHeight = 15; - assert.position(renderer.screenToTextCoordinates(0, 0), 0, 0); assert.position(renderer.screenToTextCoordinates(4, 0), 0, 0); assert.position(renderer.screenToTextCoordinates(5, 0), 0, 1);