Textarea HTML editor compatible with Opera

[Charles]

Hi folks,

I am desperatly looking for a WYSIWYG HTML editor for a textarea, using JavaScript and that'll work
with Opera.
I want this editor to use for a webmail program in PHP, and allow users to send HTML email.
All HTML editors I found out on the web work for most browsers except Opera.
Does any of you guys know of an Opera-friendly editor?
That would be great...
Thanks,

 

[Yann-Erwan Perio]

I am desperatly looking for a WYSIWYG HTML editor for a textarea, using JavaScript and that'll work
with Opera.

Generally, two techniques can be used to design such editors:
- "design mode" model,
- selection/transformation model, using text ranges.

AFAIK, only IE supports these two methods (although Mozilla may have
included some, I'm late in my browser testing), so unfortunately I don't
think you'll find the kind of editor you're looking for working on Opera.

I want this editor to use for a webmail program in PHP, and allow users to send HTML email.

Well, you could let them write custom-HTML and offer them a preview area
(Opera 7+ does support innerHTML and DOM methods) eg something like
(slightly tested only, but you see the point):


<form action="foo" onsubmit="return false">
<textarea name="editArea"></textarea>
<input type="button"
onclick="p(this.form.elements['editArea'].value);"
value="Preview">
</form>

<div id="previewArea"></div>

<script type="text/javascript">
function p(s){
// we only accept B, I, A tags
// a tag is defined as [T]content[/T]
// or [A href="foo"]content[/A]
var re = /\[([abi])(\s+href="[^"]+")?\](.*?)\[\/\1\]/ig;
s=s.replace(/</g,"&lt;").replace(/>/g,"&gt;");
s=s.replace(re, function(a, b, c, d) {
c = c || "";
if (d) d = d.replace(re, arguments.callee);
return "<" + b + c + ">" + d +"<\/" + b + ">";
});
document.getElementById("previewArea").innerHTML=s;
}
</script>


Good luck,
Yep.

 

[Charles]

Thanks ;-)