/*******************************************************************************
*
* DateSelector version 0.2
*
* @Author: Martin Oom, Eniac Data AB
*
* changelog:
* ==============================================================================
* 0.2: changed javascript framework from MochiKit to ExtJSCore
* 0.1: initial release 
*
*******************************************************************************/

Ext.ns('Ext.eniac');

Ext.eniac.DateSelector = Ext.extend(Ext.util.Observable, {
/*******************************************************************************
* private declarations
*******************************************************************************/	
	ownerElement: null,
	baseURL: null,
	button: null,
	calendarElement: null,
	calendar: null,
	ingnoreBodyClick: false,
	
	createDropDownButton: function() {
		var def = {
			tag: 'input',
			cls: 'DateSelector_Button',
			type: 'button',
			value: ' '
		};
		this.button = Ext.DomHelper.insertAfter(this.ownerElement,def,true);
		this.button.on('click',this.onButtonClick,this);		
	},
	
	createDropDownCalendar: function() {
		this.calendarElement = Ext.DomHelper.append(Ext.getBody(),{tag: 'div', cls: 'DateSelector_Calendar'},true);
		this.calendarElement.on('click',function(oEvent) {
			oEvent.stopEvent();
		},this);
		
		Ext.get(this.calendarElement).setVisible(false);
		Ext.get(this.calendarElement).setPositioning({position: 'absolute', "z-index": 10000});
		this.calendar = new Ext.eniac.Calendar(this.calendarElement, this.baseURL);
		this.calendar.on('selectDate',this.doOnSelectDateEvent,this);
	},
	
	onButtonClick: function() {
		if (this.calendarElement.isVisible())
			this.doCloseUp(false);
		else
			this.doDropDown();			
	},
	
	onBodyClick: function() {
		if (this.ingnoreBodyClick)
			this.ingnoreBodyClick = false;
		else		
			this.doCloseUp(false);
	},
	
	updateCalendarPosition: function() {
		// returns: array[x,y]
		var pos = Ext.get(this.button).getXY();
		pos[0] += Ext.get(this.button).getWidth();
		pos[0] -= Ext.get(this.calendarElement).getWidth();		
		pos[1] += Ext.get(this.button).getHeight();
		Ext.get(this.calendarElement).setXY(pos);
	},
	
	doDropDown: function() {
		this.updateCalendarPosition();
		this.calendar.setSelectedDate(Ext.getDom(this.ownerElement).value);
		this.calendar.setDisplayDate(Ext.getDom(this.ownerElement).value);
		this.calendar.update();
		Ext.get(this.calendarElement).show(true);		
		this.calendarElement.focus();
		//Ext.getBody().on('click',this.onBodyClick,this);
		Ext.get(document).on('click',this.onBodyClick,this);
		this.ingnoreBodyClick = true;
	},
	
	doCloseUp: function(DoApply) {
		//Ext.getBody().un('click',this.onBodyClick,this);
		Ext.get(document).un('click',this.onBodyClick,this);
		if (DoApply) 
			Ext.getDom(this.ownerElement).value = this.calendar.getSelectedDate();
		this.calendarElement.hide(false);
	},
	
	doOnSelectDateEvent: function() {
		this.doCloseUp(true);
	},

/*******************************************************************************
* public declarations
*******************************************************************************/	
	constructor: function(AOwnerElement, ABaseURL, AConfig) {
		AConfig = AConfig || {};
		Ext.apply(this, AConfig);
		Ext.eniac.DateSelector.superclass.constructor.call(this, AConfig);
		
		this.ownerElement = Ext.get(AOwnerElement);
		this.baseURL = ABaseURL;
		
		// create the dropdown button
		this.createDropDownButton();

		// create the dropdown calendar
		this.createDropDownCalendar();	
	}
});