/**
 * Apex Framework
 * 
 * @revised $LastChangedDate: 2008-12-13 01:52:06 +0800 (Sat, 13 Dec 2008) $
 * @version $Id: ScrollingPanel.js 8 2008-12-12 17:52:06Z eugim $
 */
 
ApexScrollingPanel = Class.create({
	
	id : ''
	
   ,targetElId : ''
   
   ,_el : null
   
   ,_targetEl : null
   
   ,leftOffset : -55 
   
   ,topOffset : 80
   
   ,maxTop : false //beyond this, do not scroll vertically 
   
   ,minTop : false //beyond this, adjust the panel according to the topOffset
   
   ,initialize : function(config){
		
		Object.extend(this, config);
		this._init();	
	}
	
   ,_init : function(){
   		
		this._targetEl = $(this.targetElId);
		this._el = $(this.id);
	
		Element.clonePosition(this._el, this._targetEl, true, true, false, false);
		this._el.show();
		
		var dim = this._el.firstDescendant().getDimensions();
		var vpOffset = this._targetEl.viewportOffset();
		
		this.maxTop = (this.maxTop === false) ? vpOffset.top : this.maxTop;
		this.minTop = (this.minTop === false) ? dim.height/2 : this.minTop;
		
		this._el.setStyle({
			height : dim.height + 'px'
		   ,width  : dim.width + 'px'
		   ,left   : (vpOffset.left + this.leftOffset) + 'px' 	   
		});
		
		Event.observe(window, 'scroll', this._handleWindowScroll.bindAsEventListener(this));
	}
	
    ,_handleWindowScroll : function(event){
		
		/** has issues with opera: viewport is not correct, and viewportoffset of element is not adjusted upon scrolling*/
		var viewport = Object.extend(document.viewport.getDimensions(), document.viewport.getScrollOffsets()), 
			elViewPortOffset = this._el.viewportOffset(),
			top = false;
			
		if(viewport.top < this.maxTop){
			top = this.maxTop + 'px';
		}
		else if( elViewPortOffset.top <= -this.minTop ){//for downward movement	
			top = (viewport.top + this.topOffset) + 'px';
		}
		else if( elViewPortOffset.top >= this.minTop ){//for upward movement
			top = (viewport.top + 20) + 'px';
		}
		
		if( false === top ){
			return;
		}
		
		this._el.setStyle({
			top : top
		});	
	}
});