var calendarLoading;
var deliveryDateFields = [];

var DeliveryDateField = function (elem, idProduct, initialDate)
{
    var self = this;
    self.idProduct = idProduct;

    var container = $(elem);
    self.deliveryDateInput = $(elem).find(".del-date-input input").eq(0);
    self.dayField = $(elem).find(".DelivDay");
    self.monthField = $(elem).find(".DelivMonth");
    self.yearField = $(elem).find(".DelivYear");

    self.defaultDate = initialDate;

    var selectDate = function (date)
    {
        self.deliveryDateInput.datepicker("setDate", $.datepicker.formatDate($.datepicker.RFC_2822, date));
        self.dayField.val(date.getDate());
        self.monthField.val(date.getMonth() + 1);
        self.yearField.val(date.getFullYear());
    }

    var refreshData = function (beforeCallback, afterCallback)
    {
        beforeCallback();
        $.getScript(BaseUrl + "/datepicker_data.asp?idProduct=" + self.idProduct, function (data, textStatus) { afterCallback(); });
    }

    var refreshDataForMonth = function (year, month, beforeCallback, afterCallback)
    {
        beforeCallback();
        $.getScript(BaseUrl + "/datepicker_data.asp?idProduct=" + self.idProduct + "&year=" + year + "&month=" + month, function (data, textStatus) { afterCallback(); });
    }

    var doNothing = function () { }

    var beforeRefresh = function ()
    {
        self.deliveryDateInput.datepicker("disable");
        //calendarLoading.show().appendTo(self.deliveryDateInput.datepicker("widget"));
    }

    var afterRefresh = function ()
    {
        //calendarLoading.hide().detach();
        self.deliveryDateInput.datepicker("enable");
    }

    var updateCalendar = function ()
    {
        self.deliveryDateInput.datepicker("refresh");
        afterRefresh();
        //prefillInput();
    }

    var initPicker = function ()
    {
        // Configure jQuery UI datepicker onto delivery date field
        self.deliveryDateInput.datepicker(
        {
            defaultDate: self.defaultDate,
            dateFormat: $.datepicker.RFC_2822,
            showOn: "both",
            buttonImage: BaseUrl + "/images/datepicker.gif",
            buttonImageOnly: true,
            changeMonth: true,
            changeYear: true,
            yearRange: "+0:+1",
            onClose: function ()
            {
                //self.deliveryDateInput.focus();
            },
            onChangeMonthYear: function (year, month, inst)
            {
                refreshDataForMonth(year, month, beforeRefresh, updateCalendar);
            },
            beforeShowDay: function (date)
            {
                for (var i = 0; i < unavailabledates.length; i++) {
                    if
                    (
                        unavailabledates[i].getDate() == date.getDate() &&
                        unavailabledates[i].getMonth() == date.getMonth() &&
                        unavailabledates[i].getYear() == date.getYear()
                    ) {
                        return new Array(false, '', 'Delivery is not available on this date');
                    }
                }
                return new Array(true, '', '');
            },
            onSelect: function (dateText, inst)
            {
                //selectDate(self.deliveryDateInput.datepicker("getDate"));
            }


        });
        
        if (container.hasClass("deferred")) {
            // Use earliest available delivery date as default choice
            //self.deliveryDateInput.datepicker("defaultDate", earliest);
            selectDate(earliest);
        }
        self.deliveryDateInput.datepicker("option", { minDate: earliest, maxDate: last });
        self.deliveryDateInput.attr("readonly", "readonly");
        container.css("visibility", "visible");
        //calendarLoading.show().appendTo($("#ui-datepicker-div"));
    }

    refreshData(doNothing, initPicker);
}

// run this when all other elements are loaded, rather that tying up browser immediately after the DOM is ready
$(document).ready(function ()
{
    calendarLoading = $('<div id="calendar-hide"><img src="' + BaseUrl + '/images/jquery-ui-images/ajax-spinner.gif" alt="Loading..." /></div>');

    $("form.additem").each(function (j, formElem)
    {
        var idProduct = $(formElem).find("input[name=idProduct]").val();

        $(formElem).find(".del-date").each(function (i, elem)
        {
            var defaultDate = null;
            var input = $(elem).find(".del-date-input input");
            if (input.val() != "")
                defaultDate = new Date(input.val());

            deliveryDateFields.push(new DeliveryDateField($(elem), idProduct, defaultDate));
        });
    });
});