$(document).ready(function () {

    //  Create the navigation
    if ($("#navigarrtion ul li")) {
        $("#navigation ul li").hover(
            function () {
                $(this).find("ul").show();
            },
            function () {
                $(this).find("ul").hide();
            }
        );
    }
});

function addCentresAndRibbons(accessory, item) {
    $("#" + item).parent().find("input:first").val(accessory);
    $("#" + item).attr("checked", true);

    //  close the popup and recalculate any charges
    $.fancybox.close();
    getCharges();
}

function addtobasket() {
    var product = $(".personaliseandbuy").find("input:first").val();
    var productoption = $("select.size").val();
    var quantity = $("select.quantity").val();
    var engravingrequired = $("#engravingrequired").find("input:last").attr("checked");
    var addlogo = $("#addlogo input:last").attr("checked");
    var logofilename = $("#logofilename").val();
    var logoengravedbefore = $("#logoengravedbefore").attr("checked");
    var differentengraving = $("#differentengraving").find("input:last").attr("checked");
    var layoutinstructions = makeJSONSafe($("#layoutinstructions textarea").val());
    var daterequired = makeJSONSafe($(".daterequired").val());
    var JSON;

    //  handle null variables.
    if (engravingrequired == undefined) engravingrequired = false;
    if (addlogo == undefined) addlogo = false;
    if (differentengraving == undefined) differentengraving = false;

    //  ensure session is current before adding to basket.
    updateSession();

    JSON = "{" +
            " 'Product' : '" + product + "' , " +
            " 'ProductOption' : '" + productoption + "' , " +
            " 'ProductOptions' : [ ] , " +
            " 'Quantity' : '" + quantity + "' , " +
            " 'EngravingRequired' : '" + engravingrequired + "' , " +
            " 'AddLogo' : '" + addlogo + "' , " +
            " 'LogoEngravedBefore' : '" + logoengravedbefore + "' , " +
            " 'LogoFilename' : '" + logofilename + "' , " +
            " 'LayoutInstructions' : '" + layoutinstructions + "' , " +
            " 'DifferentEngraving' : '" + differentengraving + "' , " +
            " 'DateRequired' : '" + daterequired + "' , " +
            " 'SportActivity' : '' " +
            "}";

    //  post the JSON via web service.
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        async: false,
        url: "/Assets/PerfectGiftsOnline/WebServices/BRT.asmx/AddToBasket",
        data: JSON,
        dataType: "json",
        success: function (response) {
            var oResponse = eval("(" + response.d + ")");

            if (oResponse.Valid) {

                //  check for message
                if (oResponse.DataThree != "") alert(oResponse.DataThree);

                $.fancybox({
                    href: "#addedtobasket"
                });
            } else {
                alert(oResponse.Data);
            }
        },
        error: function (response) {
            alert(response.responseText);
        }
    });
}

function clearSearch() {

    //  clear the seach box on click if the criteria has not been changed.
    var searchBox = $(".search input");
    if (searchBox.val() == "Search...") searchBox.val("");
}

function createCustomiseAndBuy() {

    //  stop cacheing.
    $.ajaxSetup({
        cache: false
    });

    //  get item cost on change.
    $("select.size").change(function () {
        getOptionPrice();
    });

    //  show/hide engraving options if engraving requirements are changes.
    $("#engravingrequired").find("input").click(function () {
        showEngravingOptions($("#engravingrequiredyes").attr("checked"));
    });

    //  show correct number of lines depending on quantity and if different
    //  engraving is needed.
    $("#differentengraving input").click(function () {
        createEngravingLines();
    });

    //  add logo request box.
    $("#addlogo input:last").fancybox({
        href: "#logoupload"
    });
    $("#addlogo input#addlogono").click(function () {
        getCharges();
    });

    //  re-render lines if quantity is changed.
    $("select.quantity").change(function () {
        if ($("#engravingrequired").find("input:last").attr("checked") == true) {
            if ($("select.quantity").val() > 1) {
                $("#differentengraving").show();
            } else {
                $("#differentengraving").hide();
            }
            createEngravingLines();
        } else {

            //  just update charges if no engraving.
            getCharges();
        }
    });

    //  datepicker for date required
    $(".daterequired").datepicker({ dateFormat: 'dd/mm/yy', constrainInput: true });

    //  get the price of the default option.
    getOptionPrice();

    //  finally show any engraving options and update the session.
    showEngravingOptions($("#engravingrequiredyes").attr("checked"));
}

function createEngravingLines() {
    var customiselayout;
    var quantity = $("select.quantity").val();
    var differentengraving = $("#differentengraving input:last").attr("checked");
    var engravingrequired = $("#engravingrequired").find("input:last").attr("checked");
    var product = $(".personaliseandbuy").find("input:first").val();
    var productoption = $("select.size").val();
    var itemCentre;
    var itemRibbon;

    //  update the session, before reloading engraving lines.
    updateSession();

    $("#engravableitems").load("/Assets/PerfectGiftsOnline/WebServices/EngravingLines.aspx?product_id=" + product + "&productoption_id=" + productoption + "&quantity=" + quantity + "&engravingrequired=" + engravingrequired + "&differentengraving=" + differentengraving + " #ajax", "", function () {

        $("#engravableitems .item").each(function () {

            //  get the character count on each keypress
            $(this).find(".text textarea").keyup(function () {
                getEngravingCharacters($(this));
            });

            //  handle addition of centres and ribbons
            centre = $(this).find(".centre input:last");
            centre.fancybox({
                href: "/Products/ribbons-centres/?mode=centres&id=" + centre.attr("id")
            });
            ribbon = $(this).find(".ribbon input:last");
            ribbon.fancybox({
                href: "/Products/ribbons-centres/?mode=ribbons&id=" + ribbon.attr("id")
            });

            //  recalculate if centre changed
            $(this).find(".centre p.option input").click(function () {
                getCharges();
            });

            //  recalculate if ribbon changed
            $(this).find(".ribbon p.option input").click(function () {
                getCharges();
            });

            //  recalculate if accessory option changed
            $(this).find(".accessories p.option input").click(function () {
                getCharges();
            });

        });

        //  update the charges.        
        getCharges()

    });
}

function getCharges() {
    var addlogo = $("#addlogo input:last").attr("checked");
    var logoengravedbefore = $("#logoengravedbefore").attr("checked");
    var charge_items = $(".charge_item").val() * $("select.quantity").val();
    var charge_engraving = 0.00;
    var charge_extras = 0.00;
    var charge_total = 0.00;

    //  next get each engraving text charge.
    $("p.textcharge span.charge").each(function () {
        charge_engraving += Number($(this).html());
    });
    if ($("#differentengravingno").attr("checked")) {
        charge_engraving *= Number($("select.quantity").val());
    }

    //  check for logo
    if ($("#addlogo input:last").attr("checked")) charge_engraving += (5.00 * Number($("select.quantity").val()));

    //  check for logo setup
    if (addlogo && !logoengravedbefore) {
        charge_engraving += 7.50;
    }

    //  check for centres
    $(".centre p.option").each(function () {
        if ($(this).find("input:last").attr("checked")) {
            charge_extras += Number($(this).find("span.charge input").val());
        }
    });

    //  check for ribbons
    $(".ribbon p.option").each(function () {
        if ($(this).find("input:last").attr("checked")) {
            charge_extras += Number($(this).find("span.charge input").val());
        }
    });

    //  check for accessories
    $(".accessories p.option").each(function () {
        if ($(this).find("input:last").attr("checked")) {
            charge_extras += Number($(this).find("span.charge input").val());
        }
    });

    //  multiply options by quantity if not different engraving
    if ($("#differentengravingno").attr("checked")) {
        charge_extras *= $("select.quantity").val();
    }

    //  calculate total.
    charge_total = charge_items + charge_engraving + charge_extras;

    //  update on screen costs.
    $("span.charge_items").html(charge_items.toFixed(2));
    $("span.charge_engraving").html(charge_engraving.toFixed(2));
    $("span.charge_extras").html(charge_extras.toFixed(2));
    $("span.charge_total").html(charge_total.toFixed(2));
}

function getEngravingCharacters(engravingtext) {
    var baseengravingcharge = Number(engravingtext.next("input").val());
    var engravinglettercharge = chargeperletter;

    //  do not include spaces and line breaks in characters.
    var characters = engravingtext.val().replace(/ /gi, "").replace(/\n/g, "");

    //  limit characters to maximum
    if (characters.length > maxletters) {
        engravingtext.val(engravingtext.val().substr(0, maxletters + (engravingtext.val().length - characters.length)));
        characters = engravingtext.val().replace(/ /gi, "").replace(/\n/g, "");
    }
    if (characters < 0) characters = 0;

    //  set the number of characters and the engraving charge.
    engravingtext.parent().next("p").find("span.characters").html(maxletters - characters.length);
    if (characters.length > freeletters) {
        engravingtext.parent().next("p").find("span.charge").html((((characters.length - freeletters) * engravinglettercharge) + baseengravingcharge).toFixed(2));
    } else if (characters.length > 0) {
        engravingtext.parent().next("p").find("span.charge").html((baseengravingcharge).toFixed(2));
    } else {
        engravingtext.parent().next("p").find("span.charge").html("0.00");
    }

    getCharges();
}

function getOptionPrice() {
    var productoption = $(".size").val();

    JSON = "{ 'ProductOption' : '" + productoption + "' }";

    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        async: false,
        url: "/Assets/PerfectGiftsOnline/WebServices/BRT.asmx/GetOptionPrice",
        data: JSON,
        dataType: "json",
        success: function (response) {
            var oResponse = eval("(" + response.d + ")");

            if (oResponse.Valid) {
                $(".charge_item").val(oResponse.Data);

                //  update the charges.
                getCharges();
            }
        },
        error: function (response) {
            alert(response.responseText);
        }
    });
}

function makeJSONSafe(json) {
    var safe = "";

    //   escape single quotes.
    if (json != undefined) safe = json.toString().replace(/'/g, "\\'");

    return safe;
}

function showEngravingOptions(engravingrequired) {
    if (engravingrequired == undefined) engravingrequired = false;

    //  show or hide engraving options
    if (engravingrequired == true) {
        if ($("select.quantity").val() > 1) $("#differentengraving").show();
        $("#engravingoptions").show();
        $("#engravinginstructions").show();

        //  update session and create engraving lines.
        updateSession();
        createEngravingLines();
    } else {

        //  update session first and then hide the lines.
        updateSession();
        $("#differentengraving").hide();
        $("#engravableitems").html("");
        $("#engravingoptions").hide();
        $("#engravinginstructions").hide();

        //  create the engraving lines (which in this case will not render).
        createEngravingLines();
    }
}

function updateSession() {
    var accessories = "";
    var product = $(".personaliseandbuy").find("input:first").val();
    var productoption = $("select.size").val();
    var quantity = $("select.quantity").val();
    var engravingrequired = $("#engravingrequired input:last").attr("checked");
    var addlogo = $("#addlogo input:last").attr("checked");
    var differentengraving = $("#differentengraving input:last").attr("checked");
    var engravingtextone;
    var engravingtexttwo;
    var engravingtextthree;
    var engravinglines = "";
    var JSON;
    var addCentre;
    var centreId;
    var addRibbon;
    var ribbonId;

    //  handle null variables.
    if (engravingrequired == undefined) engravingrequired = false;
    if (addlogo == undefined) addlogo = false;
    if (differentengraving == undefined) differentengraving = false;

    //  build engraving lines.
    $("#engravableitems .item").each(function () {

        //  engraving text.
        engravingtextone = makeJSONSafe($(this).find(".engravingtextone textarea").val());
        engravingtexttwo = makeJSONSafe($(this).find(".engravingtexttwo textarea").val());
        engravingtextthree = makeJSONSafe($(this).find(".engravingtextthree textarea").val());

        //  handle null variables.
        if (engravingtextone == undefined) engravingtextone = "";
        if (engravingtexttwo == undefined) engravingtexttwo = "";
        if (engravingtextthree == undefined) engravingtextthree = "";

        //  get accessories.
        accessories = "";
        $(this).find(".accessories .option").each(function () {
            if ($(this).find("input:last").attr("checked") == true) {
                accessories += $(this).find("input:first").val() + ",";
            }
        });
        if (accessories.length > 0) accessories = accessories.substr(0, accessories.length - 1);

        //  centres and ribbons.
        addCentre = $(this).find(".centre input:last").attr("checked");
        centreId = $(this).find(".centre span.id input").val();
        addRibbon = $(this).find(".ribbon input:last").attr("checked");
        ribbonId = $(this).find(".ribbon span.id input:first").val();
        if (addCentre == undefined) addCentre = false;
        if (centreId == undefined) centreId = 0;
        if (addRibbon == undefined) addRibbon = false;
        if (ribbonId == undefined) ribbonId = 0;

        //  apend each item.
        engravinglines += "[" +
                            " '" + engravingtextone + "' , " +
                            " '" + engravingtexttwo + "' , " +
                            " '" + engravingtextthree + "' , " +
                            " '" + addCentre + "' , " +
                            " '" + centreId + "' , " +
                            " '" + addRibbon + "' , " +
                            " '" + ribbonId + "' , " +
                            " 'false' , " +
                            " '0' , " +
                            " '0' , " +
                            " '" + accessories + "' " +
                            "] , ";

    });

    //  finalise JSON.
    if (engravinglines.length > 0) {
        engravinglines = "[ " + engravinglines.substr(0, engravinglines.length - 3) + " ]";
    } else {
        engravinglines = "[ ]";
    }

    JSON = "{" +
            " 'Product' : '" + product + "' , " +
            " 'ProductOption' : '" + productoption + "' , " +
            " 'Quantity' : '" + quantity + "' , " +
            " 'EngravingRequired' : '" + engravingrequired + "' , " +
            " 'AddLogo' : '" + addlogo + "' , " +
            " 'DifferentEngraving' : '" + differentengraving + "' , " +
            " 'EngravingLines' : " + engravinglines + " " +
            "}";

    //  post the JSON via web service.
    $.ajax({
        type: "POST",
        contentType: "application/json; charset=utf-8",
        async: false,
        url: "/Assets/PerfectGiftsOnline/WebServices/BRT.asmx/UpdateSession",
        data: JSON,
        dataType: "json",
        success: function (response) {
        },
        error: function (response) {
            alert(response.responseText);
        }
    });
}

//  handle logo

function cancelLogo() {
    $("#addlogo input:first").attr("checked", true);
    getCharges();

    $.fancybox.close();
}

function doLogoUpload() {

    //  see if the logo has been engraved before
    if ($("#logoengravedbefore").attr("checked")) {
        $("#addlogo input:last").attr("checked", true);
        getCharges();

        $.fancybox.close();
    } else {
        $.fancybox({
            href: "#logoupload2"
        });
    }
}

function okLogo() {
    $("#addlogo input:last").attr("checked", true);
    getCharges();

    $.fancybox.close();
}

function uploadLogo(logofile) {
    $("#logofilename").val(logofile);
    $("#addlogo input:last").attr("checked", true);
    getCharges();

    $.fancybox.close();
}

// handle Add to basket confirm

function addAnother() {
    $.fancybox.close();
}

function gotoBasket() {
    document.location = "/Basket.aspx";
}