Ace editor height = content height

4,318 views
Skip to first unread message

Peric

unread,
Sep 19, 2011, 6:49:34 AM9/19/11
to Ajax.org Cloud9 Editor (Ace)
Hello everyone,

I need a little help here.
Well, I'm setting ACE editor to a <div> inside a page. I need that ACE
editor on the middle of page, so all I want to do is to set that
editor height to the height of his content.

For example: If i have 300 rows of text, every text row is 25px
height, I need that editor to be 7500px height and without scrollbar.

I know I can set editor to 100% height/width of a page and remove
"browser's scrollbar" but this time, I need that scrollbar and i need
to remove editor's scrollbar (i know how to settle that).

Is there some possibility to just deactivate scrolling?

thank you

Fabian Jakobs

unread,
Sep 26, 2011, 8:24:58 AM9/26/11
to ace-d...@googlegroups.com
You can't just disable scrolling since Ace only renders the visible
area of the code. With a dom inspector you will see that not rendered
lines are not in the DOM. One way you could solve this is by listening
on document change events and whenever the document length changes
manually update the height of the editor. The new height is:

editor.getSession().getDocument().getLength() *
editor.renderer.lineHeight + editor.renderer.scrollBar.getWidth()

Success,
Fabian

> --
> You received this message because you are subscribed to the Google Groups "Ajax.org Cloud9 Editor (Ace)" group.
> To post to this group, send email to ace-d...@googlegroups.com.
> To unsubscribe from this group, send email to ace-discuss...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/ace-discuss?hl=en.
>
>

Fabian Jakobs

unread,
Sep 26, 2011, 8:25:32 AM9/26/11
to ace-d...@googlegroups.com
Oh, and Ace might become slow if the editor is too large.
Reply all
Reply to author
Forward
0 new messages