FirebaseExtended
Add H1, H2, H3, H4... titles
It'd be nice to have the capability of organizing a firepad document with various headers, rather than having to use font / font size / font color to make headers ourselves. Supporting titles like H1, H2, etc would be nice.
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?
(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)
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.
My experience ( https://github.com/cben/mathdown/issues/16 https://github.com/cben/mathdown/issues/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 .
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 ( https://github.com/cben/mathdown/issues/16 https://github.com/cben/mathdown/issues/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 .