[Phpslash-commit] CVS: phpslash-dev/public_html/scripts/htmlarea3 dialog.js,NONE,1.1 example-fully-l

SourceForge Headquarters 225 Broadway Suite 1600 San Diego, CA 92101 +1 (858) 454-5900

Update of /cvsroot/phpslash/phpslash-dev/public_html/scripts/htmlarea3
In directory sc8-pr-cvs1:/tmp/cvs-serv12035/phpslash-dev/public_html/scripts/htmlarea3

Added Files:
	dialog.js example-fully-loaded.html example-spell-checker.html 
	example-table-operations.html example.html htmlarea.css 
	htmlarea.js index.html license.txt make-release.pl 
	makefile.xml popupdiv.js popupwin.js project-config.xml 
	reference.html release-notes.html test.cgi 
Log Message:
Added preliminary htmlArea editing support to the Story entry form.

--- NEW FILE: dialog.js ---
// Though "Dialog" looks like an object, it isn't really an object.  Instead
// it's just namespace for protecting global symbols.

function Dialog(url, action, init) {
	if (typeof init == "undefined") {
		init = window;	// pass this window object by default
	}
	Dialog._geckoOpenModal(url, action, init);
};

Dialog._parentEvent = function(ev) {
	if (Dialog._modal && !Dialog._modal.closed) {
		Dialog._modal.focus();
		HTMLArea._stopEvent(ev);
	}
};

// should be a function, the return handler of the currently opened dialog.
Dialog._return = null;

// constant, the currently opened dialog
Dialog._modal = null;

// the dialog will read it's args from this variable
Dialog._arguments = null;

Dialog._geckoOpenModal = function(url, action, init) {
	var dlg = window.open(url, "hadialog",
			      "toolbar=no,menubar=no,personalbar=no,width=10,height=10," +
			      "scrollbars=no,resizable=yes");
	Dialog._modal = dlg;
	Dialog._arguments = init;

	// capture some window's events
	function capwin(w) {
		HTMLArea._addEvent(w, "click", Dialog._parentEvent);
		HTMLArea._addEvent(w, "mousedown", Dialog._parentEvent);
		HTMLArea._addEvent(w, "focus", Dialog._parentEvent);
	};
	// release the captured events
	function relwin(w) {
		HTMLArea._removeEvent(w, "click", Dialog._parentEvent);
		HTMLArea._removeEvent(w, "mousedown", Dialog._parentEvent);
		HTMLArea._removeEvent(w, "focus", Dialog._parentEvent);
	};
	capwin(window);
	// capture other frames
	for (var i = 0; i < window.frames.length; capwin(window.frames[i++]));
	// make up a function to be called when the Dialog ends.
	Dialog._return = function (val) {
		if (val && action) {
			action(val);
		}
		relwin(window);
		// capture other frames
		for (var i = 0; i < window.frames.length; relwin(window.frames[i++]));
		Dialog._modal = null;
	};
};

--- NEW FILE: example-fully-loaded.html ---
<html>
<head>
<title>Example of HTMLArea 3.0</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!-- load the main HTMLArea files -->
<script type="text/javascript" src="htmlarea.js"></script>
<script type="text/javascript" src="lang/en.js"></script>
<script type="text/javascript" src="dialog.js"></script>
<!-- <script type="text/javascript" src="popupdiv.js"></script> -->
<script type="text/javascript" src="popupwin.js"></script>

<!-- load the plugins -->
<script type="text/javascript">
      // WARNING: using this interface to load plugin
      // will _NOT_ work if plugins do not have the language
      // loaded by HTMLArea.

      // In other words, this function generates SCRIPT tags
      // that load the plugin and the language file, based on the
      // global variable HTMLArea.I18N.lang (defined in the lang file,
      // in our case "lang/en.js" loaded above).

      // If this lang file is not found the plugin will fail to
      // load correctly and nothing will work.

      HTMLArea.loadPlugin("TableOperations");
      HTMLArea.loadPlugin("SpellChecker");
</script>

<style type="text/css">
@import url(htmlarea.css);

html, body {
  font-family: Verdana,sans-serif;
  background-color: #fea;
  color: #000;
}
a:link, a:visited { color: #00f; }
a:hover { color: #048; }
a:active { color: #f00; }

textarea { background-color: #fff; border: 1px solid 00f; }
</style>

<script type="text/javascript">
var editor = null;
function initEditor() {
  // create an editor for the "ta" textbox
  editor = new HTMLArea("ta");

  // register the SpellChecker plugin
  editor.registerPlugin("TableOperations");

  // register the SpellChecker plugin
  editor.registerPlugin("SpellChecker");

  editor.generate();
  return false;
}

function insertHTML() {
  var html = prompt("Enter some HTML code here");
  if (html) {
    editor.insertHTML(html);
  }
}
function highlight() {
  editor.surroundHTML('<span style="background-color: yellow">', '</span>');
}
</script>

</head>

<!-- use <body onload="HTMLArea.replaceAll()" if you don't care about
     customizing the editor.  It's the easiest way! :) -->
<body onload="initEditor()">

<h1>HTMLArea 3.0</h1>

<p>A replacement for <code>TEXTAREA</code> elements.  &copy; <a
href="http://interactivetools.com">InteractiveTools.com</a>, 2003.</p>

<p>Plugins:
      <tt>TableOperations<tt> |
      <tt>SpellChecker</tt>
</p>

<form action="test.cgi" method="post" id="edit" name="edit">

<textarea id="ta" name="ta" style="width:100%" rows="24" cols="80">

      <h1>This is the fully loaded HTMLArea ;-)</h1>

      <p>It loads all the plugins that have been developed so far.</p>

      <table style="background-color: #99f; border: 1px dashed #08f; width:
        60%; border-collapse: collapse;" align="center">
        <tr style="background-color: #fdd">
          <td style="font-weight: bold; border: 1px solid #000;">Plugin</td>
          <td style="font-weight: bold; border: 1px solid #000;">Sponsor</td>
        </tr>

        <tr>
          <td style="font-family: monospace">TableOperations</td>
          <td><a href="http://bloki.com">Zapatec, Inc.</a></td>
        </tr>

        <tr>
          <td style="font-family: monospace">SpellChecker</td>
          <td><a href="http://americanbible.org">Amerian Bible Society</a></td>
        </tr>
      </table>

</textarea>

<p />

<input type="submit" name="ok" value="  submit  " />
<input type="button" name="ins" value="  insert html  " onclick="return insertHTML();" />
<input type="button" name="hil" value="  highlight text  " onclick="return highlight();" />

<a href="javascript:mySubmit()">submit</a>

<script type="text/javascript">
function mySubmit() {
// document.edit.save.value = "yes";
document.edit.onsubmit(); // workaround browser bugs.
document.edit.submit();
};
</script>

</form>

</body>
</html>

--- NEW FILE: example-spell-checker.html ---
<html>
<head>
<title>Example of HTMLArea 3.0</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!-- load the main HTMLArea files -->
<script type="text/javascript" src="htmlarea.js"></script>
<script type="text/javascript" src="lang/en.js"></script>
<script type="text/javascript" src="dialog.js"></script>
<!-- <script type="text/javascript" src="popupdiv.js"></script> -->
<script type="text/javascript" src="popupwin.js"></script>

<!-- load the SpellChecker plugin files -->
<script type="text/javascript" src="plugins/SpellChecker/spell-checker.js"></script>
<script type="text/javascript" src="plugins/SpellChecker/lang/en.js"></script>

<style type="text/css">
@import url(htmlarea.css);

html, body {
  font-family: Verdana,sans-serif;
  background-color: #fea;
  color: #000;
}
a:link, a:visited { color: #00f; }
a:hover { color: #048; }
a:active { color: #f00; }

textarea { background-color: #fff; border: 1px solid 00f; }
</style>

<script type="text/javascript">
var editor = null;
function initEditor() {
  // create an editor for the "ta" textbox
  editor = new HTMLArea("ta");

  // register the SpellChecker plugin
  editor.registerPlugin("SpellChecker");

  editor.generate();
  return false;
}

function insertHTML() {
  var html = prompt("Enter some HTML code here");
  if (html) {
    editor.insertHTML(html);
  }
}
function highlight() {
  editor.surroundHTML('<span style="background-color: yellow">', '</span>');
}
</script>

</head>

<!-- use <body onload="HTMLArea.replaceAll()" if you don't care about
     customizing the editor.  It's the easiest way! :) -->
<body onload="initEditor()">

<h1>HTMLArea 3.0</h1>

<p>A replacement for <code>TEXTAREA</code> elements.  &copy; <a
href="http://interactivetools.com">InteractiveTools.com</a>, 2003.</p>

<p>Plugins:
      <tt>SpellChecker</tt> (sponsored by <a
        href="http://americanbible.org">American Bible Society</a>).
</p>

<form action="test.cgi" method="post" id="edit" name="edit">

<textarea id="ta" name="ta" style="width:100%" rows="24" cols="80">

<h1>The <tt>SpellChecker</tt> plugin</h1>

      <p>This file deminstrates the <tt>SpellChecker</tt> plugin of
      HTMLArea.  To inwoke the spell checkert you need to press the
      <em>spell-check</em> buton in the toolbar.</p>

      <p>The spell-checker uses a serverside script written in Perl.  The
        Perl script calls <a href="http://aspell.net">aspell</a> for any
        word in the text and reports wordz that aren't found in the
        dyctionari.</p>

      <p>The document that yu are reading now <b>intentionaly</b> containes
        some errorz, so that you have something to corect ;-)</p>

      <p>Credits for the <tt>SpellChecker</tt> plugin go to:</p>

      <ul>

        <li><a href="http://aspell.net">Aspell</a> -- spell
          checker</li>

        <li>The <a href="http://perl.org">Perl</a> programming language</li>

        <li><tt><a
              href="http://cpan.org/modules/by-module/Text/Text-Aspell-0.02.readme">Text::Aspell</a></tt>
          -- Perl interface to Aspell</li>

        <li><a href="http://americanbible.org">American Bible Society</a> --
          for sponsoring the <tt>SpellChecker</tt> plugin for
          <tt>HTMLArea</tt></li>

        <li><a href="http://dynarch.com/mishoo/">Your humble servant</a> for
          implementing it ;-)</li>

      </ul>

</textarea>

<p />

<input type="submit" name="ok" value="  submit  " />
<input type="button" name="ins" value="  insert html  " onclick="return insertHTML();" />
<input type="button" name="hil" value="  highlight text  " onclick="return highlight();" />

<a href="javascript:mySubmit()">submit</a>

<script type="text/javascript">
function mySubmit() {
// document.edit.save.value = "yes";
document.edit.onsubmit(); // workaround browser bugs.
document.edit.submit();
};
</script>

</form>

</body>
</html>

--- NEW FILE: example-table-operations.html ---
<html>
<head>
<title>Example of HTMLArea 3.0</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!-- load the main HTMLArea files -->
<script type="text/javascript" src="htmlarea.js"></script>
<script type="text/javascript" src="lang/en.js"></script>
<script type="text/javascript" src="dialog.js"></script>
<!-- <script type="text/javascript" src="popupdiv.js"></script> -->
<script type="text/javascript" src="popupwin.js"></script>

<!-- load the TableOperations plugin files -->
<script type="text/javascript" src="plugins/TableOperations/table-operations.js"></script>
<script type="text/javascript" src="plugins/TableOperations/lang/en.js"></script>

<style type="text/css">
@import url(htmlarea.css);

html, body {
  font-family: Verdana,sans-serif;
  background-color: #fea;
  color: #000;
}
a:link, a:visited { color: #00f; }
a:hover { color: #048; }
a:active { color: #f00; }

textarea { background-color: #fff; border: 1px solid 00f; }
</style>

<script type="text/javascript">
var editor = null;
function initEditor() {
  // create an editor for the "ta" textbox
  editor = new HTMLArea("ta");

  // register the TableOperations plugin with our editor
  editor.registerPlugin("TableOperations");

  editor.generate();
  return false;
}

function insertHTML() {
  var html = prompt("Enter some HTML code here");
  if (html) {
    editor.insertHTML(html);
  }
}
function highlight() {
  editor.surroundHTML('<span style="background-color: yellow">', '</span>');
}
</script>

</head>

<!-- use <body onload="HTMLArea.replaceAll()" if you don't care about
     customizing the editor.  It's the easiest way! :) -->
<body onload="initEditor()">

<h1>HTMLArea 3.0</h1>

<p>A replacement for <code>TEXTAREA</code> elements.  &copy; <a
href="http://interactivetools.com">InteractiveTools.com</a>, 2003.</p>

<p>Page that demonstrates the additional features of the
<tt>TableOperations</tt> plugin (sponsored by <a
href="http://www.bloki.com">Zapatec Inc.</a>).</p>

<form action="test.cgi" method="post" id="edit" name="edit">

<textarea id="ta" name="ta" style="width:100%" rows="24" cols="80">

<h1>Plugin: <tt>TableOperations</tt></h1>

<p>This page exemplifies the table operations toolbar, provided by the
TableOperations plugin.</p>

<p>Following there is a table.</p>

<table border="1" style="border: 2px solid rgb(255, 0, 0); width: 80%; background-image: none; border-collapse: collapse; color: rgb(153, 102, 0); background-color: rgb(255, 255, 51);" align="center" cellspacing="2" cellpadding="1" summary="">
  <caption>This <span style="font-weight: bold;">is</span> a table</caption>
  <tbody>
  <tr style="border-style: none; background-image: none; background-color: rgb(255, 255, 153);" char="." align="left" valign="middle"> <td>1.1</td> <td>1.2</td> <td>1.3</td> <td>1.4</td> </tr>
  <tr> <td>2.1</td> <td style="border: 1px solid rgb(51, 51, 255); background-image: none; background-color: rgb(102, 255, 255); color: rgb(0, 0, 51);" char="." align="left" valign="middle">2.2</td> <td>2.3</td> <td>2.4</td> </tr>
  <tr> <td>3.1</td> <td>3.2</td> <td style="border: 2px dashed rgb(51, 204, 102); background-image: none; background-color: rgb(102, 255, 153); color: rgb(0, 51, 0);" char="." align="left" valign="middle">3.3</td> <td>3.4</td> </tr>
  <tr> <td style="background-color: rgb(255, 204, 51);">4.1</td> <td style="background-color: rgb(255, 204, 51);">4.2</td> <td style="background-color: rgb(255, 204, 51);">4.3</td> <td style="background-color: rgb(255, 204, 51);">4.4</td> </tr>
  </tbody>
</table>

<p>Text after the table</p>

</textarea>

<p />

<input type="submit" name="ok" value="  submit  " />
<input type="button" name="ins" value="  insert html  " onclick="return insertHTML();" />
<input type="button" name="hil" value="  highlight text  " onclick="return highlight();" />

<a href="javascript:mySubmit()">submit</a>

<script type="text/javascript">
function mySubmit() {
// document.edit.save.value = "yes";
document.edit.onsubmit(); // workaround browser bugs.
document.edit.submit();
};
</script>

</form>

</body>
</html>

--- NEW FILE: example.html ---
<html>
<head>
<title>Example of HTMLArea 3.0</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type="text/javascript" src="htmlarea.js"></script>
<script type="text/javascript" src="lang/en.js"></script>
<script type="text/javascript" src="dialog.js"></script>

<style type="text/css">
@import url(htmlarea.css);

html, body {
  font-family: Verdana,sans-serif;
  background-color: #fea;
  color: #000;
}
a:link, a:visited { color: #00f; }
a:hover { color: #048; }
a:active { color: #f00; }

textarea { background-color: #fff; border: 1px solid 00f; }
</style>

<script type="text/javascript">
var editor = null;
function initEditor() {
  editor = new HTMLArea("ta");

  // comment the following two lines to see how customization works
  editor.generate();
  return false;

  var cfg = editor.config; // this is the default configuration
  cfg.registerButton({
    id        : "my-hilite",
    tooltip   : "Highlight text",
    image     : "ed_custom.gif",
    textMode  : false,
    action    : function(editor) {
                  editor.surroundHTML("<span class=\"hilite\">", "</span>");
                },
    context   : 'table'
  });

  cfg.toolbar.push(["linebreak", "my-hilite"]); // add the new button to the toolbar

  // BEGIN: code that adds a custom button
  // uncomment it to test
  var cfg = editor.config; // this is the default configuration
  /*
  cfg.registerButton({
    id        : "my-hilite",
    tooltip   : "Highlight text",
    image     : "ed_custom.gif",
    textMode  : false,
    action    : function(editor) {
                  editor.surroundHTML("<span class=\"hilite\">", "</span>");
                }
  });
  */

function clickHandler(editor, buttonId) {
  switch (buttonId) {
    case "my-toc":
      editor.insertHTML("<h1>Table Of Contents</h1>");
      break;
    case "my-date":
      editor.insertHTML((new Date()).toString());
      break;
    case "my-bold":
      editor.execCommand("bold");
      editor.execCommand("italic");
      break;
    case "my-hilite":
      editor.surroundHTML("<span class=\"hilite\">", "</span>");
      break;
  }
};
cfg.registerButton("my-toc",  "Insert TOC", "ed_custom.gif", false, clickHandler);
cfg.registerButton("my-date", "Insert date/time", "ed_custom.gif", false, clickHandler);
cfg.registerButton("my-bold", "Toggle bold/italic", "ed_custom.gif", false, clickHandler);
cfg.registerButton("my-hilite", "Hilite selection", "ed_custom.gif", false, clickHandler);

cfg.registerButton("my-sample", "Class: sample", "ed_custom.gif", false,
  function(editor) {
    if (HTMLArea.is_ie) {
      editor.insertHTML("<span class=\"sample\">&nbsp;&nbsp;</span>");
      var r = editor._doc.selection.createRange();
      r.move("character", -2);
      r.moveEnd("character", 2);
      r.select();
    } else { // Gecko/W3C compliant
      var n = editor._doc.createElement("span");
      n.className = "sample";
      editor.insertNodeAtSelection(n);
      var sel = editor._iframe.contentWindow.getSelection();
      sel.removeAllRanges();
      var r = editor._doc.createRange();
      r.setStart(n, 0);
      r.setEnd(n, 0);
      sel.addRange(r);
    }
  }
);

  /*
  cfg.registerButton("my-hilite", "Highlight text", "ed_custom.gif", false,
    function(editor) {
      editor.surroundHTML('<span class="hilite">', '</span>');
    }
  );
  */
  cfg.pageStyle = "body { background-color: #efd; } .hilite { background-color: yellow; } "+
                  ".sample { color: green; font-family: monospace; }";
  cfg.toolbar.push(["linebreak", "my-toc", "my-date", "my-bold", "my-hilite", "my-sample"]); // add the new button to the toolbar
  // END: code that adds a custom button

  editor.generate();
}
function insertHTML() {
  var html = prompt("Enter some HTML code here");
  if (html) {
    editor.insertHTML(html);
  }
}
function highlight() {
  editor.surroundHTML('<span style="background-color: yellow">', '</span>');
}
</script>

</head>

<!-- use <body onload="HTMLArea.replaceAll()" if you don't care about
     customizing the editor.  It's the easiest way! :) -->
<body onload="initEditor()">

<h1>HTMLArea 3.0</h1>

<p>A replacement for <code>TEXTAREA</code> elements.  &copy; <a
href="http://interactivetools.com">InteractiveTools.com</a>, 2003.</p>

<form action="test.cgi" method="post" id="edit" name="edit">

<textarea id="ta" name="ta" style="width:100%" rows="20" cols="80">
  &lt;p&gt;Here is some sample text: &lt;b&gt;bold&lt;/b&gt;, &lt;i&gt;italic&lt;/i&gt;, &lt;u&gt;underline&lt;/u&gt;. &lt;/p&gt;
  &lt;p align=center&gt;Different fonts, sizes and colors (all in bold):&lt;/p&gt;
  &lt;p&gt;&lt;b&gt;
   &lt;font face="arial"           size="7" color="#000066"&gt;arial&lt;/font&gt;,
   &lt;font face="courier new"     size="6" color="#006600"&gt;courier new&lt;/font&gt;,
   &lt;font face="georgia"         size="5" color="#006666"&gt;georgia&lt;/font&gt;,
   &lt;font face="tahoma"          size="4" color="#660000"&gt;tahoma&lt;/font&gt;,
   &lt;font face="times new roman" size="3" color="#660066"&gt;times new roman&lt;/font&gt;,
   &lt;font face="verdana"         size="2" color="#666600"&gt;verdana&lt;/font&gt;,
   &lt;font face="tahoma"          size="1" color="#666666"&gt;tahoma&lt;/font&gt;
  &lt;/b&gt;&lt;/p&gt;
  &lt;p&gt;Click on &lt;a href="http://www.interactivetools.com/"&gt;this link&lt;/a&gt; and then on the link button to the details ... OR ... select some text and click link to create a &lt;b&gt;new&lt;/b&gt; link.&lt;/p&gt;
</textarea>

<p />

<input type="submit" name="ok" value="  submit  " />
<input type="button" name="ins" value="  insert html  " onclick="return insertHTML();" />
<input type="button" name="hil" value="  highlight text  " onclick="return highlight();" />

<a href="javascript:mySubmit()">submit</a>

<script type="text/javascript">
function mySubmit() {
// document.edit.save.value = "yes";
document.edit.onsubmit(); // workaround browser bugs.
document.edit.submit();
};
</script>

</form>

</body>
</html>

--- NEW FILE: htmlarea.css ---
.htmlarea { background: #fff; }

.htmlarea .toolbar {
  cursor: default;
  background: ButtonFace;
  padding: 1px 1px 2px 1px;
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
}
.htmlarea .toolbar table { font-family: tahoma,verdana,sans-serif; font-size: 11px; }
.htmlarea .toolbar img { border: none; }
.htmlarea .toolbar .label { padding: 0px 3px; }

.htmlarea .toolbar .button {
  background: ButtonFace;
  color: ButtonText;
  border: 1px solid ButtonFace;
  padding: 1px;
  margin: 0px;
  width: 18px;
  height: 18px;
}
.htmlarea .toolbar .buttonHover {
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
}
.htmlarea .toolbar .buttonActive, .htmlarea .toolbar .buttonPressed {
  padding: 2px 0px 0px 2px;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
}
.htmlarea .toolbar .buttonPressed {
  background: ButtonHighlight;
}
.htmlarea .toolbar .indicator {
  padding: 0px 3px;
  overflow: hidden;
  width: 20px;
  text-align: center;
  cursor: default;
  border: 1px solid ButtonShadow;
}

.htmlarea .toolbar .buttonDisabled { background-color: #aaa; }

.htmlarea .toolbar .buttonDisabled img {
  filter: alpha(opacity = 25);
  -moz-opacity: 25%;
}

.htmlarea .toolbar .separator {
  position: relative;
  margin: 3px;
  border-left: 1px solid ButtonShadow;
  border-right: 1px solid ButtonHighlight;
  width: 0px;
  height: 16px;
  padding: 0px;
}

.htmlarea .toolbar .space { width: 5px; }

.htmlarea .toolbar select { font: 11px Tahoma,Verdana,sans-serif; }

.htmlarea .toolbar select,
.htmlarea .toolbar select:hover,
.htmlarea .toolbar select:active { background: FieldFace; color: ButtonText; }

.htmlarea .statusBar {
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
  padding: 2px 4px;
  background-color: ButtonFace;
  color: ButtonText;
  font: 11px Tahoma,Verdana,sans-serif;
}

.htmlarea .statusBar .statusBarTree a {
  padding: 2px 5px;
  color: #00f;
}

.htmlarea .statusBar .statusBarTree a:visited { color: #00f; }
.htmlarea .statusBar .statusBarTree a:hover {
  background-color: Highlight;
  color: HighlightText;
  padding: 1px 4px;
  border: 1px solid HighlightText;
}

/* Hidden DIV popup dialogs (PopupDiv) */

.dialog {
  color: ButtonText;
  background: ButtonFace;
}

.dialog .content { padding: 2px; }

.dialog, .dialog button, .dialog input, .dialog select, .dialog textarea, .dialog table {
  font: 11px Tahoma,Verdana,sans-serif;
}

.dialog table { border-collapse: collapse; }

.dialog .title {
  background: #008;
  color: #ff8;
  border-bottom: 1px solid #000;
  padding: 1px 0px 2px 5px;
  font-size: 12px;
  font-weight: bold;
  cursor: default;
}

.dialog .title .button {
  float: right;
  border: 1px solid #66a;
  padding: 0px 1px 0px 2px;
  margin-right: 1px;
  color: #fff;
  text-align: center;
}

.dialog .title .button-hilite { border-color: #88f; background: #44c; }

.dialog button {
  width: 5em;
  padding: 0px;
}

.dialog .buttonColor {
  padding: 1px;
  cursor: default;
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
}

.dialog .buttonColor-hilite {
  border-color: #000;
}

.dialog .buttonColor .chooser, .dialog .buttonColor .nocolor {
  height: 0.6em;
  border: 1px solid;
  padding: 0px 1em;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
}

.dialog .buttonColor .nocolor { padding: 0px; }
.dialog .buttonColor .nocolor-hilite { background-color: #fff; color: #f00; }

.dialog .label { text-align: right; width: 6em; }
.dialog .value input { width: 100%; }
.dialog .buttons { text-align: right; padding: 2px 4px 0px 4px; }

.dialog legend { font-weight: bold; }
.dialog fieldset table { margin: 2px 0px; }

.popupdiv {
  border: 2px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
}

.popupwin {
  padding: 0px;
  margin: 0px;
}

.popupwin .title {
  background: #fff;
  color: #000;
  font-weight: bold;
  font-size: 120%;
  padding: 3px 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid black;
  letter-spacing: 2px;
}

form { margin: 0px; border: none; }

--- NEW FILE: htmlarea.js ---
//
// htmlArea v3.0 - 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 full source code and docs, visit http://www.interactivetools.com/
//
// Version 3.0 developed by Mihai Bazon for InteractiveTools.
//   http://dynarch.com/mishoo
//
// $Id: htmlarea.js,v 1.1 2003/11/12 21:29:48 joestewart Exp $

// Creates a new HTMLArea object.  Tries to replace the textarea with the given
// ID with it.
function HTMLArea(textarea, config) {
	if (HTMLArea.checkSupportedBrowser()) {
		if (typeof config == "undefined") {
			this.config = new HTMLArea.Config();
		} else {
[...1800 lines suppressed...]
};

HTMLArea.prototype.popupURL = function(file) {
	var url = "";
	if (file.match(/^plugin:\/\/(.*?)\/(.*)/)) {
		var plugin = RegExp.$1;
		var popup = RegExp.$2;
		if (!/\.html$/.test(popup))
			popup += ".html";
		url = this.config.editorURL + "plugins/" + plugin + "/popups/" + popup;
	} else
		url = this.config.editorURL + this.config.popupURL + file;
	return url;
};

// EOF
// Local variables: //
// c-basic-offset:8 //
// indent-tabs-mode:t //
// End: //

--- NEW FILE: index.html ---
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.2//EN">
<html>
  <head>
    <title>HTMLArea -- the free, customizable online editor</title>

    <style type="text/css">
      html, body { font-family: georgia,"times new roman",serif; background-color: #fff; color: #000; }
      .label { text-align: right; padding-right: 0.3em; }
      .bline { border-bottom: 1px solid #aaa; }
    </style>
  </head>

  <body>
    <div style="float: right; border: 1px solid #aaa; background-color: #eee; padding: 3px; margin-left: 10px; margin-bottom: 10px;">
      <table cellspacing="0" cellpadding="0" border="0">
        <tr>
          <td class="label">Version:</td><td><% $version %></td>
        </tr>
        <tr>
          <td class="label">Release:</td><td><% $release %> (<a href="release-notes.html">release notes</a>)</td>
        </tr>
        <tr>
          <td class="label bline">Compiled at:</td><td class="bline"><% $time %></td>
        </tr>
        <tr>
          <td class="label">SourceForge page:</td><td><a href="http://sf.net/projects/itools-htmlarea/">http://sf.net/projects/itools-htmlarea/</a></td>
      </table>
    </div>
    <h1>HTMLArea -- the free<br/>customizable online editor</h1>

    <p>
      HTMLArea is a free, customizable online editor.  It works inside your
      browser.  It uses a non-standard feature implemented in Internet
      Explorer 5.5 or better for Windows and Mozilla 1.3 or better (any
      platform), therefore it will only work in one of these browsers.
    </p>

    <p>
      HTMLArea is copyright <a
      href="http://interactivetools.com">InteractiveTools.com</a> and
      released under a BSD-style license.  HTMLArea is created and developed
      upto version 2.03 by InteractiveTools.com.  Version 3.0 developed by
      <a href="http://dynarch.com/mishoo/">Mihai Bazon</a> for
      InteractiveTools.  It contains code sponsored by other companies as
      well.
    </p>

    <h2>Online demos</h2>

    <ul>

      <li><a href="example.html">HTMLArea standard</a> -- contains the core
        editor.</li>

      <li><a href="example-table-operations.html">HTMLArea + tables</a> --
        loads the <tt>TableOperations</tt> plugin, sponsored by <a
          href="http://bloki.com">Zapatec Inc.</a></li>

      <li><a href="example-spell-checker.html">HTMLArea + spell checher</a>
        -- loads the <tt>SpellChecker</tt> plugin, sponsored by <a
          href="http://americanbible.org">American Bible Society</a>.</li>

      <li><a href="example-fully-loaded.html">HTMLArea fully loaded</a> ;-)</li>

    </ul>

    <h2>Installation</h2>

    <p>
      Installation is (or should be) easy.  You need to unpack the ZIP file
      in a directory accessible through your webserver.  Supposing you
      unpack in your <tt>DocumentRoot</tt> and your <tt>DocumentRoot</tt> is
      <tt>/var/www/html</tt> as in a standard RedHat installation, you need
      to acomplish the following steps: (the example is for a Unix-like
      operating system)
    </p>

    <pre style="margin-left: 2em"
>
cd /var/www/html
unzip /path/to/archive/<% $basename %>.zip
mv <% $basename %> htmlarea
find htmlarea/ -type f -exec chmod 644 {} \;
find htmlarea/ -type d -exec chmod 755 {} \;
find htmlarea/ -name "*.cgi" -exec chmod 755 {} \;</pre>

    <p>
      <strong>Notes.</strong> You may chose to symlink "htmlarea" to "<%
      $basename %>", in which case your server needs to be configured to
      "<tt>FollowSymLinks</tt>".  You need to make sure that *.cgi files are
      interpreted as CGI scripts.  If you want to use the SpellChecker
      plugin you need to have a recent version of Perl installed (I
      recommend 5.8.0) on the server, and the module Text::Aspell, available
      from CPAN.  More info in "<a
      href="plugins/SpellChecker/readme-tech.html">plugins/SpellChecker/readme-tech.html</a>".
    </p>

    <p>About how to setup your pages to use the editor, please read the
      [outdated yet generally valid] <a
        href="reference.html">documentation</a>.</p>

    <h2>Status and links</h2>

    <p>HTMLArea has reached version 3.0.  As of this version, it
      supports:</p>

    <ul>

      <li>Customizable toolbar</li>

      <li>Easy internationalization</li>

      <li>Plugin-based infrastructure</li>

      <li>Delivers W3-compliant HTML (with few exceptions)</li>

      <li>Has a subset of Microsoft Word's keyboard shortcuts</li>

      <li>Full-screen editor</li>

      <li>Advanced table operations (by external plugin
        "TableOperations")</li>

      <li>Spell checker (by external plugin "SpellChecker")</li>

      <li>probably more... ;-)</li>

    </ul>

    <p>We have a <a
    href="http://sourceforge.net/projects/itools-htmlarea/">project page</a>
    at <a href="http://sourceforge.net">SourceForge.net</a>.  There you can
    also find out <a href="http://sourceforge.net/cvs/?group_id=69750">how
    to retrieve the code from CVS</a>, or you can <a
    href="http://cvs.sourceforge.net/cgi-bin/viewcvs.cgi/itools-htmlarea">browse
    the CVS online</a>.  We also have a <a
    href="http://sourceforge.net/tracker/?atid=525656&group_id=69750&func=browse">bug
    system</a>, a <a
    href="http://sourceforge.net/tracker/?atid=525658&group_id=69750&func=browse">patch
    tracking system</a> and a <a
    href="http://sourceforge.net/tracker/?atid=525659&group_id=69750&func=browse">feature
    request page</a>.</p>

    <p>We invite you to say everything you want about HTMLArea <a
    href="http://www.interactivetools.com/forum/gforum.cgi?forum=14;">on the
    forums</a> at InteractiveTools.com.  There you should also find the
    latest news.</p>

    <p>Sometimes I post news about the latest developments on <a
    href="http://dynarch.com/mishoo/">my personal homepage</a>.</p>

    <h2>"It doesn't work, what's wrong?"</h2>

    <p>If it doesn't work, you have several options:</p>

    <ul>

      <li>Post a message to the forum.  Describe your problem in as much
      detail as possible.  Include errors you might find in the JavaScript
      console (if you are a Mozilla user), or errors displayed by IE (though
      they're most of the times useless).</li>

      <li>If you're positive that you discovered a bug in HTMLArea then feel
      free to fill a bug report in our bug system.  If you have the time you
      should check to see if a similar bug was reported or not; it might be
      fixed already in the CVS ;-) If you're positive that a similar bug was
      not yet reported, do fill a bug report and please include as much
      detail as possible, such as your browser, OS, errors from JavaScript
      console, etc.</li>

      <li>If you want a new feature to be implemented, post it on the
      features request and someone will hopefully take care of it.</li>

    </ul>

    <p>You can <a href="mailto:mi...@in...">contact me directly</a>
    <em>only</em> if you want to pay me for implementing custom features to
    HTMLArea.  If you want to sponsor these features (that is, allow them to
    get back into the public HTMLArea distribution) I'll be cheaper. ;-)</p>

    <hr />
    <address><a href="http://dynarch.com/mishoo/">Mihai Bazon</a></address>
<!-- Created: Sun Aug  3 14:11:26 EEST 2003 -->
<!-- hhmts start -->
Last modified on Sun Sep 28 14:56:12 2003
<!-- hhmts end -->
<!-- doc-lang: English -->
  </body>
</html>

<%ARGS>
  $project => 'HTMLArea'
  $version => '3.0'
  $release => 'beta'
  $basename => 'HTMLArea-3.0-beta'
</%ARGS>

<%INIT>;
use POSIX qw(strftime);
my $time = strftime '%b %e, %Y [%H:%M] GMT', gmtime;
</%INIT>

--- NEW FILE: license.txt ---
htmlArea License (based on BSD license)

Copyright (c) 2002, interactivetools.com, inc.

Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:

1) Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. 

2) Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution. 

3) Neither the name of interactivetools.com, inc. nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. 

THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

--- NEW FILE: make-release.pl ---
#! /usr/bin/perl -w
# $Id: make-release.pl,v 1.1 2003/11/12 21:29:48 joestewart Exp $

# Script for creating a distribution archive.  Based on make-release.pl from
# jscalendar.

# Author: Mihai Bazon, http://dynarch.com/mishoo
# NO WARRANTIES WHATSOEVER.  READ GNU LGPL.

# This file requires HTML::Mason; this module is used for automatic
# substitution of the version/release number as well as for selection of the
# changelog (at least in the file release-notes.html).  It might not work
# without HTML::Mason.

use strict;
# use diagnostics;
use HTML::Mason;
use File::Find;
use XML::Parser;
use Data::Dumper;

my $verbosity = 1;

my $tmpdir = '/tmp';

my $config = parseXML("project-config.xml");
speak(3, Data::Dumper::Dumper($config));

my ($project, $version, $release, $basename);

$project = $config->{project}{ATTR}{title};
$version = $config->{project}{version}{DATA};
$release = $config->{project}{release}{DATA};
$basename = "$project-$version";
$basename .= "-$release" if ($release);

speak(1, "Project: $basename");

## create directory tree
my ($basedir);
{
    # base directory
    $basedir = "$tmpdir/$basename";
    if (-d $basedir) {
        speak(-1, "$basedir already exists, removing... >:-]\n");
        system "rm -rf $basedir";
    }
}

process_directory();

## make the ZIP file
chdir "$basedir/..";
speak(1, "Making ZIP file /tmp/$basename.zip");
system ("zip -r $basename.zip $basename > /dev/null");
system ("ls -la /tmp/$basename.zip");

## remove the basedir
system("rm -rf $basedir");

## back
#chdir $cwd;

### SUBROUTINES

# handle _one_ file
sub process_one_file {
    my ($attr, $target) = @_;

    $target =~ s/\/$//;
    $target .= '/';
    my $destination = $target.$attr->{REALNAME};

    # copy file first
    speak(1, "   copying $attr->{REALNAME}");
    system "cp $attr->{REALNAME} $destination";

    my $masonize = $attr->{masonize} || '';
    if ($masonize =~ /yes|on|1/i) {
        speak(1, "   > masonizing to $destination...");
        my $args = $attr->{args} || '';
        my @vars = split(/\s*,\s*/, $args);
        my %args = ();
        foreach my $i (@vars) {
            $args{$i} = eval '$'.$i;
            speak(1, "      > argument: $i => $args{$i}");
        }
        my $outbuf;
        my $interp = HTML::Mason::Interp->new ( comp_root    => $target,
                                                out_method   => \$outbuf );
        $interp->exec("/$attr->{REALNAME}", %args);
        open (FILE, "> $destination");
        print FILE $outbuf;
        close (FILE);
    }
}

# handle some files
sub process_files {
    my ($files, $target) = @_;

    # proceed with the explicitely required files first
    my %options = ();
    foreach my $i (@{$files}) {
        $options{$i->{ATTR}{name}} = $i->{ATTR};
    }

    foreach my $i (@{$files}) {
        my @expanded = glob "$i->{ATTR}{name}";
        foreach my $file (@expanded) {
            $i->{ATTR}{REALNAME} = $file;
            if (defined $options{$file}) {
                unless (defined $options{$file}->{PROCESSED}) {
                    speak(1, "EXPLICIT FILE: $file");
                    $options{$file}->{REALNAME} = $file;
                    process_one_file($options{$file}, $target);
                    $options{$file}->{PROCESSED} = 1;
                }
            } else {
                speak(2, "GLOB: $file");
                process_one_file($i->{ATTR}, $target);
                $options{$file} = 2;
            }
        }
    }
}

# handle _one_ directory
sub process_directory {
    my ($dir, $path) = @_;
    my $cwd = '..';             # ;-)

    (defined $dir) || ($dir = '.');
    (defined $path) || ($path = '');
    speak(2, "DIR: $path$dir");
    $dir =~ s/\/$//;
    $dir .= '/';

    unless (-d $dir) {
        speak(-1, "DIRECTORY '$dir' NOT FOUND, SKIPPING");
        return 0;
    }

    # go where we have stuff to do
    chdir $dir;

    my $target = $basedir;
    ($path =~ /\S/) && ($target .= "/$path");
    ($dir ne './') && ($target .= $dir);

    speak(1, "*** Creating directory: $target");
    mkdir $target;

    unless (-f 'makefile.xml') {
        speak(-1, "No makefile.xml in this directory");
        chdir $cwd;
        return 0;
    }
    my $config = parseXML("makefile.xml");
    speak(3, Data::Dumper::Dumper($config));

    my $tmp = $config->{files}{file};
    if (defined $tmp) {
        my $files;
        if (ref($tmp) eq 'ARRAY') {
            $files = $tmp;
        } else {
            $files = [ $tmp ];
        }
        process_files($files, $target);
    }

    $tmp = $config->{files}{dir};
    if (defined $tmp) {
        my $subdirs;
        if (ref($tmp) eq 'ARRAY') {
            $subdirs = $tmp;
        } else {
            $subdirs = [ $tmp ];
        }
        foreach my $i (@{$subdirs}) {
            process_directory($i->{ATTR}{name}, $path.$dir);
        }
    }

    # get back to our previous location
    chdir $cwd;
}

# this does all the XML parsing shit we'll need for our little task
sub parseXML {
    my ($filename) = @_;
    my $rethash = {};

    my @tagstack;

    my $handler_start = sub {
        my ($parser, $tag, @attrs) = @_;
        my $current_tag = {};
        $current_tag->{NAME} = $tag;
        $current_tag->{DATA} = '';
        push @tagstack, $current_tag;
        if (scalar @attrs) {
            my $attrs = {};
            $current_tag->{ATTR} = $attrs;
            while (scalar @attrs) {
                my $name = shift @attrs;
                my $value = shift @attrs;
                $attrs->{$name} = $value;
            }
        }
    };

    my $handler_char = sub {
        my ($parser, $data) = @_;
        if ($data =~ /\S/) {
            $tagstack[$#tagstack]->{DATA} .= $data;
        }
    };

    my $handler_end = sub {
        my $current_tag = pop @tagstack;
        if (scalar @tagstack) {
            my $tmp = $tagstack[$#tagstack]->{$current_tag->{NAME}};
            if (defined $tmp) {
                ## better build an array, there are more elements with this tagname
                if (ref($tmp) eq 'ARRAY') {
                    ## oops, the ARRAY is already there, just add the new element
                    push @{$tmp}, $current_tag;
                } else {
                    ## create the array "in-place"
                    $tagstack[$#tagstack]->{$current_tag->{NAME}} = [ $tmp, $current_tag ];
                }
            } else {
                $tagstack[$#tagstack]->{$current_tag->{NAME}} = $current_tag;
            }
        } else {
            $rethash->{$current_tag->{NAME}} = $current_tag;
        }
    };

    my $parser = new XML::Parser
      ( Handlers => { Start => $handler_start,
                      Char  => $handler_char,
                      End   => $handler_end } );
    $parser->parsefile($filename);

    return $rethash;
}

# print somethign according to the level of verbosity
# receives: verbosity_level and message
# prints message if verbosity_level >= $verbosity (global)
sub speak {
    my ($v, $t) = @_;
    if ($v < 0) {
        print STDERR "\033[1;31m!! $t\033[0m\n";
    } elsif ($verbosity >= $v) {
        print $t, "\n";
    }
}

--- NEW FILE: makefile.xml ---
<files>
  <file name="*.{js,html,css,cgi}" />
  <file name="license.txt" />
  <file name="release-notes.html" masonize="yes" />
  <file name="index.html" masonize="yes" />

  <dir name="lang" />
  <dir name="plugins" />
  <dir name="popups" />
  <dir name="images" />
</files>

--- NEW FILE: popupdiv.js ---
/** This file is derived from PopupDiv, developed by Mihai Bazon for
 * SamWare.net.  Modifications were needed to make it usable in HTMLArea.
 * HTMLArea is a free WYSIWYG online HTML editor from InteractiveTools.com.
 *
 * This file does not function standalone.  It is dependent of global functions
 * defined in HTMLArea-3.0 (htmlarea.js).
 *
 * Please see file htmlarea.js for further details.
 **/

var is_ie = ( (navigator.userAgent.toLowerCase().indexOf("msie") != -1) &&
	      (navigator.userAgent.toLowerCase().indexOf("opera") == -1) );
var is_compat = (document.compatMode == "BackCompat");

function PopupDiv(editor, titleText, handler, initFunction) {
	var self = this;

	this.editor = editor;
	this.doc = editor._mdoc;
	this.handler = handler;

	var el = this.doc.createElement("div");
	el.className = "content";

	var popup = this.doc.createElement("div");
	popup.className = "dialog popupdiv";
	this.element = popup;
	var s = popup.style;
	s.position = "absolute";
	s.left = "0px";
	s.top = "0px";

	var title = this.doc.createElement("div");
	title.className = "title";
	this.title = title;
	popup.appendChild(title);

	HTMLArea._addEvent(title, "mousedown", function(ev) {
		self._dragStart(is_ie ? window.event : ev);
	});

	var button = this.doc.createElement("div");
	button.className = "button";
	title.appendChild(button);
	button.innerHTML = "&#x00d7;";
	title.appendChild(this.doc.createTextNode(titleText));
	this.titleText = titleText;

	button.onmouseover = function() {
		this.className += " button-hilite";
	};
	button.onmouseout = function() {
		this.className = this.className.replace(/\s*button-hilite\s*/g, " ");
	};
	button.onclick = function() {
		this.className = this.className.replace(/\s*button-hilite\s*/g, " ");
		self.close();
	};

	popup.appendChild(el);
	this.content = el;

	this.doc.body.appendChild(popup);

	this.dragging = false;
	this.onShow = null;
	this.onClose = null;
	this.modal = false;

	initFunction(this);
};

PopupDiv.currentPopup = null;

PopupDiv.prototype.showAtElement = function(el, mode) {
	this.defaultSize();
	var pos, ew, eh;
	var popup = this.element;
	popup.style.display = "block";
	var w = popup.offsetWidth;
	var h = popup.offsetHeight;
	popup.style.display = "none";
	if (el != window) {
		pos = PopupDiv.getAbsolutePos(el);
		ew = el.offsetWidth;
		eh = el.offsetHeight;
	} else {
		pos = {x:0, y:0};
		var size = PopupDiv.getWindowSize();
		ew = size.x;
		eh = size.y;
	}
	var FX = false, FY = false;
	if (mode.indexOf("l") != -1) {
		pos.x -= w;
		FX = true;
	}
	if (mode.indexOf("r") != -1) {
		pos.x += ew;
		FX = true;
	}
	if (mode.indexOf("t") != -1) {
		pos.y -= h;
		FY = true;
	}
	if (mode.indexOf("b") != -1) {
		pos.y += eh;
		FY = true;
	}
	if (mode.indexOf("c") != -1) {
		FX || (pos.x += Math.round((ew - w) / 2));
		FY || (pos.y += Math.round((eh - h) / 2));
	}
	this.showAt(pos.x, pos.y);
};

PopupDiv.prototype.defaultSize = function() {
	var s = this.element.style;
	var cs = this.element.currentStyle;
	var addX = (is_ie && is_compat) ? (parseInt(cs.borderLeftWidth) +
					   parseInt(cs.borderRightWidth) +
					   parseInt(cs.paddingLeft) +
					   parseInt(cs.paddingRight)) : 0;
	var addY = (is_ie && is_compat) ? (parseInt(cs.borderTopWidth) +
					   parseInt(cs.borderBottomWidth) +
					   parseInt(cs.paddingTop) +
					   parseInt(cs.paddingBottom)) : 0;
	s.display = "block";
	s.width = (this.content.offsetWidth + addX) + "px";
	s.height = (this.content.offsetHeight + this.title.offsetHeight) + "px";
	s.display = "none";
};

PopupDiv.prototype.showAt = function(x, y) {
	this.defaultSize();
	var s = this.element.style;
	s.display = "block";
	s.left = x + "px";
	s.top = y + "px";
	this.hideShowCovered();

	PopupDiv.currentPopup = this;
	HTMLArea._addEvents(this.doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
	HTMLArea._addEvents(this.editor._doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
	if (is_ie && this.modal) {
		this.doc.body.setCapture(false);
		this.doc.body.onlosecapture = function() {
			(PopupDiv.currentPopup) && (this.doc.body.setCapture(false));
		};
	}
	window.event && HTMLArea._stopEvent(window.event);

	if (typeof this.onShow == "function") {
		this.onShow();
	} else if (typeof this.onShow == "string") {
		eval(this.onShow);
	}

	var field = this.element.getElementsByTagName("input")[0];
	if (!field) {
		field = this.element.getElementsByTagName("select")[0];
	}
	if (!field) {
		field = this.element.getElementsByTagName("textarea")[0];
	}
	if (field) {
		field.focus();
	}
};

PopupDiv.prototype.close = function() {
	this.element.style.display = "none";
	PopupDiv.currentPopup = null;
	this.hideShowCovered();
	HTMLArea._removeEvents(this.doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
	HTMLArea._removeEvents(this.editor._doc.body, ["mousedown", "click"], PopupDiv.checkPopup);
	is_ie && this.modal && this.doc.body.releaseCapture();
	if (typeof this.onClose == "function") {
		this.onClose();
	} else if (typeof this.onClose == "string") {
		eval(this.onClose);
	}
	this.element.parentNode.removeChild(this.element);
};

PopupDiv.prototype.getForm = function() {
	var forms = this.content.getElementsByTagName("form");
	return (forms.length > 0) ? forms[0] : null;
};

PopupDiv.prototype.callHandler = function() {
	var tags = ["input", "textarea", "select"];
	var params = new Object();
	for (var ti in tags) {
		var tag = tags[ti];
		var els = this.content.getElementsByTagName(tag);
		for (var j = 0; j < els.length; ++j) {
			var el = els[j];
			params[el.name] = el.value;
		}
	}
	this.handler(this, params);
	return false;
};

PopupDiv.getAbsolutePos = function(el) {
	var r = { x: el.offsetLeft, y: el.offsetTop };
	if (el.offsetParent) {
		var tmp = PopupDiv.getAbsolutePos(el.offsetParent);
		r.x += tmp.x;
		r.y += tmp.y;
	}
	return r;
};

PopupDiv.getWindowSize = function() {
	if (window.innerHeight) {
		return { y: window.innerHeight, x: window.innerWidth };
	}
	if (this.doc.body.clientHeight) {
		return { y: this.doc.body.clientHeight, x: this.doc.body.clientWidth };
	}
	return { y: this.doc.documentElement.clientHeight, x: this.doc.documentElement.clientWidth };
};

PopupDiv.prototype.hideShowCovered = function () {
	var self = this;
	function isContained(el) {
		while (el) {
			if (el == self.element) {
				return true;
			}
			el = el.parentNode;
		}
		return false;
	};
	var tags = new Array("applet", "select");
	var el = this.element;

	var p = PopupDiv.getAbsolutePos(el);
	var EX1 = p.x;
	var EX2 = el.offsetWidth + EX1;
	var EY1 = p.y;
	var EY2 = el.offsetHeight + EY1;

	if (el.style.display == "none") {
		EX1 = EX2 = EY1 = EY2 = 0;
	}

	for (var k = tags.length; k > 0; ) {
		var ar = this.doc.getElementsByTagName(tags[--k]);
		var cc = null;

		for (var i = ar.length; i > 0;) {
			cc = ar[--i];
			if (isContained(cc)) {
				cc.style.visibility = "visible";
				continue;
			}

			p = PopupDiv.getAbsolutePos(cc);
			var CX1 = p.x;
			var CX2 = cc.offsetWidth + CX1;
			var CY1 = p.y;
			var CY2 = cc.offsetHeight + CY1;

			if ((CX1 > EX2) || (CX2 < EX1) || (CY1 > EY2) || (CY2 < EY1)) {
				cc.style.visibility = "visible";
			} else {
				cc.style.visibility = "hidden";
			}
		}
	}
};

PopupDiv.prototype._dragStart = function (ev) {
	if (this.dragging) {
		return false;
	}
	this.dragging = true;
	PopupDiv.currentPopup = this;
	var posX = ev.clientX;
	var posY = ev.clientY;
	if (is_ie) {
		posY += this.doc.body.scrollTop;
		posX += this.doc.body.scrollLeft;
	} else {
		posY += window.scrollY;
		posX += window.scrollX;
	}
	var st = this.element.style;
	this.xOffs = posX - parseInt(st.left);
	this.yOffs = posY - parseInt(st.top);
	HTMLArea._addEvent(this.doc, "mousemove", PopupDiv.dragIt);
	HTMLArea._addEvent(this.doc, "mouseover", HTMLArea._stopEvent);
	HTMLArea._addEvent(this.doc, "mouseup", PopupDiv.dragEnd);
	HTMLArea._stopEvent(ev);
};

PopupDiv.dragIt = function (ev) {
	var popup = PopupDiv.currentPopup;
	if (!(popup && popup.dragging)) {
		return false;
	}
	is_ie && (ev = window.event);
	var posX = ev.clientX;
	var posY = ev.clientY;
	if (is_ie) {
		posY += this.doc.body.scrollTop;
		posX += this.doc.body.scrollLeft;
	} else {
		posY += window.scrollY;
		posX += window.scrollX;
	}
	popup.hideShowCovered();
	var st = popup.element.style;
	st.left = (posX - popup.xOffs) + "px";
	st.top = (posY - popup.yOffs) + "px";
	HTMLArea._stopEvent(ev);
};

PopupDiv.dragEnd = function () {
	var popup = PopupDiv.currentPopup;
	if (!popup) {
		return false;
	}
	popup.dragging = false;
	HTMLArea._removeEvent(popup.doc, "mouseup", PopupDiv.dragEnd);
	HTMLArea._removeEvent(popup.doc, "mouseover", HTMLArea._stopEvent);
	HTMLArea._removeEvent(popup.doc, "mousemove", PopupDiv.dragIt);
	popup.hideShowCovered();
};

PopupDiv.checkPopup = function (ev) {
	is_ie && (ev = window.event);
	var el = is_ie ? ev.srcElement : ev.target;
	var cp = PopupDiv.currentPopup;
	for (; (el != null) && (el != cp.element); el = el.parentNode);
	if (el == null) {
		cp.modal || ev.type == "mouseover" || cp.close();
		HTMLArea._stopEvent(ev);
	}
};

PopupDiv.prototype.addButtons = function() {
	var self = this;
	var div = this.doc.createElement("div");
	this.content.appendChild(div);
	div.className = "buttons";
	for (var i = 0; i < arguments.length; ++i) {
		var btn = arguments[i];
		var button = this.doc.createElement("button");
		div.appendChild(button);
		button.innerHTML = HTMLArea.I18N.buttons[btn];
		switch (btn) {
		    case "ok":
			button.onclick = function() {
				self.callHandler();
				self.close();
			};
			break;
		    case "cancel":
			button.onclick = function() {
				self.close();
			};
			break;
		}
	}
};

--- NEW FILE: popupwin.js ---
function PopupWin(editor, title, handler, initFunction) {
	this.editor = editor;
	this.handler = handler;
	var dlg = window.open("", "__ha_dialog",
			      "toolbar=no,menubar=no,personalbar=no,width=600,height=600," +
			      "scrollbars=no,resizable=no");
	this.window = dlg;
	var doc = dlg.document;
	this.doc = doc;
	var self = this;

	var base = document.baseURI || document.URL;
	if (base && base.match(/(.*)\/([^\/]+)/)) {
		base = RegExp.$1 + "/";
	}
	if (typeof _editor_url != "undefined" && !/^\//.test(_editor_url)) {
		// _editor_url doesn't start with '/' which means it's relative
		// FIXME: there's a problem here, it could be http:// which
		// doesn't start with slash but it's not relative either.
		base += _editor_url;
	} else
		base = _editor_url;
	if (!/\/$/.test(base)) {
		// base does not end in slash, add it now
		base += '/';
	}
	this.baseURL = base;

	doc.open();
	var html = "<html><head><title>" + title + "</title>\n";
	// html += "<base href='" + base + "htmlarea.js' />\n";
	html += "<style type='text/css'>@import url(" + base + "htmlarea.css);</style></head>\n";
	html += "<body class='dialog popupwin' id='--HA-body'></body></html>";
	doc.write(html);
	doc.close();

	// sometimes I Hate Mozilla... ;-(
	function init2() {
		var body = doc.body;
		if (!body) {
			setTimeout(init2, 25);
			return false;
		}
		dlg.title = title;
		doc.documentElement.style.padding = "0px";
		doc.documentElement.style.margin = "0px";
		var content = doc.createElement("div");
		content.className = "content";
		self.content = content;
		body.appendChild(content);
		self.element = body;
		initFunction(self);
		dlg.focus();
	};
	init2();
};

PopupWin.prototype.callHandler = function() {
	var tags = ["input", "textarea", "select"];
	var params = new Object();
	for (var ti in tags) {
		var tag = tags[ti];
		var els = this.content.getElementsByTagName(tag);
		for (var j = 0; j < els.length; ++j) {
			var el = els[j];
			var val = el.value;
			if (el.tagName.toLowerCase() == "input") {
				if (el.type == "checkbox") {
					val = el.checked;
				}
			}
			params[el.name] = val;
		}
	}
	this.handler(this, params);
	return false;
};

PopupWin.prototype.close = function() {
	this.window.close();
};

PopupWin.prototype.addButtons = function() {
	var self = this;
	var div = this.doc.createElement("div");
	this.content.appendChild(div);
	div.className = "buttons";
	for (var i = 0; i < arguments.length; ++i) {
		var btn = arguments[i];
		var button = this.doc.createElement("button");
		div.appendChild(button);
		button.innerHTML = HTMLArea.I18N.buttons[btn];
		switch (btn) {
		    case "ok":
			button.onclick = function() {
				self.callHandler();
				self.close();
				return false;
			};
			break;
		    case "cancel":
			button.onclick = function() {
				self.close();
				return false;
			};
			break;
		}
	}
};

PopupWin.prototype.showAtElement = function() {
	var self = this;
	// Mozilla needs some time to realize what's goin' on..
	setTimeout(function() {
		var w = self.content.offsetWidth + 4;
		var h = self.content.offsetHeight + 4;
		// size to content -- that's fuckin' buggy in all fuckin' browsers!!!
		// so that we set a larger size for the dialog window and then center
		// the element inside... phuck!

		// center...
		var el = self.content;
		var s = el.style;
		// s.width = el.offsetWidth + "px";
		// s.height = el.offsetHeight + "px";
		s.position = "absolute";
		s.left = (w - el.offsetWidth) / 2 + "px";
		s.top = (h - el.offsetHeight) / 2 + "px";
		if (HTMLArea.is_gecko) {
			self.window.innerWidth = w;
			self.window.innerHeight = h;
		} else {
			self.window.resizeTo(w + 8, h + 35);
		}
	}, 25);
};

--- NEW FILE: project-config.xml ---
<project title="HTMLArea">
  <version>3.0</version>
  <release>beta+CVS</release>
</project>

--- NEW FILE: reference.html ---
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.2//EN">
<html> <head>
<title>HTMLArea-3.0 Reference</title>

<style type="text/css">
  @import url(htmlarea.css);
  body { font: 14px verdana,sans-serif; background: #fff; color: #000; }
  h1, h2 { font-family:tahoma,sans-serif; }
  h1 { border-bottom: 2px solid #000; }
  h2 { border-bottom: 1px solid #aaa; }
  h3, h4 { margin-bottom: 0px; font-family: Georgia,serif; font-style: italic; }
  h4 { font-size: 90%; margin-left: 1em; }
  acronym { border-bottom: 1px dotted #063; color: #063; }
  p { margin-left: 2em; margin-top: 0.3em; }
  li p { margin-left: 0px; }
  .abstract { padding: 5px; margin: 0px 10em; font-size: 90%; border: 1px dashed #aaa; background: #eee;}
  li { margin-left: 2em; }
  em { color: #042; }
  a { color: #00f; }
  a:hover { color: #f00; }
  a:active { color: #f80; }
  span.browser { font-weight: bold; color: #864; }
  .fixme { font-size: 20px; font-weight: bold; color: red; background: #fab;
padding: 5px; text-align: center; }
  .code {
   background: #e4efff; padding: 5px; border: 1px dashed #abc; margin-left: 2em; margin-right: 2em;
   font-family: fixed,"lucidux mono","andale mono","courier new",monospace;
  }
  .note, .warning { font-weight: bold; color: #0a0; font-variant: small-caps; }
  .warning { color: #a00; }

.string {
  color: #06c;
} /* font-lock-string-face */
.comment {
  color: #840;
} /* font-lock-comment-face */
.variable-name {
  color: #000;
} /* font-lock-variable-name-face */
.type {
  color: #008;
  font-weight: bold;
} /* font-lock-type-face */
.reference {
  color: #048;
} /* font-lock-reference-face */
.preprocessor {
  color: #808;
} /* font-lock-preprocessor-face */
.keyword {
  color: #00f;
  font-weight: bold;
} /* font-lock-keyword-face */
.function-name {
  color: #044;
} /* font-lock-function-name-face */
.html-tag {
  font-weight: bold;
} /* html-tag-face */
.html-helper-italic {
  font-style: italic;
} /* html-helper-italic-face */
.html-helper-bold {
  font-weight: bold;
} /* html-helper-bold-face */

</style>

<script type="text/javascript" src="htmlarea.js"></script>
<script type="text/javascript" src="dialog.js"></script>
<script tyle="text/javascript" src="lang/en.js"></script>

</head>

<body onload="HTMLArea.replace('TA')">

<h1>HTMLArea-3.0 Documentation</h1>

<div class="abstract" style="color: red; font-weight: bold">

      This documentation contains valid information, but is outdated in the
      terms that it does not covers all the features of HTMLArea.  A new
      documentation project will be started, based on LaTeX.

</div>

<h2>Introduction</h2>

<h3>What is HTMLArea?</h3>

<p>HTMLArea is a free <acronym title="What You See Is What You Get"
>WYSIWYG</acronym> editor replacement for <code>&lt;textarea&gt;</code>
fields.  By adding a few simple lines of JavaScript code to your web page
you can replace a regular textarea with a rich text editor that lets your
users do the following:</p>

<ul>
  <li>Format text to be bold, italicized, or underlined.</li>
  <li>Change the face, size, style and color.</li>
  <li>Left, center, or right-justify paragraphs.</li>
  <li>Make bulleted or numbered lists.</li>
  <li>Indent or un-indent paragraphs.</li>
  <li>Insert a horizontal line.</li>
  <li>Insert hyperlinks and images.</li>
  <li>View the raw HTML source of what they're editing.</li>
  <li>and much more...</li>
</ul>

<p>Some of the interesting features of HTMLArea that set's it apart from
other web based WYSIWYG editors are as follows:</p>

<ul>
  <li>It's lightweight, fast loading and can transform a regular textarea
  into a rich-text editor with a single line of JavaScript.</li>
  <li>Generates clean, valid HTML.</li>
  <li>It's 100% backwards compatible with older or non-supported browsers
  (they get the original textarea field).</li>
  <li>It's free and can be incorporated into any free or commercial
  program.</li>
  <li>It works with any server-side languages (ASP, PHP, Perl, Java,
  etc).</li>
  <li>It's written in JavaScript and can be easily viewed, modified or
  extended.</li>
  <li>It remembers entered content when a user navigates away and then hits
  "back" in their browser.</li>
  <li>Since it replaces existing textareas it doesn't require a lot of code
  to add it to your pages (just one line).</li>
  <li>Did we mention it was free? ;-)</li>
</ul>

<h3>Is it really free?  What's the catch?</h3>

<p>Yes! It's really free. You can use it, modify it, distribute it with your
software, or do just about anything you like wit...

[truncated message content]