function DatePicker(containerId, buttonTitle) {

    var container = document.getElementById(containerId);
    var selects = container.getElementsByTagName("select");    
    var minParts = selects[1].options[0].value.split("|");
    var maxParts = selects[1].options[selects[1].length - 1].value.split("|");
    var minDate = minParts[0] + "/" + (new Date()).getDate() + "/" + minParts[1];
    var maxDay = (new Date(parseInt(maxParts[1]),  parseInt(maxParts[0]), 0)).getDate();
    var maxDate = maxParts[0] + "/" + maxDay + "/" + maxParts[1];
    
    /*
         Create a Calendar instance
    */
    
    var calContainerId = containerId + "_calContainer";
    
    var oCalendar = new YAHOO.widget.Calendar(containerId + "Calendar", calContainerId, {close: true, maxdate: maxDate, mindate: minDate});
    localizeCalendar(oCalendar);
    oCalendar.render();


    /*
        Subscribe to the Calendar instance's "select" event to 
        update the month, day, year form fields when the user
        selects a date.
    */

    oCalendar.selectEvent.subscribe(function(p_sType, p_aArgs) {

    	var aDate;

    	if (p_aArgs) {

    		aDate = p_aArgs[0][0];

    		var date = new Date();
    		date.setDate(1);
    		date.setYear(aDate[0])
    		date.setMonth(aDate[1] - 1);
    		date.setDate(aDate[2]);

    		setDate(date);
    	}

    	oCalendar.hide();
    });
    
    // Listener to show the calendar when the button is clicked
	var buttonId = containerId + "_button";


	YAHOO.util.Event.addListener(buttonId, "click", function() {
	    fixDate();

	    var parts = selects[1].value.split("|")
	    var initDate = parts[0] + "/" + selects[0].value + "/" + parts[1];
	    oCalendar.select(initDate);
	    oCalendar.setMonth(parts[0] - 1);
	    oCalendar.setYear(parts[1])
	    oCalendar.render();
	    oCalendar.show();
	}, true);
    
    
    //Checks clicks outside the calendar. If the there is a click outside the calendar then the calendar is closed.
   
    function clickedOutsideElement(elemId, evt) {
        var theElem = getEventTarget(evt);

        while(theElem != null) {
            if(theElem.id == elemId)
                return false;

            theElem = theElem.offsetParent;
        }

        return true;
    }

    function getEventTarget(evt) {
        var targ = (evt.target) ? evt.target : evt.srcElement;

        if(targ != null) {
            if(targ.nodeType == 3)
                targ = targ.parentNode;
        }

        return targ;
    }
    
    YAHOO.util.Event.addListener(document, "click", function (e) { 
        
        if (clickedOutsideElement(calContainerId, e) && clickedOutsideElement(buttonId, e)) 
        {
            oCalendar.hide();
        }
    }, true);
    
    this.getSelectDay = function() { return selects[0]; }
    this.getSelectMonthYear = function() { return selects[1]; }
    this.getCalendar = function() { return oCalendar; }
    this.getContainer = function() { return container; }

    this.getDate = function() {

        var date = new Date();
        var monthYearSplits = selects[1].options[selects[1].selectedIndex].value.split("|");
        date.setDate(1);
        date.setYear(monthYearSplits[1]);
        date.setMonth(monthYearSplits[0] - 1);
        date.setDate(selects[0].value);

        return date;
    }
    
    this.setDate = setDate;

    function setDate(date) {
        
        var month = date.getMonth() + 1;
        var strMonth = (month < 10) ? "0" + String(month) : String(month);
        
        selects[0].value = date.getDate();
        selects[1].value = strMonth + "|" + date.getFullYear();
    }

    YAHOO.util.Event.addListener(selects[1], "change", function(e) {

        fixDate();

    }, true);

    YAHOO.util.Event.addListener(selects[1], "blur", function(e) {

        fixDate();

    }, true);


    function fixDate() {

        var monthYearSplits = selects[1].options[selects[1].selectedIndex].value.split("|");

        var monthDays = getMonthDays(monthYearSplits[1], monthYearSplits[0] - 1);

        if (monthDays < selects[0].value) {
            selects[0].value = monthDays;
        }

    }

    this.isDateValid = isDateValid;
    
    function isDateValid() {
        
        var monthYearSplits = selects[1].value.split("|");

        var monthDays = getMonthDays(monthYearSplits[1], monthYearSplits[0] - 1);

        return (monthDays >= selects[0].value);
    }
    
}

function DatePickerDependency(containerIdFrom, buttonTitleFrom, containerIdTo, buttonTitleTo, minSpan) 
{
    var dpFrom = new DatePicker(containerIdFrom, buttonTitleFrom);
    var dpTo = new DatePicker(containerIdTo, buttonTitleTo);
    
    var dllDayFrom = dpFrom.getSelectDay();
    var dllMonthYearFrom = dpFrom.getSelectMonthYear();
    
    var dllDayTo = dpTo.getSelectDay();
    var dllMonthYearTo = dpTo.getSelectMonthYear();    
    
    dpFrom.getCalendar().selectEvent.subscribe(function (p_sType, p_aArgs) {

        if (p_aArgs) {
                
            onChange(null, true);           
        }
    });    
    
    YAHOO.util.Event.addListener(dllDayFrom, "change", function (e) {
        
        onChange(e);
        
    }, true);

    YAHOO.util.Event.addListener(dllMonthYearFrom, "change", function(e) {

        onChange(e);

    }, true);

    YAHOO.util.Event.addListener(dllMonthYearFrom, "blur", function(e) {

        onChange(e);

    }, true);

    function onChange(e) {


        if (dpFrom.isDateValid()) {

    	    var dateFrom = dpFrom.getDate();
           
            var dateTo = dpTo.getDate();
                
            if (dateFrom >= dateTo) {
                dateTo.setDate(1);            
                dateTo.setYear(dateFrom.getFullYear());
                dateTo.setMonth(dateFrom.getMonth());
                dateTo.setDate(dateFrom.getDate() + minSpan);
            }

            dpTo.setDate(dateTo);
        }
    }
}

function getMonthDays(year, month) 
{
    var date = new Date();
    date.setDate(1);
    date.setYear(year);
    date.setMonth(month + 1);
    date.setDate(0);

    return date.getDate();
}