﻿var confirmDelete = false;
var as3Ready = false;
var recordReady = false;
var faceSwf;
var lastEcardMsg = "";
var newToon = true;
var gettingFields = false;

function toggleSection(section)
{
    confirmDelete = false;

    try
    {
        getObject("divSwitch").style.display = "none";
    }
    catch (err) { }
    try
    {
        getObject("divFace").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divSkin").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divAction").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divDialog").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divText").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divPicture").style.display = "none";
    }
    catch (err) { }
    try
    {
        getObject("divSave").style.display = "none";
    }
    catch (err){}
    try
    {
        getObject("divShare").style.display = "none";
    }
    catch (err){}

    getObject(section).style.display = "block";

    /*    
    switch (section)
    {
        case "divFace":
            getObject("divCreateFace").style.display = "none";
            getObject("divCropFace").style.display = "none";
            break;

        case "divDialog":
            getObject("divCreateDialog").style.display = "none";
            break;
    }
    */
    
    setTimeout("updateSection('" + section + "');", 100);
}

function getPhotoTips()
{
    var tips =
        "<div style=\"font-family: Arial; font-size: 10pt; text-align: left\">" +
        "<strong>Photo Tips</strong><br />" +
        "<ol><li>Try selecting photo's where the person is facing forward - like in a driver's license photo.<br />&nbsp;</li>" +
        "<li>Avoid pictures where the person is wearing a hat. This may work ok for some pictures but not for others.<br />&nbsp;</li>" +
        "<li>Try to line up the mouth so that the break occurs between the lips and/or below any exposed teeth.<br />&nbsp;</li>" +
        "<li>The head you create doesn't have to be perfect - slight issues like gaps and spaces around the head or a mouth that don't line up perfectly may not even be noticeable in the final version.<br />&nbsp;</li>" +
        "</ol></div>";
        
    return tips;
}

function switchCharacters()
{
    toggleSection("divSwitch");
}

function cancelSwitch()
{
    as3Ready = false;
    getObject("divSwitch").style.display = "none";
    getObject("divViewer").style.display = "block";
}

function showShare()
{
    getObject("divSteps").style.display = "none";
    getObject("divShareStep").style.display = "block";
}

function headShaped(value)
{
    getObject("divBtnCropFace").style.display = "block";
}

function headNotShaped(value)
{
    getObject("divBtnCropFace").style.display = "none";
}

function updateSection(section)
{
    switch (section)
    {
        case "divSkin":
            setCheckedValue("skintone", getObject("_ctl0_bodyContent_hfSkinID").value);
            break;
               
        case "divText":
            loadField2();
            break;       
    }
}

function flashReady(value)
{
    if (!as3Ready)
    {
        as3Ready = true;
        faceSwf = getEmbedObject("swfToon");
        initializeToon();
    }
}

function recordReady(value)
{
    recordReady = true;
}

function recorded(file)
{
    getObject("_ctl0_bodyContent_hfRecordedFile").value = file;
}

function initializeToon()
{
    var skin = getObject("_ctl0_bodyContent_hfSkinID");
    
    if (skin.value.length > 0)
    {
        setCheckedValue("skintone", skin.value);
        setSkinTone(skin.value);
    }
    
    var field2 = getObject("_ctl0_bodyContent_field2");

    if (field2 != null)
    {
        field2.value = unescape(field2.value.replace(/\+/g, ' '))

        //loadField2();

        try
        {
            setField2();
        }
        catch (err) { }
    }
    else
        setEcardFields();

    rewind();
}

function loadNew()
{
    newToon = true;
}

function setEcardFields()
{
    updateEcardFields();
}

function filterHTML(text)
{
    if (text == null) text = "";

    text = text.replace(/\x01/g, "");
    text = text.replace(/<BR>/g, "\n");
    text = text.replace(/<br>/g, "\n");
    text = text.replace(/<\/P>/g, " \n");
    text = text.replace(/<\/p>/g, " \n");
    text = text.replace(/<[^>]*>/g, "");
    text = text.replace(/  /g, " ")
    text = text.replace(/&apos;/g, "'")
    text = text.replace(/&quot;/g, "\"")
    text = text.replace(/&nbsp;/g, " ")

    return text
}

function cancelKey(e)
{
    e = e || window.event;
    var key = e.which || e.keyCode;

    if (key == 13)
    {
        e.returnValue = false;
        return false;
    }
}

function checkNull(text)
{
    if (text.replace(/\n/g, "").replace(/^\s+|\s+$/g, "").length == 0)
        return true;
    else
        return false;
}

function updateEcardFields()
{
    var to = getObject("_ctl0_bodyContent_txtTo").value.replace(/\r/g, "");
    if (checkNull(to))
        to = String.fromCharCode(1);
    else
        to = "To: " + to;
    var from = getObject("_ctl0_bodyContent_txtFrom").value.replace(/\r/g, "");
    if (checkNull(from))
        from = String.fromCharCode(1);
    else
        from = "From: " + from;
    var text1 = getObject("_ctl0_bodyContent_txtText1").value.replace(/\r/g, "");
    if (checkNull(text1)) text1 = String.fromCharCode(1);
    var text2 = getObject("_ctl0_bodyContent_txtText2").value.replace(/\r/g, "");
    if (checkNull(text2)) text2 = String.fromCharCode(1);
    var wrapup = getObject("_ctl0_bodyContent_txtWrapup").value.replace(/\r/g, "");
    if (checkNull(wrapup)) wrapup = String.fromCharCode(1);

    faceSwf.updateFields(to, from, text1, text2, wrapup);
}

function setTo()
{
    updateEcardFields();
    faceSwf.TGotoLabel("/", "to");
}

function setFrom()
{
    updateEcardFields();
    faceSwf.TGotoLabel("/", "from");
}

function setText1()
{
    updateEcardFields();
    faceSwf.TGotoLabel("/", "text1");
}

function setText2()
{
    updateEcardFields();
    faceSwf.TGotoLabel("/", "text2");
}

function setWrapup()
{
    updateEcardFields();
    faceSwf.TGotoLabel("/", "wrapup");
}

function setSkinTone(tone)
{
    if (as3Ready)
    {
        faceSwf.setSkin(Number(tone));
        getObject("_ctl0_bodyContent_hfSkinID").value = tone;
    }
}

function play()
{
    if (as3Ready)
    {
        try
        {
            faceSwf.playToon();
        }
        catch (err){}
    }
}

function rewind()
{
    if (as3Ready)
    {
        try
        {
            faceSwf.rewindToon();
        }
        catch (err){}
    }
}

function setDialog(drp)
{
    var ourdialogdrp = getObject("_ctl0_bodyContent_drpOurDialogs");
    ourdialogdrp.selectedIndex = 0;
    
    updateToon();
}

function setOurDialog(drp)
{
    var dialogdrp = getObject("_ctl0_bodyContent_drpDialogs");
    if (dialogdrp != null)
        dialogdrp.selectedIndex = 0;
    
    updateToon();
}

function updateToon()
{
    confirmDelete = false;

    var face = getCheckedValue("face");
    var dialogdrp = getObject("_ctl0_bodyContent_drpDialogs");
    var dialog = "-";
    if (dialogdrp != null)
        dialog = dialogdrp.options[dialogdrp.selectedIndex].value;
    var ourdialogdrp = getObject("_ctl0_bodyContent_drpOurDialogs");
    var ourdialog = ourdialogdrp.options[ourdialogdrp.selectedIndex].value;
    
    if (dialog == "-" && ourdialog == "-") dialog = null;
    if (ourdialog != "-") dialog = ourdialog;
    
    if (dialog == null && getObject("_ctl0_bodyContent_hfDefaultDialog").value.length > 0)
        dialog = getObject("_ctl0_bodyContent_hfDefaultDialog").value;
    
    var pictureid = getObject("_ctl0_bodyContent_hfPictureID").value;
    
    as3Ready = false;
    getObject("divAnimation").innerHTML = 
        getSwf("swfToon", "facetoon.ashx?toonid=" + getObject("_ctl0_bodyContent_hfSwfID").value + "&as=0" + (face != null ? "&faceid=" + face : "") + (dialog != null ? "&dialogid=" + dialog : "") + (pictureid.length > 0 ? "&pictureid=" + pictureid : ""), 400, 291, true, "direct", 9);
}

function setEcardText(drp)
{
    var val = drp.options[drp.selectedIndex].value;
    
    if (val != "" && val != lastEcardMsg)
    {   
        var field2 = getObject("_ctl0_bodyContent_field2");       
        field2.value = unescape(val.replace(/\+/g, ' '))

        loadField2();
        setField2();
    }

    lastEcardMsg = val;
}

function changeAction(drp)
{
    var val = drp.options[drp.selectedIndex].value;
       
    getObject("_ctl0_bodyContent_hfSwfID").value = val;
    updateToon();
}

function getCheckedValue(radname)
{
    var rad = getObjectByName(radname);

    for (i = 0; i < rad.length; i++)
    {
        if (rad[i].checked)
            return rad[i].value;
    }
    
    return null;
}

function setCheckedValue(radname, value)
{
    var rad = getObjectByName(radname);

    for (i = 0; i < rad.length; i++)
        if (rad[i].value == value)
            rad[i].checked = true;
        else
            rad[i].checked = false;
    
    return;
}

function addFace()
{
    setFaceTab("tabYourFaces");
    getObject("divCreateFace").style.display = "block";
    getObject("divYourFaceSection").style.display = "none";
    getObject("divCropFace").style.display = "none";
}

function createFace()
{
    var createStyle = getObject("divCreateFace").style;
    var cropStyle = getObject("divCropFace").style;
    var faceStyle = getObject("divYourFaceSection").style;
    
    if (createStyle.display == "block")
    {
        createStyle.display = "none";
        faceStyle.display = "block";
    }
    else if (cropStyle.display == "block")
    {
        cropStyle.display = "none";
        faceStyle.display = "block";
    }
    else
    {
        createStyle.display = "block";
        faceStyle.display = "none";
    }
}

function addDialog()
{
    setDialogTab("tabYourDialogs");
    getObject("divCreateDialog").style.display = "block";
    getObject("divYourDialogSection").style.display = "none";
}

function createDialog()
{
    var createStyle = getObject("divCreateDialog").style;
    var dialogStyle = getObject("divYourDialogSection").style;
    
    if (createStyle.display == "block")
    {
        createStyle.display = "none";
        dialogStyle.display = "block";
    }
    else
    {
        createStyle.display = "block";
        dialogStyle.display = "none";
    }
}

function deleteFace()
{
    var face = getCheckedValue("face");
    if (face == null)
    {
        alert("Select a face first");
        return;
    }
    
    if (!confirmDelete)
    {
        confirmDelete = true;
        alert("Click one more time to confirm deletion of this face.  All animations that currently use this face will also be deleted.");
    }
    else
    {
        getObject("_ctl0_bodyContent_hfDeleteFace").value = face;
        document.forms['aspnetForm'].submit();
    }
}

function deleteDialog()
{
    var dialogdrp = getObject("_ctl0_bodyContent_drpDialogs");
    var dialog = dialogdrp.options[dialogdrp.selectedIndex].value;

    if (dialog == "-")
    {
        alert("Select a dialog first");
        return;
    }
    
    if (!confirmDelete)
    {
        confirmDelete = true;
        alert("Click one more time to confirm deletion of this dialog.  All animations that currently use this dialog will also be deleted.");
    }
    else
    {
        getObject("_ctl0_bodyContent_hfDeleteDialog").value = dialog;
        document.forms['aspnetForm'].submit();
    }
}

function cropFace()
{
    getObject("divCropFace").style.display = "block";
    getObject("divCreateFace").style.display = "none";
    getObject("divYourFaceSection").style.display = "none";
}

function updateFields()
{
    var swf = getEmbedObject("swfCrop");
    
    getObject("_ctl0_bodyContent_fxpos").value = swf.TGetPropertyAsNumber("/theface/face1/image", 0);
    getObject("_ctl0_bodyContent_fypos").value = swf.TGetPropertyAsNumber("/theface/face1/image", 1);
    getObject("_ctl0_bodyContent_fwdth").value = swf.TGetPropertyAsNumber("/theface/face1/image", 8);
    getObject("_ctl0_bodyContent_fhght").value = swf.TGetPropertyAsNumber("/theface/face1/image", 9);
    getObject("_ctl0_bodyContent_cxpos").value = swf.TGetPropertyAsNumber("/theface/cropper/themask", 0);
    getObject("_ctl0_bodyContent_cypos").value = swf.TGetPropertyAsNumber("/theface/cropper/themask", 1);
    getObject("_ctl0_bodyContent_cwdth").value = swf.TGetPropertyAsNumber("/theface/cropper/themask", 8);
    getObject("_ctl0_bodyContent_chght").value = swf.TGetPropertyAsNumber("/theface/cropper/themask", 9);
    getObject("_ctl0_bodyContent_mcxpos").value = swf.TGetPropertyAsNumber("/theface/mouthcropper/cropper", 0);
    getObject("_ctl0_bodyContent_mcypos").value = swf.TGetPropertyAsNumber("/theface/mouthcropper/cropper", 1);
    getObject("_ctl0_bodyContent_mcwdth").value = swf.TGetPropertyAsNumber("/theface/mouthcropper/cropper", 8);
    getObject("_ctl0_bodyContent_mchght").value = swf.TGetPropertyAsNumber("/theface/mouthcropper/cropper", 9);
    getObject("_ctl0_bodyContent_rotation").value = swf.TGetPropertyAsNumber("/theface/face1/image", 10);
    getObject("_ctl0_bodyContent_face").value = swf.TGetPropertyAsNumber("/theface/cropper/themask", 4);
}

function swfEdit_DoFSCommand(command, args, textareaID)
{
    if (command == "set_content")
    {
        var field2 = getObject("_ctl0_bodyContent_field2");
    
        field2.value = clean(args);
        setField2();
    }
}

function clean(html)
{
    html = html.replace(/ FACE=\".*?\"/g, " FACE=\"Verdana\"");
    
    return html;
}

function gotoLabel(lbl)
{    
    faceSwf.TGotoLabel("/", lbl);
    
    if (lbl == "field2")
        setField2();
}

function setField2()
{   
    if (as3Ready)
    {
        try
        {
            var field2 = getField2();
            
            if (field2.length == 0)
                faceSwf.updateField2("<p></p>");
            else
                faceSwf.updateField2(field2);
        }
        catch (err){}
    }
}

function loadField2()
{
    var edit = getEmbedObject("swfEdit");
    edit.SetVariable("myHTMLtext", getField2());
}

function getField2()
{
    var field2 = getObject("_ctl0_bodyContent_field2").value;

    if (field2.length == 0)
        field2 = "<p align=\"left\"><font face=\"verdana\" size=\"32\">&nbsp;</font></p>";

    return field2;
}

function switchToon(id)
{
    getObject("_ctl0_bodyContent_hfSwitchID").value = id;
    document.forms['aspnetForm'].submit();    
}

function setFaceTab(tab)
{
    getObject("tabOurFaces").className = "CustomTabBack";
    getObject("tabYourFaces").className = "CustomTabBack";
    
    getObject("divOurFaces").style.display = "none";
    getObject("divYourFaces").style.display = "none";
    
    getObject(tab).className = "CustomTabFront";
    
    switch (tab)
    {
        case "tabOurFaces":
            getObject("divOurFaces").style.display = "block";
            break;
            
        case "tabYourFaces":
            getObject("divYourFaces").style.display = "block";

            var numFaces = Number(getObject("_ctl0_bodyContent_hfNumFaces").value);
            
            if (numFaces == 0)
            {
                getObject("divCreateFace").style.display = "block";
                getObject("divYourFaceSection").style.display = "none";
            }
            else
            {
                getObject("divCreateFace").style.display = "none";
                getObject("divYourFaceSection").style.display = "block";
            }
                
            break;
    }
}

function setDialogTab(tab)
{
    getObject("tabOurDialogs").className = "CustomTabBack";
    getObject("tabYourDialogs").className = "CustomTabBack";
    
    getObject("divOurDialogs").style.display = "none";
    getObject("divYourDialogs").style.display = "none";
    
    getObject(tab).className = "CustomTabFront";
    
    switch (tab)
    {
        case "tabOurDialogs":
            getObject("divOurDialogs").style.display = "block";
            break;
            
        case "tabYourDialogs":
            getObject("divYourDialogs").style.display = "block";
            
            var numDialogs = Number(getObject("_ctl0_bodyContent_hfNumDialogs").value);
            
            if (numDialogs == 0)
            {
                getObject("divCreateDialog").style.display = "block";
                getObject("divYourDialogSection").style.display = "none";
            }
            else
            {
                getObject("divCreateDialog").style.display = "none";
                getObject("divYourDialogSection").style.display = "block";
            }            
            
            break;
    }
}

function setShareTab(tab)
{
    getObject("tabShareEmail").className = "CustomTabBack";
    getObject("tabShareFacebook").className = "CustomTabBack";
    getObject("tabShareLink").className = "CustomTabBack";
    if (getObject("_ctl0_bodyContent_tabShareDownload").className != "")
        getObject("_ctl0_bodyContent_tabShareDownload").className = "CustomTabBack";
    
    getObject("divShareEmail").style.display = "none";
    getObject("divShareFacebook").style.display = "none";
    getObject("divShareDownload").style.display = "none";
    getObject("divShareLink").style.display = "none";
    
    getObject(tab).className = "CustomTabFront";
    
    switch (tab)
    {
        case "tabShareEmail":
            getObject("divShareEmail").style.display = "block";
            break;

        case "tabShareFacebook":
            getObject("divShareFacebook").style.display = "block";
            break;

        case "_ctl0_bodyContent_tabShareDownload":
            getObject("divShareDownload").style.display = "block";
            break;

        case "tabShareLink":
            getObject("divShareLink").style.display = "block";
            break;          
    }
}

function changeDownloadURL(lnk)
{
    var val = getCheckedValue("cclick");

    if (val == null)
        return;
        
    if (val == "yes")
    {
        if (lnk.href.indexOf("&cs=1") == -1)
            lnk.href = lnk.href + "&cs=1";
    }
    else
        lnk.href = lnk.href.replace("&cs=1", "");
}

