//this is a global variable to have only one instance of the calendar
	var calendar = null;
	
	//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.3});
	   },
	
	   isOpen: function()
	   { 
	   return ( $(this.options.wrapper) || this.element).visible();
	   }
	 });
    
    //@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', 
                closebutton: '<img src=\"IMG/close.jpg\">', 
                wrapper: container
            }); 
        }
        else
        {
            calendar.updateelement = $(input);
        }

        var date = new Date($F(input));
        
        if(document.getElementById(input).value == '') 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() - 175, offsetTop: 25 });
        }
        
        //finally show the calendar =)
        calendar.openCalendar();
    };