/* +-------------------------------------------------------------------+ | J S - R I C H E D I T (v1.18) | | | | Copyright Gerd Tentler www.gerd-tentler.de/tools | | Created: Jun. 2, 2003 Last modified: Feb. 10, 2007 | +-------------------------------------------------------------------+ | This program may be used and hosted free of charge by anyone for | | personal purpose as long as this copyright notice remains intact. | | | | Obtain permission before selling the code for this program or | | hosting this software on a commercial website or redistributing | | this software over the Internet or in any other medium. In all | | cases copyright must remain intact. | +-------------------------------------------------------------------+ =========================================================================================================== This script was tested with the following systems and browsers: - Windows XP: IE 6, NN 7, Opera 7 + 9, Firefox 2 - Mac OS X: IE 5, Safari 1 If you use another browser or system, this script may not work for you - sorry. Generally, richtext editing should work on Windows with Internet Explorer 4+ and with browsers using the Mozilla 1.3+ engine, i.e. all browsers that support "designMode". NOTE: The following browsers have been tested and do NOT support richtext editing: NN 7.0 and Opera 7.0 + 9.0 on Windows, IE 5.2 and Safari 1.0 on Mac OS. However, the script works with them, too - a simple textarea will replace the richtext editor. =========================================================================================================== */ var OP = (navigator.userAgent.indexOf('Opera') != -1) ? true : false; var IE = (navigator.userAgent.indexOf('MSIE') != -1 && !OP) ? true : false; var GK = (navigator.userAgent.indexOf('Gecko') != -1) ? true : false; var DM = (document.designMode && document.execCommand) ? true : false; var rto = new Array(); var mouseX, mouseY, winX, winY, scrLeft, scrTop; //--------------------------------------------------------------------------------------------------------- // Language settings //--------------------------------------------------------------------------------------------------------- var txtParagraph = "Paragraph"; var txtNormal = "Normal"; var txtHeading = "Heading"; var txtClearFormatting = "Clear Formatting"; var txtJustifyLeft = "Justify Left"; var txtJustifyCenter = "Justify Center"; var txtJustifyRight = "Justify Right"; var txtJustifyFull = "Justify Full"; var txtOrderedList = "Ordered List"; var txtUnorderedList = "Unordered List"; var txtOutdent = "Outdent"; var txtIndent = "Indent"; var txtInsertHR = "Insert Horizontal Rule"; var txtInsertTable = "Insert Table"; var txtInsertGraph = "Insert Graph"; var txtInsertBullet = "Insert Bullet Point"; var txtInsertImage = "Insert Image"; var txtInsertText = "Insert text here"; var txtFont = "Font"; var txtSize = "Size"; var txtBold = "Bold"; var txtItalic = "Italic"; var txtUnderline = "Underline"; var txtFontColor = "Font Color"; var txtBGColor = "Background Color"; var txtHyperlink = "Hyperlink"; var txtCut = "Cut"; var txtCopy = "Copy"; var txtPaste = "Paste"; var txtUndo = "Undo"; var txtRedo = "Redo"; var txtBorder = "Border"; var txtBorderColor = "Border Color"; var txtCellColor = "Cell Color"; var txtCellSpacing = "Cell Spacing"; var txtCellPadding = "Cell Padding"; var txtColumns = "Columns"; var txtRows = "Rows"; var txtCreate = "Create"; var txtCancel = "Cancel"; var txtValues = "Values"; var txtLabels = "Labels"; var txtBarColor = "Bar Color"; var txtLabelColor = "Label Color"; var txtViewValues = "View Values"; var txtLegend = "Legend"; var txtViewSource = "View Source"; var txtViewEditor = "View Editor"; function EDITOR() { //--------------------------------------------------------------------------------------------------------- // Configuration //--------------------------------------------------------------------------------------------------------- this.editorBGColor = "white"; // editor background color this.editorBorder = "1px silver"; // editor border (CSS-spec: "size style color") this.textWidth = 500; // text field width (pixels) this.textHeight = 140; // text field height (pixels) this.textBGColor = "white"; // text field background color this.textBorder = "2px inset"; // text field border (CSS-spec: "size style color") this.textFont = "Verdana, Arial, Helvetica"; // text field font family (CSS-spec) this.textFontSize = 11; // text field font size (pixels) this.setFocus = false; // focus text field on load (true or false) this.fieldName = "htmlcontent"; // default field name this.iconPath = "includes/htmlEditor/icons"; // path to icons this.bulletpoint = "bp.gif"; // bullet point image (full path) //--------------------------------------------------------------------------------------------------------- // Functions //--------------------------------------------------------------------------------------------------------- this.editor = 0; this.id = 0; this.curSelection = 0; this.field = ''; this.curFontColor = 'gray'; this.curBGColor = 'yellow'; this.source = false; this.getEditor = function() { var e = false; if(GK) e = document.getElementById('rtoIFrame' + this.id).contentWindow; else if(IE) e = document.frames('rtoIFrame' + this.id); if(e && !DM) e = false; return e; } this.wordWrap = function(string, col, prefix) { if(col == null) col = 100; if(prefix == null) prefix = ''; var text = line = newline = word = ''; var row = col - prefix.length; var i, j, cnt; var words = new Array(); var lines = new Array(); lines = string.split('\n'); if(row > 0) { for(i = 0; i < lines.length; i++) { line = lines[i]; if(line.length > row) { newline = ''; words = line.split(' '); for(j = 0; j < words.length; j++) { word = words[j]; if(word.length > row) { if(newline) { text += prefix + newline + '\n'; newline = ''; } text += prefix + word + '\n'; } else if(newline.length + word.length > row) { newline.replace(/ +$/, ''); text += prefix + newline + '\n'; newline = word + ' '; } else newline += word + ' '; } newline.replace(/ +$/, ''); text += prefix + newline + '\n'; } else { line.replace(/ +$/, ''); text += prefix + line + '\n'; } } } return text.replace(/\n$/, ''); } this.initEditor = function(content) { if(this.editor = this.getEditor()) { var html = '' + '' + content.replace(/\n' + content; this.field.value = content; } } } this.buildEditor = function() { document.writeln(''); document.writeln('
'); document.writeln('
'); document.writeln('' + ''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln('
'+ //**** REMOVED PARAGRAPH OPTIONS *********************** // '; '
'); document.writeln('
'); //document.writeln('
'); document.writeln('' + ''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln('
' + //**** REMOVED FONT OPTIONS *********************** // ' ''); document.writeln(''); document.writeln(''); document.writeln('
'); document.writeln(''); document.writeln(''); document.writeln('
'); document.writeln('
'); document.writeln(''); document.writeln(''); document.writeln('
'); document.writeln('
'); } this.create = function(content) { if(content == null) content = ''; this.id = rto.length; if(rto[this.id] = this) { if((IE || GK) && DM) { this.buildEditor(); this.initEditor(content); } else { var cols = Math.round(this.textWidth / 10); var rows = Math.round(this.textHeight / 20); document.write(''); } } else alert("Could not create editor!"); } this.barGraph = function(values, labels, bColor, lColor, showVal, legend, bSize, bBorder, bLen) { showVal = parseInt(showVal); var colors = new Array('#0000FF', '#FF0000', '#00E000', '#A0A0FF', '#FFA0A0', '#00A000'); var d = (typeof(values) == 'string') ? this.makeArray(values) : values; if(labels) var r = (typeof(labels) == 'string') ? this.makeArray(labels) : labels; else var r = new Array(); var label = graph = ''; var percent = 0; if(bColor) var drf = (typeof(bColor) == 'string') ? this.makeArray(bColor) : bColor; else var drf = new Array(); var drw, val = new Array(); var bc = new Array(); if(lColor) { if(lColor.indexOf(',') != -1) var lc = lColor.split(','); else { lColor = lColor.replace(/\s+/g, ' '); var lc = lColor.split(' '); } } else var lc = new Array(); if(lc[0]) lc[0] = lc[0].replace(/\s+/, ''); else lc[0] = '#C0E0FF'; if(lc[1]) lc[1] = lc[1].replace(/\s+/, ''); var bars = (d.length > r.length) ? d.length : r.length; if(legend) graph += '
'; var sum = max = max_neg = max_dec = ccnt = lcnt = 0; for(var i = 0; i < bars; i++) { if(typeof(d[i]) == 'string') drw = d[i].split(';'); else { drw = new Array(); drw[0] = d[i]; } val[lcnt] = new Array(); for(var j = v = 0; j < drw.length; j++) { val[lcnt][j] = v = drw[j] ? parseFloat(drw[j]) : 0; if(v > max) max = v; else if(v < max_neg) max_neg = v; if(v < 0) v *= -1; sum += v; v = v.toString(); if(v.indexOf('.') != -1) { v = v.substr(v.indexOf('.') + 1); dec = v.length; if(dec > max_dec) max_dec = dec; } if(!bc[j]) { if(ccnt >= colors.length) ccnt = 0; bc[j] = (!drf[j] || drf[j].length < 3) ? colors[ccnt++] : drf[j]; } } lcnt++; } if(!showVal) showVal = 0; if(!bBorder) bBorder = '2px outset white'; if(!bSize) bSize = 15; if(!bLen) bLen = 1.0; else if(bLen < 0.1) bLen = 0.1; else if(bLen > 2.9) bLen = 2.9; var border = parseInt(bBorder); var mPerc = sum ? Math.round(max * 100 / sum) : 0; var mul = mPerc ? 100 / mPerc : 1; mul *= bLen; if(showVal < 2) var valSpace = 25; else var valSpace = 0; var spacer = maxSize = Math.round(mPerc * mul + valSpace + border * 2); if(max_neg) { var mPerc_neg = sum ? Math.round(-max_neg * 100 / sum) : 0; var spacer_neg = Math.round(mPerc_neg * mul + valSpace + border * 2); maxSize += spacer_neg; } graph += ''; for(i = 0; i < val.length; i++) { label = (i < r.length) ? r[i] : i+1; graph += ''; for(j = 0; j < val[i].length; j++) { percent = sum ? val[i][j] * 100 / sum : 0; if(showVal == 1 || showVal == 2) { graph += this.showValue(val[i][j], max_dec, lc[0], 0, 'right'); } if(percent < 0) { percent *= -1; graph += ' '; } else { if(max_neg) graph += ''; graph += ''; if(percent) { graph += '
'; graph += '
'; } else graph += '
'; if(showVal < 2) graph += '
 ' + Math.round(percent) + '%
'; graph += ''; } graph += '
'; } } graph += '
'; graph += ' ' + label + ' '; if(showVal < 2) graph += '
' + Math.round(percent) + '% 
'; graph += '
'; graph += '
'; graph += '
 
'; if(legend) { graph += '
 
'; var l = (typeof(legend) == 'string') ? this.makeArray(legend) : legend; for(i = 0; i < bc.length; i++) { graph += ''; graph += ' ' + (l[i] ? l[i] : '') + '
'; } graph += '
'; } return graph; } this.makeArray = function(str) { var arr = new Array(); if(str.indexOf(',') != -1) { arr = str.split(','); for(var i = 0; i < arr.length; i++) { arr[i] = arr[i].replace(/^\s+/, ''); arr[i] = arr[i].replace(/\s+$/, ''); } } else { str = str.replace(/\s+/g, ' '); arr = str.split(' '); } return arr; } this.formatValue = function(val, dec) { if(val < 0) { var neg = true; val *= -1; } else var neg = false; var v = (Math.round(val * Math.pow(10, dec))).toString(); if(v.length <= dec) for(var i = 0; i < dec - v.length + 1; i++) v = '0' + v; v = v.substr(0, v.length - dec) + '.' + v.substr(v.length - dec); if(v.substr(0, 1) == '.') v = '0' + v; if(neg) v = '-' + v; return v; } this.showValue = function(val, max_dec, color, sum, align) { val = max_dec ? this.formatValue(val, max_dec) : val; if(sum) sum = max_dec ? this.formatValue(sum, max_dec) : sum; value = ''; value += ' ' + val + (sum ? ' / ' + sum : '') + ' '; return value; } } //--------------------------------------------------------------------------------------------------------- // Global functions //--------------------------------------------------------------------------------------------------------- function buildColorChart(mode) { var c = new Array(); // red c[0] = new Array('FFEEEE', 'FFCCCC', 'FFAAAA', 'FF8888', 'FF6666', 'FF4444', 'FF2222', 'FF0000', 'EE0000', 'CC0000', 'AA0000', '880000', '770000', '660000', '550000', '440000', '330000'); // green c[1] = new Array('EEFFEE', 'CCFFCC', 'AAFFAA', '88FF88', '66FF66', '44FF44', '22FF22', '00FF00', '00EE00', '00CC00', '00AA00', '008800', '007700', '006600', '005500', '004400', '003300'); // blue c[2] = new Array('EEEEFF', 'CCCCFF', 'AAAAFF', '8888FF', '6666FF', '4444FF', '2222FF', '0000FF', '0000EE', '0000CC', '0000AA', '000088', '000077', '000066', '000055', '000044', '000033'); // yellow c[3] = new Array('FFFFEE', 'FFFFCC', 'FFFFAA', 'FFFF88', 'FFFF66', 'FFFF44', 'FFFF22', 'FFFF00', 'EEEE00', 'CCCC00', 'AAAA00', '888800', '777700', '666600', '555500', '444400', '333300'); // pink c[4] = new Array('FFEEFF', 'FFCCFF', 'FFAAFF', 'FF88FF', 'FF66FF', 'FF44FF', 'FF22FF', 'FF00FF', 'EE00EE', 'CC00CC', 'AA00AA', '880088', '770077', '660066', '550055', '440044', '330033'); // brown c[5] = new Array('FFF0D0', 'FFEECC', 'FFEEBB', 'FFDDAA', 'FFCC99', 'FFC090', 'EEBB88', 'DDAA77', 'CC9966', 'BB8855', 'AA7744', '886633', '775522', '664411', '553300', '442200', '331100'); // cyan c[6] = new Array('EEFFFF', 'CCFFFF', 'AAFFFF', '88FFFF', '66FFFF', '44FFFF', '22FFFF', '00FFFF', '00EEEE', '00CCCC', '00AAAA', '008888', '007777', '006666', '005555', '004444', '003333'); // grey c[7] = new Array('FFFFFF', 'EEEEEE', 'DDDDDD', 'CCCCCC', 'BBBBBB', 'AAAAAA', 'A0A0A0', '999999', '888888', '777777', '666666', '555555', '444444', '333333', '222222', '111111', '000000'); var html = ''; var style, i, j; for(i = 0; i < c.length; i++) { html += ''; for(j = 0; j < c[i].length; j++) { style = 'width:14px; height:14px; font-size:1px; cursor:hand; background-color:#' + c[i][j]; html += ''; } html += ''; } html += '
' + '
'; return html; } function rtoGetObj(id) { var obj = false; if(document.getElementById) obj = document.getElementById(id); else if(document.all) obj = document.all[id]; return obj; } function rtoSetUnselectable(elm) { if(document.getElementsByTagName) { if(elm && typeof(elm.tagName) != 'undefined') { if(elm.tagName != 'INPUT' && elm.tagName != 'TEXTAREA' && elm.tagName != 'IFRAME') { if(elm.hasChildNodes()) { for(var i = 0; i < elm.childNodes.length; i++) { rtoSetUnselectable(elm.childNodes[i]); } } elm.unselectable = true; } } } } function rtoStore() { for(var i = 0; i < rto.length; i++) rto[i].store(false); } function rtoGetScrollLeft() { var scrLeft = 0; if(window.pageXOffset) scrLeft = window.pageXOffset; else if(document.documentElement && document.documentElement.scrollLeft) scrLeft = document.documentElement.scrollLeft; else if(document.body && document.body.scrollLeft) scrLeft = document.body.scrollLeft; return scrLeft; } function rtoGetScrollTop() { var scrTop = 0; if(window.pageYOffset) scrTop = window.pageYOffset; else if(document.documentElement && document.documentElement.scrollTop) scrTop = document.documentElement.scrollTop; else if(document.body && document.body.scrollTop) scrTop = document.body.scrollTop; return scrTop; } function rtoGetWinXY() { if(window.innerWidth) { winX = window.innerWidth; winY = window.innerHeight; } else if(document.documentElement && document.documentElement.clientWidth) { winX = document.documentElement.clientWidth; winY = document.documentElement.clientHeight; } else if(document.body && document.body.clientWidth) { winX = document.body.clientWidth; winY = document.body.clientHeight; } else { winX = screen.width; winY = screen.height; } scrLeft = rtoGetScrollLeft(); scrTop = rtoGetScrollTop(); } function rtoGetMouse(e) { if(e && e.pageX != null) { mouseX = e.pageX; mouseY = e.pageY; } else if(event && event.clientX != null) { mouseX = event.clientX + rtoGetScrollLeft(); mouseY = event.clientY + rtoGetScrollTop(); } } document.onmousedown = rtoGetMouse; //--------------------------------------------------------------------------------------------------------- // Global styles / dialog boxes //--------------------------------------------------------------------------------------------------------- if((IE || GK) && DM) { document.writeln(''); document.writeln('
' + '

' + txtBGColor + '

' + '
' + '' + buildColorChart('BGColor') + '' + '
' + '
'); document.writeln('
' + '

' + txtFontColor + '

' + '
' + '' + buildColorChart('FontColor') + '' + '
' + '
'); document.writeln('
' + '

' + txtInsertImage + '

' + '
' + '' + ''); document.writeln(''); document.writeln('
URL: 
' + '' + '' + '' + '
' + '
' + '
'); document.writeln('
' + '

' + txtInsertTable + '

' + '
' + '' + ''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln('
' + txtColumns + ':  ' + txtCellSpacing + ': 
' + txtRows + ':  ' + txtCellPadding + ': 
' + txtBorder + ':  ' + txtBorderColor + ': 
' + txtCellColor + ': 
' + '' + '' + '' + '
' + '
' + '
'); document.writeln('
' + '

' + txtInsertGraph + '

' + '
' + '' + ''); document.writeln(''); document.writeln(''); document.writeln(''); document.writeln('
' + txtValues + ':  ' + txtBarColor + ': 
' + txtLabels + ':  ' + txtLabelColor + ': 
' + txtLegend + ':  ' + txtViewValues + ': 
' + '' + '' + '' + '
' + '
' + '
'); rtoSetUnselectable(rtoGetObj('dlgBGColor')); rtoSetUnselectable(rtoGetObj('dlgFontColor')); rtoSetUnselectable(rtoGetObj('dlgImage')); rtoSetUnselectable(rtoGetObj('dlgTable')); rtoSetUnselectable(rtoGetObj('dlgGraph')); } //---------------------------------------------------------------------------------------------------------