$(".thumbImg").live("click", function(e) {
    var img = $(this).data("img");
    var ProdId = $(this).data("prodId");
    $(".selectedPic").removeClass("selectedPic");
    $(this).addClass("selectedPic");

    $("img", $(".mainPicture")).attr("src", 'http://www.jalilstamps.com/Fotos/' + ProdId + '/280x280/' + img)
                               .data("id", ProdId)
                               .data("image", img);

    $(".mainPicture").unbind("click").click(function(e) {
        openFullPicture($("img", $(this)).data("id"), $("img", $(this)).data("image"));
    });
})
$(".itemRemove").live("click", function(e) {
    
    simpleCart.updateQuantity($(this).data("item"), 'new_quantity=0');
    return false;
})
$(".productName").live("click", function(e) {
    getProductDetails($(this).data("id"));
})
function getProductDetails(id) {
    $.ajax({
        type: "GET",
        url: "/services/ProductDetail.ashx?id=" + id,
        data: id,
        success: function(msg) {
            drawproductWithDetails(msg);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            // typically only one of textStatus or errorThrown 
            // will have info
            alert(textStatus + errorThrown)
            this; // the options for this ajax request
        }

    });
}
function drawproductWithDetails(prod) {
    var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    labels = {
        "EN": { "seeMore": "see more..", "addToCart": "add to Cart", "added": "Added!" },
        "ES": { "seeMore": "ver más..", "addToCart": "agregar al Carrito", "added": "Agregado al Carro!" }
    }
    var ProdObj = JSON.parse(prod);
    var template = '\
                    <div>\
                        <div class="descriptionBox">\
                            <div class="titleDescription">\
                            <span class="category"></span>\
                            <span class="subCategory"></span>\
                            <span class="subSubCategory"></span><br/>\
                            <span class="quality"></span><span class="lotDescription"></span>\
                            <div>\
                            <div class="fullDescription">\
                            </div>\
                        </div>\
                        <div class="photosBox">\
                            <div class="pictureNavigation">\
                            <div class="pictureNavigationUp"></div>\
                            <ul class="pictureNavigationCenter"></ul>\
                            <div class="pictureNavigationDown"></div>\
                            </div>\
                            <div class="mainPicture"></div>\
                        </div>\
                        <div class="addToCartBox"><a class="addToCartLink"></a></div>\
                    </div>'

    var existsOnCart = false;
    var descriptionBox = $(template);
    $(".pictureNavigationUp").live("click", function(e) {
    $(".pictureNavigationCenter").animate({ scrollTop: '-=200px' }, 700);
    })
    $(".pictureNavigationDown").live("click", function(e){ 
    $(".pictureNavigationCenter").animate({ scrollTop: '+=200px' }, 700);
    })
    $(".category", descriptionBox).html(ProdObj["Pais" + langPrefix] + " > ");
    $(".subCategory", descriptionBox).html(ProdObj["Estado" + langPrefix] + " > ");
    if (ProdObj["Categoria" + langPrefix] != "") {
        $(".subSubCategory", descriptionBox).html(ProdObj["Categoria" + langPrefix] + " > ");
    }
    var multipleQualities = false;
    if (ProdObj.Calidades.length > 1) {
        multipleQualities = true;
    }
    $.each(calidad, function(e, obj) {
            if ($.inArray(obj.IdCalidad, ProdObj.Calidades) != -1) {
                if (obj.Image != "") {
                    $(".quality", descriptionBox).append('<img src="/img/Quality/' + obj.Image + '" title="' + obj.Nombre + '"/> ')
                    if (multipleQualities) {
                        $(".quality", descriptionBox).append(" - ");
                    }
                }
                else {
                    $(".quality", descriptionBox).append('<span title="' + obj.Nombre + '">' + obj.Codigo + '</span> ')
                    if (multipleQualities) {
                        $(".quality", descriptionBox).append(" - ");
                    }
                }
            }
      })
    $(".lotDescription", descriptionBox).html("- " + ProdObj["Title" + langPrefix]);
    $(".fullDescription", descriptionBox).html(ProdObj["Descripcion" + langPrefix]);
    for (i = 0; i < ProdObj.Fotos.length; i++) {
        var elementPic = $('<li class="thumbImg"><img src="http://www.jalilstamps.com/Fotos/' + ProdObj.idProducto + '/64x64/' + ProdObj.Fotos[i] + '"/></li>').data("img", ProdObj.Fotos[i]).data("prodId", ProdObj.idProducto);
        if (ProdObj.Fotos[i] == ProdObj.FotoPrincipal) {
            elementPic.addClass("selectedPic");
        }
        $(".pictureNavigationCenter", descriptionBox).append(elementPic);
    }
    var elementMainPic = $('<img src="http://www.jalilstamps.com/Fotos/' + ProdObj.idProducto + '/280x280/' + ProdObj.FotoPrincipal + '"/>')
                            .data("id", ProdObj.idProducto)
                            .data("image", ProdObj.FotoPrincipal);
                            
                          
    $(".mainPicture", descriptionBox).append(elementMainPic).unbind("click").click(function(e) {
            openFullPicture($("img", $(this)).data("id"), $("img", $(this)).data("image"));
    }); 
    $.each(simpleCart.items, function(e) {
        actual = simpleCart.items[e];
        if (actual.getValue("id") == ProdObj.idProducto) {
            existsOnCart = true;
            return false;
        }
    })
    if (!existsOnCart) {
        $(".addToCartLink", descriptionBox).html(labels[langPrefix]["addToCart"])
                                           .data("name", ProdObj["Title" + langPrefix])
                                           .data("id", ProdObj.idProducto)
                                           .data("price", ProdObj.Precio)
                                           .data("foto", getPicture(ProdObj))
                                           .data("addLinkText", labels[langPrefix]["addToCart"])
                                           .data("labelAdded", labels[langPrefix]["added"])
                                           .addClass("addLink" + ProdObj.idProducto)
                                           .unbind("click")
                                           .click(function(e) {
                                               var me = $(this);
                                               $(".addLink" + me.data("id")).html(me.data("labelAdded")).addClass("addedLink");
                                               simpleCart.add('name="' + me.data("name").replace(/,/g, "--") + '"', 'price=' + me.data("price"), 'id=' + me.data("id"), 'image=' + me.data("foto"));

                                           });
    }
    else {
        $(".addToCartLink", descriptionBox).html(labels[langPrefix]["addToCart"])
                                           .data("name", ProdObj["Title" + langPrefix])
                                           .data("addLinkText", labels[langPrefix]["addToCart"])
                                           .data("labelAdded", labels[langPrefix]["added"])
                                           .data("id", ProdObj.idProducto)
                                           .data("price", ProdObj.Precio)
                                           .addClass("addLink" + ProdObj.idProducto)
                                           .addClass("addedLink")
                                           .html(labels[langPrefix]["added"]);
    }
    $(".wrap", $("#overlay")).append(descriptionBox);
}

function openFullPicture(id,image) {
    window.open("/popUp/popupImage.aspx?id=" + id + "&image=" + image, "", "scrollbars=1,menu=0,location=0");
    return false;
}
function buildMenu(obj,lang,countrys,categories,topic,general){
    var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    labels = {
                "EN":{"Filters":"Search by: ","countryMenu":"Countries","categoriesMenu":"General Categories","topicMenu":"Topic","generalMenu":"General"},
                "ES": { "Filters": "Buscar por: ", "countryMenu": "Países", "categoriesMenu": "Categorías Generales", "topicMenu": "Tema", "generalMenu": "General" }
             }
    obj.append("<h2>" + labels[langPrefix]["Filters"] + "</h2>" )
    var divMenuList = $(document.createElement("div")).addClass("box");
    divMenuList.append($('<h3 class="menuTitle">' + labels[langPrefix]["countryMenu"] + '</h3>').click(function(e){
        $("#countryMenu").slideToggle("slow");
    }));
    var menuList = $(document.createElement("ul")).addClass("bottom menuTitle").attr("id","countryMenu").hide();
    $.each(countrys,function(e){
        var actualCountry = countrys[e];
        if (e != 0){
             menuList.append('<li><a href="searchResults.aspx?country=' + actualCountry["IdPais"] + '">' + actualCountry["Name" + langPrefix] + '</a></li>');                                     
        }
        else{
            menuList.append('<li class="first"><a href="searchResults.aspx?country=' + actualCountry["IdPais"] + '">' + actualCountry["Name" + langPrefix] + '</a></li>');  
        }                              
    });
    divMenuList.append(menuList);
    obj.append(divMenuList);
    var divMenuListCategories = $(document.createElement("div")).addClass("box");
    divMenuListCategories.append($('<h3 class="menuTitle">' + labels[langPrefix]["categoriesMenu"] + '</h3>').click(function(e){
          $("#categoriesMenu").slideToggle("slow");  
    }));
    var menuListCategories = $(document.createElement("ul")).addClass("bottom").addClass("bottom menuTitle").attr("id","categoriesMenu").hide();
    $.each(categories,function(j){
        var actualCategory = categories[j];
        if (j != 0){
            menuListCategories.append('<li><a href="searchResults.aspx?key=' + actualCategory["IdClave"] + '">' + actualCategory["Name" + langPrefix] + '</a></li>');                                     
        }
        else{
            menuListCategories.append('<li class="first"><a href="searchResults.aspx?key=' + actualCategory["IdClave"] + '">' + actualCategory["Name" + langPrefix] + '</a></li>');  
        }                              
    });
    divMenuListCategories.append(menuListCategories);
    obj.append(divMenuListCategories);
    var divMenuListTopic = $(document.createElement("div")).addClass("box");
    divMenuListTopic.append($('<h3 class="menuTitle">' + labels[langPrefix]["topicMenu"] + '</h3>').click(function(e){
        $("#topicMenu").slideToggle("slow");     
    }));
    var menuListTopic = $(document.createElement("ul")).addClass("bottom menuTitle").attr("id","topicMenu").hide();
    $.each(topic,function(h){
        var actualTopic = topic[h];
        if (h != 0){
            menuListTopic.append('<li><a href="searchResults.aspx?key=' + actualTopic["IdClave"] + '">' + actualTopic["Name" + langPrefix] + '</a></li>');                                     
        }
        else{
            menuListTopic.append('<li class="first"><a href="searchResults.aspx?key=' + actualTopic["IdClave"] + '">' + actualTopic["Name" + langPrefix] + '</a></li>');  
        }                              
    });
    divMenuListTopic.append(menuListTopic);
    obj.append(divMenuListTopic);

}

function drawProductList(container,listProducts)
{
    $.each(listProducts,function(e){
        container.append(drawProduct(listProducts[e]));
    });
}
function drawProduct(product)
{   
    var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    labels = {
            "EN":{"addToCart":"Add to Cart","added":"Added!"},
            "ES":{"addToCart":"Agregar al Carrito","added":"Agregado al Carro!"}
         }
   var htmlProduct = '\
                     <h3> \
                     <a href="" class="paisLink"></a> \
                     <a href="" class="categoriaLink"></a> \
                     <a href="" class="subCategoriaLink"></a>\
                     <br/> \
                     <a href="" class="productName" rel="#overlay"></a>\
                     </h3> \
                     <img class="image" /> \
                     <div class="description"></div>\
                     <div class="productPrice"></div>\
                     <div class="clearBox"></div>\
                     <div><a class="addToCartLink"></a></div>'



   var box = $(document.createElement("div")).addClass("box").append(htmlProduct).addClass("Estado" + product["IdPaisSecundario"]);
   $(".productName", box).html(product["Title" + langPrefix]).data("id", product.idProducto)
    
    //.attr("href", "/popUp/popUpProduct.aspx?id=" + product.idProducto); //Agregar la funcionalidad de descripcion de producto.
    $(".qualitiesTitle", box).html(labels[langPrefix]["qualityTitle"] + ">");
    $(".paisLink", box).html(product["Pais" + langPrefix] + " > ").attr("href", "searchResults.aspx?country=" + product["idPais"] + "&page=1&size=20");
    if (product["Estado" + langPrefix] != "") {
        $(".categoriaLink", box).html(product["Estado" + langPrefix] + " > ").attr("href", "searchResults.aspx?country=" + product["idPais"] + "&category=" + product["IdPaisSecundario"] + "&page=1&size=20");
    }
    if (product["Categoria" + langPrefix] != "") {
        $(".subCategoriaLink", box).html(product["Categoria" + langPrefix] + " > ").attr("href", "searchResults.aspx?country=" + product["idPais"] + "&category=" + product["IdPaisSecundario"] + "&subCategory=" + product["idPaisCategoria"] + "&page=1&size=20");
    }
    var price = getProductPrice(product);
    $(".productPrice",box).html(price);
    $(".image",box).attr("src",getPicture(product));
    $(".description",box).html(product["Descripcion" + langPrefix]);
    var actual;
    var existsOnCart = false;
    $.each(simpleCart.items,function(e){
        actual = simpleCart.items[e];
        if (actual.getValue("id")== product.idProducto)
        {
            existsOnCart = true;
            return false;
        }
    })
    if (!existsOnCart)
    {
        $(".addToCartLink", box).html(labels[langPrefix]["addToCart"])
                           .data("name", product["Title" + langPrefix])
                           .data("id", product.idProducto)
                           .addClass("addLink" + product.idProducto)
                           .data("price", product.Precio)
                           .data("foto", getPicture(product))
                           .data("addLinkText", labels[langPrefix]["addToCart"])
                           .data("labelAdded", labels[langPrefix]["added"])
                           .unbind("click")
                           .click(function(e) {
                               var me = $(this);
                               me.html(me.data("labelAdded")).addClass("addedLink");
                               simpleCart.add('name="' + me.data("name").replace(/,/g, "--") + '"', 'price=' + me.data("price"), 'id=' + me.data("id"), 'image=' + me.data("foto"));
                           });
    }
    else
    {
        $(".addToCartLink",box).html(labels[langPrefix]["addToCart"])
                           .data("name",product["Title" + langPrefix])
                           .data("addLinkText",labels[langPrefix]["addToCart"])
                           .data("labelAdded", labels[langPrefix]["added"])
                           .addClass("addLink" + product.idProducto)
                           .data("id",product.idProducto)
                           .data("price",product.Precio)
                           .addClass("addedLink")
                           .html(labels[langPrefix]["added"]);
    }
    
    return box;
}
function getProductPrice(product){
    return '<span style="font-size:18px;">us</span>$ ' + product.Precio;
}
function getPicture(product){
    if (product.FotoPrincipal != "" && product.FotoPrincipal != null)
    {
         return "http://www.jalilstamps.com/Fotos/" + product.idProducto + "/160x130/" + product.FotoPrincipal;
    }
    else
    {
        return "/Fotos/no_image120.png";
    }
}

function getQualities(qualitiesList){
    //TODO:funcion que devuelve las calidades de los productos
    var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    var labels = {
                "EN":{"nonEspecified":" non-especified "},
                "ES":{"nonEspecified":" no especificado "}
    }
    if (qualitiesList != null)
    {
        var returnString = "";
        $.each(qualitiesList,function(r){
            var actualQuality = qualitiesList[r];
            if (actualQuality.Image != null)
            {
                returnString += '<img src="' +  actualQuality.Image + '" alt="' + actualQuality.Nombre + '"/>';
            }
            else
            {
                returnString += '<span>' +  actualQuality.Codigo + '</span>';
            }
        });
        return returnString;
    }
    else{
        return labels[langPrefix]["nonEspecified"];
    }
    
}


function buildMenuEstados(obj,estados,idPais)
{
     var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    labels = {
                "EN":{"title":"Categories"},
                "ES": { "title": "Categorías" }
             }
    var divMenuList = $(document.createElement("div")).addClass("box");
    divMenuList.append("<h4>" + labels[langPrefix]["title"] + "</h4>")
    var menuList = $(document.createElement("ul")).addClass("bottom");
    $.each(estados,function(e){
        var EstadoActual = estados[e];
        var listItem = $("<li></li>");
        if (e == 0){listItem.addClass("first")}
             var anchorItem = $('<a href="#"></a>').html(EstadoActual["Name" + langPrefix])
                                            .attr("href", "searchResults.aspx?country=" + idPais + "&category=" + EstadoActual["idPaisSecundario"] + "&page=1&size=20")
             listItem.append(anchorItem);                               
             menuList.append(listItem);
                                      
    });
    divMenuList.append(menuList);
    obj.append(divMenuList);

}
function getNewPage(PageNumber, PageSize, searchType) {
    location.href = "searchResults.aspx?" + searchType + "&page=" + PageNumber + "&size=" + PageSize;
    
}
function searchResults(products, PageSize, resultsQuantity, pagenumber,searchType) { 
    var langPrefix = "EN";
    if (lang == "es-AR") {
        langPrefix = "ES";
    }
    var labelsSearch = {
                "ES":{"anterior":"anterior","siguiente":"siguiente","searchResults1": "Se encontraron ","searchResults2":" lotes para su busqueda","pagina":"Página ","de":" de "},
                "EN": { "anterior": "prev", "siguiente": "next", "searchResults1": " ", "searchResults2": " Lots Found", "pagina": "Page ", "de": " of " }
    }
    var container = $("#searchResults");
    var pagging = '\
                    <div style="width: 660px;height:35px;">\
                    <ul class="paggingList">\
                    <li class="anteriorPagina">< ' + labelsSearch[langPrefix]["anterior"] + ' </li>\
                    <li class="actualPagina"></li>\
                    <li class="siguientePagina">' + labelsSearch[langPrefix]["siguiente"] + ' ></li>\
                    </ul>\
                    <div style="clear:both;"></div>\
                    </div>'
    if (page == "searchresults") {
        var paggingObj = $(pagging);
        $('.pageSize', paggingObj).val(PageSize);
        var pageQuantity = Math.ceil(resultsQuantity / PageSize);
        $(".actualPagina", paggingObj).html(labelsSearch[langPrefix]["pagina"] + pagenumber + labelsSearch[langPrefix]["de"]  + pageQuantity);
    }
    if (Products != null) {
        if (resultsQuantity == 0) {
            container.append("<h4>NO RESULTS</h4>");
        }
        else {
            container.append($("<h4></h4>").html(labelsSearch[langPrefix]["searchResults1"] + resultsQuantity + labelsSearch[langPrefix]["searchResults2"]));
            if (page == "searchresults") { container.append(paggingObj); }  
            drawProductList(container, products)
            if (page == "searchresults") {
                container.append(paggingObj.clone());
                if (pagenumber != 1) {
                    $('.anteriorPagina').data("pageNumber", pagenumber - 1).live("click", function(e) {
                        getNewPage($(this).data("pageNumber"), PageSize, searchType);
                    });
                }

                if (pagenumber != pageQuantity) {
                    $('.siguientePagina').data("pageNumber", pagenumber + 1).live("click", function(e) {
                        getNewPage($(this).data("pageNumber"), PageSize, searchType);
                    });
                }
            }
        }
    }
    
    $("a[rel]").overlay({

        effect: 'apple',

        onLoad: function() {
            
            // grab wrapper element inside content 
            var wrap = this.getContent().find("div.wrap");

            // load the page specified in the trigger 
            //wrap.load(this.getTrigger().attr("href"));
        },

        onClose: function() {
            // grab wrapper element inside content 
            var wrap = this.getContent().find("div.wrap");

            wrap.html("");
        }
    });
}

function initOverlay() {

    $("a[rel]").overlay({

        effect: 'apple',

        onLoad: function() {

            // grab wrapper element inside content 
            var wrap = this.getContent().find("div.wrap");

            // load the page specified in the trigger
            // wrap.load(this.getTrigger().attr("href"));
        },

        onClose: function() {
            // grab wrapper element inside content 
            var wrap = this.getContent().find("div.wrap");

            wrap.html("");
        }
    });
}

$(function(e) {
    
})