//Instanciate a new XMLHttpRequest object for use when posting to an asp page.
function getHTTPObject() {
    var xhr = null;

    if (window.XMLHttpRequest) {

        try { //Firefox Opera etc.
            xhr = new XMLHttpRequest();
            xhr.overrideMimeType('text/xml');
        }
        catch (e) {
            xhr = new XMLHttpRequest();
        }
    }
    else if (window.ActiveXObject) {

        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return xhr;
}
var x = getHTTPObject();
var y = getHTTPObject();

//Call the add to bag asp page to add the selected SKU on the product page to the customers basket	
function ajaxaddtobag(skusAndQuantities) {

    y = getHTTPObject();

    if (y) {
        y.onreadystatechange = getBasket;
        y.open("GET", "http://" + currentsite + "basket/xt_add_to_basket_v2.asp" + skusAndQuantities, true); //+ skusAndQuantities
        y.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        y.send(null);
    }
    setTimeout('hidebasket()', 4000);  //Hide the basket again after 4 seconds
}

function getBasket(afterAdd) {

    //Either wait for the ajax add to bag function has finished before getting the contents of the bag.
    //Or if afterAdd is false then the customer has hovered over the basket icon so get the contents straight away.
    if ((y.readyState == 4 && y.status == 200) || afterAdd == false) {



        var cell = document.getElementById("basket_info");

        if (cell.hasChildNodes()) {
            //Do nothing as basket is currently visible
        }
        else {
            x = getHTTPObject();

            if (x && (x.readyState == 0 || x.readyState == 4)) {
                x.onreadystatechange = showBasket;
                x.open("GET", "http://" + currentsite + "basket/get_ajax_basket.asp", true);
                x.send(null);

                // If the basket has been displayed after a customer has added an item to the basket then update the quantity in the header
                if (afterAdd != false) {
                    document.getElementById("shopping_bag_link").innerHTML = "Shopping bag " + BasketQty(cookie);
                }
            }
        }
    }
}

function showBasket() {

    //Wait until the basket XML has been returned before displaying it on the page.
    if (x.readyState == 4 && x.status == 200) {
        // alert("showbasket");
        var data = x.responseXML;  //the XML returned

        var basketValue = 0;
        var root = data.getElementsByTagName("orderform");  //Grab the orderform element from the XML

        try {
            $('#basket_info').css('height', '').css('display', '');
            //Get the currency symbol £ or $
            var currencySymbol = data.getElementsByTagName("currency")[0].firstChild.nodeValue

            var divContainer = document.createElement("div");
            divContainer.className = "carousel_container";
            divContainer.setAttribute("id", "carouselcontainer");
            document.getElementById("basket_info").appendChild(divContainer);

            var jQueryList = document.createElement("ul");
            jQueryList.setAttribute("class", "jcarousel-skin-solution");
            jQueryList.setAttribute("id", "mybasketcarousel");
            document.getElementById("carouselcontainer").appendChild(jQueryList);

            //Loop through the items in the bag and add them to the basket popup div
            for (i = 0; i < root[0].childNodes.length; i++) {

                var li = document.createElement("li");
                li.className = "product";
                li.setAttribute("id", "li" + i);
                document.getElementById("mybasketcarousel").appendChild(li);

                var productdiv = document.createElement("div");
                //productdiv.className = "product";
                productdiv.setAttribute("id", "product" + i);
                document.getElementById("li" + i).appendChild(productdiv);

                //Image
                if (data.getElementsByTagName("image")[i].firstChild != null) {

                    var imglink = document.createElement("a");
                    imglink.setAttribute("href", "http://" + currentsite + "product.asp?product_id=" + data.getElementsByTagName("product_id")[i].firstChild.nodeValue);
                    imglink.innerHTML = "<img src='http://images.figleaves.com/product/75x96/" + data.getElementsByTagName("image")[i].firstChild.nodeValue + ".jpg' />";
                    document.getElementById("product" + i).appendChild(imglink);
                }

                //brand
                var brand = document.createElement("p");
                brand.className = "brand";
                brand.innerHTML = data.getElementsByTagName("brand")[i].firstChild.nodeValue;
                document.getElementById("product" + i).appendChild(brand);

                //info
                var infop = document.createElement("p");
                infop.className = "item_info";
                var fullProductName = data.getElementsByTagName("product_name")[i].firstChild.nodeValue;
                var productName = (fullProductName.length > 28)
                    ? $.trim(fullProductName.substring(0, 28)) + '...'
                    : fullProductName;
                infop.innerHTML = '<span title="' + fullProductName + '">' + productName + "</span><br /> Size: " + data.getElementsByTagName("size")[i].firstChild.nodeValue + "<br /> Quantity: " + data.getElementsByTagName("quantity")[i].firstChild.nodeValue;
                document.getElementById("product" + i).appendChild(infop);

                //Price
                if (data.getElementsByTagName("onsale")[i].firstChild.nodeValue == 1) {

                    var saleprice = document.createElement("p");
                    saleprice.className = "was";
                    saleprice.innerHTML = "Was: " + currencySymbol + formatPrice(data.getElementsByTagName("list_price")[i].firstChild.nodeValue);
                    document.getElementById("product" + i).appendChild(saleprice);

                    var price = document.createElement("p");
                    price.className = "price";
                    price.innerHTML = "<span>Price</span>: " + currencySymbol + formatPrice(data.getElementsByTagName("final_price")[i].firstChild.nodeValue);
                    document.getElementById("product" + i).appendChild(price);
                }
                else {
                    var price = document.createElement("p");
                    price.className = "price";
                    price.innerHTML = "<span>Price</span>: " + currencySymbol + formatPrice(data.getElementsByTagName("final_price")[i].firstChild.nodeValue);
                    document.getElementById("product" + i).appendChild(price);
                }

                basketValue = basketValue + parseFloat(data.getElementsByTagName("final_price")[i].firstChild.nodeValue);
            }

            var li = document.createElement("li");
            li.setAttribute("style", "height:35px;");
            document.getElementById("mybasketcarousel").appendChild(li);

            var greydiv = document.createElement("div");
            greydiv.setAttribute("id", "grey_bar");
            document.getElementById("basket_info").appendChild(greydiv);

            var scrolldiv = document.createElement("div");
            scrolldiv.setAttribute("id", "more_scroll");
            document.getElementById("grey_bar").appendChild(scrolldiv);

            var imgUp = document.createElement("img");
            imgUp.setAttribute("class", "upImg");
            imgUp.setAttribute("id", "upImg");
            imgUp.setAttribute("src", "http://images.figleaves.com/uk/images/eng-gbr/basket/up_arrow.gif");
            document.getElementById("more_scroll").appendChild(imgUp);

            var imgDown = document.createElement("img");
            imgDown.setAttribute("class", "down");
            imgDown.setAttribute("id", "downImg");
            imgDown.setAttribute("src", "http://images.figleaves.com/uk/images/eng-gbr/basket/down_arrow.gif");
            document.getElementById("more_scroll").appendChild(imgDown);

            var morep = document.createElement("p");
            morep.innerHTML = "<b>More</b>";
            document.getElementById("more_scroll").appendChild(morep);

            //Total Price
            var totalpricediv = document.createElement("div");
            totalpricediv.setAttribute("id", "total_price");
            document.getElementById("grey_bar").appendChild(totalpricediv);

            var totalp = document.createElement("p");
            totalp.innerHTML = "Total: " + currencySymbol + basketValue.toFixed(2);
            document.getElementById("total_price").appendChild(totalp);

            var pinkdiv = document.createElement("div");
            pinkdiv.setAttribute("id", "pink_bar");
            document.getElementById("basket_info").appendChild(pinkdiv);

            var text = document.createElement("p");
            text.innerHTML = "<a href= http://" + currentsite + "basket/bsk_basket.asp> View bag &amp; Checkout</a>";
            document.getElementById("pink_bar").appendChild(text);

            var scrolldiv = document.createElement("a");
            scrolldiv.setAttribute("href", "http://" + currentsite + "basket/bsk_basket.asp");
            scrolldiv.innerHTML = "<img src='http://images.figleaves.com/uk/images/eng-gbr/basket/right_arrow.gif' width='18' height='18' />";
            document.getElementById("pink_bar").appendChild(scrolldiv);

            var cell = document.getElementById("basket_info");
            var vis = cell.style;
            vis.display = 'block';

            jQuery('#mybasketcarousel').jcarousel({
                vertical: true,
                auto: 0,
                scroll: 1,
                easing: 'linear',
                size: root[0].childNodes.length,
                wrap: 'both',
                buttonNextHTML: null,
                buttonPrevHTML: null,
                initCallback: mycarousel_initCallback
            });
            if (root[0].childNodes.length <= 3) {
                $('#more_scroll').css('display', 'none');
            }
        }
        catch (e) {
            //Customer has nothing in their bag so display empty bag message
            var emptyBasket = document.createElement("div");
            emptyBasket.setAttribute('id', 'emptyBasket');
            emptyBasket.innerHTML = "Your bag is currently empty";
            document.getElementById("basket_info").appendChild(emptyBasket);

            $('#basket_info').css('height', '25px').css('display', 'block');
        }

        $('#basket_info').bind('mouseout', function(e) {
            if (!e) var e = window.event;
            var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;

            while (reltg != null && reltg.tagName != 'BODY') {
                if (reltg.id == this.id) { return; }
                reltg = reltg.parentNode;
            }

            // do your stuff here
            $('#basket_info').unbind('mouseout');
            setTimeout('hidebasket()', 1500)
        });
    }
}

//Reomove all the items from the bag popup div and hide it.
function hidebasket() {
    var cell = document.getElementById("basket_info");

    if (cell.hasChildNodes()) {
        while (cell.childNodes.length >= 1) {
            cell.removeChild(cell.firstChild);
        }

        var basket = document.getElementById("basket_info");
        var vis = basket.style;
        vis.display = 'none';
    }
}

//Format prices with 2 decimal places
function formatPrice(price) {
    var formattedprice = parseFloat(price).toFixed(2);

    return formattedprice;
}

//Get the number of items in the baskest from the session cookie
function BasketQty(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') c = c.substring(1, c.length);
        if (c.indexOf(nameEQ) == 0) {

            var d = c.substring(nameEQ.length, c.length);
            var e = d.substring(d.indexOf('basketQty='), d.indexOf('basketQty=') + 12);
            if (e.indexOf('&') == -1) return "<span>" + e.substring(10, 12) + "<\/span>" + " Items";
            else if (e.indexOf('&') == 11) {
                if (e.substring(10, 11) == 1) {
                    return "<span>" + e.substring(10, 11) + "<\/span>" + " Item";
                }
                else {
                    return "<span>" + e.substring(10, 11) + "<\/span>" + " Items";
                }
            }
        }
    }
}