From b160b95dfee5cb34805f83899f8efabe38301abe Mon Sep 17 00:00:00 2001 From: Fabian Jakobs Date: Fri, 8 Oct 2010 13:34:03 +0200 Subject: [PATCH] add jump function to demonstrate how to jump to the cursor --- demo/editor.html | 20 +++++++++++++++++++- src/ace/VirtualRenderer.js | 16 ++++++++++++++++ 2 files changed, 35 insertions(+), 1 deletion(-) diff --git a/demo/editor.html b/demo/editor.html index 5c280ef9..f4505e3e 100644 --- a/demo/editor.html +++ b/demo/editor.html @@ -38,11 +38,20 @@ height: 55px; } - + #jump { + position: absolute; + width: 10px; + height: 10px; + border: 1px solid red; + z-index: 10000; + display: none; + } + +
@@ -222,6 +231,15 @@ var container = document.getElementById("editor"); var editor = new Editor(new Renderer(container, theme)); onDocChange(); +window.jump = function() { + var jump = document.getElementById("jump") + var cursor = editor.getCursorPosition() + var pos = editor.renderer.textToScreenCoordinates(cursor.row, cursor.column); + jump.style.left = pos.pageX + "px"; + jump.style.top = pos.pageY + "px"; + jump.style.display = "block"; +} + function onResize() { container.style.width = (document.documentElement.clientWidth - 4) + "px"; container.style.height = (document.documentElement.clientHeight - 55 - 4) + "px"; diff --git a/src/ace/VirtualRenderer.js b/src/ace/VirtualRenderer.js index a76f9b12..f2029c5b 100644 --- a/src/ace/VirtualRenderer.js +++ b/src/ace/VirtualRenderer.js @@ -463,6 +463,10 @@ var VirtualRenderer = function(container, theme) { this.getScrollTop = function() { return this.scrollTop; }; + + this.getScrollLeft = function() { + return this.scroller.scrollLeft; + }; this.getScrollTopRow = function() { return this.scrollTop / this.lineHeight; @@ -501,6 +505,18 @@ var VirtualRenderer = function(container, theme) { }; }; + this.textToScreenCoordinates = function(row, column) { + var canvasPos = this.scroller.getBoundingClientRect(); + + var x = Math.round(this.doc.documentToScreenColumn(row, column) * this.characterWidth); + var y = row * this.lineHeight; + + return { + pageX: canvasPos.left + x - this.getScrollLeft(), + pageY: canvasPos.top + y - this.getScrollTop() + } + }; + this.visualizeFocus = function() { dom.addCssClass(this.container, "ace_focus"); };