First of all I'm not a java hero but I tried to write my own text editor.
Everything works but only when the existing text need to be re-edited the butttons of my editor seem not to work anymore...
This is the main script :
Expand|Select|Wrap|Line Numbers
- <!--
- function storeCaret (txtarea) {
- if (txtarea.createTextRange) {
- selectedRange = document.selection.createRange().duplicate();
- selectedInputArea = txtarea;
- }
- }
- function WrapIE(txtarea, lft, rgt) {
- strSelection = document.selection.createRange().text;
- if (strSelection!='') {
- document.selection.createRange().text = lft + strSelection + rgt;
- var range = document.selection.createRange();
- range.collapse(true);
- range.moveStart('character', lft.length+strSelection.length+rgt.length);
- range.select();
- storeCaret(txtarea)
- }
- txtarea.focus();
- }
- function wrapMoz(txtarea, lft, rgt) {
- var selLength = txtarea.textLength;
- var selStart = txtarea.selectionStart;
- var selEnd = txtarea.selectionEnd;
- if (selEnd==1 || selEnd==2) selEnd=selLength;
- var s1 = (txtarea.value).substring(0,selStart);
- var s2 = (txtarea.value).substring(selStart, selEnd)
- var s3 = (txtarea.value).substring(selEnd, selLength);
- txtarea.value = s1 + lft + s2 + rgt + s3;
- txtarea.focus();
- var cPos=s1.length+(lft.length+s2.length+rgt.length);
- txtarea.setSelectionRange(cPos,cPos);
- }
- function wrapTag(txtarea, lft, rgt) {
- lft = unescape(lft);
- rgt = unescape(rgt);
- if (document.all) {
- WrapIE(txtarea, lft, rgt);
- }
- else if (document.getElementById) {
- wrapMoz(txtarea, lft, rgt);
- }
- }
- function wrapWithLink(txtarea) {
- var my_link = prompt('URL:','http://');
- if (my_link != null) {
- lft='<a href="' + my_link + '">';
- rgt='</a>';
- wrapTag(txtarea, lft, rgt);
- }
- return;
- }
- function insertIE (txtarea, text) {
- if (txtarea.createTextRange && selectedRange) {
- var caretPos = selectedRange;
- caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text+caretPos.text + ' ' : text+caretPos.text;
- } else {
- txtarea.value = txtarea.value + text;
- }
- txtarea.focus();
- return;
- }
- function insertMoz(txtarea , lft) {
- var rgt='';
- wrapTag(txtarea, lft, rgt);
- return;
- }
- function insertTag(txtarea , lft) {
- if (document.all) {
- insertIE(txtarea, lft);
- }
- else if (document.getElementById) {
- insertMoz(txtarea, lft);
- }
- }
- function insertImage(txtarea) {
- var my_link = prompt('IMG URL:','http://');
- if (my_link != null) {
- lft='<img src="' + my_link + '" />';
- insertTag(txtarea, lft);
- }
- return;
- }
- function mouseover(el) {
- el.className = 'raise';
- }
- function mouseout(el) {
- el.className = 'teksteditorImg';
- }
- function mousedown(el) {
- el.className = 'teksteditorImgPress';
- }
- function mouseup(el) {
- el.className = 'raise';
- }
- //-->
This is the editor that works :
[HTML]<table width="100%" border="0" cellpadding="0" cellspacing="0" class="ContentTable_Content_SubTable">
<tr>
<td><form action="nieuwsManagement_inhoud.php" method="post" enctype="multipart/form-data" name="form1">
<p>
Tekst :<br>
<img src="../images/bttns/teksteditor/bttn_bold_01.gif" alt="Vet" width="18" height="18" class="teksteditorImg" title="Highlight some text and click for bold" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<b>', '</b>');" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onmouseover="mouseover(this);" onmouseout="mouseout(this);">
<img src="../images/bttns/teksteditor/bttn_italic_01.gif" width="18" height="18" title="Highlight some text and click for italic" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<i>', '</i>')">
<img src="../images/bttns/teksteditor/bttn_underlined_01.gif" width="18" height="18" title="Highlight some text and click for underlined" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<u>', '</u>')">
<img src="../images/bttns/teksteditor/bttn_alignCenter_01.gif" width="18" height="18" title="Highlight some text and click to center" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<div align=%22center%22>', '</div>')">
<img src="../images/bttns/teksteditor/bttn_alignRight_01.gif" width="18" height="18" title="Highlight some text and click to right align" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<div align=%22right%22>', '</div>')">
<img src="../images/bttns/teksteditor/bttn_blockQuote_01.gif" width="18" height="18" title="Highlight some text and click for a blockquote" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<blockquote>', '</blockquote>')">
<img src="../images/bttns/teksteditor/bttn_list_01.gif" width="18" height="18" title="Highlight some text and click for a bulleted list" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapTag(this.parentNode.parentNode.elemen ts['txt'], '<li>', '</li>')">
<img src="../images/bttns/teksteditor/bttn_horizRule_01.gif" width="18" height="18" title="Insert a horizontal rule" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="insertTag(this.parentNode.parentNode.elem ents['txt'],'<hr />');">
<img src="../images/bttns/teksteditor/bttn_link_01.gif" width="18" height="18" title="Highlight some text and click to add a link" class="teksteditorImg" onmouseover="mouseover(this);" onmouseout="mouseout(this);" onmousedown="mousedown(this);" onmouseup="mouseup(this);" onclick="wrapWithLink(this.parentNode.parentNode.e lements['txt']);">
<textarea wrap="soft" name="txt" cols="85" rows="10" class="formfield" id="txt" onSelect="storeCaret(this);" onClick="storeCaret(this);" onKeyUp="storeCaret(this);"></textarea>
</p>
<p align="center">
<input name="new" type="hidden" value="active"><input name="m" type="hidden" value="<?php echo $m?>"><input name="s" type="hidden" value="<?php echo $s?>"><input name="imageField" type="image" src="../images/bttns/bttn_OK_70x20_01.jpg" width="70" height="20" border="0">
</p>
</form></td>
</tr>
</table>
[/HTML]
The Error part follows in the next window...