var overlayDiv = null;
var OVERLAY_DIV_ID = "emailOverlayDiv";
var emailForm = null;
var EMAIL_FORM_ID = "emailForm";
var OVERLAY_DIV_CLASS_NAME = "mailOverlayDiv";
var EMAILFORM_CLASS_NAME = "mailTableContainer";


function showOverlayDiv()
{
    if ( overlayDiv == null )
    {
        overlayDiv = document.createElement("div");
        overlayDiv.className = OVERLAY_DIV_CLASS_NAME;
        overlayDiv.id = OVERLAY_DIV_ID;
        overlayDiv.style.opacity = 0.8;
        overlayDiv.style.filter = "alpha(opacity=80)";
        document.body.appendChild(overlayDiv);
    }
    overlayDiv.style.display = 'block';
    resizeOverlay();
    addHandler(window, 'resize', resizeOverlay);
}

function showEmailForm()
{
    if ( emailForm == null )
    {
        emailForm = document.createElement("div");
        emailForm.id = EMAIL_FORM_ID;
        emailForm.innerHTML = "<form class=\"email\" name=\"email_to_friend\" method=\"post\" action=\"\" enctype=\"text/plain\">\n" +
                              "<table class=\"email\" width=\"500\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\">\n" +
                              "  <tr>\n" +
                              "    <td colspan=\"2\" class=\"title\">Your Information:</td>\n" +
                              "    </tr>\n" +
                              "  <tr>\n" +
                              "    <td width=\"119\" class=\"names\">First Name<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td width=\"381\" align=\"left\"><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_nonempty_fromFirstName\" style=\"vertical-align: middle;\" type=\"text\"></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td class=\"names\">Second Name<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_nonempty_fromLastName\" style=\"vertical-align: middle;\" type=\"text\"></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td class=\"names\">E-mail<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_email__nonempty_fromEmail\" style=\"vertical-align: middle;\" type=\"text\" /></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td colspan=\"2\" class=\"title\">Recipient's Information:</td>\n" +
                              "    </tr>\n" +
                              "  <tr>\n" +
                              "    <td width=\"119\" class=\"names\">First Name<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_nonempty_toFirstName\" style=\"vertical-align: middle;\" type=\"text\"></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td class=\"names\">Second Name<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_nonempty_toLastName\" style=\"vertical-align: middle;\" type=\"text\"></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td class=\"names\">E-mail<span style=\"color:#C00;\">*</span></td>\n" +
                              "    <td><input value=\"\" maxlength=\"80\" size=\"40\" name=\"_email__nonempty_toEmail\" style=\"vertical-align: middle;\" type=\"text\"></td>\n" +
                              "  </tr>\n" +
                              "  <tr>\n" +
                              "    <td class=\"names\">Additional Information:</td>\n" +
                              "    <td><textarea style=\"vertical-align: middle;\" name=\"additionalInfo\" rows=\"5\" cols=\"30\" value=\"\"></textarea></td>\n" +
                              "  </tr>\n" +
                              "</table>\n" +
                              "\n" +
                              "</form>\n" +
                              "<p class=\"email\"><b>Note:</b> NetCracker will not use information collected here for marketing or promotional purposes beyond the scope of this transaction.</p>\n" +
                              "<p class=\"email\"><input value=\"Submit\" name=\"action\" onclick=\"return(sendMail('email_to_friend'));\" type=\"submit\">  \n" +
                              "    <input onclick=\"return hideEmail();\" value=\"Cancel\" name=\"cancel\" type=\"button\"></p>";

        emailForm.className = EMAILFORM_CLASS_NAME;
        document.body.appendChild(emailForm);
    }
    emailForm.style.display = 'block';
    placeEmailForm();
    addHandler(window, 'resize', placeEmailForm);
    addHandler(window, 'scroll', placeEmailForm);
}


function emailToFriend()
{
    showOverlayDiv();
    showEmailForm();
    return false;
}

function hideEmail()
{
    hideOverlayDiv();
    hideEmailForm();
    return false;
}

function hideOverlayDiv()
{
    removeHandler(window, 'resize', resizeOverlay);
    overlayDiv.style.display = 'none';
}

function hideEmailForm()
{
    removeHandler(window, 'resize', placeEmailForm);
    removeHandler(window, 'scroll', placeEmailForm);
    emailForm.style.display = 'none';
}

function resizeOverlay()
{
    overlayDiv.style.width = (document.documentElement.scrollWidth
            ? document.documentElement.scrollWidth : document.body.scrollWidth) + 'px';
    overlayDiv.style.height = (document.documentElement.scrollHeight
            ? document.documentElement.scrollHeight : document.body.scrollHeight) + 'px';
}

function placeEmailForm()
{
    emailForm.style.left = (((window.document.documentElement.clientWidth
            ? window.document.documentElement.clientWidth : window.document.body.clientWidth) -
                             emailForm.offsetWidth) / 2 +
                            (window.document.documentElement.scrollLeft
                                    ? window.document.documentElement.scrollLeft
                                    : window.document.body.scrollLeft )) + 'px';
    emailForm.style.top = (((window.document.documentElement.clientHeight
            ? window.document.documentElement.clientHeight : window.document.body.clientHeight) -
                            emailForm.offsetHeight) / 3 +
                           (window.document.documentElement.scrollTop
                                   ? window.document.documentElement.scrollTop
                                   : window.document.body.scrollTop )) + 'px';
}

function addHandler( object, event, handler )
{
    if ( typeof object.addEventListener != 'undefined' )
        object.addEventListener(event, handler, false);
    else if ( typeof object.attachEvent != 'undefined' )
        object.attachEvent('on' + event, handler);
    else
        throw "Incompatible browser";
}

function removeHandler( object, event, handler )
{
    if ( typeof object.removeEventListener != 'undefined' )
        object.removeEventListener(event, handler, false);
    else if ( typeof object.detachEvent != 'undefined' )
        object.detachEvent('on' + event, handler);
    else
        throw "Incompatible browser";
}

function encode( sValue )
{
    var text = "", Ucode, ExitValue, s;
    for ( var i = 0; i < sValue.length; i++ )
    {
        s = sValue.charAt(i);
        Ucode = s.charCodeAt(0);
        var Acode = Ucode;
        if ( Ucode > 1039 && Ucode < 1104 )
        {
            Acode -= 848;
            ExitValue = "%" + Acode.toString(16);
        }
        else if ( Ucode == 1025 )
        {
            Acode = 168;
            ExitValue = "%" + Acode.toString(16);
        }
        else if ( Ucode == 1105 )
        {
            Acode = 184;
            ExitValue = "%" + Acode.toString(16);
        }
        else if ( Ucode == 32 )
        {
            Acode = 32;
            ExitValue = "%" + Acode.toString(16);
        }
        else if ( Ucode == 10 )
        {
            Acode = 10;
            ExitValue = "%0A";
        }
        else
        {
            ExitValue = s;
        }
        text = text + ExitValue;
    }
    return text;
}

function sendMail( formName )
{
    var form = document.forms[formName];
    form.elements[0].name = "_nonempty_fromFirstName";
    form.elements[1].name = "_nonempty_fromLastName";
    form.elements[2].name = "_email__nonempty_fromEmail";
    form.elements[3].name = "_nonempty_toFirstName";
    form.elements[4].name = "_nonempty_toLastName";
    form.elements[5].name = "_email__nonempty_toEmail";
    if ( CheckMandatoryFields(formName) )
    {
        var mailTo = form.elements[5].value;
        //var mailFrom = form.elements[2].value;
        var toFirstName = form.elements[3].value;
        var toLastName = form.elements[4].value;
        var additionalInfo = form.elements[6].value;

        var reference = document.location.href;
        var body = encode("Dear " + encode(toFirstName) + " " + encode(toLastName) + ", \n\n" +
                          "I thought you would find the content referenced on the NetCracker web page below of interest:\n" +
                          reference + (additionalInfo != '' ? ("\n\n" + additionalInfo) : ""));


        hideEmail();
        document.location.href = "mailto:" + mailTo + "?subject=Link to NetCracker" +
                                 "&body=" + body;
    }
}