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

add jump function to demonstrate how to jump to

Browse source 
the cursor
This commit is contained in:
Fabian Jakobs 2010-10-08 13:34:03 +02:00
commit b160b95dfe
2 changed files with 35 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

20
demo/editor.html
View file

@ -38,11 +38,20 @@
height: 55px;
}
#jump {
position: absolute;
width: 10px;
height: 10px;
border: 1px solid red;
z-index: 10000;
display: none;
}
</style>
<script src="require.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="jump"></div>
<table id="controls">
<tr>
@ -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";

16
src/ace/VirtualRenderer.js
View file

@ -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");
};