﻿
/// <reference path="../Edentity.Global.js" />
/// <reference path="../External/jquery-1.3.2-vsdoc2.js" />
/// <reference path="../External/jquery.blockUI.js" />
/// <reference path="../Plugins/QueryString.js" />


Edentity.RegisterNamespace("Whiskas.Modules.ProductFoodGuideSelector");

(function(PFGS, $) {

    var pnlListingArea = null; // Render area for search results
    var pnlTabs = null;
    var LoadingImageUrl = '';
    var pagesCount = 5; // Pages visibles
    var pageWidth = 19; // Page width 19px
    var waitingCallback = false; //If it's waiting ajax callback

    var ddlLifeStageFilter = null,
        ddlPreferredFlavourFilter = null,
        ddlTextureFilter = null,
        ddlPregnantNursingFilter = null;

    PFGS.OnInit = function(pnlTabsID, pnlTabsIngredientsID, btnSelectButtonUrl, loadingImageUrl,
        LifeStageJSON, PreferredFlavoursJSON, TextureJSON, PregnantNursingJSON) {

        pnlTabs = $('#' + pnlTabsID);

        var ingredient = parseInt($.Hash.get('ingredient'));

        pnlTabs.tabs({
            show: function(event, ui) {
                $('a', $(ui.tab).parent().parent()).each(function() {
                    $('img', $(this)).eq(1).hide();
                    $('img', $(this)).eq(0).show();
                });
                $('img', $(ui.tab)).eq(0).hide();
                $('img', $(ui.tab)).eq(1).show();
            }
        }).tabs('select', (isNaN(ingredient) ? 0 : 1));

        pnlTabs.css('visibility', 'visible');

        var pnlTabsIngredients = $('#' + pnlTabsIngredientsID);
        var ingredientTab = 0;
        var ingredientLink = null;
        if (!isNaN(ingredient)) {
            var ingredientLink = $('a[IngredientID=' + ingredient + ']', pnlTabsIngredients);
            var name = ingredientLink.text().toLowerCase();
            if (name[0] >= 'd' && name[0] <= 'g') {
                ingredientTab = 1;
            }
            else if (name[0] >= 'h' && name[0] <= 'o') {
                ingredientTab = 2;
            }
            else if (name[0] >= 'p' && name[0] <= 's') {
                ingredientTab = 3;
            }
            else if (name[0] >= 't' && name[0] <= 'z') {
                ingredientTab = 4;
            }
        }

        pnlTabsIngredients.tabs({
            select: ingredientTab
        });
        pnlTabsIngredients.css('visibility', 'visible');

        LoadingImageUrl = loadingImageUrl;

        var pnlListingAreas = $('div[id$=pnlListingArea]');
        var filterSet = false;
        if (pnlListingAreas.length > 0) {
            pnlListingArea = pnlListingAreas.eq(0);

            // Render filter dropdowns
            var id = parseInt($.Hash.get("lifestage"));
            ddlLifeStageFilter = _renderDropdownFilter($('div[id$=divLifeStageFilter]', pnlTabs),
                btnSelectButtonUrl, LifeStageJSON, isNaN(id) ? 0 : id);
            filterSet = filterSet || !isNaN(id);

            id = parseInt($.Hash.get("flavour"));
            ddlPreferredFlavourFilter = _renderDropdownFilter($('div[id$=divPreferredFlavourFilter]', pnlTabs),
                btnSelectButtonUrl, PreferredFlavoursJSON, isNaN(id) ? 0 : id);
            filterSet = filterSet || !isNaN(id);

            id = parseInt($.Hash.get("texture"));
            ddlTextureFilter = _renderDropdownFilter($('div[id$=divTextureFilter]', pnlTabs),
                btnSelectButtonUrl, TextureJSON, isNaN(id) ? 0 : id);
            filterSet = filterSet || !isNaN(id);

            id = parseInt($.Hash.get("pregnant"));
            ddlPregnantNursingFilter = _renderDropdownFilter($('div[id$=divPregnantNursingFilter]', pnlTabs),
                btnSelectButtonUrl, PregnantNursingJSON, isNaN(id) ? 0 : id);
            filterSet = filterSet || !isNaN(id);
        }

        if (ingredientLink != null) {
            ingredientLink.click();
        }
        else if (filterSet) {
            $("#divProductFoodGuideSelector a.ShowProducts:first").click();
        }
    };

    function _renderDropdownFilter(divFilter, btnSelectButtonUrl, JSONcontent, selectedValue) {

        return divFilter.WSelectBox({
            DefaultText: divFilter.html(),
            ClearItemText: null,
            Items: JSONcontent,
            SelectedValue: selectedValue,
            SelectImage: btnSelectButtonUrl,
            Horizontal: false,
            onSelectedChange: function(selectedvalue, selectedtext) {
                divFilter.data('selectedvalue', selectedvalue);
            }
        });

    };

    var FilteringByIngredient = false;

    PFGS.OnFilterByIngredient = function(sender) {

        if (!FilteringByIngredient) {

            FilteringByIngredient = true;

            var ingredientID = $(sender).attr('ingredientid');
            var productsPerPage = pnlListingArea.attr('ProductsPerPage');

            pnlListingArea.removeData('params');

            _applyFilter('0', '0', '0', '0', ingredientID, 0, productsPerPage, true,
            function() {
                _setSelectedIngredient(sender);
                FilteringByIngredient = false;
            });
        }
        return false;
    };

    PFGS.OnFilterBySelector = function(sender) {

        if (!$(sender).is('.ShowProductsSeleced')) {

            $(sender).addClass('ShowProductsSeleced');

            var productsPerPage = pnlListingArea.attr('ProductsPerPage');
            pnlListingArea.removeData('params');

            var filters = $('div.FilterSelectors', $(sender).parent());
            _applyFilter(
            filters.eq(0).data('selectedvalue'), filters.eq(1).data('selectedvalue'),
            filters.eq(2).data('selectedvalue'), filters.eq(3).data('selectedvalue'),
            '0', 0, productsPerPage, true, function() {
                $(sender).removeClass('ShowProductsSeleced');
            });
        }
        return false;
    };

    function _applyFilter(lifeStageIDs, preferredFlavourIDs, textureIDs, pregnantNursingIDs, ingredientIDs,
        pageNo, productsPerPage, renderPager, callbackFunction) {

        var params =
            "{'LifeStages':'" + lifeStageIDs + "', 'PreferredFavours':'" + preferredFlavourIDs +
            "','Textures':'" + textureIDs + "','PregnantNursing':'" + pregnantNursingIDs +
            "','SelectedIngredients':'" + ingredientIDs + "'}";

        _setHash(lifeStageIDs, preferredFlavourIDs, textureIDs, pregnantNursingIDs, ingredientIDs);

        _applyFilterWithParams(params, pageNo, productsPerPage, renderPager, callbackFunction);
    }

    function _applyFilterWithParams(params, pageNo, productsPerPage, renderPager, callbackFunction) {
        if (!waitingCallback) {

            if (!renderPager) {
                //We don't need to request content, just slide
                _slidePager(pageNo);
                return;
            }

            waitingCallback = true;
            var selectorView = callbackFunction == null;

            _blockListingPanel();

            $.ajax({
                type: "POST",
                url: AjaxServicesAsmxURL + '/GetProducts',
                data: params,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(result) {

                    if (result.d != null) {

                        if (!selectorView) {
                            if (renderPager) {
                                _renderIngredients(result.d.Ingredients);
                            }
                        }
                        else {
                            _renderIngredients(null);
                        }
                        if (!selectorView) {
                            _renderProducts(result.d.Products, productsPerPage, false);
                        }
                        else {
                            _renderProducts(result.d.Products, productsPerPage, true);
                        }
                        if (renderPager) {
                            var pager = new Whiskas.Controls.ClientSidePager("TestPager", result.d.Products.length, productsPerPage, pageNo, function($pager) {
                                _adjustCentering($pager);
                            }, function(pageNo) {
                                _applyFilterWithParams(params, pageNo, productsPerPage, false, null);
                            });
                            pager.Init();
                        }

                        if (jQuery.isFunction(callbackFunction)) {
                            callbackFunction();
                        }
                    }
                },
                complete: function(XMLHttpRequest, textStatus) {

                    _unblockListingPanel();
                    waitingCallback = false;

                    //alert(XMLHttpRequest.status + ' ' + textStatus);
                    //alert(XMLHttpRequest.responseText);
                }
            });
        }
    }

    function _renderIngredients(ingredientList) {
        if (pnlListingArea != null && ingredientList != null) {

            var IngredientLabel = pnlListingArea.attr('IngredientLabel');
            var WhichProductsUseThisIngredientLabel = pnlListingArea.attr('WhichProductsUseThisIngredientLabel');

            var html = '';
            for (var i = 0; i < ingredientList.length; i++) {
                html += '<h1>' + IngredientLabel + ':&nbsp;' + ingredientList[i].Title + '</h1>';
                html += '<p>' + ingredientList[i].Description + '</p>';
                html += '<h1>' + WhichProductsUseThisIngredientLabel + '</h1>';
            }
            $('div.ListingHeader', pnlListingArea).html(html);
        }
        else {
            $('div.ListingHeader', pnlListingArea).html('');
        }
    }

    function _renderProducts(productList, productsPerPage, showCategory) {

        if (pnlListingArea != null && productList != null) {

            var divListingContent = $('div.ListingContent', pnlListingArea);

            if (productList.length > 0) {

                var FindOutMoreLabel = pnlListingArea.attr('FindOutMoreLabel');
                var liCounter = 1;

                var html = "";
                for (var i = 0; i < productList.length; i++) {

                    if (i > 0 && i % productsPerPage == 0) {
                        html += "</li><li>";
                        liCounter++;
                    }

                    var p = productList[i];

                    html += "<div class='Product'><div class='Description'>";
                    if (showCategory) {
                        html += "<h1>" + p.Category.Title + "</h1>";
                    }

                    html += "<a class='Title' href='" + p.FriendlyUrl + "'>" + p.Title + "</a><br/>"
                    html += "<p>" + p.ShortDescription + "</p>"
                    html += "<span class='More'>&nbsp;&#x25b6;&nbsp;</span><a class='More' href='" + p.FriendlyUrl + "'>" + FindOutMoreLabel + "</a><br/>"
                    html += "</div><div class='Image'><a href='" + p.FriendlyUrl + "'>" + "<img src='" + p.ThumbnailUrl + "'/></a>"
                    html += "</div></div>";
                    html += "<div class='Clear'></div>";
                }
                html = "<ul style='width:" + (divListingContent.width() * liCounter) + "px;height:" + (productsPerPage * 215) + "px'><li>" + html + "</li></ul>";
                divListingContent.html(html);

                divListingContent.height(productsPerPage * 215);
            }
            else {
                divListingContent.html("<p><br/><br/><b>" + pnlTabs.prev().val() + "</b></p>");
            }
        }
    }

    PFGS.OnSelectPage = function(sender) {

        if (!$(sender).is('.Selected')) {
            var pageNo = $(sender).attr('pageno');
            var productsPerPage = pnlListingArea.attr('ProductsPerPage');
            var params = pnlListingArea.data('params');

            _applyFilterWithParams(params, pageNo, productsPerPage, false, null);
        }
        return false;
    };
    
    function _adjustCentering($pagerContainer) {
        var width = $('div.PagerLeft', $pagerContainer).width();
        width += $('div.PrevPages', $pagerContainer).width() || 0;
        width += $('div.Pages', $pagerContainer).width();
        width += $('div.NextPages', $pagerContainer).width() || 0;
        width += $('div.PagerRight', $pagerContainer).width();
        $('div.Div', $pagerContainer).width(($pagerContainer.width() - width) / 2);
    }

    PFGS.ResetSelector = function(sender) {

        ddlLifeStageFilter.SelectValue(0, true);
        ddlPreferredFlavourFilter.SelectValue(0, true);
        ddlPregnantNursingFilter.SelectValue(0, true);
        ddlTextureFilter.SelectValue(0, true);

        $.Hash.clear();

        var filters = $('div.FilterSelectors', $(sender).parent());

  

        filters.eq(0).data('selectedvalue', 0);
        filters.eq(1).data('selectedvalue', 0);
        filters.eq(2).data('selectedvalue', 0);
        filters.eq(3).data('selectedvalue', 0);

        return false;
    };

    function _slidePager(cp) {

        var divListingContent = $('div.ListingContent', pnlListingArea);

        var currentPage = eval(cp);
        var visiblePages = pagesCount;

        var pager = $('div.Pager', pnlListingArea);
        var lastPage = eval(pager.attr('totalpages')) - 1;

        $('a', pager).removeClass('Selected');

        if (lastPage >= visiblePages) { // Side sliding pager

            var step = Math.floor(currentPage / visiblePages) * visiblePages;

            if (lastPage - currentPage < 3) {
                step = lastPage - visiblePages + 1;
            }
            else if (step + visiblePages - currentPage < 2) {
                step += 2;
            }
            else if (step > 0 && currentPage - step < 2) {
                step -= 2;
            }

            $('div.All', pager).animate({ left: '-' + (step * pageWidth) + 'px' }, 'normal');
        }

        $('ul', divListingContent).animate({ left: '-' + (currentPage * divListingContent.width()) + 'px' }, 'normal');
        $("a[pageno=" + currentPage + "]", pager).addClass('Selected');
    };

    function _setSelectedIngredient(sender) {
        $('a', $(sender).parent()).removeClass('Selected');
        $(sender).addClass('Selected');
    }

    function _blockListingPanel() {
        pnlListingArea.block({
            message: "<img src='" + LoadingImageUrl + "' />",
            css: { border: 'none', backgroundColor: 'transparent' },
            overlayCSS: { backgroundColor: '#fff' }
        });
    };

    function _unblockListingPanel() {
        pnlListingArea.unblock();
    };

    function _setHash(lifeStageIDs, preferredFlavourIDs, textureIDs, pregnantNursingIDs, ingredientIDs) {

        //Set hash for navigation
        $.Hash.clear();

        var id = parseInt(lifeStageIDs);
        if (id != NaN && id > 0) {
            $.Hash.set('lifestage', id);
        }
        id = parseInt(preferredFlavourIDs);
        if (id != NaN && id > 0) {
            $.Hash.set('flavour', id);
        }
        id = parseInt(textureIDs);
        if (id != NaN && id > 0) {
            $.Hash.set('texture', id);
        }
        id = parseInt(pregnantNursingIDs);
        if (id != NaN && id > 0) {
            $.Hash.set('pregnant', id);
        }
        id = parseInt(ingredientIDs);
        if (id != NaN && id > 0) {
            $.Hash.set('ingredient', id);
        }

        window.location.hash = $.Hash.toString();
    };

})(Whiskas.Modules.ProductFoodGuideSelector, jQuery);


