Ext.namespace('Ext.ux');



Ext.ux.Flexpop = (function(){
	
	var popupEl 	= {},
		els			= {},
		initialized = false;
	
	
	return {
		
		divId	: 'hidden_info',
		targetId: 'index_ct_right_bt',
		closeBtn: 'close_btn',
		
		init: function(){
			
			 if(!initialized) {
               	this.getPopEl();
				this.initOverlay();
				this.initEvent();
				
                initialized = true;
            }
		
		},
		
		getPopEl  : function(){
			
			popupEl = Ext.get(this.divId);
			return popupEl;	
		
		},
		
		initEvent : function(){
			
			Ext.fly(this.targetId).on('click', this.open, this);
			els.overlay.on('click', this.close, this);
			Ext.fly(this.closeBtn).on('click', this.close, this);
					
		},
		
		initOverlay : function(){
			
			els.overlay = Ext.DomHelper.append(document.body, {
                id: 'ux-flexpop-overlay'
            }, true);
			
			els.overlay.hide();
			
		},
		
		centerPopUp : function(){
			
			var bodyWidth 	= Ext.getBody().getWidth();
			var bodyHeight 	= document.documentElement.clientHeight;
			var popupWidth	= popupEl.getWidth();
			var popupHeight	= popupEl.getHeight();
			
			popupEl.setTop((bodyHeight/2)-(popupHeight/2));
			popupEl.setLeft((bodyWidth/2)-(popupWidth/2));

		},
		
		open : function(){
			
			this.centerPopUp();
			var elementSize = this.getViewSize();

			popupEl.slideIn('t', 
				{
					duration	: .5, 
					endOpacity	: 1,
					scope		: this
				}
			);
			
			els.overlay.setStyle({
				'width'		: Ext.getBody().getWidth()+'px',
				'height'	: elementSize[1]+'px'
			});
	
			els.overlay.show();
			
			els.overlay.fadeIn({
				endOpacity	: .75,
				easing		: 'easeOut',
				duration	: .5,
				remove		: false,
				scope		: this
			});
		},
		
		close : function(){
			
			popupEl.ghost('t', { duration: .5 });	
			els.overlay.hide();
		
		},
		
		getViewSize: function() {
            return [Ext.lib.Dom.getViewWidth(true), Ext.lib.Dom.getViewHeight(true)];
        }
	}
	
})();

Ext.onReady(Ext.ux.Flexpop.init, Ext.ux.Flexpop);