oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Upgraded HTML Area rich editor to version 2.0.3.

Browse source
This commit is contained in:
JT Smith 2003-01-07 01:31:23 +00:00
parent f738a3051a
commit 974a7a302e
7 changed files with 1015 additions and 825 deletions
Download patch file Download diff file Expand all files Collapse all files

177
www/extras/htmlArea/editor.js
View file

@ -1,9 +1,9 @@
//
// htmlArea v2.00 - Copyright (c) 2002 interactivetools.com, inc.
// htmlArea v2.02 - Copyright (c) 2002 interactivetools.com, inc.
// This copyright notice MUST stay intact for use (see license.txt).
//
// A free WYSIWYG editor replacement for <textarea> fields.
//
// For more information visit:
// http://www.interactivetools.com/products/htmlarea/
// For full source code and docs, visit http://www.interactivetools.com/
//
// write out styles for UI buttons
@ -26,13 +26,17 @@ document.write('</style>\n');
function editor_defaultConfig(objname) {
this.version = "2.0"
this.version = "2.02"
this.width = "auto";
this.height = "auto";
this.bodyStyle = 'background-color: #FFFFFF; font-family: "Verdana"; font-size: x-small;';
this.imgURL = _editor_url + 'images/';
this.debug = 0;
this.replaceNextlines = 0; // replace nextlines from spaces (on output)
this.plaintextInput = 0; // replace nextlines with breaks (on input)
this.toolbar = [
['fontname'],
['fontsize'],
@ -44,7 +48,8 @@ this.toolbar = [
['OrderedList','UnOrderedList','Outdent','Indent','separator'],
['forecolor','backcolor','separator'],
['HorizontalRule','Createlink','InsertImage','InsertTable','htmlmode','separator'],
['Macros','separator'],
['Macros','separator'],
// ['custom1','custom2','custom3','separator'],
['popupeditor','about']];
@ -100,11 +105,10 @@ this.btnList = {
"htmlmode": ['HtmlMode', 'View HTML Source', 'editor_setmode(\''+objname+'\')', 'ed_html.gif'],
"popupeditor": ['popupeditor', 'Enlarge Editor', 'editor_action(this.id)', 'fullscreen_maximize.gif'],
"about": ['about', 'About this editor', 'editor_about(\''+objname+'\')', 'ed_about.gif'],
// Add custom buttons here:
"custom1": ['custom1', 'Purpose of button 1', 'editor_action(this.id)', 'ed_custom.gif'],
"custom2": ['custom2', 'Purpose of button 2', 'editor_action(this.id)', 'ed_custom.gif'],
"macros": ['Macros', 'Insert a WebGUI Macro','editor_action(this.id)', 'macro.gif'],
"macros": ['Macros','Insert a WebGUI Macro','editor_action(this.id)','macro.gif'],
"custom3": ['custom3', 'Purpose of button 3', 'editor_action(this.id)', 'ed_custom.gif'],
// end: custom buttons
@ -125,21 +129,12 @@ this.btnList = {
function editor_generate(objname,userConfig) {
// Check for IE 5.5+ on Windows
var Agent, VInfo, MSIE, Ver, Win32, Opera;
Agent = navigator.userAgent;
VInfo = Array(); // version info
VInfo = Agent.split(";")
MSIE = Agent.indexOf('MSIE') > 0;
Ver = VInfo[1].substr(6,3);
Win32 = Agent.indexOf('Windows') > 0 && Agent.indexOf('Mac') < 0 && Agent.indexOf('Windows CE') < 0;
Opera = Agent.indexOf('Opera') > -1;
if (!MSIE || Opera || Ver < 5.5 || !Win32) { return; }
// Default Settings
var config = new editor_defaultConfig(objname);
for (var thisName in config) {
if (userConfig && userConfig[thisName]) { config[thisName] = userConfig[thisName]; }
if (userConfig) {
for (var thisName in userConfig) {
if (userConfig[thisName]) { config[thisName] = userConfig[thisName]; }
}
}
document.all[objname].config = config; // store config settings
@ -218,21 +213,17 @@ function editor_generate(objname,userConfig) {
var btnObj = config.btnList[btnName];
if (btnName == 'linebreak') { alert("htmlArea error: 'linebreak' must be in a subgroup by itself, not with other buttons.\n\nhtmlArea wysiwyg editor not created."); return; }
if (!btnObj) { alert("htmlArea error: button '" +btnName+ "' not found in button list when creating the wysiwyg editor for '"+objname+"'.\nPlease make sure you entered the button name correctly.\n\nhtmlArea wysiwyg editor not created."); return; }
if (btnName == "about") { aboutEditor = 1; }
var btnCmdID = btnObj[0];
var btnTitle = btnObj[1];
var btnOnClick = btnObj[2];
var btnImage = btnObj[3];
toolbar += '<button title="' +btnTitle+ '" id="_' +objname+ '_' +btnCmdID+ '" class="btn" onClick="' +btnOnClick+ '" onmouseover="if(this.className==\'btn\'){this.className=\'btnOver\'}" onmouseout="if(this.className==\'btnOver\'){this.className=\'btn\'}" unselectable="on"><img src="' +config.imgURL + btnImage+ '" border=0 unselectable="on"></button>';
} // end of button sub-group
toolbar += tblClose;
} // end of entire button set
// Note: we've worked very hard to bring you this editor for free. Please don't remove the 'about this editor' button
if (!aboutEditor) { alert("htmlArea error: You must include the 'about' button in the list of editor toolbar buttons.\nIt's required by the license agreement for the wysiwyg editor, please don't remove it.\n\nhtmlArea wysiwyg editor not created."); return; }
// build editor
var editor = '<span id="_editor_toolbar"><table border=0 cellspacing=0 cellpadding=0 bgcolor="buttonface" style="padding: 1 0 0 2" width=' + config.width + ' unselectable="on"><tr><td>\n'
@ -246,6 +237,16 @@ function editor_generate(objname,userConfig) {
// hide original textarea and insert htmlarea after it
if (!config.debug) { document.all[objname].style.display = "none"; }
if (config.plaintextInput) { // replace nextlines with breaks
var contents = document.all[objname].value;
contents = contents.replace(/\r\n/g, '<br>');
contents = contents.replace(/\n/g, '<br>');
contents = contents.replace(/\r/g, '<br>');
document.all[objname].value = contents;
}
// insert wysiwyg
document.all[objname].insertAdjacentHTML('afterEnd', editor)
// convert htmlarea from textarea to wysiwyg editor
@ -257,6 +258,8 @@ function editor_generate(objname,userConfig) {
if (!r) { alert("Error attaching event to form!"); }
}
return true;
}
/* ---------------------------------------------------------------------- *\
@ -283,6 +286,14 @@ function editor_action(button_id) {
return;
}
// popup editor
if (cmdID == 'popupeditor') {
window.open(_editor_url + "popups/fullscreen.html?"+objname,
'FullScreen',
'toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480');
return;
}
// check editor mode (don't perform actions in textedit mode)
if (editor_obj.tagName.toLowerCase() == 'textarea') { return; }
@ -306,7 +317,7 @@ function editor_action(button_id) {
// Custom2
else if (cmdID == 'Macros') { // insert some text from a popup window
var myTitle = "Insert WebGUI macro";
var myTitle = "Insert WebGUI Macro";
var myText = showModalDialog(_editor_url + "popups/macros.html",
myTitle, // str or obj specified here can be read from dialog as "window.dialogArguments"
"resizable: yes; help: no; status: no; scroll: no; ");
@ -322,11 +333,6 @@ function editor_action(button_id) {
// END OF CUSTOM BUTTONS
//
// popup editor
else if (cmdID == 'popupeditor') {
showModalDialog(_editor_url + "popups/fullscreen.html?"+objname, window, "resizable: yes; help: no; status: no; scroll: no; ");
}
// FontName
else if (cmdID == 'FontName' && val) {
editdoc.execCommand(cmdID,0,val);
@ -418,6 +424,14 @@ function editor_event(objname,runDelay) {
if (ord == 17) { return; } // ignore ctrl key by itself
if (ord == 18) { return; } // ignore alt key by itself
// cancel ENTER key and insert <BR> instead
// if (ord == 13 && editEvent.type == 'keypress') {
// editEvent.returnValue = false;
// editor_insertHTML(objname, "<br>");
// return;
// }
if (ctrlKey && (ord == 122 || ord == 90)) { // catch ctrl-z (UNDO)
// TODO: Add our own undo/redo functionality
// editEvent.cancelBubble = true;
@ -469,7 +483,7 @@ function editor_updateToolbar(objname,action) {
for (var idxN in tbItems) {
var cmdID = tbItems[idxN].toLowerCase();
var tbObj = document.all["_" +objname+ "_" +tbItems[idxN]];
if (cmdID == "htmlmode" || cmdID == "about" || cmdID == "showhelp") { continue; } // don't change these buttons
if (cmdID == "htmlmode" || cmdID == "about" || cmdID == "showhelp" || cmdID == "popupeditor") { continue; } // don't change these buttons
if (tbObj == null) { continue; }
var isBtn = (tbObj.tagName.toLowerCase() == "button") ? true : false;
@ -519,8 +533,13 @@ function editor_updateToolbar(objname,action) {
var classname_obj = document.all["_" +objname+ "_FontStyle"];
if (classname_obj) {
var curRange = editdoc.selection.createRange();
var pElement = curRange.parentElement();
// check element and element parents for class names
var pElement;
if (curRange.length) { pElement = curRange[0]; } // control tange
else { pElement = curRange.parentElement(); } // text range
while (pElement && !pElement.className) { pElement = pElement.parentElement; } // keep going up
var thisClass = pElement ? pElement.className.toLowerCase() : "";
if (!thisClass && classname_obj.value) { classname_obj.value = null; }
else {
@ -536,7 +555,7 @@ function editor_updateToolbar(objname,action) {
}
// update button states
var IDList = Array('Bold','Italic','Underline','JustifyLeft','JustifyCenter','JustifyRight','InsertOrderedList','InsertUnorderedList');
var IDList = Array('Bold','Italic','Underline','StrikeThrough','SubScript','SuperScript','JustifyLeft','JustifyCenter','JustifyRight','InsertOrderedList','InsertUnorderedList');
for (i=0; i<IDList.length; i++) {
var btnObj = document.all["_" +objname+ "_" +IDList[i]];
if (btnObj == null) { continue; }
@ -584,11 +603,17 @@ function editor_updateOutput(objname) {
\* ---------------------------------------------------------------------- */
function editor_filterOutput(objname) {
editor_updateOutput(objname);
var contents = document.all[objname].value;
var config = document.all[objname].config;
// ignore blank contents
if (contents.toLowerCase() == '<p>&nbsp;</p>') { contents = ""; }
// filter tag - this code is run for each HTML tag matched
var filterTag = function(tagBody,tagName,tagAttr) {
tagName = tagName.toLowerCase();
var closingTag = (tagBody.match(/^<\//)) ? true : false;
// fix placeholder URLS - remove absolute paths that IE adds
if (tagName == 'img') { tagBody = tagBody.replace(/(src\s*=\s*.)[^*]*(\*\*\*)/, "$1$2"); }
@ -596,18 +621,36 @@ function editor_filterOutput(objname) {
// add additional tag filtering here
// convert to vbCode
// if (tagName == 'b' || tagName == 'strong') {
// if (closingTag) { tagBody = "[/b]"; } else { tagBody = "[b]"; }
// }
// else if (tagName == 'i' || tagName == 'em') {
// if (closingTag) { tagBody = "[/i]"; } else { tagBody = "[i]"; }
// }
// else if (tagName == 'u') {
// if (closingTag) { tagBody = "[/u]"; } else { tagBody = "[u]"; }
// }
// else {
// tagBody = ""; // disallow all other tags!
// }
return tagBody;
};
// match tags and call filterTag
RegExp.lastIndex = 0;
var matchTag = /<\/?(\w+)((?:[^'">]*|'[^']*'|"[^"]*")*)>/g; // this will match tags, but still doesn't handle container tags (textarea, comments, etc)
var matchTag = /<\/?(\w+)((?:[^'">]*|'[^']*'|"[^"]*")*)>/g; // this will match tags, but still doesn't handle container tags (textarea, comments, etc)
contents = contents.replace(matchTag, filterTag);
// remove nextlines from output (if requested)
if (config.replaceNextlines) {
contents = contents.replace(/\r\n/g, ' ');
contents = contents.replace(/\n/g, ' ');
contents = contents.replace(/\r/g, ' ');
}
// update output with filtered content
document.all[objname].value = contents;
@ -635,11 +678,14 @@ function editor_setmode(objname, mode) {
var TextEdit = '<textarea ID="_' +objname + '_editor" style="width:' +editor_obj.style.width+ '; height:' +editor_obj.style.height+ '; margin-top: -1px; margin-bottom: -1px;"></textarea>';
var RichEdit = '<iframe ID="_' +objname+ '_editor" style="width:' +editor_obj.style.width+ '; height:' +editor_obj.style.height+ ';"></iframe>';
// src="' +_editor_url+ 'popups/blank.html"
//
// Switch to TEXTEDIT mode
//
if (mode == "textedit" || editor_obj.tagName.toLowerCase() == 'iframe') {
config.mode = "textedit";
var editdoc = editor_obj.contentWindow.document;
var contents = editdoc.body.createTextRange().htmlText;
editor_obj.outerHTML = TextEdit;
@ -650,6 +696,7 @@ function editor_setmode(objname, mode) {
editor_updateToolbar(objname, "disable"); // disable toolbar items
// set event handlers
editor_obj.onkeydown = function() { editor_event(objname); }
editor_obj.onkeypress = function() { editor_event(objname); }
editor_obj.onkeyup = function() { editor_event(objname); }
editor_obj.onmouseup = function() { editor_event(objname); }
@ -667,7 +714,7 @@ function editor_setmode(objname, mode) {
//
else {
config.mode = "wysiwyg";
var contents = editor_obj.value;
if (mode == 'init') { contents = document.all[objname].value; } // on init use original textarea content
@ -704,6 +751,7 @@ function editor_setmode(objname, mode) {
// write to editor window
var editdoc = editor_obj.contentWindow.document;
editdoc.open();
editdoc.write(html);
editdoc.close();
@ -714,6 +762,7 @@ function editor_setmode(objname, mode) {
editdoc.objname = objname;
// set event handlers
editdoc.onkeydown = function() { editor_event(objname); }
editdoc.onkeypress = function() { editor_event(objname); }
editdoc.onkeyup = function() { editor_event(objname); }
editdoc.onmouseup = function() { editor_event(objname); }
@ -785,10 +834,10 @@ function editor_about(objname) {
function _dec_to_rgb(value) {
var hex_string = "";
for (var hexpair = 0; hexpair < 3; hexpair++) {
var byte = value & 0xFF; // get low byte
var myByte = value & 0xFF; // get low byte
value >>= 8; // drop low byte
var nybble2 = byte & 0x0F; // get low nybble (4 bits)
var nybble1 = (byte >> 4) & 0x0F; // get high nybble
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
}
@ -872,6 +921,48 @@ function editor_insertHTML(objname, str1,str2, reqSel) {
}
/* ---------------------------------------------------------------------- *\
Function : editor_getHTML
Description : return HTML contents of editor (in either wywisyg or html mode)
Usage : var myHTML = editor_getHTML('objname');
\* ---------------------------------------------------------------------- */
function editor_getHTML(objname) {
var editor_obj = document.all["_" +objname + "_editor"];
var isTextarea = (editor_obj.tagName.toLowerCase() == 'textarea');
if (isTextarea) { return editor_obj.value; }
else { return editor_obj.contentWindow.document.body.innerHTML; }
}
/* ---------------------------------------------------------------------- *\
Function : editor_setHTML
Description : set HTML contents of editor (in either wywisyg or html mode)
Usage : editor_setHTML('objname',"<b>html</b> <u>here</u>");
\* ---------------------------------------------------------------------- */
function editor_setHTML(objname, html) {
var editor_obj = document.all["_" +objname + "_editor"];
var isTextarea = (editor_obj.tagName.toLowerCase() == 'textarea');
if (isTextarea) { editor_obj.value = html; }
else { editor_obj.contentWindow.document.body.innerHTML = html; }
}
/* ---------------------------------------------------------------------- *\
Function : editor_appendHTML
Description : append HTML contents to editor (in either wywisyg or html mode)
Usage : editor_appendHTML('objname',"<b>html</b> <u>here</u>");
\* ---------------------------------------------------------------------- */
function editor_appendHTML(objname, html) {
var editor_obj = document.all["_" +objname + "_editor"];
var isTextarea = (editor_obj.tagName.toLowerCase() == 'textarea');
if (isTextarea) { editor_obj.value += html; }
else { editor_obj.contentWindow.document.body.innerHTML += html; }
}
/* ---------------------------------------------------------------- */
function _isMouseOver(obj,event) { // determine if mouse is over object

56
www/extras/htmlArea/example.html
View file

@ -16,30 +16,39 @@
--></style>
<script><!-- // load htmlArea files
_editor_url = "./";
document.write('<scr'+'ipt src="' +_editor_url+ 'editor.js" language="Javascript1.2"></scr'+'ipt>');
//--></script>
<script language="Javascript1.2"><!-- // load htmlarea
_editor_url = ""; // URL to htmlarea files
var win_ie_ver = parseFloat(navigator.appVersion.split("MSIE")[1]);
if (navigator.userAgent.indexOf('Mac') >= 0) { win_ie_ver = 0; }
if (navigator.userAgent.indexOf('Windows CE') >= 0) { win_ie_ver = 0; }
if (navigator.userAgent.indexOf('Opera') >= 0) { win_ie_ver = 0; }
if (win_ie_ver >= 5.5) {
document.write('<scr' + 'ipt src="' +_editor_url+ 'editor.js"');
document.write(' language="Javascript1.2"></scr' + 'ipt>');
} else { document.write('<scr'+'ipt>function editor_generate() { return false; }</scr'+'ipt>'); }
// --></script>
</head>
<body>
<a name="top"></a>
<form>
<form method=POST action="">
<div align=center>
<span class="headline">htmlArea v2.00</span><br>
<span class="headline2">Turn any &lt;textarea&gt; into a WYSIWYG editor<br><a href="http://www.interactivetools.com/" target="_blank">from your friends at interactivetools.com</a></span>
<span class="headline">htmlArea v2.03</span><br>
<span class="headline2">A free WYSIWYG editor replacement for &lt;textarea&gt; fields.<br><a href="http://www.interactivetools.com/" target="_blank">from your friends at interactivetools.com</a></span>
<hr>
</div>
<!-- TOC -->
<p>Sample textarea follows:</p>
<textarea name="yourFieldNameHere" style="width:500; height:150">
<textarea name="yourFieldNameHere" style="width:800; height:150">
<p>Here is some sample text: <b>bold</b>, <i>italic</i>, <u>underline</u>. </p>
<p align=center>Different fonts, sizes and colors (all in bold):</p>
<p><b>
@ -55,20 +64,20 @@ document.write('<scr'+'ipt src="' +_editor_url+ 'editor.js" language="Javascript
</textarea><br>
<b>Example "InsertHTML" links: </b> &nbsp;
<a href="javascript:editor_insertHTML('yourFieldNameHere','<font style=\'background-color: yellow\'>','</font>');">Highlight selected text</a> -
<a href="javascript:editor_insertHTML('yourFieldNameHere','<font style=\'background-color: yellow\'>','</font>',1);">Highlight selected text</a> -
<a href="javascript:editor_insertHTML('yourFieldNameHere',':)');">Insert Smiley</a>
<a href="javascript:alert(editor_getHTML('yourFieldNameHere'));">getHTML</a>
<a href="javascript:editor_setHTML('yourFieldNameHere','<b>Hello World</b>!!');">setHTML</a>
<script language="javascript1.2" defer>
<script language="javascript1.2">
editor_generate('yourFieldNameHere');
</script>
<p><hr>
<p>Another textarea follows: (This one has many more configuration defined in the source code)</p>
<textarea name="yourFieldNameHere2" style="width:100%; height:200">
<hr>
<p>Here is some sample text: <b>bold</b>, <i>italic</i>, <u>underline</u>. </p>
@ -85,7 +94,8 @@ editor_generate('yourFieldNameHere');
<p>Click on <a href="http://www.interactivetools.com/">this link</a> and then on the link button to the details ... OR ... select some text and click link to create a <b>new</b> link.</p>
</textarea><br>
<script language="javascript1.2" defer>
<script language="javascript1.2">
var config = new Object(); // create new config object
config.width = "90%";
@ -99,13 +109,12 @@ config.toolbar = [
['fontname'],
['fontsize'],
['fontstyle'],
// ['linebreak'],
['linebreak'],
['bold','italic','underline','separator'],
// ['strikethrough','subscript','superscript','separator'],
['justifyleft','justifycenter','justifyright','separator'],
['OrderedList','UnOrderedList','Outdent','Indent','separator'],
['forecolor','backcolor','separator'],
['custom1','custom2','custom3','separator'],
['HorizontalRule','Createlink','InsertImage','htmlmode','separator'],
['about','help','popupeditor'],
];
@ -136,13 +145,16 @@ config.fontstyles = [ // make sure classNames are defined in the page the cont
{ name: "headline", className: "headline", classStyle: "font-family: arial black, arial; font-size: 28px; letter-spacing: -2px;" },
{ name: "arial red", className: "headline2", classStyle: "font-family: arial black, arial; font-size: 12px; letter-spacing: -2px; color:red" },
{ name: "verdana blue", className: "headline4", classStyle: "font-family: verdana; font-size: 18px; letter-spacing: -2px; color:blue" }
// leave classStyle blank if it's defined in your stylesheet (above), like this:
// leave classStyle blank if it's defined in config.stylesheet (above), like this:
// { name: "verdana blue", className: "headline4", classStyle: "" }
];
//config.editor_insertHTML = [ { name: "test", "It's easy to add buttons that insert text!" } ];
editor_generate('yourFieldNameHere2',config); // field, width, height
editor_generate('yourFieldNameHere2',config);
</script>
</form>
</body></html>
</body></html>

20
www/extras/htmlArea/popups/about.html
View file

@ -1,19 +1,15 @@
<HTML STYLE="width: 450px; height: 285px; ">
<HTML STYLE="width: 450px; height: 185px; ">
<HEAD><TITLE>About</TITLE>
<style>
html,body,textarea { font-family: verdana,arial; font-size: 9pt; };
</style></HEAD>
<BODY style="background: threedface; color: #000000" topmargin=5 leftmargin=12>
<span style="font-family: arial black, arial; font-size: 28px; letter-spacing: -2px;">htmlArea</span> v2.0 by interactivetools.com<br>
<BODY style="background: #FFFFFF; color: #000000" topmargin=5 leftmargin=12>
<span style="font-family: arial black, arial; font-size: 28px; letter-spacing: -2px;">htmlArea v2.03</span><br>
A free WYSIWYG editor replacement for &lt;textarea&gt; fields.<br>
<p><textarea style="width:100%; height:120px" readonly>
Copyright (c) 2002 interactivetools.com, inc.
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
a) The above copyright notice, this permission notice, and the "About this editor" button that appears as the letter "i" in the editor interface, shall be included in all copies or substantial portions of the Software.
b) The "About this editor" button that appears as the letter "i" in the editor interface must always be visible in the editor interface and bring up the original "About" dialog window when clicked.
c) The "About" dialog window and its contents, including the link to interactivetools.com can not be amended.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
</textarea>
<p>For more information visit:<br>
<p>For full source code and docs, visit:<br>
<a href="http://www.interactivetools.com/products/htmlarea/" target="_blank">http://www.interactivetools.com/products/htmlarea/</a><br><br>
<p>Copyright (c) 2002 interactivetools.com, inc. All Rights Reserved.<br>
</body></html>

99
www/extras/htmlArea/popups/custom2.html
View file

@ -1,10 +1,15 @@
<html style="width:600px; Height: 50px;">
<html style="width:300px; Height: 60px;">
<head>
<title>Insert WebGUI macro</title>
<title>Select Phrase</title>
<script language="javascript">
function returnSelected(in_values) {
var text = in_values;
var myTitle = window.dialogArguments;
document.title = myTitle;
function returnSelected() {
var idx = document.all.textPulldown.selectedIndex;
var text = document.all.textPulldown[idx].text;
window.returnValue = text; // set return value
window.close(); // close dialog
@ -13,88 +18,18 @@ function returnSelected(in_values) {
</script>
</head>
<body bgcolor="#FFFFFF" topmargin=15 leftmargin=0>
<form name="macros" method=get onSubmit="Set(document.all.ColorHex.value); return false;">
<form method=get onSubmit="Set(document.all.ColorHex.value); return false;">
<div align=center>
<select name="textPulldown" onchange="returnSelected(this.value)">
<option value=''>Menus and navigation...</option>
<option value='^FlexMenu;'>FlexMenu</option>
<option value='^M;'>Current Menu (Vertical)</option>
<option value='^m;'>Current Menu (Horizontal)</option>
<option value='^P;'>Previous Menu (Vertical)</option>
<option value='^p;'>Previous Menu (Horizontal)</option>
<option value='^rootmenu;'>Root Menu (Horizontal)</option>
<option value='^S("home",0);'>Specific SubMenu (Vertical)</option>
<option value='^s("home");'>Specific SubMenu (Horizontal)</option>
<option value='^Synopsis;'>Synopsis Menu</option>
<option value='^T;'>Top Level Menu (Vertical)</option>
<option value='^t;'>Top Level Menu (Horizontal)</option>
<option value='^t;'>Top Level Menu (Horizontal)</option>
<option value='^C;'>Crumb Trail</option>
<option value='^H;'>Home Link</option>
<select name="textPulldown">
<option>The quick brown</option>
<option>fox jumps over</option>
<option>the lazy dog.</option>
</select>
<select onchange="returnSelected(this.value)">
<option value=''>SQL...</option>
<option value='^FormParam("phoneNumber");'>FormParam</option>
<option value='^*(100);'>Random Number</option>
<option value='^rownum;'>Row Number</option>
<option value='SQL("select count(*) from users", "there are ^0; on this system.");'>SQL</option>
<option value='^-;'>Begin/End looping</option>
<option value='^0;'>Column 1</option>
<option value='^1;'>Column 2</option>
<option value='^2;'>Column 3</option>
<option value='^3;'>Column 4</option>
<option value='^4;'>Column 5</option>
<option value='^5;'>Column 6</option>
<option value='^6;'>Column 7</option>
<option value='^7;'>Column 8</option>
<option value='^8;'>Column 9</option>
<option value='^9;'>Column 10</option>
</select>
<select onchange="returnSelected(this.value)">
<option value=''>User/Group/Admin...</option>
<option value='^a("Account Info");'>My Account Link</option>
<option value='^AdminBar;'>AdminBar</option>
<option value='^AdminText("You are in admin mode!");'>AdminText</option>
<option value='^AdminToggle;'>AdminToggle</option>
<option value='^GroupText("Visitors","You need an account to do anything cool on this site!");'>GroupText</option>
<option value='^H("Go Home");'>Home Link</option>
<option value='^L;'>Login Form</option>
<option value='^LoginToggle;'>LoginToggle</option>
<option value='^User("email");'>User Information</option>
<option value='^@;'>Username</option>
<option value='^#;'>User ID</option>
</select>
<select onchange="returnSelected(this.value)">
<option value=''>Page/System/Info...</option>
<option value='^c;'>Company Name</option>
<option value='^D;'>Date</option>
<option value='^e;'>Company Email Address</option>
<option value='^Env("REMOTE_ADDR");'>Web Environment Variable</option>
<option value='^Execute("/this/file.sh");'>Execute</option>
<option value='^Extras;'>extras folder</option>
<option value='^Include("/this/file.html");'>Include</option>
<option value='^Page("urlizedTitle");'>Page Properties</option>
<option value='^PageTitle;'>PageTitle</option>
<option value='^r;'>Make Page Printable</option>
<option value='^RootTitle;'>RootTitle</option>
<option value='^*(100);'>Random Number</option>
<option value='^u;'>Company URL</option>
<option value='^URLEncode("Is this my string ?");'>URLEncode</option>
<option value='^/;'>System URL</option>
<option value='^\;'>Page URL</option>
<option value='^?;'>Search Box</option>
</select>
<select onchange="returnSelected(this.value)">
<option value=''>Images...</option>
<option value='^I("imageName");'>Image Manager Image with Tag</option>
<option value='^i("imageName");'>Image Manager Image Path</option>
<option value='^Thumbnail("imageName");'>Thumbnail</option>
<option value='^ThumbnailLinker("imageName");'>ThumbnailLinker</option>
</select>
<input type="button" value=" Go " onClick="returnSelected()">
</div>
</form>
</body></html>
</body></html>

87
www/extras/htmlArea/popups/fullscreen.html
View file

@ -1,4 +1,4 @@
<html STYLE="width: 640px; height: 480px; ">
<html>
<head><title>Fullscreen Editor</title>
<style type="text/css"> body { margin: 0px; border: 0px; background-color: buttonface; } </style>
@ -6,15 +6,25 @@
// if we pass the "window" object as a argument and then set opener to
// equal that we can refer to dialogWindows and popupWindows the same way
opener = window.dialogArguments;
if (window.dialogArguments) { opener = window.dialogArguments; }
var _editor_url = "../";
document.write('<scr'+'ipt src="' +_editor_url+ 'editor.js" language="Javascript1.2"></scr'+'ipt>');
var objname = location.search.substring(1,location.search.length);
var config = opener.document.all[objname].config;
var editor_obj = opener.document.all["_" +objname+ "_editor"]; // html editor object
var parent_editdoc = editor_obj.contentWindow.document; // get iframe editor document object
var parent_objname = location.search.substring(1,location.search.length); // parent editor objname
var parent_config = opener.document.all[parent_objname].config;
var config = cloneObject( parent_config );
var objname = 'editor'; // name of this editor
// DOMViewerObj = config;
// DOMViewerName = 'config';
// window.open('/innerHTML/domviewer.htm');
/* ---------------------------------------------------------------------- *\
Function :
Description :
\* ---------------------------------------------------------------------- */
function _CloseOnEsc() {
if (event.keyCode == 27) {
@ -25,12 +35,35 @@ function _CloseOnEsc() {
}
/* ---------------------------------------------------------------------- *\
Function :
Description :
Function : cloneObject
Description : copy an object by value instead of by reference
Usage : var newObj = cloneObject(oldObj);
\* ---------------------------------------------------------------------- */
function cloneObject(obj) {
var newObj = new Object;
// check for array objects
if (obj.constructor.toString().indexOf('function Array(') == 1) {
newObj = obj.constructor();
}
for (var n in obj) {
var node = obj[n];
if (typeof node == 'object') { newObj[n] = cloneObject(node); }
else { newObj[n] = node; }
}
return newObj;
}
/* ---------------------------------------------------------------------- *\
Function : resize_editor
Description : resize the editor when the user resizes the popup
\* ---------------------------------------------------------------------- */
function resize_editor() { // resize editor to fix window
var editor = document.all['_editor_editor'];
var editor = document.all['_editor_editor'];
newWidth = document.body.offsetWidth;
newHeight = document.body.offsetHeight - editor.offsetTop;
@ -40,30 +73,33 @@ function resize_editor() { // resize editor to fix window
editor.style.width = newWidth;
editor.style.height = newHeight;
}
/* ---------------------------------------------------------------------- *\
Function :
Description :
Function : init
Description : run this code on page load
\* ---------------------------------------------------------------------- */
function init() {
// change maximize button to minimize button
config.btnList["popupeditor"] = ['popupeditor', 'Minimize Editor', 'update_parent(); window.close();', 'fullscreen_minimize.gif'];
config.btnList["popupeditor"] = ['popupeditor', 'Minimize Editor', 'update_parent(); window.close();', 'fullscreen_minimize.gif'];
// set htmlmode button to refer to THIS editor
config.btnList["htmlmode"] = ['HtmlMode', 'View HTML Source', 'editor_setmode(\'editor\')', 'ed_html.gif'];
// change image url to be relative to current path
config.imgURL = "../images/";
// generate editor and resize it
editor_generate('editor', config);
resize_editor();
// set default contents
popup_editdoc = document.all['_editor_editor'].contentWindow.document;
popup_editdoc.body.innerHTML = parent_editdoc.body.innerHTML;
// switch mode if needed
if (parent_config.mode == 'textedit') { editor_setmode(objname, 'textedit'); }
// set child window contents
var parentHTML = opener.editor_getHTML(parent_objname);
editor_setHTML(objname, parentHTML);
// continuously update parent editor window
window.setInterval(update_parent, 333);
@ -71,17 +107,16 @@ function init() {
// setup event handlers
document.body.onkeypress = _CloseOnEsc;
window.onresize = resize_editor;
}
/* ---------------------------------------------------------------------- *\
Function :
Description :
Function : update_parent
Description : update parent window editor field with contents from child window
\* ---------------------------------------------------------------------- */
function update_parent() {
parent_editdoc.body.innerHTML = popup_editdoc.body.innerHTML;
var childHTML = editor_getHTML(objname);
opener.editor_setHTML(parent_objname, childHTML);
}

4
www/extras/htmlArea/popups/insert_table.html
View file

@ -75,9 +75,9 @@ function btnOKClick() {
+ ' width="' +document.all.width.value + document.all.widthExt.value+ '"'
+ ' align="' +document.all.alignment.value+ '">\n';
for (var x=1; x<document.all.rows.value; x++) {
for (var x=0; x<document.all.rows.value; x++) {
table += " <tr>\n";
for (var y=1; y<document.all.cols.value; y++) {
for (var y=0; y<document.all.cols.value; y++) {
table += " <td></td>\n";
}
table += " </tr>\n";

1397
www/extras/htmlArea/readme.html
View file

File diff suppressed because it is too large Load diff