/**
 * @param Id of DOM node for creating of the widget
 * @param Id of DOM node for an input field to display the date in dd mmmm, yyyy format or null
 * e.g. createDatePicker("myDivId") or createDatePicker("myDivId", null) 
 * or createDatePicker("myDivId", "myInputId");
 * */
function createDatePicker(nodeId, inputForDisplay, isShowPast, availablityFor, onSelectCallBack){
	
	if (availablityFor){
		availablityFor = dateFormat(availablityFor, 'dd mmmm, yyyy');
	}else{
		availablityFor = new Date();
	}
	
	var id = '#'+ nodeId;
	var datePicker = $(id).datepicker({
		onSelect: function(dateText, inst) {
			if (inputForDisplay != null){
				$('#'+inputForDisplay).val(dateText);
			}
			if (onSelectCallBack != null){
				onSelectCallBack(dateText);
			}
		 },
		altFormat: 'dd MM, yy',
		dateFormat: 'dd MM, yy'
	});
	
	$(id).datepicker("option", "autoSize", true);
	$(id).datepicker("setDate" , availablityFor);
	
	if (isShowPast != true){
		//FIXME: date from the server
		$(id).datepicker("option", "minDate", new Date());
	}
	if (inputForDisplay != null){
		var fullDate = $(id).datepicker("getDate");
		$('#'+inputForDisplay).val(fullDate.format('dd mmmm, yyyy'));
	}
	return datePicker;
}

function createInlineDatePicker(nodeId, date, isShowPast, onSelectCallBack){
	var id = '#'+ nodeId;
	var picker = $(id).datepicker({
		onSelect: function(dateText, inst) {
			onSelectCallBack(dateText);
		},
		altFormat: 'dd MM, yy',
		dateFormat: 'dd MM, yy'
	});
	if (isShowPast != true){
		$(id).datepicker("option", "minDate", new Date());
	}
	date = dateFormat(date, 'dd mmmm, yyyy');
	$(id).datepicker("setDate" , date);
	return picker;
}


/**
 * Creates accordion widget
 * @param node id
 * */
function createAccordion(nodeId){
	$("#"+nodeId).accordion({
			autoHeight: false
	});
}


/**
 * Creates a pop up widget
 * @param node id
 * @param title text
 * @param width int
 * */
function createPopupDialog(nodeId, title, w, h){
	var dialog = $('#'+nodeId).dialog({ 
					autoOpen: false, 
					title: title, 
					width: w,
					resizable: false,
//					show: "fade",
					hide: "fade",
					height: h
				});
	return dialog;
}

function createModalPopupDialog(nodeId, title, w, h){
	var dialog = $('#'+nodeId).dialog({ 
					autoOpen: false, 
					title: title, 
					width: w,
					resizable: false,
//					show: "fade",
					hide: "fade",
					modal: true,
					height: h
				});
	return dialog;
}


function createFieldDatePicker(nodeId, availablityFor, onSelectCallBack){
	var id = "#"+nodeId;
		$(id).datepicker({
			onSelect: function(dateText, inst) {
			onSelectCallBack(dateText);
			},
			altFormat: 'dd MM, yy',
			dateFormat: 'dd MM, yy',
			showOn: "both",
			buttonImage: "/media/images/calendar.gif",
			buttonImageOnly: true
		});
	$(id).datepicker("option", "minDate", new Date());
	$(id).datepicker("setDate" , availablityFor);
}