﻿
//konstruktor
function DatePicker(dateFieldName, displayBelowThisObject, dtFormat, dtSep) {
	this.datePickerDivID = dateFieldName + "_datepicker";
	this.iFrameDivID = dateFieldName + "_datepickeriframe";
	this.selectedDate;
	this.selectedHour;
	this.selectedMinute;
	this.dateFieldName = dateFieldName;
	this.targetDateField = document.getElementById(dateFieldName);
	this.displayBelowThisObject = displayBelowThisObject;
	this.dateSeparator = DatePicker.defaultDateSeparator;
	this.dateFormat = DatePicker.defaultDateFormat;
	
	if (!this.displayBelowThisObject)
    	this.displayBelowThisObject = this.targetDateField;
		
	if (dtSep)
    	this.dateSeparator = dtSep;
		
   	if (dtFormat)
   		this.dateFormat = dtFormat;
	
	DatePicker.count++;
	this._id = DatePicker.count;
	DatePicker.instances[this._id] = this;
}

//håller reda på våra kalendrar, antal och instanser
DatePicker.count = 0;
DatePicker.instances = new Array();

//stänger alla kalendrar
DatePicker.closeAll = function() {
	if (DatePicker.count == 0)
		return;
	for (var i = 1;i<DatePicker.instances.length;i++) {
		DatePicker.instances[i].close();
	}
};

DatePicker.prototype = {
	dayArrayShort : new Array('Sö', 'Må', 'Ti', 'On', 'To', 'Fr', 'Lö'),
	dayArrayMed : new Array('Sön', 'Mån', 'Tis', 'Ons', 'Tor', 'Fre', 'Lör'),
	dayArrayLong : new Array('Söndag', 'Måndag', 'Tisdag', 'Onsdag', 'Torsdag', 'Fredag', 'Lördag'),
	monthArrayShort : new Array('Jan', 'Feb', 'Mar', 'Apr', 'Maj', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec'),
	monthArrayMed : new Array('Jan', 'Feb', 'Mar', 'Apr', 'Maj', 'Juni', 'Juli', 'Aug', 'Sept', 'Okt', 'Nov', 'Dec'),
	monthArrayLong : new Array('Januari', 'Februari', 'Mars', 'April', 'Maj', 'Juni', 'Juli', 'Augusti', 'September', 'Oktober', 'November', 'December'),
	defaultDateSeparator : "-", // common values would be "/" or "."
	defaultDateFormat : "mdy", // valid values are "mdy", "dmy", and "ymd"
	toggleDatePicker : function() {
		var x = this.displayBelowThisObject.offsetLeft;
  		var y = this.displayBelowThisObject.offsetTop + this.displayBelowThisObject.offsetHeight ;
		var parent = this.displayBelowThisObject;
		while (parent.offsetParent) {
			parent = parent.offsetParent;
			x += parent.offsetLeft;
			y += parent.offsetTop ;
		}
		this._drawDatePicker(x, y);
	},
	close : function() {
		
		var pickerDiv = document.getElementById(this.datePickerDivID);
		if (pickerDiv) {
			pickerDiv.style.visibility = "hidden";
			pickerDiv.style.display = "none";
		 
			this._adjustiFrame();
		}
	},
	_drawDatePicker : function(x, y) {
		var dt = this._getFieldDate(this.targetDateField.value);
		
		if (!document.getElementById(this.datePickerDivID)) {
			var newNode = document.createElement("div");
			newNode.setAttribute("id", this.datePickerDivID);
			newNode.setAttribute("class", "dpDiv");
			newNode.setAttribute("style", "visibility: hidden;");
			document.body.appendChild(newNode);
		}
		var pickerDiv = document.getElementById(this.datePickerDivID);
		pickerDiv.style.position = "absolute";
		pickerDiv.style.left = x + "px";
		pickerDiv.style.top = y + "px";
		pickerDiv.style.visibility = (pickerDiv.style.visibility == "visible" ? "hidden" : "visible");
		pickerDiv.style.display = (pickerDiv.style.display == "block" ? "none" : "block");
		pickerDiv.style.zIndex = 10000;
		
		//hämta valt datum
		this.selectedDate = new Date();
		if ((dt.getMonth() >= 0) && (dt.getFullYear() > 0)) {
			this.selectedDate = new Date(dt.getFullYear(), dt.getMonth(), dt.getDate());
		} else {
			this.selectedDate.setDate(1);
		}
		
	    var ar = this.targetDateField.value.split(",")[1].split(":");

	    this.selectedHour = ar[0];
	    this.selectedMinute = ar[1];
		this.refreshDatePicker( dt.getFullYear(), dt.getMonth(), dt.getDate());
	},
	_refreshDate : function(dt) {
		dt = this._getFieldDate(dt);
		this.selectedDate = new Date(dt.getFullYear(), dt.getMonth(), dt.getDate());
		this.refreshDatePicker(dt.getFullYear(), dt.getMonth(), dt.getDate());
	},
	refreshDatePicker : function(year, month, day) {
		var thisDay = new Date();
		if ((month >= 0) && (year > 0)) {
			thisDay = new Date(year, month, 1);
		} else {
			day = thisDay.getDate();
			thisDay.setDate(1);
		}
		
		  var crlf = "\r\n";
		  var TABLE = "<table cols=7 class='dpTable' cellspacing='0' cellpadding='0'>" + crlf;
		  var xTABLE = "</table>" + crlf;
		  var TR = "<tr class='dpTR'>";
		  var TR_title = "<tr class='dpTitleTR'>";
		  var TR_days = "<tr class='dpDayTR'>";
		  var TR_todaybutton = "<tr class='dpTodayButtonTR'>";
		  var xTR = "</tr>" + crlf;
		  var TD = "<td class='dpTD' onMouseOut='this.className=\"dpTD\";' onmouseover=' this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
		  var TD_empty = "<td>";
		  var TD_title = "<td colspan=5 class='dpTitleTD'>";
		  var TD_buttons = "<td class='dpButtonTD'>";
		  var TD_todaybutton = "<td colspan=7 class='dpTodayButtonTD'>";
		  var TD_days = "<td class='dpDayTD'>";
		  var TD_selected = "<td class='dpDayHighlightTD' onmouseout='this.className=\"dpDayHighlightTD\";' onmouseover='this.className=\"dpTDHover\";' ";    // leave this tag open, because we'll be adding an onClick event
		  var xTD = "</td>" + crlf;
		  var DIV_title = "<div class='dpTitleText'>";
		  var DIV_selected = "<div class='dpDayHighlight'>";
		  var xDIV = "</div>";
		  var SELECT_hours = "<select class='dpSelect' onchange='DatePicker.instances[" + this._id +"].selectedHour = this.options[this.selectedIndex].value;'>";
		  var SELECT_minutes = "<select class='dpSelect' onchange='DatePicker.instances[" + this._id +"].selectedMinute = this.options[this.selectedIndex].value;'>";
		  var xSELECT = "</select>";
		 
		  var html = TABLE;
		  
		  html += TR_title;
		  html += TD_buttons + this._getButtonCode(thisDay, -1, "previous"," ") + xTD;
		  html += TD_title + DIV_title + this.monthArrayLong[thisDay.getMonth()] + " " + thisDay.getFullYear() + xDIV + xTD;
		  html += TD_buttons + this._getButtonCode(thisDay, 1, "next"," ") + xTD;
		  html += xTR;
		  
		  html += TR_days;
		  for(i = 0; i < this.dayArrayShort.length; i++)
			html += TD_days + this.dayArrayShort[i] + xTD;
		  html += xTR;
		 
		  html += TR;

		var lastMonth = thisDay.getMonth()-1;
		var lastYear = (lastMonth > thisDay.getMonth()) ? thisDay.getYear()-1 : thisDay.getYear();
		var daysInMonth = this._daysInMonth(lastMonth,lastYear)
        //alert(daysInMonth)
		for (i = 0,j = daysInMonth-thisDay.getDay()+1; i < thisDay.getDay(); i++,j++)
    		html += "<td class='dpTDDisabled'>" + j + xTD;
		
		var dayNum;
		do {
			dayNum = thisDay.getDate();
			TD_onclick = " onclick='DatePicker.instances[" + this._id +"]._refreshDate(\"" +  this._getDateString(thisDay) + "\");'>";

			if (this.selectedDate.getMonth() == month && dayNum == day)
			  html += TD_selected + DIV_selected + dayNum + xDIV + xTD;
			else
			  html += TD + TD_onclick + dayNum + xTD;
			
			if (thisDay.getDay() == 6)
			  html += xTR + TR;
			
			thisDay.setDate(thisDay.getDate() + 1);
		} while (thisDay.getDate() > 1)
		
		if (thisDay.getDay() > 0) { 
		    var days = 7-thisDay.getDay();
			for (i = 1; i <= days; i++)
				html += "<td class='dpTDDisabled'>" + i + xTD;
		}
		html += xTR;
		var today = new Date();
  		var todayString = "Idag är " + this.dayArrayMed[today.getDay()] + ", " + this.monthArrayMed[today.getMonth()] + " " + today.getDate();
		
		html += "<tr class='dpTimeTR'><td class='dpTimeTD' colspan='7'>";
		html += "<strong>Klockslag:&nbsp;</strong>";
		html +=  SELECT_hours + this.getOptionTags(0,23,this.selectedHour) + xSELECT + "&nbsp;" + SELECT_minutes + this.getOptionTags(0,59,this.selectedMinute) + xSELECT;
		html += xTD + xTR; 
		html += "<tr><td align=\"right\" colspan=7>";
		html += "<button class='closeButton' onclick='DatePicker.instances[" + this._id +"]._updateDateField();'>Spara</button>&nbsp;<button class='closeButton' onclick='DatePicker.instances[" + this._id +"].toggleDatePicker();'>Avbryt</button>";
		html += xTD + xTR;
		
		 
		html += xTABLE;
		 
		document.getElementById(this.datePickerDivID).innerHTML = html;
		
		this._adjustiFrame();
	},
	getOptionTags : function(start,length,sel) {
		var _html = "";
		for (start;start <= length;start++) {
			var tid = this.formatDate(start);
			_html += "<option value='" + tid + "'" + ((start == sel)?" selected='selected'":"") +">" + tid +"</option>\r\n";
		}
		return _html;
	},
	_getButtonCode : function(dateVal, adjust, label,svlabel)
	{
	  var newMonth = (dateVal.getMonth () + adjust) % 12;
	  var newYear = dateVal.getFullYear() + parseInt((dateVal.getMonth() + adjust) / 12);
	  if (newMonth < 0) {
		newMonth += 12;
		newYear += -1;
	  }
	 
	  return "<button class='dpButton_" + label+ "' onclick='DatePicker.instances[" + this._id +"].refreshDatePicker(\""+ newYear + "\", \"" + newMonth + "\", \"" + this.selectedDate.getDate() +"\");'><span class='hidden'>" + ((svlabel)?svlabel:label) + "</span></button>";
	},
	_daysInMonth : function(iMonth, iYear)
    {
	    return 32 - new Date(iYear, iMonth, 32).getDate();
    },
	_getDateString : function(dateVal)
	{
	  var dayString = "00" + dateVal.getDate();
	  var monthString =  this.formatDate(dateVal.getMonth() + 1);
	  //var monthString = monthArrayShort[dateVal.getMonth()];
	  //var monthString = "00" + monthArrayShort[(dateVal.getMonth()+1)];
	  dayString = dayString.substring(dayString.length - 2);
	  //monthString = monthString.substring(monthString.length - 2);
	 
	  switch (this.dateFormat) {
		case "dmy" :
		  return dayString + this.dateSeparator + monthString + this.dateSeparator + dateVal.getFullYear();
		case "ymd" :
		  return dateVal.getFullYear() + this.dateSeparator + monthString + this.dateSeparator + dayString;
		case "mdy" :
		default :
		  return monthString + this.dateSeparator + dayString + this.dateSeparator + dateVal.getFullYear();
	  }
	},
	_getFieldDate : function(dateString){
		var dateVal;
		var dArray;
		var d, m, y;
		 
		try {
			dArray = this.splitDateString(dateString);
			if (dArray) {
			  switch (this.dateFormat) {
				case "dmy" :
				  d = parseInt(dArray[0], 10);
				  m = parseInt(dArray[1], 10) - 1;
				  y = parseInt(dArray[2], 10);
				  break;
				case "ymd" :
				  d = parseInt(dArray[2], 10);
				  m = parseInt(dArray[1], 10) - 1;
				  y = parseInt(dArray[0], 10);
				  break;
				case "mdy" :
				default :
				  d = parseInt(dArray[1], 10);
				  m = parseInt(dArray[0], 10) - 1;
				  y = parseInt(dArray[2], 10);
				  break;
			  }
			  dateVal = new Date(y, m, d);
			} else if (dateString) {
			  dateVal = new Date(dateString);
			} else {
			  dateVal = new Date();
			}
		} catch(e) {
			dateVal = new Date();
		}
		 
		return dateVal;
	},
	splitDateString : function(dateString) {
		var dArray;
	  	if (dateString.indexOf("/") >= 0)
			dArray = dateString.split("/");
		else if (dateString.indexOf(".") >= 0)
			dArray = dateString.split(".");
		else if (dateString.indexOf("-") >= 0)
			dArray = dateString.split("-");
		else if (dateString.indexOf("\\") >= 0)
			dArray = dateString.split("\\");
		else
			dArray = false;
	 
	  	return dArray;
	},
	_updateDateField : function(dateString) {
		var _targetDateField = document.getElementsByName(this.targetDateField.name).item(0);
		
		
	  if (this.selectedHour.length > 2)
		this.selectedHour = this.selectedHour.substr(this.selectedHour.length-2);
		
	  if (dateString) {
		_targetDateField.value = dateString + ", " + this.selectedHour + ":" + this.selectedMinute;
	  }
	  else {
		_targetDateField.value = this._getDateString(this.selectedDate) + ", " + this.selectedHour + ":" + this.selectedMinute;
	  }
	 
	
	  var pickerDiv = document.getElementById(this.datePickerDivID);
	  pickerDiv.style.visibility = "hidden";
	  pickerDiv.style.display = "none";
	 
	  this._adjustiFrame();
	  //targetDateField.focus();
	
	  //if ((dateString) && (typeof(datePickerClosed) == "function"))
		//datePickerClosed(targetDateField);
	},
	_adjustiFrame : function(){
		var is_opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
		var pickerDiv,iFrameDiv;
	  	if (is_opera)
			return;
	
	  	try {
			if (!document.getElementById(this.iFrameDivID)) {
			  var newNode = document.createElement("iFrame");
			  newNode.setAttribute("id", this.iFrameDivID);
			  newNode.setAttribute("src", "javascript:false;");
			  newNode.setAttribute("scrolling", "no");
			  newNode.setAttribute ("frameborder", "0");
			  document.body.appendChild(newNode);
			}
		
			if (!pickerDiv)
		  		pickerDiv = document.getElementById(this.datePickerDivID);
			if (!iFrameDiv)
		  		iFrameDiv = document.getElementById(this.iFrameDivID);
		
			try {
		  		iFrameDiv.style.position = "absolute";
		  		iFrameDiv.style.width = pickerDiv.offsetWidth;
		  		iFrameDiv.style.height = pickerDiv.offsetHeight ;
		  		iFrameDiv.style.top = pickerDiv.style.top;
		  		iFrameDiv.style.left = pickerDiv.style.left;
		  		iFrameDiv.style.zIndex = pickerDiv.style.zIndex - 1;
		  		iFrameDiv.style.visibility = pickerDiv.style.visibility ;
		  		iFrameDiv.style.display = pickerDiv.style.display;
			} catch(e) { }
	  	} catch (ee) { }
	},
	formatDate : function(date) {
		if (date < 10)
			return "0" + date;
		else
			return date;
	}

};
