A lightweight forum engine written in PHP. Repository is now obsolete and read-only.
http://www.pioder.pl/uforum.html
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
703 lines
32 KiB
703 lines
32 KiB
/**
|
|
* @package uForum
|
|
* @file images/wyzz.js
|
|
* @version $Id$
|
|
* @copyright 2009(c) The Mouse Whisperer
|
|
* @author The Mouse Whisperer
|
|
* @modified PioDer <[email protected]>
|
|
* @link http://pioder.gim2przemysl.int.pl/
|
|
* @license GNU GPL v3
|
|
**/
|
|
|
|
// Editor Width and Height
|
|
wyzzW = 600;
|
|
wyzzH = 200;
|
|
|
|
image_path = skin_path + 'images/';// Number of toolbars - must be either 1 or 2
|
|
// If set to 1, the first tooolbar (defined in array buttonName below) will be ignored
|
|
toolbarCount = 2;
|
|
|
|
// Edit region stylesheet
|
|
editstyle = skin_path + 'wyzz_editarea.css';
|
|
|
|
// Do we want to try to clean the code to emulate xhtml? 1=Yes, 0=No
|
|
xhtml_out = 0;
|
|
|
|
// Style Sheet
|
|
document.write('<link rel="stylesheet" type="text/css" href="'+ skin_path+'wyzz_style.css">\n');
|
|
|
|
// TOOLBARS ARRAYS
|
|
// Order of available commands in toolbar
|
|
// Remove from this any buttons not required in your application
|
|
var buttonName = new Array("font","headers","separator","bold","italic","underline","strikethrough","separator","cut","copy","paste","separator","subscript","superscript","separator","justifyleft","justifycenter","justifyright","justifyfull","indent","outdent","separator","insertunorderedlist","insertorderedlist","separator","link","insertimage","separator","undo","redo");
|
|
|
|
// Order of available commands in toolbar2
|
|
// Remove from this any buttons not required in your application
|
|
var buttonName2 = new Array("specialchar","separator","forecolor","backcolor","separator","inserthorizontalrule","separator","removeformat","separator","upsize","downsize","separator","htmlmode","separator","help");
|
|
|
|
var myFonts = new Array("Andale Mono","Georgia","Verdana","Arial","Arial Black","impact","Times New Roman","Courier New","Comic Sans MS","Helvetica","Trebuchet MS","Tahoma");
|
|
|
|
var specialChars = new Array("©","®","™","à","á","ç","è","é","ë","ì","í","ñ","ò","ó","ö","ù","ú","ü","£","¢","¥","€","“","”","«","»","•","—","…","¶","†","‡","×","÷","°","±","¼","½","¾","¬","<",">","Δ","λ","Φ","Ψ","Σ","∫","α","β","Ω","μ","π","θ","↔","∞","√","≈","≠","≡","≤","≥","¡","¿","♠","♣","♥","♦");
|
|
|
|
// DON'T MODIFY BEYOND THIS LINE unless you know what you are doing //////////////
|
|
/********************************************************************************/
|
|
|
|
version = "0.65"; // Please leave this
|
|
|
|
var Headers = new Array("P","PRE","H1","H2","H3","H4","H5","H6");
|
|
|
|
// Mode wysiwyg = 1 or sourcecode = 0
|
|
mode = 1;
|
|
|
|
// Get browser
|
|
browserName = navigator.appName;
|
|
|
|
// New code for additional browser support
|
|
if (navigator.userAgent.indexOf('Safari') !=-1)
|
|
{
|
|
browserName = "Safari";
|
|
}
|
|
if (navigator.userAgent.indexOf('Chrome') !=-1)
|
|
{
|
|
browserName = "Chrome";
|
|
}
|
|
if (navigator.userAgent.indexOf('Firefox') !=-1)
|
|
{
|
|
browserName = "Firefox";
|
|
}
|
|
|
|
|
|
nlBefore = new Array("div","p","li","h1","h2","h3","h4","h5","h6","hr","ul","ol");
|
|
|
|
function h2x(node,inPre) { // we will pass the node containing the Wyzz-generated html
|
|
var xout = '';
|
|
var i;
|
|
var j;
|
|
// for each child of the node
|
|
for(i=0;i<node.childNodes.length;i++) {
|
|
if(node.childNodes[i].parentNode && String(node.tagName).toLowerCase() != String(node.childNodes[i].parentNode.tagName).toLowerCase()) continue;
|
|
// alert('Nodes: '+ node.childNodes.length);
|
|
switch(node.childNodes[i].nodeType) {
|
|
case 1: { // for element nodes
|
|
// get tag name
|
|
var tagname = String(node.childNodes[i].tagName).toLowerCase();
|
|
if(tagname == '') break;
|
|
if((indexOf(nlBefore,tagname)!=-1)&&(!inPre)) { // this tag needs line break before it
|
|
xout += '\n';
|
|
}
|
|
xout += '<' + tagname;
|
|
var atts = node.childNodes[i].attributes;
|
|
var attvalue;
|
|
for(j=0;j<atts.length;j++) { // for each attribute
|
|
var attname = atts[j].nodeName.toLowerCase();
|
|
if(!atts[j].specified) continue;
|
|
var validatt = true;
|
|
switch(attname) {
|
|
case "style": attvalue = node.childNodes[i].style.cssText; break;
|
|
case "class": attvalue = node.childNodes[i].className; break;
|
|
case "name": attvalue = node.childNodes[i].name; break;
|
|
default:
|
|
try {
|
|
attvalue = node.childNodes[i].getAttribute(attname,2);
|
|
} catch(e) {
|
|
validatt = false;
|
|
}
|
|
}
|
|
if(validatt) {
|
|
if(!(tagname=='li' && attname == 'value')) {
|
|
xout += ' '+attname + '="' + fixatt(attvalue) + '"';
|
|
}
|
|
}
|
|
}
|
|
if(tagname == 'img' && attname == 'alt') {
|
|
xout += ' alt=""';
|
|
}
|
|
if(node.childNodes[i].canHaveChildren||node.childNodes[i].hasChildNodes()) {
|
|
xout += '>';
|
|
xout += h2x(node.childNodes[i],tagname=='pre'?true:false);
|
|
xout += '</' + tagname + '>';
|
|
} else {
|
|
if(tagname == 'style'||tagname == 'title'||tagname=='script'||tagname=='textarea'||tagname=='a') {
|
|
xout += '>';
|
|
var innertext;
|
|
if(tagname=='script') {
|
|
innertext = node.childNodes[i].text;
|
|
} else {
|
|
innertext = node.childNodes[i].innerHTML;
|
|
}
|
|
if(tagname=='style') {
|
|
innertext = String(innertext).replace(/[\n]+/g,'\n');
|
|
}
|
|
xout += innertext + '</' + tagname + '>';
|
|
} else {
|
|
xout += '/>';
|
|
}
|
|
}
|
|
break;
|
|
}
|
|
// else if(node.childNodes[i].nodeType == 2) { // for attribute nodes
|
|
|
|
// }
|
|
case 3: { // for text nodes
|
|
if(!inPre) { // don't change inside a <pre> tag
|
|
if(node.childNodes[i] != '\n') {
|
|
xout += fixents(fixtext(node.childNodes[i].nodeValue));
|
|
}
|
|
} else {
|
|
xout += node.childNodes[i].nodeValue;
|
|
break;
|
|
}
|
|
}
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
return xout;
|
|
}
|
|
|
|
function fixents(text) {
|
|
var i;
|
|
var ents = {8364 : "euro",402 : "fnof",8240 : "permil",352 : "Scaron",338 : "OElig",381 : "#381",8482 : "trade",353 : "scaron",339 : "oelig",382 : "#382",376 : "Yuml",162 : "cent",163 : "pound",164 : "curren",165 : "yen",166 : "brvbar",167 : "sect",168 : "uml",169 : "copy",170 : "ordf",171 : "laquo",172 : "not",173 : "shy",174 : "reg",175 : "macr",176 : "deg",177 : "plusmn",178 : "sup2",179 : "sup3",180 : "acute",181 : "micro",182 : "para",183 : "middot",184 : "cedil",185 : "sup1",186 : "ordm",187 : "raquo",188 : "frac14",189 : "frac12",190 : "frac34",191 : "iquest",192 : "Agrave",193 : "Aacute",194 : "Acirc",195 : "Atilde",196 : "Auml",197 : "Aring",198 : "AElig",199 : "Ccedil",200 : "Egrave",201 : "Eacute",202 : "Ecirc",203 : "Euml",204 : "Igrave",205 : "Iacute",206 : "Icirc",207 : "Iuml",208 : "ETH",209 : "Ntilde",210 : "Ograve",211 : "Oacute",212 : "Ocirc",213 : "Otilde",214 : "Ouml",215 : "times",216 : "Oslash",217 : "Ugrave",218 : "Uacute",219 : "Ucirc",220 : "Uuml",221 : "Yacute",222 : "THORN",223 : "szlig",224 : "agrave",225 : "aacute",226 : "acirc",227 : "atilde",228 : "auml",229 : "aring",230 : "aelig",231 : "ccedil",232 : "egrave",233 : "eacute",234 : "ecirc",235 : "euml",236 : "igrave",237 : "iacute",238 : "icirc",239 : "iuml",240 : "eth",241 : "ntilde",242 : "ograve",243 : "oacute",244 : "ocirc",245 : "otilde",246 : "ouml",247 : "divide",248 : "oslash",249 : "ugrave",250 : "uacute",251 : "ucirc",252 : "uuml",253 : "yacute",254 : "thorn",255 : "yuml",913 : "Alpha",914 : "Beta",915 : "Gamma",916 : "Delta",917 : "Epsilon",918 : "Zeta",919 : "Eta",920 : "Theta",921 : "Iota",922 : "Kappa",923 : "Lambda",924 : "Mu",925 : "Nu",926 : "Xi",927 : "Omicron",928 : "Pi",929 : "Rho", 931 : "Sigma",932 : "Tau",933 : "Upsilon",934 : "Phi",935 : "Chi",936 : "Psi",937 : "Omega",8756 : "there4",8869 : "perp",945 : "alpha",946 : "beta",947 : "gamma",948 : "delta",949 : "epsilon",950 : "zeta",951 : "eta",952 : "theta",953 : "iota",954 : "kappa",955 : "lambda",956 : "mu",957 : "nu",968 : "xi",969 : "omicron",960 : "pi",961 : "rho",962 : "sigmaf",963 : "sigma",964 : "tau",965 : "upsilon",966 : "phi",967 : "chi",968 : "psi",969 : "omega",8254 : "oline",8804 : "le",8260 : "frasl",8734 : "infin",8747 : "int",9827 : "clubs",9830 : "diams",9829 : "hearts",9824 : "spades",8596 : "harr",8592 : "larr",8594 : "rarr",8593 : "uarr",8595 : "darr",8220 : "ldquo",8221 : "rdquo",8222 : "bdquo",8805 : "ge",8733 : "prop",8706 : "part",8226 : "bull",8800 : "ne",8801 : "equiv",8776 : "asymp",8230 : "hellip",8212 : "mdash",8745 : "cap",8746 : "cup",8835 : "sup",8839 : "supe",8834 : "sub",8838 : "sube",8712 : "isin",8715 : "ni",8736 : "ang",8711 : "nabla",8719 : "prod",8730 : "radic",8743 : "and",8744 : "or",8660 : "hArr",8658 : "rArr",9674 : "loz",8721 : "sum",8704 : "forall",8707 : "exist",8216 : "lsquo",8217 : "rsquo",161 : "iexcl",977 : "thetasym",978 : "upsih",982 : "piv",8242 : "prime",8243 : "Prime",8472 : "weierp",8465 : "image",8476 : "real",8501 : "alefsym",8629 : "crarr",8656 : "lArr",8657 : "uArr",8659 : "dArr",8709 : "empty",8713 : "notin",8727 : "lowast",8764 : "sim",8773 : "cong",8836 : "nsub",8853 : "oplus",8855 : "otimes",8901 : "sdot",8968 : "lceil",8969 : "rceil",8970 : "lfloor",8971 : "rfloor",9001 : "lang",9002 : "rang",710 : "circ",732 : "tilde",8194 : "ensp",8195 : "emsp",8201 : "thinsp",8204 : "zwnj",8205 : "zwj",8206 : "lrm",8207 : "rlm",8211 : "ndash",8218 : "sbquo",8224 : "dagger",8225 : "Dagger",8249 : "lsaquo",8250 : "rsaquo"};
|
|
|
|
var new_text = '';
|
|
|
|
var temp = new RegExp();
|
|
temp.compile("[a]|[^a]", "g");
|
|
|
|
var parts = text.match(temp);
|
|
|
|
if (!parts) return text;
|
|
for (i=0; i<parts.length; i++) {
|
|
var c_code = parseInt(parts[i].charCodeAt());
|
|
if (ents[c_code]) {
|
|
new_text += "&"+ents[c_code]+";";
|
|
} else new_text += parts[i];
|
|
}
|
|
return new_text;
|
|
}
|
|
|
|
function fixtext(text) {
|
|
var temptext = String(text).replace(/\</g,"#h2x_lt").replace(/\>/g,"#h2x_gt");
|
|
temptext = temptext.replace(/\n{2,}/g,"\n").replace(/\&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/\u00A0/g," ");
|
|
return temptext.replace(/#h2x_lt/g,"&alt;").replace(/#h2x_gt/g,">");
|
|
}
|
|
|
|
function fixatt(text) {
|
|
var temptext = String(text).replace(/\</g,"#h2x_lt").replace(/\>/g,"#h2x_gt");
|
|
temptext = temptext.replace(/\&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/\"/g,""");
|
|
return temptext.replace(/#h2x_lt/g,"&alt;").replace(/#h2x_gt/g,">");
|
|
}
|
|
|
|
function indexOf(thisarray, value)
|
|
{
|
|
var i;
|
|
for (i=0; i < thisarray.length; i++) {
|
|
if (thisarray[i] == value) {
|
|
return i;
|
|
}
|
|
}
|
|
return -1;
|
|
}
|
|
|
|
// Color picker - here we make an array of all websafe colors
|
|
// If you want to limit the colors available to users (e.g. to fit in with
|
|
// a site design) then use a restricted array of colors
|
|
// e.g. var buttonColors = new Array("336699","66abff", .... etc
|
|
var buttonColors = new Array(216);
|
|
|
|
// Colors - replace this function with your own if you have special requirements for colors
|
|
function getColorArray() {
|
|
// Color code table
|
|
c = new Array('00', '33', '66', '99', 'cc', 'ff');
|
|
var count = 0;
|
|
// Iterate red
|
|
for (r = 0; r < 6; r++)
|
|
{
|
|
// Iterate green
|
|
for (g = 0; g < 6; g++)
|
|
{
|
|
// Iterate blue
|
|
for (b = 0; b < 6; b++)
|
|
{
|
|
// Get RGB color
|
|
buttonColors[count] = c[r] + c[g] + c[b];
|
|
count++;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
getColorArray();
|
|
|
|
/* Emulates insertAdjacentHTML(), insertAdjacentText() and insertAdjacentElement() three functions
|
|
so they work with Netscape 6/Mozilla - By Thor Larholm [email protected] */
|
|
if(typeof HTMLElement!='undefined'){
|
|
if(typeof HTMLElement.insertAdjacentHTML=='undefined'){
|
|
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;
|
|
}
|
|
};
|
|
}
|
|
if(typeof HTMLElement.insertAdjacentHTML=='undefined'){
|
|
HTMLElement.prototype.insertAdjacentHTML=function(where,htmlStr){
|
|
var r=this.ownerDocument.createRange();
|
|
r.setStartBefore(this);
|
|
var parsedHTML=r.createContextualFragment(htmlStr);
|
|
this.insertAdjacentElement(where,parsedHTML);
|
|
};
|
|
}
|
|
if(typeof HTMLElement.insertAdjacentText=='undefined'){
|
|
HTMLElement.prototype.insertAdjacentText=function(where,txtStr){
|
|
var parsedText=document.createTextNode(txtStr);
|
|
this.insertAdjacentElement(where,parsedText);
|
|
};
|
|
}
|
|
}
|
|
|
|
function closeColorPicker(thisid) {
|
|
document.getElementById(thisid).style.display = "none";
|
|
}
|
|
|
|
// the hyperlink dialog
|
|
function insertLink(n) {
|
|
var newWindow = 'blank';
|
|
var linkurl = '';
|
|
var linktitle = '';
|
|
var targetText = grabSelectedText(n);
|
|
var linkurl = prompt(editor_lng2);
|
|
var linktitle = prompt(editor_lng3);
|
|
if(newWindow==''||linkurl==''||linktitle=='') {
|
|
alert();
|
|
insertLink(n);
|
|
} else {
|
|
var hyperLink = '<a href="' + linkurl + '" target="_' + newWindow + '" title="' + linktitle + '" class="fsmall">' + linktitle + '</a>';
|
|
insertHTML(hyperLink, n);
|
|
}
|
|
}
|
|
|
|
function insertImage(n) {
|
|
alert(n);
|
|
var imgurl = prompt(editor_lng4);
|
|
var imgtitle = 'image';
|
|
var theImage = '<img src="' + imgurl + '" title="' + imgtitle + '" alt="' + imgtitle + '" />';
|
|
insertHTML(theImage, n); }
|
|
|
|
function insertSmile(imgurl, imgtitle) {
|
|
if(mode==0) {
|
|
alert(editor_lng1);
|
|
} else {
|
|
var n = 'textedit';
|
|
var theImage = '<img src="' + imgurl + '" title="' + imgtitle + '" alt="' + imgtitle + '" >';
|
|
insertHTML(theImage, n); } }
|
|
|
|
function make_wyzz(textareaID) {
|
|
|
|
// Hide the textarea
|
|
document.getElementById(textareaID).style.display = 'none';
|
|
|
|
// get textareaID
|
|
var n = textareaID;
|
|
|
|
// Toolbars width is 2 pixels wider than the editor
|
|
toolbarWidth = parseFloat(wyzzW) + 2;
|
|
|
|
var toolbar = '';
|
|
|
|
// We only generate toolbar 1 if toolbarCount is set to 2
|
|
if(toolbarCount == 2) {
|
|
// Generate WYSIWYG toolbar
|
|
toolbar = '<table cellpadding="0" cellspacing="0" border="0" class="toolbar" style="width:' + toolbarWidth + 'px;"><tr>';
|
|
|
|
// Output buttons for toolbar
|
|
var colNumbers = 0;
|
|
for (btn in buttonName) {
|
|
colNumbers ++;
|
|
if(buttonName[btn] == "separator") {
|
|
toolbar += '<td class="separator"> </td>';
|
|
} else {
|
|
toolbar += '<td style="width: 22px;"><img src="' + image_path + 'wyzz/' +buttonName[btn]+ '.gif" border=0 unselectable="on" title="' +buttonNameLng[btn]+ '" id="' +buttonName[btn]+ '" class="button" onClick="formatText(this.id,\'' + n + '\');" onmouseover="if(className==\'button\'){className=\'buttonOver\'};" onmouseout="if(className==\'buttonOver\'){className=\'button\'};" unselectable="on" width="20" height="20"></td>';
|
|
}
|
|
}
|
|
toolbar += '<td> </td></tr></table>';
|
|
}
|
|
|
|
|
|
// Generate WYSIWYG toolbar2
|
|
var toolbar2 = '<table cellpadding="0" cellspacing="0" border="0" class="toolbar" style="width:' + toolbarWidth + 'px;"><tr>';
|
|
|
|
// Output buttons for toolbar2
|
|
var colNumbers = 0;
|
|
for (btn in buttonName2) {
|
|
colNumbers ++;
|
|
if(buttonName2[btn] == "separator") {
|
|
toolbar2 += '<td class="separator"> </td>';
|
|
} else {
|
|
toolbar2 += '<td style="width: 22px;"><img src="' + image_path + 'wyzz/' +buttonName2[btn]+ '.gif" border=0 unselectable="on" title="' +buttonName2Lng[btn]+ '" id="' +buttonName2[btn]+ '" class="button" onClick="formatText(this.id,\'' + n + '\');" onmouseover="if(className==\'button\'){className=\'buttonOver\'};" onmouseout="if(className==\'buttonOver\'){className=\'button\'};" unselectable="on" width="20" height="20"></td>';
|
|
}
|
|
}
|
|
toolbar2 += '<td> </td></tr>';
|
|
|
|
// the foreground color picker
|
|
var swatchcount = 0;
|
|
toolbar2 += '<tr><td colspan=' + colNumbers + '>';
|
|
toolbar2 += '<div id="colorpicker' + n + '" class="colorpicker" style="display:none">';
|
|
for (clr in buttonColors) {
|
|
toolbar2 += '<a href="#" title="#' + buttonColors[clr] + '" alt="#' + buttonColors[clr] + '" "class="colorButton" onClick="formatTextColor(\'' + buttonColors[clr] + '\',\'' + n + '\');" style="background: #' + buttonColors[clr] + '"> </a>';
|
|
swatchcount++;
|
|
if(swatchcount%18==0) {
|
|
toolbar2 += '<br>';
|
|
}
|
|
}
|
|
toolbar2 += '<img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'colorpicker' + n + '\')"></div>';
|
|
// the background color picker
|
|
toolbar2 += '<div id="colorbackpicker' + n + '" class="colorpicker" style="display:none">';
|
|
for (clr in buttonColors) {
|
|
toolbar2 += '<a href="#" title="#' + buttonColors[clr] + '" alt="#' + buttonColors[clr] + '" class="colorButton" onClick="formatBackColor(\'' + buttonColors[clr] + '\',\'' + n + '\');" style="background: #' + buttonColors[clr] + '"> </a>';
|
|
swatchcount++;
|
|
if(swatchcount%18==0) {
|
|
toolbar2 += '<br>';
|
|
}
|
|
}
|
|
toolbar2 += '<img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'colorbackpicker' + n + '\')"></div>';
|
|
// the font picker
|
|
toolbar2 += '<div id="fontpicker' + n + '" class="fontpicker" style="display:none">';
|
|
for (fnt in myFonts) {
|
|
toolbar2 += '<a href="#" class="fontSelect" onClick="formatFontName(\'' + myFonts[fnt] + '\',\'' + n + '\');" style="font-size:14px;padding: 0px 0px 0px 30px;font-family:' + myFonts[fnt] +'">' + myFonts[fnt] +'</a>';
|
|
toolbar2 += '<br>';
|
|
}
|
|
toolbar2 += '<img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'fontpicker' + n + '\')"></div>';
|
|
// the special character picker
|
|
toolbar2 += '<div id="specialpicker' + n + '" class="specialpicker" style="display:none"><table><tr>';
|
|
var charcount = 0;
|
|
for (chr in specialChars) {
|
|
toolbar2 += '<td><a href="#" onClick="formatSpecialChar(\'' + specialChars[chr] + '\',\'' + n + '\');">' + specialChars[chr] + '</a> </td>';
|
|
charcount++;
|
|
if(charcount%10==0) {
|
|
toolbar2 += '</tr><tr>';
|
|
}
|
|
}
|
|
toolbar2 += '</tr></table><br><img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'specialpicker' + n + '\')"></div>';
|
|
// the header picker
|
|
toolbar2 += '<div id="headerpicker' + n + '" class="headerpicker" style="display:none">';
|
|
for (hdr in Headers) {
|
|
toolbar2 += '<a href="#" class="headerSelect" onClick="formatHeader(\'' + Headers[hdr] + '\',\'' + n + '\');" style="font-size:14px;padding: 0px 0px 0px 30px;font-family:arial">' + Headers[hdr] +'</a>';
|
|
toolbar2 += '<br>';
|
|
}
|
|
toolbar2 += '<img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'headerpicker' + n + '\')"></div>';
|
|
// Add extra popups here
|
|
// The help/about box
|
|
// The copyright and link must remain unaltered
|
|
toolbar2 += '<div id="helpbox' + n + '" class="helpbox" style="display:none">';
|
|
toolbar2 += '<div class="help"><h4>Wyzz v' + version + '</h4><br>Running on ' + browserName + '<br>© 2009 <a href="http://www.wyzz.info" target=_blank>www.wyzz.info</a><br><br></div>';
|
|
toolbar2 += '<img class="closebutton" src="' + image_path + 'wyzz/close.gif" border=0 onclick="closeColorPicker(\'helpbox' + n + '\')"></div></td></tr></table>';
|
|
|
|
// Create iframe for editor
|
|
var iframe = '<table cellpadding="0" cellspacing="0" border="0" style="width:' + wyzzW + 'px; height:' + wyzzH + 'px;border: 1px inset #dddddd;"><tr><td valign="top">\n'
|
|
+ '<iframe frameborder="0" id="wysiwyg' + n + '"></iframe>\n'
|
|
+ '</td></tr></table>\n';
|
|
|
|
// Insert toolbar after the textArea
|
|
document.getElementById(n).insertAdjacentHTML("afterEnd", toolbar + toolbar2 + iframe);
|
|
|
|
// Give the iframe the required height and width
|
|
document.getElementById("wysiwyg" + n).style.height = wyzzH + "px";
|
|
document.getElementById("wysiwyg" + n).style.width = wyzzW + "px";
|
|
|
|
// Pass the textarea's existing text into the editor
|
|
var content = document.getElementById(n).value;
|
|
var doc = document.getElementById("wysiwyg" + n).contentWindow.document;
|
|
|
|
// Write the textarea's content into the iframe
|
|
doc.open();
|
|
if (browserName == "Microsoft Internet Explorer") {
|
|
doc.write('<link rel="stylesheet" media="screen" type="text/css" href="' + editstyle + '"/>' + content);
|
|
} else {
|
|
doc.write('<html><head><link rel="stylesheet" type="text/css" href="' + editstyle + '"/></head><body>' + content + '<br /></body></html>');
|
|
}
|
|
doc.close();
|
|
|
|
if (browserName == "Microsoft Internet Explorer") {
|
|
// Make the iframe editable
|
|
doc.body.contentEditable = true;
|
|
} else {
|
|
// Make the iframe editable
|
|
doc.designMode = "on";
|
|
}
|
|
|
|
// Update the textarea with content in WYSIWYG when user submits form
|
|
if (browserName == "Microsoft Internet Explorer"||browserName == "Opera") {
|
|
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);
|
|
}
|
|
}
|
|
}
|
|
|
|
function formatTextColor(color, n, selected) {
|
|
if (browserName == "Microsoft Internet Explorer"||browserName == "Chrome") { color = '#' + color; }
|
|
document.getElementById('wysiwyg' + n).contentWindow.document.execCommand('forecolor', false, color);
|
|
document.getElementById('colorpicker' + n).style.display = "none";
|
|
}
|
|
|
|
function formatBackColor(color, n, selected) {
|
|
if (browserName == "Microsoft Internet Explorer"||browserName == "Chrome") { color = '#' + color; }
|
|
if (browserName == "Microsoft Internet Explorer") {
|
|
document.getElementById('wysiwyg' + n).contentWindow.document.execCommand('backcolor', false, color);
|
|
} else {
|
|
document.getElementById('wysiwyg' + n).contentWindow.document.execCommand('hilitecolor', false, color);
|
|
}
|
|
document.getElementById('colorbackpicker' + n).style.display = "none";
|
|
}
|
|
|
|
function formatFontName(fontname, n, selected) {
|
|
document.getElementById('wysiwyg' + n).contentWindow.document.execCommand('fontName', false, fontname);
|
|
document.getElementById('fontpicker' + n).style.display = "none";
|
|
}
|
|
|
|
function formatSpecialChar(charname, n, selected) {
|
|
insertHTML(charname, n);
|
|
document.getElementById('specialpicker' + n).style.display = "none";
|
|
}
|
|
|
|
function formatHeader(headername, n, selected) {
|
|
document.getElementById('wysiwyg' + n).contentWindow.document.execCommand('formatBlock', false, '<'+headername+'>');
|
|
document.getElementById('headerpicker' + n).style.display = "none";
|
|
}
|
|
|
|
function formatText(id, n, selected) {
|
|
if(mode==0&&id!='htmlmode') {
|
|
alert(editor_lng1);
|
|
} else {
|
|
// When user clicks button make sure it always targets correct textarea
|
|
document.getElementById("wysiwyg" + n).contentWindow.focus();
|
|
if(id=="upsize") {
|
|
var currentFontSize = document.getElementById("wysiwyg"+n).contentWindow.document.queryCommandValue("FontSize");
|
|
if(currentFontSize == ''||!currentFontSize) currentFontSize = 3; // fudge for FF
|
|
if(currentFontSize < 7) {
|
|
var newFontSize = parseInt(currentFontSize) + 1;
|
|
} else {
|
|
var newFontSize = currentFontSize;
|
|
}
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand("FontSize", false, newFontSize);
|
|
}
|
|
else if(id=="downsize") {
|
|
var currentFontSize = document.getElementById("wysiwyg"+n).contentWindow.document.queryCommandValue("FontSize");
|
|
if(currentFontSize > 1) {
|
|
var newFontSize = currentFontSize - 1;
|
|
} else {
|
|
var newFontSize = currentFontSize;
|
|
}
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand("FontSize", false, newFontSize);
|
|
}
|
|
else if(id=="forecolor"){
|
|
if(document.getElementById('colorpicker' + n).style.display == ""){
|
|
document.getElementById('colorpicker' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('colorpicker' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="backcolor"){
|
|
if(document.getElementById('colorbackpicker' + n).style.display == ""){
|
|
document.getElementById('colorbackpicker' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('colorbackpicker' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="font"){
|
|
if(document.getElementById('fontpicker' + n).style.display == ""){
|
|
document.getElementById('fontpicker' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('fontpicker' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="specialchar"){
|
|
if(document.getElementById('specialpicker' + n).style.display == ""){
|
|
document.getElementById('specialpicker' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('specialpicker' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="headers"){
|
|
if(document.getElementById('headerpicker' + n).style.display == ""){
|
|
document.getElementById('headerpicker' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('headerpicker' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="htmlmode"){
|
|
var getDoc = document.getElementById("wysiwyg" + n).contentWindow.document;
|
|
if(mode == 1) {
|
|
if(navigator.appName == "Microsoft Internet Explorer"||browserName == "Opera") {
|
|
var iHTML = getDoc.body.innerHTML;
|
|
getDoc.body.innerText = iHTML;
|
|
} else {
|
|
var html = document.createTextNode(getDoc.body.innerHTML);
|
|
getDoc.body.innerHTML = "";
|
|
getDoc.body.appendChild(html);
|
|
}
|
|
getDoc.body.style.fontSize = "12px";
|
|
getDoc.body.style.fontFamily = "Courier New";
|
|
mode = 0;
|
|
} else {
|
|
if(navigator.appName == "Microsoft Internet Explorer"||browserName == "Opera") {
|
|
var iText = getDoc.body.innerText;
|
|
getDoc.body.innerHTML = iText;
|
|
} else {
|
|
var html = getDoc.body.ownerDocument.createRange();
|
|
html.selectNodeContents(getDoc.body);
|
|
getDoc.body.innerHTML = html.toString();
|
|
}
|
|
mode = 1;
|
|
}
|
|
}
|
|
else if(id=="help"){
|
|
if(document.getElementById('helpbox' + n).style.display == ""){
|
|
document.getElementById('helpbox' + n).style.display = "none";
|
|
} else {
|
|
document.getElementById('helpbox' + n).style.display = "";
|
|
}
|
|
}
|
|
else if(id=="link"){
|
|
if (browserName == "Microsoft Internet Explorer") {
|
|
var target = confirm('Should this link open in a new window?\n\nOK = Open in NEW Window\nCancel = Open in THIS window');
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand('createLink',true,' ');
|
|
if(target == true)
|
|
{
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.selection.createRange().parentElement().target="_blank";
|
|
}
|
|
} else {
|
|
insertLink(n);
|
|
}
|
|
}
|
|
else if(id=="insertimage") {
|
|
if (browserName == "Microsoft Internet Explorer") {
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand(id, true, null);
|
|
} else {
|
|
insertImage(n);
|
|
}
|
|
}
|
|
else {
|
|
document.getElementById("wysiwyg" + n).contentWindow.document.execCommand(id, false, null);
|
|
}
|
|
}
|
|
}
|
|
|
|
function insertHTML(html, n) {
|
|
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("span");
|
|
|
|
div.innerHTML = html;
|
|
var node = insertNodeAtSelection(div, n);
|
|
}
|
|
}
|
|
|
|
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 updateTextArea(n) {
|
|
if(xhtml_out == 1) {
|
|
document.getElementById(n).value = h2x(document.getElementById("wysiwyg" + n).contentWindow.document.body);
|
|
} else {
|
|
document.getElementById(n).value = document.getElementById("wysiwyg" + n).contentWindow.document.body.innerHTML;
|
|
}
|
|
}
|
|
|
|
function grabSelectedText(n){
|
|
|
|
var selectedText = '';
|
|
// for IE
|
|
if (browserName == "Microsoft Internet Explorer"||browserName == "Opera") {
|
|
var theText = document.getElementById("wysiwyg" + n).contentWindow.document.selection;
|
|
if(theText.type =='Text') {
|
|
var newText = theText.createRange();
|
|
selectedText = newText.text;
|
|
}
|
|
}
|
|
// for Mozilla/Netscape
|
|
else {
|
|
var selectedText = document.getElementById("wysiwyg" + n).contentWindow.document.getSelection();
|
|
}
|
|
return selectedText;
|
|
}
|