footnote/image solution

[Johannes Wilm]

Hey guys,

so this canvas solution for footnotes is basically the same as the image solution I mentioned in a community meeting a little while ago. With some extra javascript I show the footnote contents below the editable text. There would have to be some more to update the contents of the footnotes. This is kind of a hack, but it may just work.

So basically, the possible solutions we have found so far are:

1. Use pure javascript for the editor (like Google Docs).

2. Draw the text editor on a canvas (like Teamlab).

3. Use contenteditable and intercept keystrokes A LOT (rough estimate: 2500 lines of Javascript to handle both Chromium and Firefox) -- see the movecursor script I sent over a few days ago.

4. Use contenteditable for most text, and canvas for elements we want the user be able to treat as a whole in the main editor (attachment). We still need some keystroke interception, because Firefox doesn't move the cursor correctly (it jumps a letter when you cross a canvas element and you cannot move the cursor beyond the last element). It doesn't look as beautiful for now, but I'm sure that can be fixed.

None of these solutions is perfect. Solution #4 would work for footnotes, but I'm not sure it would work for example for mathjax. 

--

Johannes Wilm

BookJS Developer

johann...@sourcefabric.org

www.sourcefabric.org

US: +1 520 399 8880

skype: johanneswilm