function createCommentArea(object, index, defaultname, defaultsite, defaultemail)
{
    var node = document.getElementById(object);

    var html = "<form id=\"commentForm\" method=\"POST\" action=\"pagemill.cgi?postcomment=" + index + "\" onsubmit=\"return validate()\">";
    html += "    <input type=\"hidden\" name=\"postcomment\" value=\"" + index + "\" />";
    html += "    <label style=\"display:block; float:left; width:160px;\">Your Name</label>";
    html += "    <input type=\"text\" name=\"name\" style=\"width:340px;\" value=\"" + defaultname + "\" /><br />";
    html += "    <label style=\"display:block; float:left; width:160px;\">Your Email<span style=\"font-size:small;\"> (required)</span></label>";
    html += "    <input type=\"text\" name=\"email\" id=\"commentFormEmail\" style=\"width:340px;\" value=\"" + defaultemail + "\" /><br />";
    html += "    <label style=\"display:block; float:left; width:160px;\">Your Website</label>";
    html += "    <span style=\"display:block; float:left; width:60px; font-family:monospace;\">http://</span>";
    html += "    <input type=\"text\" name=\"site\" style=\"width:280px;\" value=\"" + defaultsite + "\" /><br />";
    html += "    Your Comment:<br />";
    html += "    <div style=\"text-align:center;\"><textarea name=\"commententry\" id=\"commententry\" rows=\"8\" onkeyup=\"updatepreview()\" style=\"width:500px;\"></textarea></div>";
    html += "    <input type=\"checkbox\" name=\"rememberme\" value=\"yes\" ";
    if (defaultname != "" || defaultsite != "")
        html += "checked=\"checked\" ";
    html += "/> Remember me <span style=\"font-size:small;\">(uses a cookie)</span>";
    html += "    <div style=\"font-size:x-small;\"><span style=\"font-size:small; font-weight:bold;\">Rules:</span>";
    html += "        <ul>";
    html += "            <li>Your email address will not be shown, it's just for security.</li>";
    html += "            <li>Every comment also has their IP address recorded, but again, not shown.</li>";
    html += "            <li>A minimal set of HTML is allowed and mistakes will be visible and mocked.  Look before you leap.<br />";
    html += "            ALLOWED: a href, b, i, li, ol, ul, u<br />";
    html += "            HINT: The comment preview box below will show you exactly what the comment will look like.</li>";
    html += "            <li>I do not need prescription drugs or a new home mortgage.  Don't try to sell me something.</li>";
    html += "            <li>I reserve the right to edit or delete comments posted on this website.</li>";
    html += "            <li>Name and website fields can be blank.</li>";
    html += "            <li>Try to stay on-topic.</li>";
    html += "            <li>Be nice.</li>";
    html += "        </ul>";
    html += "    </div>";
    html += "    <div style=\"text-align:center;\"><input type=\"submit\" value=\"Submit\" id=\"sumbitButton\" /></div>";
    html += "    Comment Preview:<br /><div id=\"commentpreview\" style=\"border:1px dashed black;\" >&nbsp;</div>";
    html += "</form>";
    node.innerHTML = html;
}

function updatepreview()
{
    var preview = document.getElementById("commentpreview");
    var snode = document.getElementById("commententry");
    var content = snode.value;
    content = content.replace(/&/g,"&amp;");
    content = content.replace(/\"/g,"&quot;"); //"
    content = content.replace(/</g,"&lt;");
    content = content.replace(/>/g,"&gt;");
    content = content.replace(/\n/g,"<br />");
    content = content.replace(/&lt;a href=&quot;(.*?)&quot;&gt;(.+?)&lt;\/a&gt;/g,"<a href=\"$1\" rel=\"nofollow\">$2</a>");
    content = content.replace(/&lt;b&gt;(.+?)&lt;\/b&gt;/g,"<span style=\"font-weight:bold;\">$1</span>");
    content = content.replace(/&lt;i&gt;(.+?)&lt;\/i&gt;/g,"<span style=\"font-style:italic;\">$1</span>");
    content = content.replace(/&lt;u&gt;(.+?)&lt;\/u&gt;/g,"<span style=\"text-decoration:underline;\">$1</span>");
    content = content.replace(/&lt;li&gt;(.+?)&lt;\/li&gt;/g,"<li>$1</li>");
    content = content.replace(/&lt;ol&gt;(.+?)&lt;\/ol&gt;/g,"<ol>$1</ol>");
    content = content.replace(/&lt;ul&gt;(.+?)&lt;\/ul&gt;/g,"<ul>$1</ul>");
    content = content.replace(/^\s+$/, "&nbsp;");
    if (content == "")
    {
        content = '&nbsp;';
    }
    preview.innerHTML = content; 
}

function validateEmail(str)
{
    /**
     * DHTML email validation script. Courtesy of SmartWebby.com (http://www.smartwebby.com/dhtml/)
     */

    var at = "@";
    var dot = ".";
    var lat = str.indexOf(at);
    var lstr = str.length;
    var ldot = str.indexOf(dot);

    if (str.indexOf(at)== -1)
        return false;

    if (str.indexOf(at) == -1 || str.indexOf(at) == 0 || str.indexOf(at) == lstr - 1)
        return false;

    if (str.indexOf(dot) == -1 || str.indexOf(dot) == 0 || str.indexOf(dot) == lstr - 1)
        return false;

    if (str.indexOf(at, (lat + 1)) != -1)
        return false;

    if (str.substring(lat-1, lat) == dot || str.substring(lat + 1, lat + 2) == dot)
        return false;

    if (str.indexOf(dot, (lat + 2)) == -1)
        return false;

    if (str.indexOf(" ") != -1)
        return false;

    return true;
}

function validate()
{
    document.getElementById("sumbitButton").value = "Thank you!";
    document.getElementById("sumbitButton").disabled = "disabled";

    if (!validateEmail(document.getElementById("commentFormEmail").value))
    {
        alert("A valid email address is required");
        document.getElementById("commentFormEmail").focus();

        document.getElementById("sumbitButton").value = "Submit";
        document.getElementById("sumbitButton").disabled = "";
        return false;
    }

    return true;
}

