$(document).ready(function() {
    InitializeLocator();
    InitializeSurvivalGuide();
});

function InitializeLocator() {
    $("select#locator-age-select").change(function() {
        var flavorID = $(this).val();
        var url = pedialyteDomain + "/locator/flavors/" + flavorID;

        ShowLocatorLoadingScreen();

        $.get(url, function(html) {
            $("#locator-flavor-select").replaceWith(html);
            HideLocatorLoadingScreen();
        }, "html");
    });

    $("a#locator-submit-button").click(function() {
        if (ValidateLocatorZipEntry()) {
            if ($(this).hasClass("popup")) {
                var age = $("#locator-age-select").val();
                var flavor = $("#locator-flavor-select").val();
                var zip = $("#locator-zip-field").val();

                ShowLocatorPopup(age, flavor, zip);
            }
            else if ($(this).hasClass("tab")) {
                var flavor = $("#locator-flavor-select").val();
                var zip = $("#locator-zip-field").val();

                RemoveSearchForm();
                LoadStores(flavor, zip, 1);
            }
        }
        else {
            alert("Oops! Please enter a valid zip code.");
        }
    });

    BindDetailTabEvents();

    FormatDetailTab();
}

var locatorEntryForm = $("#locator-entry-form");
var locatorLoadingScreen = $("#locator-entry-loading-screen");

function ShowLocatorLoadingScreen() {
    var width = $(locatorEntryForm).outerWidth();
    var height = $(locatorEntryForm).outerHeight();

    $(locatorLoadingScreen).css({ 'width': width + "px", 'height': height + "px", 'display': 'block' });
}

function HideLocatorLoadingScreen() {
    $(locatorLoadingScreen).hide();
}

function ValidateLocatorZipEntry() {
    var zip = $("input#locator-zip-field").val();
    var regex = /\d{5}/gi;
    if (regex.test(zip)) {
        return true;
    }
    else {
        return false;
    }
}

//some variables to store element ids and their corresponding HTML
var popupBodyClass = "locator_popup_open";
var popupContainerID = "#locator-popup-container";
var popupContainerHTML = "<div id=\"locator-popup-container\"></div>";
var overlayContainerID = "#locator-overlay-container";
var overlayContainerHTML = "<div id=\"locator-overlay-container\" class=\"loading_background\"></div>";
var modalContainerID = "#locator-modal-container";
var modalContentContainerID = "#locator-modal-content-container";
var modalContainerHTML = "<div id=\"locator-modal-container\">" +
                         "<div id=\"locator-modal-content-container\">" +
                         "<div id=\"locator-modal-top\"><span id=\"locator-title-bar\">Store locator - results</span><a id=\"locator-close-button\">close</a></div>" +
                         "<div id=\"locator-modal-results-container\"><div class=\"modal_results_loading\"></div><div id=\"locator-results\"></div></div>" +
                         "<div id=\"locator-modal-bottom\">" +
                         "</div></div></div>";
var modalHeight = 360; // used to calculate where to position modal on screen

var closeButtonID = "#locator-close-button";
var resultsContainerID = "locator-modal-results-container";
var resultsHtmlContainerID = "#locator-results";

function ShowLocatorPopup(age, flavor, zip) {
    $("body").append(popupContainerHTML);
    $("body").addClass(popupBodyClass);
    SizeLocatorPopup();
    $(popupContainerID).show();
    $(popupContainerID).append(overlayContainerHTML);
    $(popupContainerID).append(modalContainerHTML);
    PositionLocatorModal();
    BindLocatorEvents();
    $(modalContainerID).show(0, function() {
        LoadLocatorPopupResults(age, flavor, zip);
    });
}

function DestroyLocatorPopupElements() {
    $(popupContainerID).remove();
    $("body").removeClass(popupBodyClass);
    $("body").removeAttr("style");
}

function SizeLocatorPopup() {
    var windowWidth = $(window).width();
    var windowHeight = $(window).height();

    var scrollFromTop = $(window).scrollTop();

    $(popupContainerID).css({ 'top': scrollFromTop + "px", 'width': windowWidth + "px", 'height': windowHeight + "px" });

    if ($("body").height() > windowHeight) {
        $("body").css({ 'height': windowHeight + "px" });
    }
}

function PositionLocatorModal() {
    var windowWidth = $(window).width();
    var windowHeight = $(window).height();

    var modalTop = ((windowHeight - modalHeight) / 2);

    $(modalContainerID).css("padding-top", modalTop + "px");
}

function BindLocatorEvents() {
    $(window).resize(function() { SizeLocatorPopup(); PositionLocatorModal(); });

    $(modalContainerID).click(function() {
        DestroyLocatorPopupElements();
    });

    $(modalContentContainerID).click(function(event) {
        event.stopPropagation();
    });

    $(closeButtonID).click(function() {
        DestroyLocatorPopupElements();
    });
}

function BindDetailTabEvents() {
    $("a#detail-tab-more-stores-button").click(function() {
        LoadMoreStores();
    });
}

function LoadLocatorPopupResults(age, flavor, zip) {
    var url = pedialyteDomain + "/locator/search/" + age + "/" + flavor + "/" + zip + "/popup/1";

    $.get(url, function(html) {
        $(resultsHtmlContainerID).append(html);
        AdjustStoreHeights();
        $(resultsHtmlContainerID).css({ 'display': 'none', 'visibility': 'visible' });
        $(".modal_results_loading").remove();
        $(resultsHtmlContainerID).show();
    }, "html");
}

function AdjustStoreHeights() {
    var minHeight = 0;

    $("ul#results-stores-list li").each(function() {
        if ($(this).outerHeight() > minHeight) {
            minHeight = $(this).outerHeight();
        }
    });

    $("ul#results-stores-list li").each(function() {
        var computedHeight = minHeight - parseInt($(this).css("padding-top"));
        $(this).css("height", computedHeight + "px");
    });
}

var tabResultsContainerID = "#locator-results-stores";
var tabResultsHtmlContainerID = "#locator-results";

function FormatDetailTab() {
    AdjustStoreHeights();
    $(tabResultsHtmlContainerID).css("visibility", "visible");
}

function LoadStores(productID, zip, page) {
    var url = pedialyteDomain + "/locator/search/product/" + productID + "/" + zip + "/tab/" + page;

    $(tabResultsContainerID).empty();
    $(tabResultsContainerID).addClass("tab_results_loading");

    $.get(url, function(html) {
        $(tabResultsContainerID).append(html);
        BindDetailTabEvents();
        AdjustStoreHeights();
        $(resultsHtmlContainerID).css({ 'display': 'none', 'visibility': 'visible' });
        $(tabResultsContainerID).removeClass("tab_results_loading");
        $(resultsHtmlContainerID).show();
    }, "html");
}

function LoadMoreStores() {
    var currentPage = $("a#detail-tab-more-stores-button").attr("current-page");
    var productID = $("a#detail-tab-more-stores-button").attr("product-id");
    var zip = $("a#detail-tab-more-stores-button").attr("zip");

    LoadStores(productID, zip, ++currentPage);
}

function RemoveSearchForm() {
    $(locatorEntryForm).remove();
    $(tabResultsContainerID).show();
}

// homepage survival guide page
function InitializeSurvivalGuide() {
    $("a#homepage-survival-guide-download-link").click(function() {
        $("#homepage-survival-guide-download-panel").hide();
        $("#homepage-survival-guide-confirmation-panel").show();
    });
}


/* Get the Guide click function -by Smita*/
$("a#get-the-guide-button").click(function() {

});