Website text and code editor solution
I have spent days trying to incorporate different editors within my site. None seem to be up to the job. I have delved in to their code a lot and one thing or another doesn't work.

Here's my requirements:

- Basic formatting such as size, bold, italic, strikeout, subscript and superscript
- Image upload via ajax, image resize and positioning
- Link handling
- Code tag or styled div with a drop down in the top right for selecting syntax highlighting. And on leaving the code tag/styled div the text updates via ajax to include line numbering.
- Paste but encode users code

The main issues with editors I have tried are:

Carriage Returns/Line breaks don't get the cursor out of the current element and if they do they re-create the current element or re-create the current element within itself.

They use a lot of unnecessary code, such as multiple nested divs. Heck looking at the source of some you get `<div><div><div><div><div><div>Hello World</div></div></div></div></div></div>`

They don't work in quirks which I need them to.

Here's an image of my idea, it's just a knock up:

![enter image description here][1]


  [1]: http://i.stack.imgur.com/04IXL.jpg


So my idea is to use a content Editable div and regex to track the code tags and implement my own functionality. But I need to get selection start and length of a content div in all browsers inc' quirks. How can I do that?

Also replacing text within the content div.

Any suggestions, ideas or help would be great thank you.


Website text and code editor solution
===

I have spent days trying to incorporate different editors within my site. None seem to be up to the job. I have delved in to their code a lot and one thing or another doesn't work.

Here's my requirements:

- Basic formatting such as size, bold, italic, strikeout, subscript and superscript
- Image upload via ajax, image resize and positioning
- Link handling
- Code tag or styled div with a drop down in the top right for selecting syntax highlighting. And on leaving the code tag/styled div the text updates via ajax to include line numbering.
- Paste but encode users code

The main issues with editors I have tried are:

Carriage Returns/Line breaks don't get the cursor out of the current element and if they do they re-create the current element or re-create the current element within itself.

They use a lot of unnecessary code, such as multiple nested divs. Heck looking at the source of some you get `<div><div><div><div><div><div>Hello World</div></div></div></div></div></div>`

They don't work in quirks which I need them to.

Here's an image of my idea, it's just a knock up:

![enter image description here][1]


  [1]: http://i.stack.imgur.com/04IXL.jpg


So my idea is to use a content Editable div and regex to track the code tags and implement my own functionality. But I need to get selection start and length of a content div in all browsers inc' quirks. How can I do that?

Also replacing text within the content div.

Any suggestions, ideas or help would be great thank you.

