/****************************************\
* Author: Fabio R. Panettieri            *
* Date: 13-07-2008                       *
* Email: frenzo.panettieri@concatel.com  *
* CVT Argentina                          *
* -------------------------------------- *
* Class used to draw Popups              * 
\****************************************/
/**
 * Generic popup
 *
 * Usage:
 * pop = new PopUp({[configuration]});
 *
 * @return:
 *     Popup instance
 * 
 * Parameters:
 * @type:
 *     String indicating the type of popup that must be constructed
 *     Ex.: type: "ListFilter"
 *
 * @modal:
 *     Boolean
 *     Indicates if other actions should be blocked
 *
 * @bg:
 *	   String ('transparent','light','dark')
 *	   Indicates the type of background that should be used
 *	   Notice, that this background is only displayed in modal popups
 * 
 * @width:
 *     String (px / %)
 *     Required width
 *     Default: 100px
 *     ex.: width: 100px / 40%
 *     
 * @height: 
 *     String (px / %)
 *     Required height
 *     Default: 100px
 *     ex.: height: 100px / 40%
 *
 * @top:
 *     String (px / %)
 *     Required top
 *     Default: 100px
 *     ex.: top: 100px / 40%
 *     
 * @left:
 *     String (px / %)
 *     Required left
 *     Default: 100px
 *     ex.: left: 100px / 40%
 *
 *
 * All other parameters are passed to the real popup implementation 
 * 
 */


function Popup(n){
	this.drawed = false;
	this.visible = false;
	this.configured = false;
	this.n = n;

	/* 
	 * Read configuration parameters
	 * Options must be passed as a single JSON object
	 */
	this.configure = function(options){
    
        /* set default parameters */
        if (typeof options == "undefined") {
            var opt = {};
        }
        else {
            opt = options;
        }
        
        // TODO: Remove this in production!
        if (typeof opt.type == "undefined") {
            //alert("ERROR!, a type must be expecified for the current popup");
            return false;
        }
        
        if (typeof opt.modal == "undefined") {
            opt.modal = false;
        }
        if (typeof opt.bg == "undefined") {
            opt.bg = 'light';
        }
        if (typeof opt.width == "undefined") {
            opt.width = '100px';
        }
		if (typeof opt.height == "undefined") {
            opt.height = '100px';
        }
		if(typeof opt.top == "undefined"){
            opt.top = "centered";
        }
            
		if(typeof opt.left == "undefined"){
            opt.left = "centered";
        }

    		this.type = opt.type.toLowerCase();
		this.modal = opt.modal;
		this.bg = opt.bg.toLowerCase();
		
		/* Create the real implementation and configure it */
		this.imp = PopupFactory.get(this.type);
		this.imp.configure(options);
        	this.imp.n = this.n;
		        
		/* Position and size */
		this.width = opt.width;
		this.height = opt.height;
		this.left = opt.left;
		this.top = opt.top;
		this.configured = true;
	}
	
	
	
		/* Create DOM element, and make the request for it's real contents */
		this.draw = function(){
			if($('.popup-container').size() == 0){
				$('body').append('<div class="popup-container"></div>');
			}
			
			if(this.drawed == false){
				str ='<div class="popup-window" n="' + this.n + '">';
	
				stylePatch = "";
	          
				if (this.modal){
					/* set background style */
					if(this.bg == 'transparent'){
						bgStyle = ' popup-window-transparent';
					}
				 	else if(this.bg == 'light'){
						bgStyle = ' popup-window-light';
				 	} 
				 	else if(this.bg == 'dark'){
						bgStyle = ' popup-window-dark';
				 	}
	                else{
	                    bgStyle = '';
	                }
	                str += '<div class="popup-background' + bgStyle + '" style="' + stylePatch + '"></div>';
				}
		            
		            
		            
		            /* Define popup position and size */            
				var style = "position:absolute; width:" + Common.completeSize(this.width) + "; height:" + Common.completeSize(this.height) + "; ";
				var horizontalCentered = "false";
		            if(this.left == "centered"){
					var horizontalCentered = "true";
		  	      //    style += "margin-left: -" + (this.width / 2) + "px; " left: " + Common.completeSize(left) + "; "; 
		            }
		            else{
		                style += "left: " + Common.completeSize(this.left) + "; "; 
		            }
		            
				var verticalCentered = "false";
		            if(this.top == "centered"){
					verticalCentered = "true";
		            //    style += "margin-top: -" + (this.height / 2) + "px; top: 50% ";
		            }
		            else{
		                style += "top: " + Common.completeSize(this.top) + "; "; 
		            }
		            style += stylePatch;
		
				str += '<div class="popup-body" style="' + style + '" hc="' + horizontalCentered  + '" vc="' + verticalCentered  +'" >' + this.imp.draw() + '</div>';
				str += '</div>';
	
				/* Create main container */			
				$('.popup-container').append(str);
		
	      		/* Set the new popup as active */
			      PopupManager.setActive(this);
	            
				/* Tell the implementation to load it's contents */
	            	this.imp.load();
	
				this.bindEvents();
	            
	            	this.drawed = true;
				Common.centerPopup();
			}
			else{
			  this.show();
			}
		}
    
    
    this.refresh = function(){
        try{
            this.imp.refresh();
        }
        catch(error){
            //TODO: ERROR HANDLING?
        }
    }

     
	this.bindEvents = function(){
		$(this.getSelector() + ' .popup-body').mouseover(function(){
				var n = $(this).parents('.popup-window').attr('n');
				PopupManager.setActive(PopupManager.get(n));
			}
		);
    
	}

    
    this.getSelector = function(){
        return '.popup-window[@n="' + this.n + '"]';
    }
	
	
	/* Show hidden Popup */
	this.show = function(){
		var obj = $(this.getSelector());
		if(obj.size() > 0){
			obj.show();
		}
        this.visible = true;
	}
  
	/* Hide visible Popup */
	this.hide = function(){
		var obj = $(this.getSelector());
		if(obj.size() > 0){
			obj.hide();
		}
        this.visible = false;
	}
	  
	/* Remove DOM element */
	this.close = function(){
		var obj = $(this.getSelector());
		if(obj.size() > 0){
			//obj.unbind();
			obj.remove();
		}
		if($('.popup-window').size() == 0){
			$('.popup-container').remove();
		}
        this.drawed = false;
        this.visible = false;
	}
}