//Extend the scal library to add draggable calendar support.
//This script block can be added to the scal.js file.
Object.extend(scal.prototype,
{
	toggleCalendar: function()
	{
		var element = $(this.options.wrapper) || this.element;
		this.options[element.visible() ? 'onclose' : 'onopen'](element);
		this.options[element.visible() ? 'closeeffect' : 'openeffect'](element, {duration: 0.5});
	},

	isOpen: function()
	{ 
		return ( $(this.options.wrapper) || this.element).visible();
	}
});

//this is a global variable to have only one instance of the calendar
var calendar = null;

//@element   => is the <div> where the calender will be rendered by Scal.
//@input     => is the <input> where the date will be updated.
//@container => is the <div> for dragging.
//@source    => is the img/button which raises up the calender, the script will locate the calenar over this control.
function showCalendar(element, input, container, source)            
{
	if (!calendar)
	{
		container = $(container);
		//the Draggable handle is hard coded to "rtop" to avoid other parameter.
		new Draggable(container, {handle: "rtop", starteffect: Prototype.emptyFunction, endeffect: Prototype.emptyFunction});
		
		//The singleton calendar is created.
		calendar = new scal(element, $(input), 
		{
			updateformat: 'dd/mm/yyyy', 
			titleformat: 'mmmm yyyy',
			closebutton: '&nbsp;', 
			weekdaystart: 1,
			wrapper: container
		}); 
	}
	else
	{
		calendar.updateelement = $(input);
	}
	
	var tab = $F(input).split('/');
	var date_en = tab[1] + '/' + tab[0] + '/' + tab[2];

	var date = new Date(date_en);

	calendar.setCurrentDate(isNaN(date) ? new Date() : date);
	
	//Locates the calendar over the calling control  (in this example the "img").
	if (source = $(source))
	{
		Position.clone($(source), container, {setWidth: false, setHeight: false, offsetLeft: source.getWidth() + 2});
	}
	
	//finally show the calendar =)
	calendar.openCalendar();
};