/******************************
OO-based DropdownDatePicker 
By: Glenn G. Vergara
glenngv@yahoo.com
Philippines

Please make this intact
if you want to use this script.
Thanks!
******************************/


function DropdownDatePicker(day, month, year, hasLeadingZero){
	var me = this;
	this.month = month;
	this.day = day;
	this.year = year;
	if (hasLeadingZero==null || typeof hasLeadingZero=="undefined") hasLeadingZero=false;
	this.hasLeadingZero = hasLeadingZero;
	this.setWeekend = false;
	
	this.populateDate = function(){
		var dSelYear = me.year.options[me.year.selectedIndex].value;
		var dSelMonth = me.month.options[me.month.selectedIndex].value;
		var timeA = new Date(dSelYear,dSelMonth,1); //get date of first day of next month
		var timeDifference = timeA - 86400000;//subtract 1 day
		var timeB = new Date(timeDifference);
		var daysInMonth = timeB.getDate();
		prevDaysInMonth = me.day.options.length;
		if (daysInMonth < prevDaysInMonth){	//current month's days < previous month's
			if (me.day.selectedIndex>=daysInMonth){
				me.day.selectedIndex = daysInMonth;	//select last day of the current month if previous month's selected day is > current month's
			}
			me.day.options.length = daysInMonth;
   		}
   		else if (daysInMonth > prevDaysInMonth){	//current month's days > previous month's
			var sDay;
			for (var i = prevDaysInMonth; i < (daysInMonth); i++) {
				sDay = ((i+1)<10 && me.hasLeadingZero)?"0"+(i+1):i+1;
				me.day.options[i] = new Option(sDay,sDay);
			}		
	    }
		if (me.setWeekend){
			me.setWeekendStyleOn(me.callbackOn);
		}
	}

	this.setDisplayMonths = function(mode, isUpperCase, arrMonth){
		switch (mode){
			case 1: //numeric months
				for (var i=0;i<12;i++){
					me.month.options[i] = new Option(((i+1)<10 && me.hasLeadingZero)?"0"+(i+1):i+1, i+1);
				}
				break;
			case 2: //full english month names
				var arrMonth = new Array("January","February","March","April","May","June","July","August","September","October","November","December");
				for (var i=0;i<arrMonth.length;i++){
					me.month.options[i] = new Option((isUpperCase)?arrMonth[i].toUpperCase():arrMonth[i],i+1);
				}
				break;
			case 3: //abbreviated english month names (first 3 letters)
				var arrMonth = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");
				for (var i=0;i<arrMonth.length;i++){
					me.month.options[i] = new Option((isUpperCase)?arrMonth[i].toUpperCase():arrMonth[i],i+1);
				}
				break;
			case 4: //customized month names
				if (arrMonth==null || typeof arrMonth=="undefined"){ //default is full english month names if arrMonth is invalid
					var arrMonth = new Array("January","February","March","April","May","June","July","August","September","October","November","December");				
				}
				for (var i=0;i<arrMonth.length;i++){
					me.month.options[i] = new Option((isUpperCase)?arrMonth[i].toUpperCase():arrMonth[i],i+1);
				}
				break;
			default: //numeric months
				for (var i=0;i<12;i++){
					me.month.options[i] = new Option(((i+1)<10 && me.hasLeadingZero)?"0"+(i+1):i+1, i+1);
				}
		}		
	}

	this.setDisplayYears = function(fromYear, toYear){
		me.year.length=0;
		for (var i=fromYear;i<=toYear;i++){
			me.year.options[i-fromYear] = new Option(i,i);
		}
	}

	//set default date
	this.setDefaultDate = function(defaultDate){
		if (defaultDate==null || typeof defaultDate=="undefined" || isNaN(defaultDate)){
			defaultDate = new Date();
		}
		me.month.options[defaultDate.getMonth()].selected = true;		//select default month
		me.day.options[defaultDate.getDate()-1].selected = true;		//select default day
		//select default year
		for (var i=0;i<me.year.options.length;i++){
			if (me.year.options[i].value==defaultDate.getFullYear()){
				me.year.selectedIndex = i;
				break;
			}
		}
	}

	//set day as title (title attribute in select and option tags is currently supported only by Gecko)
	//no problem with other browsers as this will be ignored by them
	this.displayDay = function(arrDay){
		if (arrDay==null || typeof arrDay=="undefined"){
			var arrDay = new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");
		}
		me.arrDay = arrDay;

		//set month select title
		me.month.onmouseover = function(){
			var selectedDate = new Date(me.year.options[me.year.selectedIndex].value, this.selectedIndex, me.day.options[me.day.selectedIndex].value);
			this.title = me.arrDay[selectedDate.getDay()];
		}
		//set month options title
		for (var i=0;i<me.month.options.length;i++){
			me.month.options[i].onmouseover = function(){
				var selectedDate = new Date(me.year.options[me.year.selectedIndex].value, this.value-1, me.day.options[me.day.selectedIndex].value);
				this.title = me.arrDay[selectedDate.getDay()];
			}
		}

		//set day select title
		me.day.onmouseover = function(){
			var selectedDate = new Date(me.year.options[me.year.selectedIndex].value, me.month.selectedIndex, this.options[this.selectedIndex].value);
			this.title = me.arrDay[selectedDate.getDay()];
		}
		//set day options title
		for (var i=0;i<me.day.options.length;i++){
			me.day.options[i].onmouseover = function(){
				var selectedDate = new Date(me.year.options[me.year.selectedIndex].value, me.month.selectedIndex, this.value);
				this.title = me.arrDay[selectedDate.getDay()];
			}
		}

		//set year select title
		me.year.onmouseover = function(){
			var selectedDate = new Date(me.year.options[me.year.selectedIndex].value, this.selectedIndex, me.day.options[me.day.selectedIndex].value);
			this.title = me.arrDay[selectedDate.getDay()];
		}
		//set year options title
		for (var i=0;i<me.year.options.length;i++){
			me.year.options[i].onmouseover = function(){
				var selectedDate = new Date(this.value, me.month.selectedIndex, me.day.options[me.day.selectedIndex].value);
				this.title = me.arrDay[selectedDate.getDay()];
			}

		}
	}

	this.setWeekendStyleOn = function(callbackFunc){
		me.callbackOn = callbackFunc;
		me.setWeekend = true;
		for (var i=0;i<me.day.options.length;i++){
			var date = new Date(me.year.options[me.year.selectedIndex].value, me.month.selectedIndex, i+1);
			var day = date.getDay();
			if (day==0 || day==6){
				me.callbackOn(me.day.options[i]);
			}
			else{
				me.callbackOff(me.day.options[i]);
			}

		}
	}

	this.setWeekendStyleOff = function(callbackFunc){
		me.callbackOff = callbackFunc;	
	}
		
	
	//set onchange handler
	var monthChange = this.month.onchange;
	if (monthChange){
		this.month.onchange = function(){
			me.populateDate();
			monthChange();
		}
	}
	else{
		this.month.onchange = this.populateDate;
	}
	var yearChange = this.year.onchange;
	if (yearChange){
		this.year.onchange = function(){
			me.populateDate();
			yearChange();
		}
	}
	else{
		this.year.onchange = this.populateDate;	
	}
	
}

//sample usage of datepicker
function initDatePicker(dayElement, monthElement, yearElement){
	//var f = document.forms[formname];
	var day = document.getElementById(dayElement);
	var month = document.getElementById(monthElement);
	var year = document.getElementById(yearElement);
	var datePicker1 = new DropdownDatePicker(day, month, year, true);
}

//callback functions for setting option style for weekend
//must have one argument that refers to the option object

function setStyleWeekend(objOpt){
	if (objOpt && objOpt.style){
		objOpt.style.backgroundColor = "silver";
	}
}

function resetStyleWeekend(objOpt){
	if (objOpt && objOpt.style){
		objOpt.style.backgroundColor = "white";
	}
}