//
// openWYSIWYG v1.01 Copyright (c) 2006 openWebWare.com
// This copyright notice MUST stay intact for use.
//
// An open source WYSIWYG editor for use in web based applications.
// For full source code and docs, visit http://www.openwebware.com/
//
// This library is free software; you can redistribute it and/or modify
// it under the terms of the GNU Lesser General Public License as published
// by the Free Software Foundation; either version 2.1 of the License, or
// (at your option) any later version.
//
// This library is distributed in the hope that it will be useful, but
// WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
// or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Lesser General Public
// License for more details.
//
// You should have received a copy of the GNU Lesser General Public License along
// with this library; if not, write to the Free Software Foundation, Inc., 59
// Temple Place, Suite 330, Boston, MA 02111-1307 USA
/* ---------------------------------------------------------------------- *\
Global Variables: Set global variables such as images directory,
WYSIWYG Height, Width, and CSS Directory.
\* ---------------------------------------------------------------------- */
// Images Directory
imagesDir = "javascript/lib/wysiwyg/icons/";
// CSS Directory
cssDir = "javascript/lib/wysiwyg/styles/";
// Popups Directory
popupsDir = "javascript/lib/wysiwyg/popups/";
// WYSIWYG Width and Height
// Include Style Sheet
document.write('\n');
/* ---------------------------------------------------------------------- *\
Toolbar Settings: Set the features and buttons available in the WYSIWYG
Toolbar.
\* ---------------------------------------------------------------------- */
// List of available font types
var Fonts = new Array();
Fonts[0]="굴림";
Fonts[1]="돋움";
Fonts[2]="바탕";
Fonts[3]="궁서";
Fonts[4] = "Arial";
Fonts[5] = "Sans Serif";
Fonts[6] = "Tahoma";
Fonts[7] = "Verdana";
Fonts[8] = "Courier New";
Fonts[9] = "Georgia";
Fonts[10] = "Times New Roman";
Fonts[11] = "Impact";
Fonts[12] = "Comic Sans MS";
// List of available block formats (not in use)
var BlockFormats = new Array();
BlockFormats[0] = "Address";
BlockFormats[1] = "Bulleted List";
BlockFormats[2] = "Definition";
BlockFormats[3] = "Definition Term";
BlockFormats[4] = "Directory List";
BlockFormats[5] = "Formatted";
BlockFormats[6] = "Heading 1";
BlockFormats[7] = "Heading 2";
BlockFormats[8] = "Heading 3";
BlockFormats[9] = "Heading 4";
BlockFormats[10] = "Heading 5";
BlockFormats[11] = "Heading 6";
BlockFormats[12] = "Menu List";
BlockFormats[13] = "Normal";
BlockFormats[14] = "Numbered List";
// List of available font sizes
var FontSizes = new Array();
FontSizes[0] = "1";
FontSizes[1] = "2";
FontSizes[2] = "3";
FontSizes[3] = "4";
FontSizes[4] = "5";
FontSizes[5] = "6";
FontSizes[6] = "7";
// Order of available commands in toolbar one
var buttonName = new Array();
buttonName[0] = "bold";
buttonName[1] = "italic";
buttonName[2] = "underline";
buttonName[3] = "strikethrough";
buttonName[4] = "seperator";
buttonName[5] = "subscript";
buttonName[6] = "superscript";
buttonName[7] = "seperator";
buttonName[8] = "justifyleft";
buttonName[9] = "justifycenter";
buttonName[10] = "justifyright";
buttonName[11] = "seperator";
buttonName[12] = "unorderedlist";
buttonName[13] = "orderedlist";
buttonName[14] = "outdent";
buttonName[15] = "indent";
// Order of available commands in toolbar two
var buttonName2 = new Array();
buttonName2[0] = "forecolor";
// buttonName2[1] = "backcolor";
buttonName2[2] = "seperator";
buttonName2[3] = "cut";
buttonName2[4] = "copy";
buttonName2[5] = "paste";
buttonName2[6] = "seperator";
buttonName2[7] = "undo";
buttonName2[8] = "redo";
buttonName2[9] = "seperator";
buttonName2[10] = "inserttable";
// buttonName2[11] = "insertimage";
buttonName2[11] = "createlink";
buttonName2[12] = "seperator";
buttonName2[13] = "viewSource";
buttonName2[14] = "seperator";
buttonName2[15] = "insertimage";
buttonName2[16] = "save";
var buttonName3 = new Array();
buttonName3[6] = "save";
buttonName3[7] = "seperator";
buttonName3[8] = "unorderedlist";
buttonName3[9] = "orderedlist";
buttonName3[10] = "seperator";
buttonName3[20] = "bold";
buttonName3[21] = "italic";
buttonName3[22] = "underline";
buttonName3[23] = "strikethrough";
buttonName3[25] = "seperator";
buttonName3[28] = "justifyleft";
buttonName3[29] = "justifycenter";
buttonName3[30] = "justifyright";
buttonName3[31] = "seperator";
buttonName3[34] = "outdent";
buttonName3[35] = "indent";
var buttonName4 = new Array();
buttonName4[8] = "justifyleft";
buttonName4[9] = "justifycenter";
buttonName4[10] = "justifyright";
buttonName4[12] = "unorderedlist";
buttonName4[13] = "orderedlist";
buttonName4[14] = "outdent";
buttonName4[15] = "indent";
// List of available actions and their respective ID and images
var ToolbarList = {
//Name buttonID buttonTitle buttonImage buttonImageRollover
"bold": ['Bold', '굵게(Ctrl + B)', imagesDir + 'bold.gif', imagesDir + 'bold_on.gif'],
"italic": ['Italic', '기울임꼴(Ctrl + I)', imagesDir + 'italics.gif', imagesDir + 'italics_on.gif'],
"underline": ['Underline', '밑줄(Ctrl + U)', imagesDir + 'underline.gif', imagesDir + 'underline_on.gif'],
"strikethrough": ['Strikethrough', '가로선(Ctrl + T)', imagesDir + 'strikethrough.gif', imagesDir + 'strikethrough_on.gif'],
"seperator": ['', '', imagesDir + 'seperator.gif', imagesDir + 'seperator.gif'],
"subscript": ['Subscript', '아래첨자(Ctrl + _)', imagesDir + 'subscript.gif', imagesDir + 'subscript_on.gif'],
"superscript": ['Superscript', '위첨자(Ctrl + ^)', imagesDir + 'superscript.gif', imagesDir + 'superscript_on.gif'],
"justifyleft": ['Justifyleft', '왼쪽정렬(Ctrl + 1)', imagesDir + 'justify_left.gif', imagesDir + 'justify_left_on.gif'],
"justifycenter": ['Justifycenter', '중앙정렬(Ctrl + 2)', imagesDir + 'justify_center.gif', imagesDir + 'justify_center_on.gif'],
"justifyright": ['Justifyright', '오른쪽정렬(Ctrl + 3)', imagesDir + 'justify_right.gif', imagesDir + 'justify_right_on.gif'],
"unorderedlist": ['InsertUnorderedList', '리스트(Ctrl + 9)',imagesDir + 'list_unordered.gif', imagesDir + 'list_unordered_on.gif'],
"orderedlist": ['InsertOrderedList', '번호 리스트(Ctrl + 0)', imagesDir + 'list_ordered.gif', imagesDir + 'list_ordered_on.gif'],
"outdent": ['Outdent', '내어쓰기(Tab)', imagesDir + 'indent_left.gif', imagesDir + 'indent_left_on.gif'],
"indent": ['Indent', '들여쓰기(Shift + Tab)', imagesDir + 'indent_right.gif', imagesDir + 'indent_right_on.gif'],
"cut": ['Cut', '잘라내기(Ctrl + x)', imagesDir + 'cut.gif', imagesDir + 'cut_on.gif'],
"copy": ['Copy', '복사(Ctrl + c)', imagesDir + 'copy.gif', imagesDir + 'copy_on.gif'],
"paste": ['Paste', '붙여넣기(Ctrl + v)', imagesDir + 'paste.gif', imagesDir + 'paste_on.gif'],
"forecolor": ['ForeColor', '글꼴색', imagesDir + 'forecolor.gif', imagesDir + 'forecolor_on.gif'],
"backcolor": ['BackColor', '배경색', imagesDir + 'backcolor.gif', imagesDir + 'backcolor_on.gif'],
"undo": ['Undo', '되돌리기', imagesDir + 'undo.gif', imagesDir + 'undo_on.gif'],
"redo": ['Redo', '다시하기', imagesDir + 'redo.gif', imagesDir + 'redo_on.gif'],
"inserttable": ['InsertTable', '표 집어넣기', imagesDir + 'insert_table.gif', imagesDir + 'insert_table_on.gif'],
"insertimage": ['InsertImage', '이미지 추가하기', imagesDir + 'insert_picture.gif', imagesDir + 'insert_picture_on.gif'],
"createlink": ['CreateLink', '링크 걸기', imagesDir + 'insert_hyperlink.gif', imagesDir + 'insert_hyperlink_on.gif'],
"viewSource": ['ViewSource', '소스보기', imagesDir + 'view_source.gif', imagesDir + 'view_source_on.gif'],
"viewText": ['ViewText', '에디터보기', imagesDir + 'view_text.gif', imagesDir + 'view_text_on.gif'],
// "help": ['Help', 'Help', imagesDir + 'help.gif', imagesDir + 'help_on.gif'],
"selectfont": ['SelectFont', '글꼴 선택', imagesDir + 'select_font.gif', imagesDir + 'select_font_on.gif'],
"selectsize": ['SelectSize', '크기 선택', imagesDir + 'select_size.gif', imagesDir + 'select_size_on.gif'],
"editBig": ['editBig', '큰 창에서 수정하기', imagesDir + 'bold.gif', imagesDir + 'bold_on.gif'],
"save": ['Save', '수정 끝냄(Ctrl + s)', imagesDir + 'save.gif', imagesDir + 'save_on.gif']
};
/* ---------------------------------------------------------------------- *\
Function : insertAdjacentHTML(), insertAdjacentText() and insertAdjacentElement()
Description : Emulates insertAdjacentHTML(), insertAdjacentText() and
insertAdjacentElement() three functions so they work with
Netscape 6/Mozilla
Notes : by Thor Larholm me@jscript.dk
\* ---------------------------------------------------------------------- */
if(typeof HTMLElement!="undefined" && !HTMLElement.prototype.insertAdjacentElement){
HTMLElement.prototype.insertAdjacentElement = function
(where,parsedNode)
{
switch (where){
case 'beforeBegin':
this.parentNode.insertBefore(parsedNode,this)
break;
case 'afterBegin':
this.insertBefore(parsedNode,this.firstChild);
break;
case 'beforeEnd':
this.appendChild(parsedNode);
break;
case 'afterEnd':
if (this.nextSibling)
this.parentNode.insertBefore(parsedNode,this.nextSibling);
else this.parentNode.appendChild(parsedNode);
break;
}
}
HTMLElement.prototype.insertAdjacentHTML = function
(where,htmlStr)
{
var r = this.ownerDocument.createRange();
r.setStartBefore(this);
var parsedHTML = r.createContextualFragment(htmlStr);
this.insertAdjacentElement(where,parsedHTML)
}
HTMLElement.prototype.insertAdjacentText = function
(where,txtStr)
{
var parsedText = document.createTextNode(txtStr)
this.insertAdjacentElement(where,parsedText)
}
};
// Create viewTextMode global variable and set to 0
// enabling all toolbar commands while in HTML mode
viewTextMode = 0;
/* ---------------------------------------------------------------------- *\
Function : generate_wysiwyg() ----- big window
Description : replace textarea with wysiwyg editor
Usage : generate_wysiwyg("textarea_id");
Arguments : textarea_id - ID of textarea to replace
\* ---------------------------------------------------------------------- */
function generate_wysiwyg(textareaID) {
document.getElementById(textareaID).style.display = 'none';
// Pass the textareaID to the "n" variable.
var n = textareaID;
document.getElementById(n).scrollTop=0;
// Toolbars width is 2 pixels wider than the wysiwygs
toolbarWidth = parseFloat(document.getElementById(n).style.width) + 2;
// Generate WYSIWYG toolbar one
var toolbar;
toolbar = '
';
// Create IDs for inserting Font Type and Size drop downs
toolbar += '
';
toolbar += '
';
// Output all command buttons that belong to toolbar one
for (var i = 0; i <= buttonName.length;) {
if (buttonName[i]) {
var buttonObj = ToolbarList[buttonName[i]];
var buttonID = buttonObj[0];
var buttonTitle = buttonObj[1];
var buttonImage = buttonObj[2];
var buttonImageRollover = buttonObj[3];
if (buttonName[i] == "seperator") {
toolbar += '
';
}
else {
toolbar += '
';
}
}
i++;
}
toolbar += '
';
// Generate WYSIWYG toolbar two
var toolbar2;
toolbar2 = '
';
// Output all command buttons that belong to toolbar two
for (var j = 0; j <= buttonName2.length;) {
if (buttonName2[j]) {
var buttonObj = ToolbarList[buttonName2[j]];
var buttonID = buttonObj[0];
var buttonTitle = buttonObj[1];
var buttonImage = buttonObj[2];
var buttonImageRollover = buttonObj[3];
if (buttonName2[j] == "seperator") {
toolbar2 += '
';
}
else if (buttonName2[j] == "viewSource"){
toolbar2 += '
';
toolbar2 += '';
toolbar2 += '';
toolbar2 += '
';
}
else {
toolbar2 += '
';
}
}
j++;
}
toolbar2 += '
';
// Create iframe which will be used for rich text editing
var iframe = '
\n'
+ '\n'
+ '
\n';
// Insert after the textArea both toolbar one and two
document.getElementById(n).insertAdjacentHTML("afterEnd", "
"+toolbar +toolbar2+iframe+ "
");
// Insert the Font Type and Size drop downs into the toolbar
outputFontSelect(n);
outputFontSizes(n);
// Hide the dynamic drop down lists for the Font Types and Sizes
hideFonts(n);
hideFontSizes(n);
// Hide the "Text Mode" button
document.getElementById("textMode" + n).style.display = 'none';
//header=" ";
// Give the iframe the global wysiwyg height and width
document.getElementById("wysiwyg" + n).style.height = document.getElementById(n).style.height ;
document.getElementById("wysiwyg" + n).style.width = document.getElementById(n).style.width ;
// Pass the textarea's existing text over to the content variable
var content = document.getElementById(n).value;
var doc = document.getElementById("wysiwyg" + n).contentWindow.document;
// Write the textarea's content into the iframe
doc.open();
doc.write(content);
var browserName = navigator.appName;
doc.close();
// doc.addEventListener('ondblclick',function ondblclick() {alert(1); },true);
// Make the iframe editable in both Mozilla and IE
doc.body.contentEditable = true;
if (!(browserName == "Microsoft Internet Explorer")) {
doc.designMode = "on";
}
//doc.body.innerHTML=content;
doc.body.style.fontSize="13px";
doc.body.style.fontFamily="verdana";
doc.body.style.letterSpacing="-1";
doc.body.style.color="#606060";
// Update the textarea with content in WYSIWYG when user submits form
if (browserName == "Microsoft Internet Explorer") {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].attachEvent('onsubmit', function() { updateTextArea(n); });
}
}
else {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].addEventListener('submit',function OnSumbmit() { updateTextArea(n); }, true);
}
}
if (!(browserName == "Microsoft Internet Explorer")) {
Event.observe(doc,'keyup',function(e) {
$('bigWindowSave1').innerHTML="editing...";
lastKeyUp=(new Date()).getTime();
eval("timer"+n+"=setTimeout(\"checkAutoSave('"+n+"')\",1000)");
});
} else {
Event.observe(doc.body,'keyup',function(e) {
$('bigWindowSave1').innerHTML="editing...";
lastKeyUp=(new Date()).getTime();
eval("timer"+n+"=setTimeout(\"checkAutoSave('"+n+"')\",1000)");
});
}
Event.observe(doc.body,'keypress',function(e) {
if(e.shiftKey && e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Outdent', false, null);
return false;
} else if(e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Indent', false, null);
return false;
}
if(e.ctrlKey && e.keyCode==83) {
saveHTML(n);
return false;
}
if(e.ctrlKey && e.keyCode==84) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Strikethrough',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==189) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Subscript',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==54) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Superscript',false,null);
}
if(e.ctrlKey && e.keyCode == 49) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyleft',false,null);
}
if(e.ctrlKey && e.keyCode == 50) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifycenter',false,null);
}
if(e.ctrlKey && e.keyCode == 51) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyright',false,null);
}
if(e.ctrlKey && e.keyCode == 57) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertUnorderedList',false,null);
}
if(e.ctrlKey && e.keyCode == 48) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertOrderedList',false,null);
}
});
Event.observe(doc.body,'keyup',function(e) {
if(e.keyCode==13) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Backspace',false,null);
insertHTML(" ",n);
return false;
}
},true);
Event.stopObserving('clientareabigWindow','dblclick',toggleTextField2);
Event.observe(doc.body,'dblclick',function(e) {
saveHTML('contentbigWindow');
})
//start autosaving
index=n;
$('editingcontentbigWindow').value=1;
/*
new PeriodicalExecuter(function(pe) {
//alert($('editingcontentbigWindow').value);
if($('editingcontentbigWindow').value==1) {
checkAutoSave(n);
}
}, 0.5);
*/
document.getElementById("wysiwyg" + n).contentWindow.focus();
};
/* ---------------------------------------------------------------------- *\
Function : generate_wysiwyg2()
Description : replace textarea with wysiwyg editor - simple mode
Usage : generate_wysiwyg2("textarea_id");
Arguments : textarea_id - ID of textarea to replace
\* ---------------------------------------------------------------------- */
function generate_wysiwyg2(textareaID) {
// Hide the textarea
document.getElementById(textareaID).style.display = 'none';
// Pass the textareaID to the "n" variable.
var n = textareaID;
// Toolbars width is 2 pixels wider than the wysiwygs
toolbarWidth = parseFloat(document.getElementById(n).style.width) + 2;
// Generate WYSIWYG toolbar one
var toolbar;
toolbar = '
';
// Create IDs for inserting Font Type and Size drop downs
//toolbar += '
';
//toolbar += '
';
toolbar += '
';
// Output all command buttons that belong to toolbar one
for (var i = 0; i <= buttonName3.length;) {
if (buttonName3[i]) {
var buttonObj = ToolbarList[buttonName3[i]];
var buttonID = buttonObj[0];
var buttonTitle = buttonObj[1];
var buttonImage = buttonObj[2];
var buttonImageRollover = buttonObj[3];
if (buttonName3[i] == "seperator") {
toolbar += '
';
}
else {
toolbar += '
';
}
}
i++;
}
toolbar += '
';
// Create iframe which will be used for rich text editing
var iframe = '
\n'
+ '\n'
+ '
\n';
// Insert after the textArea both toolbar one and two
document.getElementById(n).insertAdjacentHTML("afterEnd", "
"+toolbar +iframe+ "
");
// Insert the Font Type and Size drop downs into the toolbar
//outputFontSelect(n);
outputFontSizes(n);
// Hide the dynamic drop down lists for the Font Types and Sizes
//hideFonts(n);
hideFontSizes(n);
// Hide the "Text Mode" button
//document.getElementById("textMode" + n).style.display = 'none';
// Give the iframe the global wysiwyg height and width
document.getElementById("wysiwyg" + n).style.height = document.getElementById(n).style.height ;
document.getElementById("wysiwyg" + n).style.width = document.getElementById(n).style.width ;
// Pass the textarea's existing text over to the content variable
var content = document.getElementById(n).value;
var doc = document.getElementById("wysiwyg" + n).contentWindow.document;
// Write the textarea's content into the iframe
doc.open();
doc.write(content);
var browserName = navigator.appName;
doc.close();
// doc.addEventListener('ondblclick',function ondblclick() {alert(1); },true);
// Make the iframe editable in both Mozilla and IE
doc.body.contentEditable = true;
if (!(browserName == "Microsoft Internet Explorer")) {
doc.designMode = "on";
}
//doc.body.innerHTML=content;
doc.body.style.fontSize="13px";
doc.body.style.fontFamily="verdana";
doc.body.style.letterSpacing="-1";
doc.body.style.color="#606060";
// Update the textarea with content in WYSIWYG when user submits form
if (browserName == "Microsoft Internet Explorer") {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].attachEvent('onsubmit', function() { updateTextArea(n); });
}
}
else {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].addEventListener('submit',function OnSumbmit() { updateTextArea(n); }, true);
}
}
if (!(browserName == "Microsoft Internet Explorer")) {
Event.observe(doc,'keyup',function(e) {
$('wysiwyg'+n).style.border="1px dashed red";
lastKeyUp=(new Date()).getTime();
eval("timer"+n+"=setTimeout(\"checkAutoSave('"+n+"')\",1000)");
});
} else {
Event.observe(doc.body,'keyup',function(e) {
$('wysiwyg'+n).style.border="1px dashed red";
lastKeyUp=(new Date()).getTime();
eval("timer"+n+"=setTimeout(\"checkAutoSave('"+n+"')\",1000)");
});
}
Event.observe(doc.body,'keypress',function(e) {
if(e.shiftKey && e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Outdent', false, null);
return false;
} else if(e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Indent', false, null);
return false;
}
if(e.ctrlKey && e.keyCode==83) {
saveHTML(n);
return false;
}
if(e.ctrlKey && e.keyCode==84) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Strikethrough',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==189) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Subscript',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==54) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Superscript',false,null);
}
if(e.ctrlKey && e.keyCode == 49) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyleft',false,null);
}
if(e.ctrlKey && e.keyCode == 50) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifycenter',false,null);
}
if(e.ctrlKey && e.keyCode == 51) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyright',false,null);
}
if(e.ctrlKey && e.keyCode == 57) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertUnorderedList',false,null);
}
if(e.ctrlKey && e.keyCode == 48) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertOrderedList',false,null);
}
});
index=n.slice(7);
Event.observe(doc.body,'dblclick',function(e) {
if (!(browserName == "Microsoft Internet Explorer")) {
autosaveHTML(n);
refreshMemo(index);
document.getElementById('clientarea'+index).style.overflow="auto";
} else {
saveHTML(n);
}
});
Event.observe(doc.body,'keyup',function(e) {
if(e.keyCode==13) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Backspace',false,null);
insertHTML(" ",n);
return false;
}
},true);
Event.observe(doc.body,'blur',function(e) {
autosaveHTML(n);
});
//start autosaving
$('editing'+index).value=1;
document.getElementById("wysiwyg" + n).contentWindow.focus();
/* new PeriodicalExecuter(function(pe) {
if($('editing'+index).value==1) {
checkAutoSave(n);
}
}, 0.5);*/
};
/* ---------------------------------------------------------------------- *\
Function : generate_wysiwyg3()
Description : replace textarea with wysiwyg editor - simple mode
Usage : generate_wysiwyg2("textarea_id");
Arguments : textarea_id - ID of textarea to replace
\* ---------------------------------------------------------------------- */
function generate_wysiwyg3(textareaID) {
// Hide the textarea
document.getElementById(textareaID).style.display = 'none';
// Pass the textareaID to the "n" variable.
var n = textareaID;
// Toolbars width is 2 pixels wider than the wysiwygs
toolbarWidth = parseFloat(document.getElementById(n).style.width) + 2;
// Generate WYSIWYG toolbar one
var toolbar;
toolbar = '
';
// Create IDs for inserting Font Type and Size drop downs
//toolbar += '
';
//toolbar += '
';
// Output all command buttons that belong to toolbar one
for (var i = 0; i <= buttonName4.length;) {
if (buttonName4[i]) {
var buttonObj = ToolbarList[buttonName4[i]];
var buttonID = buttonObj[0];
var buttonTitle = buttonObj[1];
var buttonImage = buttonObj[2];
var buttonImageRollover = buttonObj[3];
if (buttonName4[i] == "seperator") {
toolbar += '
';
}
else {
toolbar += '
';
}
}
i++;
}
toolbar += '
';
// Create iframe which will be used for rich text editing
var iframe = '
\n'
+ '\n'
+ '
\n';
// Insert after the textArea both toolbar one and two
document.getElementById(n).insertAdjacentHTML("afterEnd", "
"+toolbar +iframe+ "
");
// Insert the Font Type and Size drop downs into the toolbar
//outputFontSelect(n);
//outputFontSizes(n);
// Hide the dynamic drop down lists for the Font Types and Sizes
// hideFonts(n);
//hideFontSizes(n);
// Hide the "Text Mode" button
//document.getElementById("textMode" + n).style.display = 'none';
// Give the iframe the global wysiwyg height and width
document.getElementById("wysiwyg" + n).style.height = document.getElementById(n).style.height ;
document.getElementById("wysiwyg" + n).style.width = document.getElementById(n).style.width ;
// Pass the textarea's existing text over to the content variable
var content = document.getElementById(n).value;
var doc = document.getElementById("wysiwyg" + n).contentWindow.document;
// Write the textarea's content into the iframe
doc.open();
doc.write(content);
var browserName = navigator.appName;
doc.close();
// doc.addEventListener('ondblclick',function ondblclick() {alert(1); },true);
// Make the iframe editable in both Mozilla and IE
doc.body.contentEditable = true;
if (!(browserName == "Microsoft Internet Explorer")) {
doc.designMode = "on";
}
//doc.body.innerHTML=content;
doc.body.style.fontSize="13px";
doc.body.style.fontFamily="verdana";
doc.body.style.letterSpacing="-1";
doc.body.style.color="#606060";
// Update the textarea with content in WYSIWYG when user submits form
if (browserName == "Microsoft Internet Explorer") {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].attachEvent('onsubmit', function() { updateTextArea(n); });
}
}
else {
for (var idx=0; idx < document.forms.length; idx++) {
document.forms[idx].addEventListener('submit',function OnSumbmit() { updateTextArea(n); }, true);
}
}
Event.observe(doc.body,'keypress',function(e) {
if(e.shiftKey && e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Outdent', false, null);
return false;
} else if(e.keyCode==9) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Indent', false, null);
return false;
}
if(e.ctrlKey && e.keyCode==83) {
saveHTML(n);
return false;
}
if(e.ctrlKey && e.keyCode==84) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Strikethrough',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==189) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Subscript',false,null);
}
if(e.shiftKey && e.ctrlKey && e.keyCode==54) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Superscript',false,null);
}
if(e.ctrlKey && e.keyCode == 49) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyleft',false,null);
}
if(e.ctrlKey && e.keyCode == 50) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifycenter',false,null);
}
if(e.ctrlKey && e.keyCode == 51) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('Justifyright',false,null);
}
if(e.ctrlKey && e.keyCode == 57) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertUnorderedList',false,null);
}
if(e.ctrlKey && e.keyCode == 48) {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('InsertOrderedList',false,null);
}
});
index=n.slice(7);
//start autosaving
// $('editing'+index).value=1;
/* new PeriodicalExecuter(function(pe) {
if($('editing'+index).value==1) {
checkAutoSave(n);
}
}, 0.5);*/
};
/* ---------------------------------------------------------------------- *\
Function : formatText()
Description : replace textarea with wysiwyg editor
Usage : formatText(id, n, selected);
Arguments : id - The execCommand (e.g. Bold)
n - The editor identifier that the command
affects (the textarea's ID)
selected - The selected value when applicable (e.g. Arial)
\* ---------------------------------------------------------------------- */
function formatText(id, n, selected) {
// When user clicks toolbar button make sure it always targets its respective WYSIWYG
document.getElementById("wysiwyg" + n).contentWindow.focus();
// When in Text Mode these execCommands are disabled
var formatIDs = new Array("FontSize","FontName","Bold","Italic","Underline","Subscript","Superscript","Strikethrough","Justifyleft","Justifyright","Justifycenter","InsertUnorderedList","InsertOrderedList","Indent","Outdent","ForeColor","BackColor","InsertImage","InsertTable","CreateLink");
// Check if button clicked is in disabled list
for (var i = 0; i <= formatIDs.length;) {
if (formatIDs[i] == id) {
var disabled_id = 1;
}
i++;
}
// Check if in Text Mode and disabled button was clicked
if (viewTextMode == 1 && disabled_id == 1) {
alert ("You are in HTML Mode. This feature has been disabled.");
}
else {
// FontSize
if (id == "FontSize") {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand("FontSize", false, selected);
}
// FontName
else if (id == "FontName") {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand("FontName", false, selected);
}
// ForeColor and BackColor
else if (id == 'ForeColor' || id == 'BackColor') {
var w = screen.availWidth;
var h = screen.availHeight;
var popW = 210, popH = 165;
var leftPos = (w-popW)/2, topPos = (h-popH)/2;
var currentColor = _dec_to_rgb(document.getElementById("wysiwyg" + n).contentWindow.document.queryCommandValue(id));
window.open(popupsDir + 'select_color.html?color=' + currentColor + '&command=' + id + '&wysiwyg=' + n,'popup','location=0,status=0,scrollbars=0,width=' + popW + ',height=' + popH + ',top=' + topPos + ',left=' + leftPos);
}
// InsertImage
else if (id == "InsertImage") {
//window.open(popupsDir + 'insert_image.html?wysiwyg=' + n,'popup','location=0,status=0,scrollbars=0,resizable=0,width=400,height=190');
showImageInsert(n);
}
// InsertTable
else if (id == "InsertTable") {
window.open(popupsDir + 'create_table.html?wysiwyg=' + n,'popup','location=0,status=0,scrollbars=0,resizable=0,width=400,height=360');
}
// CreateLink
else if (id == "CreateLink") {
window.open(popupsDir + 'insert_hyperlink.html?wysiwyg=' + n,'popup','location=0,status=0,scrollbars=0,resizable=0,width=300,height=110');
}
// ViewSource
else if (id == "ViewSource") {
viewSource(n);
}
// ViewText
else if (id == "ViewText") {
viewText(n);
}
else if (id == "Save") {
saveHTML(n);
} else if (id == "editBig") {
editBig(n);
}
// Help
else if (id == "Help") {
window.open(popupsDir + 'about.html','popup','location=0,status=0,scrollbars=0,resizable=0,width=400,height=330');
}
// Every other command
else {
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand(id, false, null);
}
}
};
/* ---------------------------------------------------------------------- *\
Function : insertHTML()
Description : insert HTML into WYSIWYG in rich text
Usage : insertHTML(hello, "textareaID")
Arguments : html - The HTML being inserted (e.g. hello)
n - The editor identifier that the HTML
will be inserted into (the textarea's ID)
\* ---------------------------------------------------------------------- */
function insertHTML(html, n) {
var browserName = navigator.appName;
if (browserName == "Microsoft Internet Explorer") {
document.getElementById('wysiwyg' + n).contentWindow.document.selection.createRange().pasteHTML(html);
}
else {
var div = document.getElementById('wysiwyg' + n).contentWindow.document.createElement("div");
div.innerHTML = html;
var node = insertNodeAtSelection(div, n);
}
}
/* ---------------------------------------------------------------------- *\
Function : insertNodeAtSelection()
Description : insert HTML into WYSIWYG in rich text (mozilla)
Usage : insertNodeAtSelection(insertNode, n)
Arguments : insertNode - The HTML being inserted (must be innerHTML
inserted within a div element)
n - The editor identifier that the HTML will be
inserted into (the textarea's ID)
\* ---------------------------------------------------------------------- */
function insertNodeAtSelection(insertNode, n) {
// get current selection
var sel = document.getElementById('wysiwyg' + n).contentWindow.getSelection();
// get the first range of the selection
// (there's almost always only one range)
var range = sel.getRangeAt(0);
// deselect everything
sel.removeAllRanges();
// remove content of current selection from document
range.deleteContents();
// get location of current selection
var container = range.startContainer;
var pos = range.startOffset;
// make a new range for the new selection
range=document.createRange();
if (container.nodeType==3 && insertNode.nodeType==3) {
// if we insert text in a textnode, do optimized insertion
container.insertData(pos, insertNode.nodeValue);
// put cursor after inserted text
range.setEnd(container, pos+insertNode.length);
range.setStart(container, pos+insertNode.length);
}
else {
var afterNode;
if (container.nodeType==3) {
// when inserting into a textnode
// we create 2 new textnodes
// and put the insertNode in between
var textNode = container;
container = textNode.parentNode;
var text = textNode.nodeValue;
// text before the split
var textBefore = text.substr(0,pos);
// text after the split
var textAfter = text.substr(pos);
var beforeNode = document.createTextNode(textBefore);
afterNode = document.createTextNode(textAfter);
// insert the 3 new nodes before the old one
container.insertBefore(afterNode, textNode);
container.insertBefore(insertNode, afterNode);
container.insertBefore(beforeNode, insertNode);
// remove the old node
container.removeChild(textNode);
}
else {
// else simply insert the node
afterNode = container.childNodes[pos];
container.insertBefore(insertNode, afterNode);
}
range.setEnd(afterNode, 0);
range.setStart(afterNode, 0);
}
sel.addRange(range);
};
/* ---------------------------------------------------------------------- *\
Function : _dec_to_rgb
Description : convert a decimal color value to rgb hexadecimal
Usage : var hex = _dec_to_rgb('65535'); // returns FFFF00
Arguments : value - dec value
\* ---------------------------------------------------------------------- */
function _dec_to_rgb(value) {
var hex_string = "";
for (var hexpair = 0; hexpair < 3; hexpair++) {
var myByte = value & 0xFF; // get low byte
value >>= 8; // drop low byte
var nybble2 = myByte & 0x0F; // get low nybble (4 bits)
var nybble1 = (myByte >> 4) & 0x0F; // get high nybble
hex_string += nybble1.toString(16); // convert nybble to hex
hex_string += nybble2.toString(16); // convert nybble to hex
}
return hex_string.toUpperCase();
};
/* ---------------------------------------------------------------------- *\
Function : outputFontSelect()
Description : creates the Font Select drop down and inserts it into
the toolbar
Usage : outputFontSelect(n)
Arguments : n - The editor identifier that the Font Select will update
when making font changes (the textarea's ID)
\* ---------------------------------------------------------------------- */
function outputFontSelect(n) {
var FontSelectObj = ToolbarList['selectfont'];
var FontSelect = FontSelectObj[2];
var FontSelectOn = FontSelectObj[3];
Fonts.sort();
var FontSelectDropDown = new Array;
FontSelectDropDown[n] = '
';
FontSelectDropDown[n] += '';
for (var i = 0; i <= Fonts.length;) {
if (Fonts[i]) {
FontSelectDropDown[n] += ' ';
}
i++;
}
FontSelectDropDown[n] += '
';
document.getElementById('FontSelect' + n).insertAdjacentHTML("afterBegin", FontSelectDropDown[n]);
};
/* ---------------------------------------------------------------------- *\
Function : outputFontSizes()
Description : creates the Font Sizes drop down and inserts it into
the toolbar
Usage : outputFontSelect(n)
Arguments : n - The editor identifier that the Font Sizes will update
when making font changes (the textarea's ID)
\* ---------------------------------------------------------------------- */
function outputFontSizes(n) {
var FontSizeObj = ToolbarList['selectsize'];
var FontSize = FontSizeObj[2];
var FontSizeOn = FontSizeObj[3];
FontSizes.sort();
var FontSizesDropDown = new Array;
FontSizesDropDown[n] = '
';
FontSizesDropDown[n] += '';
for (var i = 0; i <= FontSizes.length;) {
if (FontSizes[i]) {
FontSizesDropDown[n] += ' ';
}
i++;
}
FontSizesDropDown[n] += '
';
toolbar2 += '