Add H1, H2, H3, H4... titles about firepad

[andrewbaker00]

So I've put a couple of hours into implementing this into firepad. Not terribly hard once you dive into the firepad code. I've got custom classes being added to pre tags just fine, but I've run into a problem with the way codemirror/firepad do their cursor calculations.

Basically, adding extra top and bottom padding to pre.firepad-header-1 throws the cursor calculations off and the cursor doesnt match up with the 'real' position of where codemirror is inserting text. This also pops up when you have remote user cursors in your editor.

From a bit of research I assume that this is because codemirror assumes all lines to have the same padding/line spacing. Any custom padding in a

 element does not get calculated in codemirror's cursor math.

Any ideas/pointers as to what direction to proceed?

[andrewbaker00]

(I understand codemirror/firepad are both code editors by design, not wysiwyg editors, but i really dont want to drop firepad collaboration by moving to a different wysiwyg editor)

[mikelehen]

Cool! Thanks for diving into the code. :-)

You're probably right about the reasoning, but as a quick sanity-check you might want to try calling .refresh() on the codemirror instance to see if that fixes it. I've run into issues a few times where cursor calculation gets off until I manually refresh codemirror. So it'd be good to rule that out.

[cben]

My experience ( cben/mathdown#16
cben/mathdown#16) was that any vertical
padding/margins, whether on spans or the line element, confuse CM.
I didn’t dig deep to understand why.

CM does respect line-height which can be abused to create vertical space.
The drawback is that if a long header gets wrapped, the vertical spacewould
apply between the wrapped lines; so you probably want to apply
line-heightto e.g. first char only.

2013/12/18 Michael Lehenbauer [email protected]

Cool! Thanks for diving into the code. :-)

You're probably right about the reasoning, but as a quick sanity-check you
might want to try calling .refresh() on the codemirror instance to see if
that fixes it. I've run into issues a few times where cursor calculation
gets off until I manually refresh codemirror. So it'd be good to rule that
out.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/17#issuecomment-30812506
.

[cben]

I see now that you were ahead of me - I just figured that CodeMirror does
support vertical padding (but not margin) on the

 surrounding a line.

Which is what you described.

But Firepad-drawn cursors of other users are sometimes out of sync.

OTOH Firepad-drawn selections by other users always change position/size

when text resizes.  Perhaps cursor drawing could changed to use same

mechanism as selections?
2014/1/1 Beni Cherniavsky-Paskin [email protected]

My experience ( cben/mathdown#16

cben/mathdown#16) was that any vertical

padding/margins, whether on spans or the line element, confuse CM.

I didn’t dig deep to understand why.
CM does respect line-height which can be abused to create vertical space.

The drawback is that if a long header gets wrapped, the vertical spacewould

apply between the wrapped lines; so you probably want to apply line-heightto e.g. first char only.
2013/12/18 Michael Lehenbauer [email protected]

Cool! Thanks for diving into the code. :-)
You're probably right about the reasoning, but as a quick sanity-check

you might want to try calling .refresh() on the codemirror instance to see

if that fixes it. I've run into issues a few times where cursor calculation

gets off until I manually refresh codemirror. So it'd be good to rule that

out.
—

Reply to this email directly or view it on GitHubhttps://github.com/firebase/firepad/issues/17#issuecomment-30812506

.