/// <reference path="../MsAjax/MicrosoftAjax.js" />
/// <reference path="../XCookie/XCookie.js" />
function ShoppingCar(container, box, carID, productPage) {
    
    var cName = "car";
    var con = document.getElementById(container);
    var box = document.getElementById(box);
    this.InitComponent = function() {
        
        box.style.position = "absolute";
        box.style.top = "0px";
        var left = document.body.clientWidth - 200;
        box.style.left = left + "px";
        this.Render();

    }
    this.AddProduct = function(pid, pName, number) {
        xCookie.load();
        if (xCookie.$(cName).val != undefined) {
            var items = xCookie.$(cName).val.split('*');
            var addIndex;
            for (var i = 0; i < items.length; i++) {
                var v = items[i].split('$');
                if (v[0] != undefined) {
                    if (v[0] == pid) {
                        addIndex = i;
                    }
                }
            }
            if (addIndex == undefined) {
                xCookie.$(cName).val += pid + "$" + pName + "$" + number + "*";

            }
            else {
                var v = items[addIndex].split('$');
                var oldString = pid + "$" + pName + "$" + v[2] + "*";
                var newNumber = Number(v[2]) + 1;
                var newString = pid + "$" + pName + "$" + newNumber + "*";
                xCookie.$(cName).val = xCookie.$(cName).val.replace(oldString, newString);
            }


        }
        else {
            xCookie.$(cName).val = pid + "$" + pName + "$" + number + "*";
        }
        xCookie.save();
        this.Render();
    }

    this.DeleteProduct = function(pid) {
        xCookie.load();
        var cValue = xCookie.$(cName).val;
        if (cValue != undefined) {
            var items = cValue.split('*');
            var deleteValue = "";
            for (var i = 0; i < items.length; i++) {
                var v = items[i].split('$');
                if (v[0] != undefined) {
                    if (v[0] == pid) {
                        deleteValue = items[i] + '*';
                    }
                }
            }
            xCookie.$(cName).val = xCookie.$(cName).val.replace(deleteValue, "");
            xCookie.save();
            
        }this.Render();
    }
    this.ClearProduct = function() {
        xCookie.load();
        xCookie.clear();
        xCookie.save();
        this.Render();
    }

    this.Render = function() {
        xCookie.load();
        var renderValue = "";

        var cValue = xCookie.$(cName).val;

        if (cValue != null) {
            var itemsString = cValue.split('*');
            var deleteValue = "";


            for (var i = 0; i < itemsString.length; i++) {
                var v = itemsString[i].split('$');
                if (v[1] != undefined) {
                    renderValue += "<div class=\"CarItem\">";
                    renderValue += "<a class=\"CarProductName\" href=\"" + productPage + "?id=" + v[0] + "\">" + v[1] + "</a>";
                    renderValue += "<input id=\"carNumber" + i + "\" onKeypress=\"return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))\" style=\"ime-mode:Disabled\" class=\"CarNumber\" type=\"text\" value=\"" + v[2] + "\" maxlength=\"3\" />";
                    renderValue += "<a class=\"CarDelete\" href=\"#\" onclick=\"" + carID + ".DeleteProduct(" + v[0] + ");\">删除</a>";
                    renderValue += "</div>";
                }

            }
            if (renderValue != "") {
                box.style.display = "block";

            }
            else {
                box.style.display = "none";
            }

            con.innerHTML = renderValue;
        }
        else {
            box.style.display = "none";
        }
        xCookie.save();
    }
    this.SetNumberInput = function() {

        if (xCookie.$(cName).val != null) {
            var itemsString = xCookie.$(cName).val.split('*');
            for (var i = 0; i < itemsString.length; i++) {
                var v = itemsString[i].split('$');
                if (v[1] != undefined) {
                    var number = document.getElementById("carNumber" + i);
                    $addHandler(number, "change", this.NumberInputChange);
                }
            }
        }
    }
    this.NumberInputChange = function(e, args) {

        xCookie.load();
        if (xCookie.$(cName).val != undefined) {
            var t = e.target;
            var index = t.id.replace("carNumber", "");
            var items = xCookie.$(cName).val.split('*');
            var v = items[index].split('$');
            var oldString = v[0] + "$" + v[1] + "$" + v[2] + "*";
            var newNumber = Number(v[2]) + 1;
            var newString = v[0] + "$" + v[1] + "$" + t.value + "*";
            xCookie.$(cName).val = xCookie.$(cName).val.replace(oldString, newString);

            alert("ChangeTo:" + t.value);
        }
       
        xCookie.save();
    }

    this.FirefoxSetPosstion = function() {
        var value = GetScroll();
        box.style.top = value + "px";
        var left = document.body.clientWidth - 200;
        box.style.left = left + "px";
    }

    g_myBodyInstance = (document.documentElement ? document.documentElement : window);
    g_myBodyInstance.onscroll = function() {


        var value = GetScroll();
        box.style.top = value + "px";
    }
    window.onresize = function() {
        box.style.left = "";
        var value = GetScroll();
        box.style.top = value + "px";
        var left = document.body.clientWidth - 200;
        box.style.left = left + "px";
    }
    if (Sys.Browser.name == "Firefox") {
        setInterval(this.FirefoxSetPosstion, 100);
    }

    this.InitComponent();
    this.SetNumberInput();
}
function GetScroll() {

    var t, l, w, h;

    if (document.documentElement && document.documentElement.scrollTop) {

        t = document.documentElement.scrollTop;

        l = document.documentElement.scrollLeft;

        w = document.documentElement.scrollWidth;

        h = document.documentElement.scrollHeight;

    } else if (document.body) {

        t = document.body.scrollTop;

        l = document.body.scrollLeft;

        w = document.body.scrollWidth;

        h = document.body.scrollHeight;

    }

    return t;

}