function DateControl(divDays, divHeader, instanceName,showWeekNumber,y,m,d,displayDefault,dateFormat,toggleCalendar,upImage,downImage){

var today = new Date();
var SelectedDate = new Date();

var dateValue = document.getElementById('txt'+instanceName);
var arr = dateValue.value.split('/');

if(dateFormat=='DDMMYYYY'){
	SelectedDate.setFullYear(arr[2],arr[1]-1,arr[0]);
	
}else if (dateFormat=='MMDDYYYY'){
	SelectedDate.setFullYear(arr[2],arr[0]-1,arr[1]);
}

//set the default date if no date is set
if(isNaN(SelectedDate.valueOf())){
	    SelectedDate.setFullYear(y,m-1,d);    
}

// render the selected date or default date via ASP.NET
var selectedDay = SelectedDate.getDate();
var selectedMonth = SelectedDate.getMonth()+1; // Jan = 0 | Dec = 11
var selectedYear = SelectedDate.getFullYear();

var displayMonth = SelectedDate.getMonth()+1; // Jan = 0 | Dec = 11
var displayYear = SelectedDate.getFullYear();


//alert(SelectedDate.getMonth());
var keepOpen = false;

var browser=navigator.appName

var dropDisplayYear = displayYear;

// set the default selected date to null
var selectedCell=null;

this.keepCalendarOpen = function(){
    keepOpen = true;
}

this.formatDate = function(date){

   arr = date.split('/');
   
   if(dateFormat=='DDMMYYYY'){
	    return arr[0]+'/'+arr[1]+'/'+arr[2];
   }else if (dateFormat=='MMDDYYYY'){
	    return arr[1]+'/'+arr[0]+'/'+arr[2];
   }
    return date; 
}


////////////////////////////////// drop downs
this.findPosX = function(obj){
    var curLeft = 0;
    if(obj.offsetParent){
        while(true){
            curLeft += obj.offsetLeft;
            if(!obj.offsetParent)
                break;
           obj = obj.offsetParent;
        }
    }
    else if(obj.x){
        curLeft += obj.x;
    }
    return curLeft;
}

this.findPosY = function(obj){
    var curTop = 0;
    if(obj.offsetParent){
        while(true){
            curTop += obj.offsetTop;
            if(!obj.offsetParent)
                break;      
           obj = obj.offsetParent;
        }
    }
    else if(obj.y){
        curTop += obj.y;
    }
    return curTop;
}

this.exactMonth = function(month){
    displayMonth = month;
    this.renderDays();
    this.toggleMonthDrop();
}

this.exactYear = function(year){
    displayYear = year;
    this.renderDays();
    this.toggleYearDrop();
}

this.renderMonths = function(){
    var divMonths = document.getElementById('divMonths'+instanceName);
    var html = "<table width='100%' border=0 cellpadding=0 cellspacing=0>";
    
 
    for(var i=1;i<13;i++){
        if(i==displayMonth)
            html += "<tr><td align=center class='"+instanceName+"mOverHighlightHover' onclick='"+instanceName+"Class.exactMonth("+i+")'>"+months[i]+"</td></tr>";
        else
            html += "<tr><td align=center class='"+instanceName+"mOverHighlight' onmouseover=this.className='"+instanceName+"mOverHighlightHover' onmouseout=this.className='"+instanceName+"mOverHighlight'  onclick='"+instanceName+"Class.exactMonth("+i+")'>"+months[i]+"</td></tr>";
    }
    
    html += "</table>";
    divMonths.innerHTML = html;
}

this.renderYears = function(value){
    var divYears = document.getElementById('divYears'+instanceName);
    var html = "<table width='100%' border=0 cellpadding=0 cellspacing=0>";
    var fromYear = dropDisplayYear - 6;
    var toYear = dropDisplayYear + 6;
    
    if(value== 1){
        fromYear--;
        toYear--;
        dropDisplayYear--;
    }else if(value==-1){
        fromYear++;
        toYear++;
        dropDisplayYear++;
    }

    html += "<tr><td align=center onclick='"+instanceName+"Class.renderYears(1)' style='cursor:pointer' height='10'><img src='"+upImage+"'></td></tr>"
    for(var i=fromYear;i<toYear;i++){
        if(i==displayYear)
            html += "<tr><td align=center class='"+instanceName+"mOverHighlightHover' onclick='"+instanceName+"Class.exactYear("+i+")'>"+i+"</td></tr>";
        else
            html += "<tr><td align=center class='"+instanceName+"mOverHighlight' onmouseover=this.className='"+instanceName+"mOverHighlightHover' onmouseout=this.className='"+instanceName+"mOverHighlight' onclick='"+instanceName+"Class.exactYear("+i+")'>"+i+"</td></tr>";
    }
    html += "<tr><td align=center onclick='"+instanceName+"Class.renderYears(-1)' style='cursor:pointer' height='10'><img src='"+downImage+"'></td></tr>"
    html += "</table>";
    divYears.innerHTML = html;
}

this.renderMonths();

this.toggleMonthDrop = function(){

    var divMonths = document.getElementById('divMonths'+instanceName);
    var divHeader = document.getElementById('divMonthSelect'+instanceName);
    divMonths.style.left = this.findPosX(divHeader)  + 'px';
    divMonths.style.top = this.findPosY(divHeader) + 20 + 'px';
    
    if (divMonths.style.visibility=='visible'){
        keepOpen = true;
    }
    
    divMonths.style.visibility = (divMonths.style.visibility=='visible') ? 'hidden' : 'visible';   
    
    this.renderMonths();
}

this.toggleYearDrop = function(){
    var divYears = document.getElementById('divYears'+instanceName);
    var divHeader = document.getElementById('divYearSelect'+instanceName);
    dropDisplayYear = displayYear;    
    divYears.style.left = this.findPosX(divHeader) + 'px';
    divYears.style.top = this.findPosY(divHeader) + 20 + 'px';
    
    if (divYears.style.visibility=='visible'){
        keepOpen = true;
    }
    
    divYears.style.visibility = (divYears.style.visibility=='visible') ? 'hidden' : 'visible';  

    this.renderYears(0);  
}


//Select a new date
this.selectDate = function(cell,day){

    //reset the cell if one has been selected
    if(selectedCell!=null) selectedCell.className = instanceName+'normalDayCell';
    
    // assign the selected cell so it can be normalised upon new day selection
    selectedCell = cell;
    cell.className = instanceName+'selectedDayCell';
    
    //set the the selection
    selectedDay = day;
    selectedMonth = displayMonth;
    selectedYear = displayYear;
    
    var date = selectedDay+'/'+selectedMonth+'/'+selectedYear;
    
    //only render to the textbox if the parsed date was valid
    if(!displayDefault)
        this.setTextValue(date);

    //make sure its set for manual intervention through the calendar
    displayDefault = false;
    
    //Hide the calendar
    if(toggleCalendar){
            var cal = document.getElementById('calendar'+instanceName);
            var divYears = document.getElementById('divYearSelect'+instanceName);
            var divMonths = document.getElementById('divMonthSelect'+instanceName);
            cal.style.visibility = 'hidden';
            divYears.visibility = 'hidden';
            divMonths.visibility = 'hidden';
    }
}

this.setNoneDate = function(){
    this.setTextValue(null);
    if(selectedCell!=null) selectedCell.className = instanceName+'normalDayCell';
    this.toggleCalendarShow();
}

this.setTodayDate = function(){
    this.setTextValue(today);
    this.toggleCalendarShow();
}

this.toggleCalendarShow = function(){

    var cal = document.getElementById('calendar'+instanceName);
    var divYears = document.getElementById('divYearSelect'+instanceName);
    var divMonths = document.getElementById('divMonthSelect'+instanceName);
     
     
    //has toggle been selected?
    if(toggleCalendar){
        if(cal.style.visibility=='visible'){
            cal.style.visibility = 'hidden';
            divYears.visibility = 'hidden';
            divMonths.visibility = 'hidden';
            keepOpen = false;
        }else{
            cal.style.visibility = 'visible';
            keepOpen = true;
        }
    }
}

this.setTextValue = function(value){
    var txt = document.getElementById('txt'+instanceName);
    txt.value = (value!=null) ? this.formatDate(value) : '';    
}

//the week day that the 1st falls on
this.firstWeekDay = function(month, year){

    month -= 1;// setFullDate takes a zero based month indexer
    var date=new Date()
    date.setFullYear(year,month,1);

    return date.getDay();
}
// get the number of days in the month accounting for a leap year
this.getDays = function(month, year){
    // leap years only matter in February
    if (2 == month)
        return ((0 == year % 4) && (0 != (year % 100))) ||
            (0 == year % 400) ? 29 : 28;
    else
        return daysInMonth[month];
}

// The month has been reduced
this.monthBack = function(){
    // if the month is january then set to December
    if(displayMonth==1){
        displayMonth=12;
        displayYear--; // decrement the year
    }else{
        displayMonth--;
    }

    //re-render the control
    this.renderDays();
}

// The month has been advanced
this.monthForward = function(){
    // if the month is December then set to January
    if(displayMonth==12){
        displayMonth=1;
        displayYear++; // Increment the year
    }else{
        displayMonth++;
    }
     //re-render the control
    this.renderDays();
}

// render the days
this.renderDays = function (){

    // get the number of days to render
    var numberOfDays = this.getDays(displayMonth, displayYear);
    var firstDayOfWeek = this.firstWeekDay(displayMonth, displayYear);

    // used for row control
    var leftCount = 1;
    // the html content builder to be assigned the control
    var content="";
    // the preselected day table cell
    var preSelectedDayCell=null;
    // the preselected day
    var preSelectedDay=null;
    // the ordered week number
    var weekNumber = getWeekNumber(displayYear,displayMonth,1);
    
    //open the table
    content += '<table width="100%" cellspacing=0><tr><td>&nbsp;</td>';
       
    // render the remaining days for last month
    for(var j=0;j<7;j++){
        content += '<td class="'+instanceName+'dayMn">'+days[j]+'</td>';
    }
        
    // only render the a new row if last month has bled into this
    if(firstDayOfWeek>0)
        content += '<tr class="'+instanceName+'dayMn">';
        
    // get the last few days of last month in reverse
    var lastMonth = (displayMonth==12) ? 1 : 11
    var lastMonthDays = daysInMonth[lastMonth] - firstDayOfWeek + 1;
    
    //pad the days of last month
    for(var i=0;i<firstDayOfWeek;i++){
    //onmouseover="window.status = displayMonth;return true;" onmouseout="window.status = '';return true;"
        if(i==0){
            if(showWeekNumber)
                content += '<td class="'+instanceName+'weekNumber" >'+weekNumber++ +'</td>';
            else
                content += '<td>&nbsp;</td>';
        }
        content += '<td class="'+instanceName+'dim">' + lastMonthDays++ + '</td>';      
        leftCount++
    }


    // loop through all the days of the display month
    for(var i=1;i<=numberOfDays;i++){
        //Render the <TR> tag
        if(leftCount==1){
            content += '<tr class="'+instanceName+'day">';
            
           if(showWeekNumber)
                content += '<td class="'+instanceName+'weekNumber">'+weekNumber++ +'</td>';
           else
                content += '<td>&nbsp;</td>';
        }
         
        // add the day table cell and add the onclick javascript reference             
        content += '<td id="dayCell'+instanceName+i+'" class="'+instanceName+'normalDayCell" onClick="'+instanceName+'Class.selectDate(this,('+i+'))">'+i+'</td>';
        
        
        // register the selected day
        if(selectedMonth==displayMonth && selectedYear==displayYear && selectedDay==i){
            preSelectedDayCell = 'dayCell'+instanceName+i;
            preSelectedDay = i;
        }
        
        // render the close <TR> tag
        if(leftCount==7){
            content += '<td>&nbsp;</td></tr>';
            leftCount = 1; //reset leftCount
        }else{
            leftCount++;
        }
    }
    
    // pad the remaining days of the month
    if(leftCount<=7){
        var nextMonthDays = 1;
        for(var i=leftCount;i<=7;i++){
            // leave a space if the week number column is being displayed
            if(i==1 && showWeekNumber)
                content += '<td class="'+instanceName+'weekNumber">&nbsp;</td>';
            else if(i==1)
                content += '<td>&nbsp;</td>';
                
            content += '<td class="'+instanceName+'dim">'+ nextMonthDays++ +'</td>';  
            // render the close <TR> tag
            if(i==7){
                content += '</tr>';
            }
        }
    }
    
    //close the table
    content+= '</table>';
    
    // ass the html to the dic objects
    divDays.innerHTML = content;
    divHeader.innerHTML = "<div align=center ><table border=0 style='font-size:small;'><tr><td><div id='divMonthSelect"+instanceName+"' style='cursor:pointer;position:relative;' onclick='"+instanceName+"Class.toggleMonthDrop();'>"+months[displayMonth]+"</div></td><td><div onclick='" + instanceName+"Class.toggleYearDrop();' id='divYearSelect"+instanceName+"' style='position:relative;cursor:pointer;'>"+displayYear+"</div></td></tr></table></div>";
   
    
    // preselecct the day cell
    if(preSelectedDayCell!=null) {
        this.selectDate(document.getElementById(preSelectedDayCell),preSelectedDay);
        
        if(!displayDefault)
            this.setTextValue(selectedDay+'/'+selectedMonth+'/'+selectedYear+'/'); 
    }
    
    //only disable preselection on the first run
    displayDefault = false;
      
}

this.documentClick = function (){
 
    if(!keepOpen && toggleCalendar){    
        var cal = document.getElementById('calendar'+instanceName);
        var divYears = document.getElementById('divYears'+instanceName);
        var divMonths = document.getElementById('divMonths'+instanceName);
        cal.style.visibility = 'hidden';
        divYears.style.visibility = 'hidden';
        divMonths.style.visibility = 'hidden';
    }

    keepOpen=false;
}

function getWeekNumber(year,month,day){
    var a = Math.floor((14-(month))/12);
    var y = year+4800-a;
    var m = (month)+(12*a)-3;
    var jd = day + Math.floor(((153*m)+2)/5) + (365*y) + Math.floor(y/4) - Math.floor(y/100) + Math.floor(y/400) - 32045; 
    var d4 = (jd+31741-(jd%7))%146097%36524%1461;
    var L = Math.floor(d4/1460);
    var d1 = ((d4-L)%365)+L;
    NumberOfWeek = Math.floor(d1/7) + 1;
    return NumberOfWeek;        
}

    //hide the calendar if the user clicks off
    if(browser=='Netscape')
        document.addEventListener("click", this.documentClick,false);
    else if(browser=='Microsoft Internet Explorer')
        document.attachEvent("onclick", this.documentClick,false);
        
    //render this month when the page first loads
    return this;
}