Jump to content

iframe, designMode, event capturing


Recommended Posts

I'm playing around with creating a Javascript RTE control.  I've got a bit more done on my local machine than what's visible here, but before I continued further development I needed to do some experimenting with the iframe.

 

When the page loads, you should see a textarea on top and the iframe on the bottom.  When the following events occur, they should update the contents of the textarea:

 

mouseover, mouseout

mousedown, mouseup

click

keydown, keyup, keypress

select

 

mousemove is turned off since it generates so much output so quickly and I don't feel like putting in a throttling mechanism.

 

I'm still working out how to capture the change event.

 

I've tried to write this to be cross-platform, so I'm really concerned if the events register correctly and if you're able to type in the iframe box.  Simple test really, nothing fancy!

 

The beta test: http://www.rbredlau.com/tutorials/richtext/part_ii/index.html

 

Associated blog entry (aka shameless plug):  http://www.rbredlau.com/drupal/node/7

Link to comment
Share on other sites

The idea is intriguing, but I agree that there seems to be so much going on that it takes a long time for the triggers to catch up to the content... and I'm not a super fast typist, either. Imagine you hand it off to someone with 70+ wpm speed as opposed to my 50-60. They would get very frustrated about having to wait that long for things to catch up on any length of text, I'm afraid.

Link to comment
Share on other sites

To the best of my knowledge, string concatenation in Javascript isn't always the fastest operation.  So doing something like reading the content of a textarea, appending to it, and rewriting to the control for each of keydown, keyup, and keypress, is going to bog it down.  In reality, you want to put as little processing as possible in those event handlers and most of the time handling just one of them is sufficient.

 

So my big concern is if everyone was able to type into it, which based on your responses you were.

 

:)

Link to comment
Share on other sites

Seems to register all events on Ubuntu (Fesity) with FireFox 2.0.  As others have mentioned, it becomes  slower as the string gets longer, eventually becoming unusable. 

 

Using Konqueror the events register, but no text shows up in the iframe.  I don't know if you really care about Kongueror as their market share is negligible  but Safari is built on top of the same core code, so it might be worth having a look.

 

Best,

 

Patrick

Link to comment
Share on other sites

Alright, here is what I tested it on and the results:

 

Windows Vista Home Premium:

Internet Explorer 7.0.6000.16448: Seems to work fine.

Firefox 2.0.0.3: Hangs. Unusable because it, when I hit random keys fast, eventually made Firefox unresponsive.

Link to comment
Share on other sites

Using Konqueror the events register, but no text shows up in the iframe.  I don't know if you really care about Kongueror as their market share is negligible  but Safari is built on top of the same core code, so it might be worth having a look.

 

Well I just spent the last two hours testing and doing some research; it appears that Safari / Konqueror do not support the designMode property just yet.  It is expected that Safari 2 will have support for this.

 

I'm sort of glad as I was worried about how I could go about testing a graceful failure of the control.

 

Related links:

http://blog.solmetra.com/2007/02/22/safari-is-not-konqueror/

from what I’ve googled there’s no so called “designMode=on” functionality in Konqueror

 

http://programmabilities.com/xml/?id=17

//enable designMode if the browser is not safari or konqueror.

 

http://operawiki.info/TextAreaEditor

Safari 2 supposedly will have rich text editing support, which means Konqueror most likely wil get it too.
Link to comment
Share on other sites

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.