/** 
 * @description		@namespace UI.Browser
 * @author			Amit Sharma  - amit_sharma2@symantec.com or http://www.symantec.com
 * @date			11/05/09
 * @release			1.0 
 * @functionality	Modal window for Iframe,Ajax,Scrolling Ajax, Page, Form
**/

var UI = UI || parent.UI || {};

UI.ModalDialog = Class.create();
UI.ModalDialog.prototype = {
 
  close : function() {
    this.onUnload();
    //this.onClosed();
    Element.remove(this);
  },
  
  displayIframe : function(options) {
    this.resize(options.dimensions);
    this.renderMode   = options.contentSource;
    this.originalSize = options.dimensions; 

  },
  
  display : function(options) {
    document.body.appendChild(this);
    this.resize(options.dimensions);

    this.renderMode   = options.contentSource;
    this.originalSize = options.dimensions;
  },
  
  resize : function(dims) {
    var contentDims = { };
    contentDims.width  = ( parseInt(dims.width)  ? dims.width  + 'px'  : '400px' );
    contentDims.height = ( parseInt(dims.height) ? dims.height + 'px'  : 'auto'  );
    var content = Element.getElementsByClassName(this, 'modal_content')[0];   
    
    Element.setStyle(content, contentDims);
    this.setContainerSize(dims);
  },
  
  setContainerSize : function(dimensions) {
    var position = ( UI.Browser.IE6 ? 'absolute' : 'fixed' );
    var height = ( typeof dimensions.height == 'string' ? 'auto' : (dimensions.height + 41) + 'px' );

    Element.setStyle( this, {
      'width'    : ( dimensions.width + 18 ) + 'px',
      'height'   : height,
      'display'  : 'block',
      'position' : position
    });
    
    this.recenter();
    Element.setStyle( this, {
      'visibility' : 'visible'
    });
        
    if( UI.Browser.IE6 ) {
      window.onscroll = this.redisplay.bind(this);
      window.onresize = this.redisplay.bind(this);
    }
  },
  
  predisplay : function() {
    this.style.top  = ((document.documentElement.clientHeight/2) + document.documentElement.scrollTop);
    this.style.left = document.documentElement.clientWidth/2;
    this.style.position = 'absolute';
  },
  
  redisplay : function() {
    UI.Modal.background.style.height = document.body.clientHeight;
    UI.Modal.background.style.width  = document.documentElement.clientWidth;
    
    if( !UI.Browser.IE6 ) return;
    
    if(!this.timeOut) {
      this.predisplay();
    }
    
   clearTimeout(this.timeOut);
    this.timeOut = setTimeout( function() {
      var height = ((document.documentElement.clientHeight/2) + document.documentElement.scrollTop);
      this.style.position = 'absolute';
      new Effect.Move(this, { x: document.documentElement.clientWidth/2, y : height, mode: 'absolute', duration: 0.1});
    }.bind(this), 10);
  },
  
  setTitle : function(newTitle) {
    this.getElementsByTagName('h3')[0].innerHTML = newTitle;
  },
  
  recenter : function() {
    var dimensions = Element.getDimensions(this)
	var getHeight=dimensions.height/-2
	getHeight=getHeight-23;
	Element.setStyle( this, {
      'marginTop'  : getHeight + 'px',
      'marginLeft' : dimensions.width/-2 + 'px',
      'top' : '50%', 'left' : '50%'
    });  

    if( UI.Browser.IE6 ) 
		setTimeout(this.redisplay.bind(this), 10);
  },
  
  onUnload : function() {
    // if the contents were copied from off the page, copy them back.
    if(this.contentSourceElement) {
      target = this.getElementsByClassName('modal_content')[0];
      $A(target.childNodes).each(function(e) { this.contentSourceElement.appendChild(e); }.bind(this));
    }
  }
}

// Global Modal Controller
UI.Modal = parent.UI.Modal || {

  activeDialog : null,
  cache : { },
  background : Builder.node('div', { 'class' : 'modalbg' }),
  defaultDimensions : { width : 400, height: 'auto' },
   
  resize: function(dimensions) {
    if(this.activeDialog)
      this.activeDialog.resize( Object.extend( UI.Modal.defaultDimensions, dimensions ) );
  },
  
  close: function(options){
    if(this.activeDialog) {
      this.activeDialog.close(options);
      this.activeDialog = null;
    }
    Element.setStyle(UI.Modal.background, { 'display' : 'none' });
  },
  
  setTitle : function(title) {
    if(UI.Modal.activeDialog)
      UI.Modal.activeDialog.setTitle(title);
  },
  
  recenter : function() {
    if(UI.Modal.activeDialog)
      UI.Modal.activeDialog.recenter();
  },
  
  showBackground : function() {
    if(UI.Modal.background.parentNode != document.body) {
    
      if(UI.Browser.IE6) {
        var iframe = Builder.node( 'iframe', { src : 'javascript:false', className : 'iefix' });
        UI.Modal.background.appendChild( iframe );
      }
      
      document.body.appendChild(UI.Modal.background);
      
    }
    
    if(!document.evaluate) {
      UI.Modal.background.style.height = document.body.clientHeight;
      UI.Modal.background.style.width  = document.documentElement.clientWidth;
    }
    
    Element.setStyle(UI.Modal.background, { 'display' : 'block' });
    Element.setOpacity(UI.Modal.background, 0.8);
   
  },
  
  open: function(url, title, displayOptions, requestOptions){

    displayOptions = Object.extend({
      renderAs      : 'div', // deprecated
      contentSource : 'ajax',
      expireCache   : true,
      dimensions    : UI.Modal.defaultDimensions,
      showCloseIcon : true,
      onClosed      : Prototype.emptyFunction
    }, displayOptions);

//    title = title || 'No Title';
    title = title || '';	

    // deprecated: displayOptions.renderAs 
    if(displayOptions.renderAs == 'iframe') {
      displayOptions.contentSource = displayOptions.renderAs;
    } else if(displayOptions.renderAs == 'div' && !displayOptions.contentSource) {
      displayOptions.contentSource = 'ajax';
    }
        
    requestOptions = Object.extend({
      evalScripts : true,
      parameters : '',
      method : 'get'
    }, requestOptions);
    
    // if there reusing a dialog, ignore some options
    if( this.activeDialog ){
      displayOptions.contentSource = this.activeDialog.renderMode;
      displayOptions.dimensions = this.activeDialog.originalSize;
    }
    this[('open-'+displayOptions.contentSource.toLowerCase()).camelize()](url, title, displayOptions, requestOptions);
    
  },
  
  // open a modal with content defined on the page.
  openPage : function(element, title, displayOptions, requestOptions) {

    var target;
    var modal = this.activeDialog;
    var w = displayOptions.dimensions.width;

    element = $(element);
    
    
    if( !modal ) {
      modal = Builder.node( 'div', { className : 'modal' } );
      modal.appendChild( Builder.node( 'div', { className : 'modal_title' } ));
      modal.firstChild.innerHTML = '<h3>' + title + '</h3>';
      modal.firstChild.innerHTML += ( displayOptions.showCloseIcon ? '<a href="javascript:UI.Modal.close()"></a>' : '' );
      target = Builder.node( 'div', { className : 'modal_content' } );
      modal.appendChild(target);
      Object.extend( modal, UI.ModalDialog.prototype );
      modal.contentSourceElement = element;
      modal.onClosed = displayOptions.onClosed;
      this.activeDialog = modal;
    } else {
      modal.onUnload();
      target = modal.getElementsByClassName('modal_content')[0];
    }
    this.showBackground();
    
      if(UI.Browser.Safari && window.frames.safariFrame){
		try{			
			if(element !=null && element.id == "map_cat"){
				 $A(element.childNodes).each( function(e) {target.appendChild(e);});
			}else{
			target.innerHTML=window.frames.safariFrame.advanced_search_categories.innerHTML;
			}
		}catch(ex){
		//	alert(" Advance Search Safari Model " +ex.message);	
		}
	 }else{
		 $A(element.childNodes).each( function(e) {target.appendChild(e);});
	}
    
    
    modal.display(displayOptions);
  },
  
  openAjax: function(url, title, displayOptions, requestOptions) {
    var target;
    var modal = this.activeDialog;
    var w = displayOptions.dimensions.width;
    
    if( !modal ) {
      modal = Builder.node( 'div', { className : 'modal' } );
      modal.appendChild( Builder.node( 'div', { className : 'modal_title' } ));
      modal.firstChild.innerHTML = '<h3>' + title + '</h3>';
      modal.firstChild.innerHTML += ( displayOptions.showCloseIcon ? '<a href="javascript:UI.Modal.close()"></a>' : '' );
      target = Builder.node( 'div', { className : 'modal_content' } );
      modal.appendChild(target);
      Object.extend( modal, UI.ModalDialog.prototype );
      modal.onClosed = displayOptions.onClosed;      
      this.activeDialog = modal;
    } else {
      target = modal.getElementsByClassName('modal_content')[0];
    }
    this.showBackground();
    this.ajax = new Ajax.Updater(target, url, {
      onComplete : function(ajax) { modal.display(displayOptions); }
    });
  },
  
  openIframe: function(url, title, displayOptions, requestOptions) {
    var target;
    var postForm;
    var fullUrl;    
    var modal = this.activeDialog;

	var closeText=displayOptions.dimensions.closetext||""

    if( typeof requestOptions.parameters == 'object' )
      requestOptions.parameters = $H(requestOptions.parameters);    
    
    // Build modal dialog skin
    if( !modal ){
	//	alert("modal");

      modal = Builder.node( 'div', { className : 'modal' } );
   
	  var topDiv = Builder.node('div', { className: 'gSnavTopGreyWdgt' },[
			  Builder.node('div',{className:'gs1GreyWdgt'}),
			  Builder.node('div',{className:'gs2GreyWdgt'}),
			  Builder.node('div',{className:'gs3GreyWdgt'}),
 			  Builder.node('div',{className:'gs4GreyWdgt'}),]);




	 var topDivInner = Builder.node('div', {className: 'mainBdyWrapTxtGreyWdgt'},[
	 Builder.node('div', { className: 'gSnavTop' },[
			  Builder.node('div',{className:'gs1'}),
			  Builder.node('div',{className:'gs2'}),
			  Builder.node('div',{className:'gs3'}),
 			  Builder.node('div',{className:'gs4'}),]),]);
	
	topDiv.appendChild(topDivInner)
	
	var bottomDiv = Builder.node('div', { className: 'gSnavBtmGreyWdgt' },[
			  Builder.node('div',{className:'gs4GreyWdgt'}),
			  Builder.node('div',{className:'gs3GreyWdgt'}),
			  Builder.node('div',{className:'gs2GreyWdgt'}),
 			  Builder.node('div',{className:'gs1GreyWdgt'}),]);


	 var bottomDivInner = Builder.node('div', {className: 'mainBdyWrapTxtGreyWdgtBtM'},[
	 Builder.node('div', { className: 'gSnavBtm' },[
			  Builder.node('div',{className:'gs4'}),
			  Builder.node('div',{className:'gs3'}),
			  Builder.node('div',{className:'gs2'}),
 			  Builder.node('div',{className:'gs1'}),]),]);

	
	

		modal.appendChild(topDiv);


		modal.appendChild( Builder.node( 'div', { className : 'modal_title' } )); 
		//modal.firstChild.nextSibling.innerHTML = '<h3>' + title + '</h3>';
		modal.firstChild.nextSibling.innerHTML += ( displayOptions.showCloseIcon ? '<a href="javascript:UI.Modal.close()">' +closeText+ '</a>' : '' );
		



      var content = Builder.node( 'div', { className : 'modal_content' } ); 
      

		
		
      displayOptions.dimensions.scrolling=displayOptions.dimensions.scrolling||'no';

      target = Builder.node( 'iframe', {
        scrolling   : displayOptions.dimensions.scrolling,
        frameborder : 'no',
        style : 'width: 100%',
        allowTransparency : true,
        name : '__modal_iframe_target',
        src : 'javascript:void(0);'
      })
		  
	
      
      content.appendChild(target);
      modal.style.display = UI.Browser.Safari ? '' : 'none';
    
	  modal.appendChild(content);



	  modal.appendChild(bottomDivInner);
	  modal.appendChild(bottomDiv);
	  
      
      Object.extend( modal, UI.ModalDialog.prototype );
      modal.onClosed = displayOptions.onClosed;
      this.activeDialog = modal;
		} else {
		  target = this.activeDialog.childNodes[1].firstChild;
		}
    
    // choose get or post
    switch(requestOptions.method) {
      case 'post' :
        if(typeof requestOptions.parameters == 'object' && requestOptions.parameters.keys().length > 0) {
          postForm = this.buildIframeForm(url, requestOptions.parameters);
          fullUrl = 'javascript:void(0);';
          break;
        }
      case 'get'  :
      default     :
        fullUrl = url + ( typeof requestOptions.parameters == 'object' ? '?'+requestOptions.parameters.toQueryString() : requestOptions.parameters );
    }
    
    Event.observe(target, 'load', function() { modal.displayIframe(displayOptions) });
    document.body.appendChild(modal);
    target.src = fullUrl;
    
    this.showBackground();
    
    
    if(postForm) {
      postForm.target = '__modal_iframe_target';
      document.body.appendChild( postForm );
      postForm.id = '_f1';
      postForm.submit();
      Element.remove(postForm);
    }
    
  },
  
  buildIframeForm : function(actionUrl, queryObject) {
    var form = Builder.node('form', { 'action' : actionUrl, 'method' : 'post'});
    $H(queryObject).each( function(pair) {
      form.appendChild( Builder.node('input', { 'name' : pair.key, 'value' : pair.value }) );
    });
    return form;
  },
  
  cancelLoading : function() {
    this.ajax.transport.abort();
    Element.remove(this.activeDialog);
    delete this.activeDialog;
    Element.setStyle(UI.Modal.background, { 'display' : 'none' });
  }
  
};