var canvas
var pictmat = [false, false, false, false, false, false, false, false, false, false, false]

var req // xml http request
var editstate = 0
var cvedit, ctxedit;
var uploadallowed = false;

var finalDocumentName = ""


function GetAXParm(searchstr,tokenreq) {
    var posmsg = searchstr.indexOf(tokenreq+"=")
    var endmsg = searchstr.indexOf("-->", posmsg)
    if (posmsg >= 0) {
        return searchstr.substring(posmsg + tokenreq.length + 1, endmsg)
    }
    return ""
}


function processPageChange() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            document.getElementById("picgallery").innerHTML = req.responseText
            var clickers = document.getElementById("TyutClicker")
            if (clickers) {clickers.innerHTML = js_YUT + "<br/>" + js_clickhere}
            clickers = document.getElementById("TsasClicker")
            if (clickers) { clickers.innerHTML = js_SAS + "<br/>" + js_clickhere }
            clickers = document.getElementById("TgalClicker")
            if (clickers) { clickers.innerHTML = js_GAL + "<br/>" + js_clickhere }
            clickers = document.getElementById("AutoZoomer")
            if (clickers) { ZoomPic(clickers) }
        } else {
            document.getElementById("picgallery").innerHTML = "<div>We had a problem retrieving your picture data<br><a href='javascript:galleryPage(0)'>Try Again</a><br>" + req.statusText + "</div>"
        }
        req = false
    }
}

function processMetaUpload() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            var axreply = GetAXParm(req.responseText, "RESULT")
            if (axreply!="") {
                finalDocumentName = axreply;
                loadXMLDoc("?Action=GetMath", processGetMath)
                return 1
            } else {
                finalDocumentName = ""
            }
        } else {
            finalDocumentName = ""
        }
        req = false
    }
}

function processGetMath() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            document.getElementById("xspamQuestion").innerHTML = GetAXParm(req.responseText, "QUESTION") + " ";
            document.forms["onlineform"].spamQcode.value = GetAXParm(req.responseText, "CODE");
            galleryPage(-1);
            return 1
        } else {        }
        req = false
    }
}


function processEmailSubmit() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            var axreply = GetAXParm(req.responseText, "RESULT")
            if (axreply != "OK") {
                alert(axreply);
            } else {
            set_view_status(0)
            loadXMLDoc("?Action=Showpage&Page=-2&IMAGEID=" + finalDocumentName, processPageChange)
            editstate = 0
            return 1
            }
        } else {
        alert("A technical issue has prevented us from sending your email. Sorry!");
        }
        req = false
    }
}

function galleryPage(n) {
    loadXMLDoc("?Action=Showpage&Page=" + n, processPageChange)
}
function galleryPageID(n,actualpic) {
    loadXMLDoc("?Action=Showpage&Page=" + n + "&IMAGEID=" + actualpic, processPageChange)
}

function loadBGPicture(hdl, className) {
    var editaction = className != 'pic_bg' ? 0 : 1;
    document.getElementById("infomsg").innerHTML = "<p>" + helpmsg[editaction] + "</p>"
    if (editaction != 0) {
        raph_background_pic(hdl.src)
    }
}

function se_win_reset(hdl) {
    galleryPage(1)
    editstate = 0
    se_win(hdl)
}

function se_win(hdl) {
    var className = hdl.className
    var clickers = false
    className = className.toLowerCase();
    switch (editstate) {
        case 0:
            set_view_status(1);
            clickers = document.getElementById("sasClicker")
            if (clickers) { clickers.style.display = "none"; }
            clickers = document.getElementById("yutClicker");
            if (clickers) { clickers.style.display = "none"; }
            loadBGPicture(hdl, className)
            editstate = 1
            document.getElementById("selActions").style.display = pictmat[0] ? "block" : "none";
            document.getElementById("sasShare").style.display = pictmat[0] ? "block" : "none";
            break;
        case 1:
            switch (className) {
                case 'pic_sm': //It is a smile chosen from the gallery
                    addASmile(hdl); break;
                case 'pic_bg': //background pic from gallery
                    loadBGPicture(hdl, className);
                    break;
            }
            break;
        case 2: //we're doing the SHARE info so ignore all of these events
            break;
    }
}

function upload_image_meta() {
    var urlparms = ""
    var numdone = 0

    for (var i = 0; i <= 10; i++) {
        if (pictmat[i]) {
            urlparms = urlparms + "&I" + (++numdone) + "=" + pictmat[i].serverpic + "," + Math.round(pictmat[i].attr("x")) + "," + Math.round(pictmat[i].attr("y")) + "," + Math.round(pictmat[i].attr("width")) + "," + Math.round(pictmat[i].attr("height")) + "," + Math.round(pictmat[i].attr("rotation"));
        }
    }
    if (numdone > 0) {
        urlparms = "?Action=SaveMeta&Images=" + numdone + urlparms
        loadXMLDoc(urlparms, processMetaUpload)
    }
}

function set_view_status(newstate) {
    switch (newstate) {
        case 1: // Editing Mode
            document.getElementById("userarea").style.display = "block";
            document.getElementById("editsmile").style.display = "block";
            document.getElementById("selActions").style.display = "block";
            document.getElementById("selBackgrounds").style.display = "block";
            document.getElementById("editshare").style.display = "none";
            document.getElementById("selTerms").style.display = "none";
            document.getElementById("sasleftflash").style.display = "none";
            break;
        case 2: // Data Mode
            document.getElementById("Terms").checked = false;
            document.getElementById("xspamAnswer").value = '';
            document.getElementById("userarea").style.display = "block";
            document.getElementById("editsmile").style.display = "none";
            document.getElementById("selActions").style.display = "none";
            document.getElementById("selBackgrounds").style.display = "none";
            document.getElementById("editshare").style.display = "block";
            document.getElementById("selTerms").style.display = "block";
            document.getElementById("sasleftflash").style.display = "none";
            break;
        case 0: // Gallery and Initial Mode
            document.getElementById("userarea").style.display = "none";
            document.getElementById("selBackgrounds").style.display = "none";
            document.getElementById("sasleftflash").style.display = "block";
            document.getElementById("selActions").style.display = "none";
            document.getElementById("sasShare").style.display = "none";
            document.getElementById("editsmile").style.display = "none";
            document.getElementById("selActions").style.display = "none";
            document.getElementById("selBackgrounds").style.display = "none";
            document.getElementById("editshare").style.display = "none";
            document.getElementById("selTerms").style.display = "none";
    }
}

function sas_Share() {
    upload_image_meta();
    set_view_status(2)
    editstate = 2
    document.getElementById("infomsg").innerHTML = "<p>" + helpmsg[3] + "</p>"
    emailForm_CheckSubmit();
}

function sas_back() {
    switch (--editstate) {
        case 1:
            set_view_status(1)
            break;
        default:
            set_view_status(0)
            editstate = 0;
            galleryPage(0);
            break;
    }
}

function XMLRequest(urlparms, returnproc, actionpage) {
    req = false;
    if (window.XMLHttpRequest && !(window.ActiveXObject)) {
        try {
            req = new XMLHttpRequest();
        } catch (e) {
            req = false;
        }
    } else if (window.ActiveXObject) {
        try {
            req = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                req = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                req = false;
            }
        }
    }
    if (req) {
        if (returnproc) { req.onreadystatechange = returnproc; }
        req.open("POST", "http://www.mouthsmadegood.com/includes/asp/" + actionpage + urlparms + "&ln=" + js_Language + "&FL=" + js_Full_Language, true);
//        req.open("POST", "http://10.199.4.16/includes/asp/" + actionpage + urlparms + "&ln=" + js_Language + "&FL=" + js_Full_Language, true);
        req.send("");
    }
}


function loadXMLDoc(urlparms, returnproc) {
    XMLRequest(urlparms, returnproc, "ajaxdata.asp");
}

function isImage(file) {
    var ext = file.substr(file.lastIndexOf('.')).toLowerCase()
    return '.gif,.jpg,.png,.jpeg,.bmp,'.indexOf(ext + ',') >= 0
}


var isDrag = false;
var lastSel = false;
var lastUndo = false;
var ticker
var selanyamt

function addASmile(hdl) {
    var i = 1
    while ((pictmat[++i] != false) && (i <= 10)) { }
    if (i <= 10) {
        pictmat[i] = canvas.image(hdl.src.replace(".jpg", ".png"), 0, 0, 190, 170);
        pictmat[i].insertBefore(pictmat[i-1]);
        pictmat[i].insertAfter(pictmat[1]);
        pictmat[i].node.style.cursor = 'move';
        pictmat[i].mousedown(raph_drag);
        pictmat[i].pscale = 0.3
        pictmat[i].matindex = i;
        pictmat[i].serverpic = hdl.src.replace(".jpg", ".png")
        pictmat[i].attr({"stroke-width": 2, "stroke": "black", "fill":"none", "stroke-opacity":1 })
        lastSel = pictmat[i]
        lastSel.attr({ "stroke-width": 2, "stroke": "black", "fill":"none", "stroke-opacity":1 });
        lastSel.scale(lastSel.pscale, lastSel.pscale);
        if (uploadallowed) {
            document.uploadpic.submit();
            uploadallowed = false;
        }
    }
    document.getElementById("infomsg").innerHTML = "<p>" + helpmsg[2] + "</p>"
}

function raph_background_pic(bgname) {
    for (var i = 0; i <= 10; i++) {
        if (pictmat[i]) {
            pictmat[i].remove();
            pictmat[i] = false;
        }
    }
    if (bgname) {
        pictmat[0] = canvas.image(bgname, 3, 3, 212, 272);
        pictmat[0].serverpic = bgname;
        pictmat[1] = canvas.rect(0, 0, 217, 277, 12).attr({ "stroke-width": 6, "stroke": "#ff9900" });
        pictmat[1].insertAfter(pictmat[0]);
        pictmat[1].serverpic = "/iGallery/bg/roundFrame.gif"
        uploadallowed = false;
        galleryPage(11);
        document.getElementById("selActions").style.display = "block";
        document.getElementById("sasShare").style.display = "block";
    }
}

function raph_endtick() {
    if (lastSel) {
        clearInterval(ticker);
    }
}

function raph_start_any(amt, proc) {
    if (lastSel) {
        selanyamt = amt;
        ticker = setInterval(proc, 100);
        isDrag = lastSel;
    }
}

function raph_start_rotate(amt) {
    raph_start_any(amt, raph_rotate);
}

function raph_start_shrink() {
    raph_start_any(-0.05, raph_scale);
}

function raph_start_grow() {
    raph_start_any(+0.05, raph_scale);
}

function raph_rotate() {
    lastSel.rotate(selanyamt);
}

function raph_scale() {
    lastSel.pscale += selanyamt
    if (lastSel.pscale > 0.1) { lastSel.scale(lastSel.pscale, lastSel.pscale); }
}

function raph_delete() {
    if (lastUndo || lastSel) {
        lastSel = !lastSel ? lastUndo : lastSel;
        pictmat[lastSel.matindex] = false;
        lastSel.remove();
        lastUndo = false;
        lastSel = false;
        isDrag = false;
    }
}

var raph_drag = function(e) {
    if (lastSel && lastSel != this) {
        lastSel.attr({ "stroke-width": 0 });
        lastUndo = lastSel;
    }
    e = e || event;
    this.dx = e.clientX;
    this.dy = e.clientY;
    isDrag = this; lastSel = false;
    isDrag.attr({ "stroke-width": 0 });
    e.preventDefault()
    return false
}

function generic_move(e) {
    e = e || event;
    if (isDrag && !lastSel) {
        isDrag.translate(e.clientX - isDrag.dx, e.clientY - isDrag.dy);
        canvas.safari();
        isDrag.dx = e.clientX;
        isDrag.dy = e.clientY;
    }
    return false
}

document.mousemove = function(e) {
    return generic_move(e);
}

parent.document.onmousemove = function(e) {
    return generic_move(e);
}

parent.document.onmouseup = function() {
    if (isDrag) {
        isDrag.attr({ "stroke-width": 2 });
        lastSel = isDrag
        isDrag = false;
    } else {
        if (lastSel) {
            lastSel.attr({"stroke-width": 0 });
            lastUndo = lastSel;
            lastSel = false;
        }
    }
}


function uploadDone() { //Function will be called when iframe is loaded
    var ret = frames['upload_target'].document.getElementsByTagName("body")[0].innerHTML;
    var posmsg = GetAXParm(ret, "SAVED")
    if (posmsg != '') {
        uploadallowed = false;
        pictmat[0] = canvas.image(posmsg, 3, 3, 212, 272);
        pictmat[0].serverpic = posmsg;
        pictmat[0].insertBefore(pictmat[1]);
    } else {
        posmsg = GetAXParm(ret, "ERROR")
        if (posmsg!='') { alert(posmsg); }
    }
    return false;
}


function get_ImagePath(input) {
    var ians = document.uploadpic.xfileName.value
    try {
        if (input.files && input.files[0]) {
            ians = input.files[0].getAsDataURL(); }
    }
    catch (e) {
        var uploadField = document.uploadpic.xfileName

        // now create a clone
        var clone = uploadField.cloneNode(true);
        clone.type = "text";

        // now we can extract the value
        ians = clone.value;
        //                ians = document.uploadpic.xfileName.value;
    }
    return ians;
}

function DoPreview(what) {
    raph_background_pic(get_ImagePath(what))
    document.getElementById("upload_target").onload = uploadDone;
    uploadallowed = true;
    document.getElementById("uploadpic").submit();
    return false;
}

function URLEncode(clearString) {
    var output = '';
    var x = 0;
    clearString = clearString.toString();
    var regex = /(^[a-zA-Z0-9_.]*)/;
    while (x < clearString.length) {
        var match = regex.exec(clearString.substr(x));
        if (match != null && match.length > 1 && match[1] != '') {
            output += match[1];
            x += match[1].length;
        } else {
            if (clearString[x] == ' ')
                output += '+';
            else {
                var charCode = clearString.charCodeAt(x);
                var hexVal = charCode.toString(16);
                output += '%' + (hexVal.length < 2 ? '0' : '') + hexVal.toUpperCase();
            }
            x++;
        }
    }
    return output;
}


function escHTMLEncode(str) {
    str = str.replace(new RegExp("\\r\n", "g"), "<br/>")
    return URLEncode(str);
}

function emailForm_Submit() {
    var emsg = ""
    var eitem
    var form = document.forms["onlineform"]
    document.getElementById("err1").style.display = (form.blinfullname.value.length < 2 ? 'inline' : 'none');
    document.getElementById("err3").style.display = (form.blincomments.value.length < 2 ? 'inline' : 'none');
    document.getElementById("err2").style.display = (form.blinemailaddress.value.length < 6 ? 'inline' : 'none');
    x = 0
    while (++x < 4) {
        if (document.getElementById("err" + x).style.display == 'inline') { return false }
    }
    emsg = "&Sender=" + escHTMLEncode(form.blinfullname.value) + "&Email=" + escHTMLEncode(form.blinemailaddress.value) + "&Comments=" + escHTMLEncode(form.blincomments.value) + "&SpamAnswer=" + escHTMLEncode(document.getElementById("xspamAnswer").value) + "&SpamCode=" + form.spamQcode.value + "&ImageID=" + finalDocumentName + "&Gallery=" + (document.getElementById("Gallery").checked ? "Y" : "N")
    loadXMLDoc("?Action=SendMail" + emsg, processEmailSubmit)
    return false
}
function emailForm_CheckSubmit() {
    btnEmailOut()
    btnSaveOut()
}

function btnEmailOver() {
    var divitem = document.getElementById("btnEmail").style
    var bstate = ((document.getElementById("Terms").checked) && (finalDocumentName != ''))
    divitem.color = bstate ? "Black" : "#FF6600";

}
function btnEmailOut() {
    var divitem = document.getElementById("btnEmail").style
    var bstate = ((document.getElementById("Terms").checked) && (finalDocumentName != ''))
    divitem.color = bstate ? "White" : "#FF6600";
    document.getElementById("editshare").style.display = bstate ? "block" : "none";

}
function btnEmailClick() {
    var bstate = ((document.getElementById("Terms").checked) && (finalDocumentName != ''))
    if (bstate) { emailForm_Submit() }
}

function btnSaveOver() {
    var divitem = document.getElementById("btnSave").style
    var bstate = ((document.getElementById("Gallery").checked) && (document.getElementById("Terms").checked) && (finalDocumentName != ''))
    divitem.color = bstate ? "Black" : "#FF6600";

}
function btnSaveOut() {
    var divitem = document.getElementById("btnSave").style
    var bstate = ((document.getElementById("Gallery").checked) && (document.getElementById("Terms").checked) && (finalDocumentName != ''))
    divitem.color = bstate ? "White" : "#FF6600";
}
function btnSaveClick() {
    var bstate = ((document.getElementById("Gallery").checked) && (document.getElementById("Terms").checked) && (finalDocumentName != ''))
    if (bstate) {
        var form = document.forms["onlineform"]
        emsg = "&SpamAnswer=" + escHTMLEncode(document.getElementById("xspamAnswer").value) + "&SpamCode=" + form.spamQcode.value + "&ImageID=" + finalDocumentName + "&Gallery=Y"
        loadXMLDoc("?Action=SendMail" + emsg, processEmailSubmit)
    }
}

function ZoomPic(what) {
    if (what.style.height != "364px") {
        what.style.height = "364px"
        what.style.width = "274px"
//        what.style.height = "272px"
//        what.style.width = "212px"
        what.style.position = "absolute";
        what.style.left = "73px";
        what.style.top = "182px";
    } else {
        what.style.height = "175px"
        what.style.width = "130px"
        what.style.position = "relative";
        what.style.left = "0px";
        what.style.top = "0px";
    }
}

function ZoombyID(theID) {
    ZoomPic(document.getElementById(theID));
}

function Zoomer_Click(what) {
    galleryPage(-1);
    se_win(what);
}

function youtube(what) {
    window.open('http://www.youtube.com/user/mouthsmadegood#p/a', 'MouthsMadeGood', 'width=800,height=600,toolbar=yes,location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes,resizable=yes')
}

var sas_gal_next = ""
var sas_gal_prev = ""
var sas_gal_page = 1
var sas_gal_action = 0
var sas_gal_timer = 0

function processViewPageChange() {
    if (req.readyState == 4) {
        if (req.status == 200) {
            sas_gal_page = (GetAXParm(req.responseText, "PAGENUMBER"))
            sas_gal_next = GetAXParm(req.responseText, "PAGENEXT")
            document.getElementById("picgalleryNext").innerHTML = sas_gal_next
            sas_gal_prev = GetAXParm(req.responseText, "PAGEPREV")
            document.getElementById("picgalleryPrev").innerHTML = sas_gal_prev
        } else {
            document.getElementById("picgallery").innerHTML = "<div>We had a problem retrieving your picture data<br><a href='javascript:galleryPage(0)'>Try Again</a><br>" + req.statusText + "</div>"
        }
        req = false;
    }
}

function buffer_galleryPage() {
    if (!req) {
        loadXMLDoc("?Action=GALLERY&Page=" + sas_gal_page + "&OPTION=" + sas_gal_action, processViewPageChange)
        clearTimeout(sas_gal_timer); sas_gal_timer = 0
    } else {
        sas_gal_timer = setTimeout("buffer_galleryPage()", 300);
    }
}

function gallery_viewPage(borf) {
    document.getElementById("picgallery").innerHTML = document.getElementById(borf > 0 ? "picgalleryNext" : "picgalleryPrev").innerHTML
    var clickers = document.getElementById("TyutClicker")
    if (clickers) { clickers.innerHTML = js_YUT + "<br/>" + js_clickhere }
    clickers = document.getElementById("TsasClicker")
    if (clickers) { clickers.innerHTML = js_SAS + "<br/>" + js_clickhere }
    clickers = document.getElementById("TgalClicker")
    if (clickers) { clickers.innerHTML = js_GAL + "<br/>" + js_clickhere }
    sas_gal_action = borf;
    buffer_galleryPage();
    editstate = 0
}