// load jQuery dynamically
function LoadJQuery() {
    if (typeof jQuery == "undefined") {
        var script = document.createElement('script');
        script.setAttribute("type", "text/javascript");
        script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js");
        if (typeof script != "undefined")
            document.getElementsByTagName("head")[0].appendChild(script);
    }
    RunWidget(0);
}
// make sure that jQuery is loaded and 
function RunWidget(time_elapsed) {
    // Continually polls to see if jQuery is loaded.
    if (typeof jQuery == "undefined") { // if jQuery isn't loaded yet...
        if (time_elapsed <= 10000) { // and we haven't given up trying...
            setTimeout("RunWidget(" + (time_elapsed + 200) + ")", 200); // set a timer to check again in 200 ms.  
        } else {
            alert("Timed out while loading jQuery.")
        }
    } else {
        // Any code to run after jQuery loads goes here!
        GetMoolalaDeal();
    }
}
// initiate jQuery load
LoadJQuery();

// this function will make a call to moolala to get a daily deal of a given location
var ajaxLoading = false;
function GetMoolalaDeal() {
    ajaxLoading = true;
    //if (moo_width != 0 && moo_height != 0) {
    $.ajax({
        type: "GET",
        url: "http://www.moolala.com/Widget/GetDeal",
        data: { location: moo_location, publisherId: moo_pid, apikey: moo_apikey },
        dataType: "jsonp",
        jsonpCallback: "HandleMoolalaDeal",
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            ajaxLoading = false;
            alert('Unable to get Moolala Deal :-(');
        }
    });
    //}
}

// this is the callback function that will handle the returned data from moolala
var isCallbackFunctionCalled = false;
function HandleMoolalaDeal(data) {
    ajaxLoading = false;
    if (!isCallbackFunctionCalled) {
        isCallbackFunctionCalled = true;

        var moo_aid = 'K2XYEQL'; // Moolala Member Deal Widget
        var moo_cid = 'TPDQRAT'; // Moolala Member Deal Widget
        var moo_rendered = moo_affiliate_widget + 'Render';
        var domain = data.domain;
        if (moo_cjaid != "" && moo_cjpid != "") {
            moo_aid = 'UH5BDHA'; // CJ Deal Widget
            moo_cid = '59D2V7U'; // CJ Deal Widget
            moo_pid = 'DT5M1VD'; // CJ Publisher ID
            domain = "http://www.moolala.com";
        }

        var link = domain + "/deals/id/" + data.dealCode;
        var imageSource = "http://files.moolala.com/images/data/deals/" + data.image;
        if (data.success == "0") {
            link = domain + "/deals/" + data.location.replace('/','%20');
            imageSource = "http://files.moolala.com/images/widget/"+ data.image;
        }
        link += "?aid=" + moo_aid + "&pid=" + moo_pid + "&cid=" + moo_cid;
        var signupLink = domain + "/Signup?aid=" + moo_aid + "&pid=" + moo_pid + "&cid=" + moo_cid;

        // handle when generating widget for cj affiliates
        if (moo_cjaid != "" && moo_cjpid != "") {
            var cjPartialLink = "http://www.jdoqocy.com/click-" + moo_cjpid + "-" + moo_cjaid + "?url=";
            link = cjPartialLink + escape(link);
            signupLink = cjPartialLink + escape(signupLink);
        }
        
        var titleHeight = 0;
        var titleWidth = 0;
        var locationHeight = 0;
        var locationWidth = 0;
        
        var html;
        if (moo_width == 88 && moo_height == 31) {
            titleHeight = 0;
            locationHeight = 0;
            locationWidth = 0;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;overflow:hidden;'>" +
                    "<div id='moo_header' style='height:29px;text-align:center;'>" +
                        "<div style='width:84px;margin-top:1px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div style='margin-top:-1px;'><a href='" + link + "' style='color:" + moo_color + ";font-weight:bold;font-size:9px;text-decoration:underline;'>VIEW DEAL</a></div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 120 && moo_height == 60) {
            titleHeight = 45;
            locationHeight = 0;
            locationWidth = 0;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;overflow:hidden;'>" +
                    "<div id='moo_header' style='height:15px;overflow:hidden;'>" +
                        "<div style='float:left;padding:3px 0 0 3px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div style='float:right;padding:3px 3px 0 0;'><a href='" + link + "' style='color:" + moo_color + ";font-weight:bold;font-size:9px;text-decoration:underline;'>VIEW DEAL</a></div>" +
                        "<div style='clear:both;'></div>" +
                    "</div>" +
                    "<div style='clear:both;'></div>" +
                    "<div id='moo_body' style='height:39px;overflow:hidden;'>" +  
                        "<div id='moo_body_title' style='font-size:11px;font-weight:bold;line-height:12px;padding:0px 3px 4px 3px;'>" +
                            "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 120 && moo_height == 90) {
            titleHeight = 60;
            locationHeight = 0;
            locationWidth = 0;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;overflow:hidden;'>" +
                    "<div id='moo_header' style='height:23px;'>" +
                        "<div style='float:left;padding:4px 0 0 4px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div style='float:right;font-weight:bold;font-size:9px;padding:4px 4px 0 0;'>" +
                            "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:underline;'>VIEW DEAL</a>" +
                        "</div>" +
                    "</div>" +
                    "<div style='clear:both;'></div>" +
                    "<div id='moo_body' style='height:58px;overflow:hidden;'>" +
                        "<div id='moo_body_title' style='font-size:11px;font-weight:bold;line-height:14px;padding:0 0 3px 3px;'>" +
                            "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 120 && moo_height == 600) {
            titleHeight = 170;
            locationHeight = 18;
            locationWidth = 105;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;overflow:hidden;'>" +
                    "<div id='moo_header' style='height:50px;'>" +
                        "<div style='padding:6px 0 1px 4px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='padding:0 4px 0 4px;color:white;font-weight:normal;font-size:14px;'>" +
                            data.location.toUpperCase() + 
                        "</div>" +
                    "</div>" +
                    "<div id='moo_body' style='color:#666;text-align:center;font-family:Verdana;'>" +
                        "<div style='padding-top:4px;'>" +
                            "<a href='" + link + "'><img src='" + imageSource + "' style='width:112px;height:66px;border:0px;'></a>" +
                        "</div>" +
                        "<div style='height:203px;overflow:hidden;'>" +
                            "<div style='padding:5px;font-size:17px;font-weight:bold;line-height:24px;font-family:Arial;'>" +
                                "<a id='moo_body_title' href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='background-color:#ececec;height:80px;display:block;padding-top:10px;font-weight:bold;font-size:10px;'>" +
                            "<div style='width:110px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>WORTH</div>" +
                                "<div style='float:left;text-align:right;width:52px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                            "<div style='width:110px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>SAVE</div>" +
                                "<div style='float:left;text-align:right;width:52px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                            "<div style='border-bottom:1px dotted #666;width:105px;font-size:1px;margin:5px 10px 5px 5px;'></div>" +
                            "<div style='width:110px;height:45px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:5px;'>PRICE</div>" +
                                "<div style='float:left;text-align:right;width:52px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                        "</div>" +
                        "<div style='height:68px;margin-top:20px;overflow:hidden;'>";
            if (data.success == "1") {
                html +=
                            "<div id='moo_time_left_container' style='font-size:12px;'><span id='moo_time_left'></span><br>left to buy</div>" +
                            "<div style='font-size:12px;margin-top:15px;'>" + (data.vouchersBought != "0" ? "<b>" + data.vouchersBought + "</b> bought" : "Buy Now!!!") + "</div>";
            }
            else {
                html += 
                            "<div style='font-weight:bold;font-size:12px;line-height:18px;height:50px;padding:0 15px 0 15px;'>Save 50%-90% on local deals!</div>";
            }
            html +=
                        "</div>" +
                        "<div style='font-size:13px;background-color:" + moo_color + ";margin:20px 10px 10px 12px;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                                "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton.png' style='padding:5px 7px 5px 7px;'></a>" +
                        "</div>" +
                        "<div style='font-size:11px;font-weight:normal;text-align:center;font-family:Arial;'>" +
                            "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 125 && moo_height == 125) {
            titleHeight = 63;
            if (data.success == "0")
                titleHeight = 56;
            locationHeight = 15;
            locationWidth = 110;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:40px;overflow:hidden;'>" +
                        "<div style='margin:5px 0 1px 6px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='padding:0 6px 0 6px;color:white;font-weight:normal;font-size:12px;'>" + data.location.toUpperCase() + "</div>" +
                    "</div>" +
                    "<div id='moo_body' style='color:#666;text-align:left;height:83px;'>" +
                        "<div style='height:65px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='font-size:12px;font-weight:bold;padding-left:2px;margin:3px;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='width:118px;text-align:right;margin:2px 3px 3px 0;'><a href='" + link + "' style='color:" + moo_color + ";font-weight:bold;font-size:9px;text-decoration:underline;'>VIEW DEAL</a></div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 160 && moo_height == 600) {
            titleHeight = 185;
            locationHeight = 19;
            locationWidth = 145;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='width:158px;height:65px;overflow:hidden;'>" +
                        "<div style='padding:12px 12px 5px 12px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div style='height:20px;overflow:hidden;'>" +
                            "<div id='moo_header_location' style='padding:0 12px 0 12px;color:white;font-weight:bold;font-size:14px;'>" + data.location.toUpperCase() + "</div>" +
                        "</div>" +
                    "</div>" +
                    "<div id='moo_body' style='color:#666;text-align:center;font-family:Verdana;'>" +
                        "<div style='padding:4px;'>" +
                            "<a href='" + link + "'><img src='" + imageSource + "' style='width:150px;height:87px;border:0;'></a>" +
                        "</div>" +
                        "<div style='height:185px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='padding:10px;font-size:17px;font-weight:bold;overflow:hidden;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;line-height:24px;font-family:Arial;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='background-color:#ececec;height:85px;overflow:hidden;font-weight:bold;font-size:10px;'>" +
                            "<div style='padding:10px 0 0 15px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>WORTH</div>" +
                                "<div style='float:left;text-align:right;width:55px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                            "<div style='padding-left:15px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>SAVE</div>" +
                                "<div style='float:left;text-align:right;width:55px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                            "<div style='border-bottom:1px dotted #666;width:115px;font-size:1px;margin:5px 20px 5px 20px;'></div>" +
                            "<div style='padding:0 0 15px 15px;'>" +
                                "<div style='float:left;text-align:right;width:55px;padding-top:5px;'>PRICE</div>" +
                                "<div style='float:left;text-align:right;width:55px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                                "<div style='clear:both;'></div>" +
                            "</div>" +
                        "</div>"+
                        "<div style='height:68px;margin-top:15px;overflow:hidden;'>";
            if (data.success == "1") {
                html +=
                            "<div id='moo_time_left_container' style='font-size:12px;'><span id='moo_time_left'></span><br>left to buy</div>" +
                            "<div style='font-size:12px;padding-top:15px;'>" + (data.vouchersBought != "0" ? "<b>" + data.vouchersBought + "</b> bought" : "Buy Now!!!") + "</div>";
            }
            else {
                html +=
                            "<div style='font-weight:bold;font-size:12px;line-height:20px;padding:0 25px 0 25px;'>Save 50%-90% on local deals!</div>";
            }
            html +=
                        "</div>" +
                        "<div style='padding:20px 25px 0 25px;'>" +
                            "<div style='font-size:13px;background-color:" + moo_color + ";padding:5px 7px 5px 7px;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                                "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton.png' style=''></a>" +
                            "</div>" +
                            "<div style='font-size:11px;font-weight:normal;text-align:center;font-family:Arial;margin-top:5px;'>" +
                                "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                            "</div>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 180 && moo_height == 150) {
            titleHeight = 50;
            if (data.success == "0")
                titleHeight = 41;
            locationHeight = 15;
            locationWidth = 168;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:39px;overflow:hidden;'>" +
                        "<div style='padding:4px 0 0 6px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='color:white;font-weight:normal;font-size:12px;padding:1px 6px 0 6px;'>" + data.location.toUpperCase() + "</div>" +
                    "</div>" +
                    "<div id='moo_body' style='color:#666;height:108px;overflow:hidden;'>" +
                        "<div style='height:54px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='padding:4px;font-size:12px;font-weight:bold;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='padding:0 0 4px 4px;'>" +
                            "<div style='float:left;'>" +
                                "<a href='" + link + "'><img src='" + imageSource + "' style='width:83px;border:0px;'></a>" +
                            "</div>" +
                            "<div style='float:left;margin:8px 0 0 7px;'>" +
                                "<div style='font-size:13px;background-color:" + moo_color + ";margin-bottom:4px;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                                    "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton_small.png' style='padding:3px 6px 3px 5px;'></a>" +
                                "</div>" +
                                "<div style='font-size:11px;font-weight:normal;text-align:center;font-family:Arial;'>" +
                                    "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                                "</div>" +
                            "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 234 && moo_height == 60) {
            titleHeight = 36;
            locationHeight = 20;
            locationWidth = 110;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:20px;overflow:hidden;'>" +
                        "<div style='float:left;padding:5px 5px 0 5px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='float:left;color:#777;font-weight:bold;font-size:10px;padding-top:7px;'>" + data.location.toUpperCase() + "</div>" +
                        "<div style='float:right;padding-top:5px;padding-right:4px;'>" +
                            "<a href='" + link + "' style='color:" + moo_color + ";font-weight:bold;font-size:10px;text-decoration:underline;'>VIEW DEAL</a>"+
                        "</div>" +
                    "</div>" +
                    "<div style='clear:both;'></div>" +
                    "<div id='moo_body' style='height:38px;overflow:hidden;'>" +
                        "<div id='moo_body_title' style='font-size:12px;font-weight:bold;padding:3px 5px 3px 5px;'>" +
                            "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 250 && moo_height == 250) {
            titleHeight = 57;
            locationHeight = 25;
            locationWidth = 165;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:33px;overflow:hidden;'>" +
                        "<div style='float:left;padding:7px 0 7px 7px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='float:left;color:white;font-weight:bold;font-size:14px;padding:10px 0 0 5px;'>" + data.location.toUpperCase() + "</div>" +
                        "<div style='clear:both;'></div>" +
                    "</div>" +
                    "<div id='moo_body' style='color:#666;height:215px;overflow:hidden;'>" +
                        "<div style='height:62px;overflow:hidden;padding:5px 5px 0 5px;'>" +
                            "<div id='moo_body_title' style='padding-bottom:7px;font-size:15px;font-weight:bold;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='font-family:Verdana;height:90px;'>" +
                            "<div style='float:left;'>" +
                                "<a href='" + link + "'><img src='" + imageSource + "' style='width:124px;height:75px;border:0;'></a>" +
                            "</div>" +
                            "<div style='float:left;font-weight:bolder;font-size:9px;height:72px;width:120px;overflow:hidden;'>" +
                                "<div style='padding:5px 0 0 0px;'>" +
                                    "<div style='float:left;text-align:right;width:50px;padding-top:3px;'>WORTH</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div>" +
                                    "<div style='float:left;text-align:right;width:50px;padding-top:3px;'>SAVE</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='border-bottom:1px dotted #666;width:105px;font-size:1px;margin:5px 20px 5px 10px;'></div>" +
                                "<div>" +
                                    "<div style='float:left;text-align:right;width:50px;padding-top:6px;'>PRICE</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                            "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='font-size:12px;font-family:Verdana;height:54px;overflow:hidden;'>" +
                            "<div style='float:left;padding:5px 0 0 10px;'>";
            if (data.success == "1") {
                html +=
                                "<div style='margin-top:5px;' id='moo_time_left_container'><span id='moo_time_left'></span>&nbsp;left to buy</div>" +
                                "<div style='margin-top:5px;'>" + (data.vouchersBought != "0" ? "<b>" + data.vouchersBought + "</b> bought" : "Buy Now!!!") + "</div>";
            } else {
                html +=
                                "<div style='font-weight:bold;font-size:12px;line-height:20px;padding:0px;width:125px;'>Save 50%-90% on local deals!</div>";
            }
            html +=
                            "</div>" +
                            "<div style='float:right;padding:5px 10px 0 0;'>" +
                                "<div style='font-size:13px;background-color:" + moo_color + ";margin:5px 0 7px 10px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;'>" +
                                    "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton_small.png' style='padding:3px 7px 3px 7px;'></a>" +
                                "</div>" +
                                "<div style='font-size:11px;font-weight:normal;text-align:center;font-family:Arial;'>" +
                                    "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                                "</div>" +
                            "</div>" +
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 300 && moo_height == 250) {
            titleHeight = 57;
            locationHeight = 25;
            locationWidth = 205;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:33px;overflow:hidden;'>" +
                        "<div style='float:left;width:75px;padding:7px 0 0 7px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</div>" +
                        "<div id='moo_header_location' style='float:left;color:white;font-weight:bold;font-size:14px;padding:10px 0 0 5px;'>" + data.location.toUpperCase() + "</div>" +
                        "<div style='clear:both;'></div>" +
                    "</div>" +
                    "<div id='moo_body' style='height:215px;overflow:hidden;color:#666;'>" +
                        "<div style='padding:1px;height:65px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='font-size:15px;font-weight:bold;padding:5px;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='font-family:Verdana;overflow:hidden;height:120px;'>" +
                            "<div style='float:left;margin-left:8px;'>" +
                                "<a href='" + link + "'><img src='" + imageSource + "' style='width:170px;height:102px;border:0'></a>" +
                            "</div>" +
                            "<div style='float:left;font-size:10px;font-weight:bolder;width:115px;height:120px;overflow:hidden;'>" +
                                "<div style='height:18px;overflow:hidden;'>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>WORTH</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='height:18px;overflow:hidden;'>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>SAVE</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='border-bottom:1px dotted #666;height:1px;width:105px;overflow:hidden;font-size:1px;margin:5px 20px 5px 10px;'></div>" +
                                "<div style='height:20px;overflow:hidden;'>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:6px;'>PRICE</div>" +
                                    "<div style='float:left;text-align:right;width:55px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='float:right;padding:5px 10px 0 0;'>" +
                                    "<div style='font-size:13px;background-color:" + moo_color + ";margin:5px 0 3px 10px;-moz-border-radius:5px;-webkit-border-radius:5px;-khtml-border-radius:5px;border-radius:5px;'>" +
                                        "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton.png' style='padding:3px 7px 3px 7px;'></a>" +
                                    "</div>" +
                                    "<div style='font-size:11px;font-weight:normal;text-align:right;font-family:Arial;'>" +
                                        "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                                    "</div>" +
                                "</div>" +
                            "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='font-size:12px;height:30px;padding:0px 8px 0px 8px;font-family:Verdana;'>";
            if (data.success == "1") {
                html +=
                            "<div id='moo_time_left_container' style='float:left;'><span id='moo_time_left'></span>&nbsp;left to buy</div>" +
                            "<div style='float:right;'>" + (data.vouchersBought != "0" ? "<b>" + data.vouchersBought + "</b> bought" : "Buy Now!!!") + "</div>" +
                            "<div style='clear:both;'></div>";
            } else {
                html +=
                            "<div style='font-weight:bold;font-size:12px;'>Save 50%-90% on local deals!</div>";
            }
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 336 && moo_height == 280) {
            titleHeight = 60;
            locationHeight = 25;
            locationWidth = 220;
            html =
                "<div id='" + moo_rendered + "' style='font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div id='moo_header' style='height:38px;overflow:hidden;'>" +
                        "<span style='float:left;width:75px;padding:9px 0 0 10px;'>" +
                            "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                        "</span>" +
                        "<div id='moo_header_location' style='float:left;color:white;font-weight:bold;font-size:14px;padding:10px 0 0 2px;'>" + data.location.toUpperCase() + "</div>" +
                        "<div style='clear:both;'></div>" +
                    "</div>" +
                    "<div id='moo_body' style='height:240px;overflow:hidden;color:#666;'>" +
                        "<div style='margin-bottom:5px;height:62px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='padding:5px;font-size:15px;font-weight:bold;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                        "<div style='font-family:Verdana;height:125px;'>" +
                            "<div style='float:left;margin-left:5px;'>" +
                                "<a href='" + link + "'><img src='" + imageSource + "' style='width:200px;height:120px;border:0;'></a>" +
                            "</div>" +
                            "<div style='float:left;font-size:10px;font-weight:bolder;width:125px;overflow:hidden;'>" +
                                "<div style='padding-top:5px;'>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>WORTH</div>" +
                                    "<div style='float:left;text-align:right;width:58px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>SAVE</div>" +
                                    "<div style='float:left;text-align:right;width:58px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='border-bottom:1px dotted #666;width:105px;font-size:1px;margin:5px 20px 5px 10px;'></div>" +
                                "<div>" +
                                    "<div style='float:left;text-align:right;width:55px;padding-top:6px;'>PRICE</div>" +
                                    "<div style='float:left;text-align:right;width:58px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                                    "<div style='clear:both;'></div>" +
                                "</div>" +
                                "<div style='float:right;'>" +
                                    "<div style='font-size:13px;background-color:" + moo_color + ";margin:15px 10px 3px 10px;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                                        "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton.png' style='padding:4px 7px 4px 12px;'></a>" +
                                    "</div>" +
                                    "<div style='font-size:11px;font-weight:normal;text-align:right;font-family:Arial;padding-right:5px;'>" +
                                        "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                                    "</div>" +
                                "</div>" +
                            "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='font-size:12px;padding:15px 10px 5px 10px;font-family:Verdana;'>";
            if (data.success == "1") {
                html +=
                            "<div style='float:left;' id='moo_time_left_container'><span id='moo_time_left'></span>&nbsp;left to buy</div>" +
                            "<div style='float:right;'>" + (data.vouchersBought != "0" ? "<b>" + data.vouchersBought + "</b> bought" : "Buy Now!!!") + "</div>" +
                            "<div style='clear:both;'></div>";
            } else {
                html +=
                            "<div style='font-weight:bold;font-size:12px;padding:0px;'>Save 50%-90% on local deals!</div>";
            }
                        "</div>" +
                    "</div>" +
                "</div>";
        } else if (moo_width == 468 && moo_height == 60) {
            titleHeight = 33;
            locationHeight = 17;
            locationWidth = 215;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;'>" +
                    "<div style='padding:2px;float:left;'>" +
                        "<a href='" + link + "'><img src='" + imageSource + "' style='width:90px;height:54px;border:0;'></a>" +
                    "</div>" +
                    "<div style='float:left;width:280px;'>" +
                        "<div id='moo_header' style='padding:4px 0 0 4px;height:20px;overflow:hidden;'>" +
                            "<div style='width:57px;float:left;'>" +
                                "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                            "</div>" +
                            "<div id='moo_header_location' style='color:#777;font-weight:bold;font-size:10px;float:left;padding-top:2px;'>" + data.location.toUpperCase() + "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='padding:0 10px 4px 4px;height:34px;width:275px;overflow:hidden;'>" +
                            "<div id='moo_body_title' style='font-size:12px;font-weight:bold;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                    "</div>" +
                    "<div style='float:right;margin:7px 10px 0 0;'>" +
                        "<div style='background-color:" + moo_color + ";margin:5px 0 3px 0;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                            "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton_small.png' style='padding:4px 7px 4px 7px;'></a>" +
                        "</div>" +
                        "<div style='font-size:10px;text-align:center;font-weight:normal;font-family:Arial;'>" +
                            "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                        "</div>" +
                    "</div>" +
                    "<div style='clear:both;'></div>" +
                "</div>";
        } else if (moo_width == 728 && moo_height == 90) {
            titleHeight = 45;
            locationHeight = 25;
            locationWidth = 230;
            html =
                "<div id='" + moo_rendered + "' style='cursor:default;font-family:Arial;width:" + (moo_width - 2) + "px;height:" + (moo_height - 2) + "px;border:1px solid " + moo_color + ";margin:0px;padding:0px;background:url(" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_bkg.png) no-repeat;overflow:hidden;'>" +
                    "<div style='padding:2px;float:left;'>" +
                        "<a href='" + link + "'><img src='" + imageSource + "' style='width:138px;height:83px;border:0;'></a>" +
                    "</div>" +
                    "<div style='float:left;width:325px;'>" +
                        "<div id='moo_header' style='height:35px;overflow:hidden;'>" +
                            "<div style='float:left;padding:10px 0 0 15px;'>" +
                                "<img src='" + domain + "/images/widget/" + moo_width + "x" + moo_height + "_logo.png'>" +
                            "</div>" +
                            "<div id='moo_header_location' style='color:#777;font-weight:bold;font-size:14px;float:left;padding:12px 0 0 5px;'>" + data.location.toUpperCase() + "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='height:53px;'>" +
                            "<div id='moo_body_title' style='padding:5px 10px 0 15px;font-size:16px;font-weight:bold;'>" +
                                "<a href='" + link + "' style='color:" + moo_color + ";text-decoration:none;'>" + data.title + "</a>" +
                            "</div>" +
                        "</div>" +
                    "</div>" +
                    "<div style='float:left;background-color:#ececec;width:135px;height:88px;font-family:Verdana;font-weight:bold;color:#666;font-size:10px;overflow:hidden;'>" +
                        "<div style='padding:10px 0 0 5px;'>" +
                            "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>WORTH</div>" +
                            "<div style='float:left;text-align:right;width:55px;font-size:13px;'>" + (data.success == "1" ? "$" + data.itemValue : "100%") + "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='padding-left:5px;'>" +
                            "<div style='float:left;text-align:right;width:55px;padding-top:3px;'>SAVE</div>" +
                            "<div style='float:left;text-align:right;width:55px;font-size:13px;'>-" + (data.success == "1" ? "$" + data.savingsAmount : "90%") + "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                        "<div style='border-bottom:1px dotted #666;width:110px;font-size:1px;margin:5px 20px 5px 10px;'></div>" +
                        "<div style='padding-left:5px;'>" +
                            "<div style='float:left;text-align:right;width:55px;padding-top:6px;'>PRICE</div>" +
                            "<div style='float:left;text-align:right;width:55px;font-size:16px;color:" + moo_color + ";'>" + (data.success == "1" ? "$" + data.unitPrice : "10%") + "</div>" +
                            "<div style='clear:both;'></div>" +
                        "</div>" +
                    "</div>" +
                    "<div style='float:left;width:122px;height:88px;overflow:hidden;'>" +
                        "<div style='background-color:" + moo_color + ";padding-left:5px;margin:25px 15px 7px 15px;-moz-border-radius:7px;-webkit-border-radius:7px;-khtml-border-radius:7px;border-radius:7px;'>" +
                            "<a href='" + link + "'><img src='" + domain + "/images/widget/viewbutton.png' style='padding:4px 7px 4px 0px;'></a>" +
                        "</div>" +
                        "<div style='font-size:11px;text-align:center;font-weight:normal;font-family:Arial;'>" +
                            "or <a href='" + signupLink + "' style='font-weight:bold;color:" + moo_color + ";text-decoration:underline;'>SIGN UP</a>" +
                        "</div>" +
                    "</div>" +
                    "<div style='clear:both;'></div>" +
                "</div>";
        }

        // insert the daily deal widget
        if ($('#' + moo_rendered).length > 0)
            $('#' + moo_rendered).remove();
        $(html).insertAfter('#' + moo_affiliate_widget);
        // manage the title / auto-ellipse
        HandleEllipses('moo_header_location', locationHeight, locationWidth);
        HandleEllipses('moo_body_title', titleHeight, 0);
        // manage time left to buy
        HandleDealTimeLeft(data.secondsLeft);
    }
}

// Trims the text to fit a maxHeight or maxWidth, but not both.
// maxHeight may have 1 or more rows,
// maxWidth is limited to
function HandleEllipses(containerId, maxHeight, maxWidth) {
    var text;
    var container = $('#' + containerId);
    if (container.length == 0)
        return;
    
    if (maxHeight >= 0) {
        text = container.html();
        if (container.css('height') == 'auto') {
            container.css('text-overflow', 'ellipsis');
            container.css('overflow', 'hidden');
            container.css('display', 'block');
            container.css('height', maxHeight);
        }
        else {/*+parseInt(container.css('padding-left'),10)+parseInt(container.css('padding-right'),10)*/
            while (parseInt(container.css('height'),10) > maxHeight && text.length > 0) {
                text = text.substring(0, text.length - 1);
                container.html(jQuery.trim(text) + '&hellip;');
            }
            container.css('height', maxHeight);
        }
        container.css('display', 'table-cell');
        container.css('vertical-align', 'middle');
        
    }
    
    if (maxWidth > 0) {
        text = container.html();
        if (container.css('width') == 'auto') {
            container.css('text-overflow', 'ellipsis');
            container.css('overflow', 'hidden');
            container.css('display', 'block');
            container.css('width', maxWidth);
        }
        else {
            while (parseInt(container.css('width')) > maxWidth && text.length > 0) {
                text = text.substring(0, text.length - 1);
                container.html(jQuery.trim(text) + '&hellip;');
            } 
        }
    }
}

function HandleDealTimeLeft(secondsLeft) {
    if (secondsLeft <= 0) {
        $('#moo_time_left_container').html('Sorry, this deal has <b>expired</b>!');
    }
    var sleepSeconds = 999999;
    var secondsPerDay = 86400;
    var secondsPerHour = 3600;
    var daysLeft = parseInt(secondsLeft / secondsPerDay, 10);
    var hoursLeft = parseInt(secondsLeft / secondsPerHour, 10);
    var html;
    if (daysLeft > 0) { // days
        if (daysLeft > 1) {
            sleepSeconds = secondsPerDay;
            html = "<b>" + daysLeft + "</b> days";
        } else {
            sleepSeconds = secondsLeft % secondsPerDay + 1;
            "<b>" + daysLeft + "</b> day";
        }
        $('#moo_time_left').html(html);
    } else if (hoursLeft > 0) { // hours
        if (hoursLeft > 1) {
            sleepSeconds = secondsPerHour;
            html = "<b>" + hoursLeft + "</b> hours";
        } else {
            sleepSeconds = secondsLeft % secondsPerHour;
            html = "<b>" + hoursLeft + "</b> hour";
        }
        $('#moo_time_left').html(html);
    } else { // minutes & seconds
        sleepSeconds = 1;
        var minutes = parseInt(secondsLeft / 60);
        var seconds = secondsLeft % 60;
        if (seconds < 10)
            seconds = "0" + seconds;
        $('#moo_time_left').html("<b>" + minutes + ":" + seconds + "</b>");
    }
    secondsLeft -= sleepSeconds;
    setTimeout("HandleDealTimeLeft(" + secondsLeft + ")", sleepSeconds * 1000);
}