Tagging in Radio Userland

This is my first post using my new tagging tool within the Radio Userland

blogging application, using Mozilla. It really has been quite an adventure in learning Javascript at a much deeper level ... for me. Radio has a WYSIWYG editor within it's web interface that can be used for writing posts, and there are two flavors (of course): one for IE and one for Mozilla.

What I wanted to do is add a new toolbar button in the WYSIWYG editor to allow me to enter a list of comma-delimited words, and have those words converted to the proper HTML for tags ... like the tags at the bottom of this post. What an adventure!

I was actually able to get the code written and working for IE first ... but not exactly what I wanted. I wanted to have the tags 'inserted' at the cursor position, but could only get 'append' working. So the tags would always end up at the end of the post. I then worked on the Mozilla version of this, and got everything working perfectly! There was already some sample code on how to do an 'insert' in Mozilla. Well ... if I could do it in Mozilla, then I had to find how to get the same functionality in IE. The problem is that the Mozilla code (of course) would not work with IE. In the end, it was three simple lines of Javascript!

win = document.getElementById("idEdit");
var sel = win.document.selection.createRange();
sel.pasteHTML(insertNode);

First, get the iFrame object that the user is typing in, then get the selection range, then simply paste the HTML/text into that selection. Simple! In fact much easier than the Mozilla code that I was looking at. Of course, finding those three lines was a real pain ... until I found this great article at WebReference. WebReference has always been an incredible site for reading and learning about HTML, CSS, and Javascript. They came though again with this article which finally gave me the details to resolve this issue. Now I'm on to adding toolbar buttons to ease the way that I insert images into a post. We'll see how quick that goes ...

[tags: radio userland tagging tags javascript IE Mozilla]