WYSIWYG Editing en-route

Over the past few days, I've been progressing towards WYSIWYG editing with TinyMCE.

Since my last post, I have:

• Added a raw-HTML editing button to TinyMCE (via its 'HTML' button)
• Completed more pre-integration demos: 2wayTinyMCE.html, dragdrop-tinyMCE.html and tiny_mce_test.html.
• TinyMCE now starts on doubleclick, and stops when the use doubleclicks anywhere else. To keep these events from stepping on each other's toes, the start-handler is built to kill any event handed to it.
• For a more robust solution, I could probably bind the close-event only when there is an editor open, and remove that binding when it is activated. That would end the need for an event-parameter.
  
• As of revision 535, the CloneMe! button duplicates the original element's contents.
• As of revision 536, this is no longer necessary for TinyMCE.
• In Revision 536, the editor made its own wrapper-DIV to start in, so modifications to the page structure are no longer necessary.
• Editable elements are now marked by setting their "editable" property (to anything but the empty string, "").
• In revision 537 of EditMe.js.html, I changed the demo to (mostly) work by giving ondblclick() an event instead of the editable panel's ID.
• Finally, I have some uncommitted changes that attempt to roll the editor into TwoWayWeb proper.
• Unfortunately, since the editor is inserting itself into a monitored DIV, the TinyMCE interface is visible (though mangled) on other browsers. To combat this, the editor will once again become a floating window.
  

From here, I shall:

• Change my "document.onload =" to "document.addEventListener('load', .... )"
• Create "make_popup_editor()" to start TinyMCE in a top-level (dragdroppable) DIV, with an initial position and size equal to the edited node.
• After the demos work, see if that change is enough to make TinyMCE work smoothly on 2way.

Along the way, FireBug 0.4 has been invaluable. With the advent of its debugger, I can step through javascript code with all local variables displayed, and easily inspect others with its console.

I have also learned a lot about the Javascript event model, particularly with the help of this Quirksmode.org page. It's a good read for anyone who wants to handle events, particularly if more than one element is listening for the same event.