function VRPanels(_parentPanel, _id, _width, _height, _visible) {
  Panel.call(this, _parentPanel, _id, _width, _height, _visible);
  this.panels = new Array();

  this.addPanel = function(panel) {
    if (panel == null) throw new Error();
    this.panels.push(panel);
  }
  
  this.resize = function(){

  	this.element.style.width = this.parentPanel.elementInfo.Width() + 'px';
	this.element.style.height= this.parentPanel.elementInfo.Height() + 'px';
  	fixedHeight = 0;
  	fillingPanel = null;
  	for(var i=0; i < this.panels.length; i++) {
  		panel = this.panels[i];
  		
  		if (panel.defaultHeight != '*' && panel.visible)
  			fixedHeight += panel.getFloatHeight() + panel.border;
  		if (panel.defaultHeight == '*' && panel.visible)
  			fillingPanel = panel;
	}

	fillingPanelHeight = parseFloat(this.parentPanel.elementInfo.Height()) - fixedHeight - fillingPanel.border;


	for(var i=0; i < this.panels.length; i++) {
  		panel = this.panels[i];
  		if (panel.defaultHeight != '*' && panel.visible)
  		{
  			panel.element.style.width = panel.defaultWidth;
  			panel.element.style.height = panel.getFloatHeight() + 'px';
            panel.resize();
		}

  		if (panel.defaultHeight == '*' && panel.visible)
  		{
  			panel.element.style.width = panel.defaultWidth;
  			panel.element.style.height = fillingPanelHeight + 'px';
    		panel.resize();
		}

	}
  }
  
  
  this.requestParentResize = function() {
  		this.parentPanel.requestParentResize();
      	//this.resize();
    }

}
VRPanels.prototype = new Panel();
VRPanels.prototype.constructor = VRPanels;







/*
BodyPanel
*/

function BodyPanel() {
   this.childPanel = null;
   this.bodyInfoFactory = new BodyInfoFactory()
   this.elementInfo = this.bodyInfoFactory.getBodyInfo();
  

	this.setChildPanel = function(_childPanel) {
		this.childPanel = _childPanel;
	}

	this.resize = function() {
		this.childPanel.resize();
	}
   
    this.requestParentResize = function() {
      	this.childPanel.resize();
    }

	this.getFloatWidth  = function() {
		return parseFloat(this.elementInfo.Width());
	}
	
	this.getFloatHeight  = function() {
		return parseFloat(this.elementInfo.Height());
	}
	
	this.windowResize = function() {
		this.elementInfo = this.bodyInfoFactory.getBodyInfo();
		this.childPanel.resize();
	}

}











function SplitterVRPanel(_parentPanel, _leftPanel, _rightPanel, _dividerPanel, _collapsedDividerPanel) {
  this.parentPanel = _parentPanel;
  this.leftPanel= _leftPanel;
  this.rightPanel= _rightPanel;
  this.dividerPanel= _dividerPanel;
  this.collapsedDividerPanel= _collapsedDividerPanel;
  
  //TODO  manage cookies
  this.cookieManager = new CookiesManager();
  this.leftMaxWidth =800;
  this.leftMinWidth =20;
  this.leftWidth = 250;
  this.leftCollapsed = false;
  //if (this.cookieManager.hasCookie("wsx")) this.leftWidth = parseFloat(this.cookieManager.readCookie("wsx"));
  
  this.resizing = false;


  this.isResizing = function(){
  	return this.resizing;
  }
  this.resizeOn = function(){
  	this.resizing = true;
  }
  this.resizeOff = function(){
  	this.resizing = false;
  	this.cookieManager.createCookie("wsx",this.leftWidth,0);
  }



  this.getLeftWidth = function(){
  		return this.leftWidth;
  }
  
  this.setLeftWidth = function(width){
  		this.leftWidth = width;
  }

 
  this.resize = function(){

		if(this.leftCollapsed)
		{
		    remainWidth = (this.parentPanel.getFloatWidth()  - this.collapsedDividerPanel.getFloatWidth())
		    
			this.rightPanel.element.style.width = remainWidth + 'px';
			this.rightPanel.element.style.height= this.parentPanel.getFloatHeight() + 'px';
			
			this.collapsedDividerPanel.element.style.width = this.collapsedDividerPanel.getFloatWidth() + 'px';
			this.collapsedDividerPanel.element.style.height = this.parentPanel.getFloatHeight() + 'px';
			
			this.rightPanel.resize();
		}
		else
		{
	  		this.leftPanel.element.style.width = this.getLeftWidth() + 'px';
			this.leftPanel.element.style.height= this.parentPanel.getFloatHeight() + 'px';
	
			remainWidth = (this.parentPanel.getFloatWidth()  - this.dividerPanel.getFloatWidth() - this.getLeftWidth())
	
			this.rightPanel.element.style.width = remainWidth + 'px';
			this.rightPanel.element.style.height = this.parentPanel.getFloatHeight() + 'px';
			
			this.rightPanel.resize();
		    this.leftPanel.resize();
		}
		
		
  }
 
  
  this.onMouseUp = function(){
  		this.resizeOff();
  }
 
  this.onMouseMove = function(evt){
  		if(this.isResizing())
  		{
			mx=(ie5)?event.clientX+document.body.scrollLeft:evt.pageX;
			if (mx > this.leftMaxWidth) mx = this.leftMaxWidth;
			if (mx < this.leftMinWidth) mx = this.leftMinWidth;
	        this.setLeftWidth(mx);
	        this.resize();
	        return false;
		}
		return true;
  }
  
  this.closeLeft = function(){
		this.collapsedDividerPanel.show();
		this.collapseLeft();
  }
  
  
  this.collapseLeft = function(){
  		this.leftCollapsed = true;
		this.leftPanel.hide();
		this.dividerPanel.hide();
		//this.collapsedDividerPanel.show();
		this.resize();
  }
  this.openLeft = function(){
  		this.leftCollapsed = false;
		this.leftPanel.show();
		this.dividerPanel.show();
		this.collapsedDividerPanel.hide();
		this.resize();
  }



  documentEventsDispacher.addDocumentMouseMoveHandler(this);
  documentEventsDispacher.addDocumentMouseUpHandler(this);
}







function SplitterHRPanel(_parentPanel, _highPanel, _lowPanel, _dividerPanel, _collapsedDividerPanel) {
  this.parentPanel = _parentPanel;
  this.highPanel= _highPanel;
  this.lowPanel= _lowPanel;
  this.dividerPanel= _dividerPanel;
  this.collapsedDividerPanel= _collapsedDividerPanel;
  
  this.highPanelHeight = 250;
  this.lowPanelCollapsed = false;
  this.lowPanelIconizedHeight = 60;

  this.resizeOffset = this.parentPanel.elementInfo.Top();
  this.resizing = false;


  this.isResizing = function(){
  	return this.resizing;
  }
  this.resizeOn = function(){
	this.resizeOffset = this.parentPanel.elementInfo.Top();
  	this.resizing = true;
  }
  
  this.resizeOff = function(){
  	this.resizing = false;
  }

  this.gethighPanelHeight = function(){
  		return this.highPanelHeight;
  }
  
  this.sethighPanelHeight = function(height){
  		this.highPanelHeight= height;
  }

 
  this.resize = function(){

		if(this.lowPanelCollapsed)
		{
			this.highPanel.element.style.width = this.parentPanel.getFloatWidth() + 'px';
			this.highPanel.element.style.height = this.parentPanel.getFloatHeight() + 'px';
		}
        else
		{
	  		this.lowPanel.element.style.width = this.parentPanel.getFloatWidth() + 'px';
	  		remainHeight = (this.parentPanel.getFloatHeight()  - this.dividerPanel.getFloatHeight() - this.gethighPanelHeight())
	  		
	  		if (remainHeight <0)//Se c'è un resize della pagina mentre il frame basso è collassato devo gestire un numero negativo
	  		{
	  		    this.highPanelHeight += remainHeight -60;
	  		    remainHeight = 60;
	  		}
			this.lowPanel.element.style.height= remainHeight  + 'px';
			
			this.highPanel.element.style.width = this.parentPanel.getFloatWidth()+ 'px';
			this.highPanel.element.style.height = this.gethighPanelHeight() + 'px';
		}
		
		this.highPanel.resize();
		if(!this.lowPanelCollapsed) this.lowPanel.resize();

  }
 
  
  this.onMouseUp = function(){
  		this.resizeOff();
  }
 
  this.onMouseMove = function(evt){
  		if(this.isResizing())
  		{
			my=(ie5)?event.clientY+document.body.scrollTop:evt.pageY;
	        this.sethighPanelHeight(my- this.resizeOffset);
	        this.resize();
	        return false;
		}
		return true;
  }
  
  

  this.collapseLow = function(){
  		this.lowPanelCollapsed = true;
		this.lowPanel.hide();
		this.dividerPanel.hide();
		this.resize();
  } 
  this.oldhighPanelHeight = 250;
   this.iconizeLow = function(){
         this.oldhighPanelHeight =  this.highPanelHeight;
  		remainHeight = (this.parentPanel.getFloatHeight()  - this.dividerPanel.getFloatHeight() - this.lowPanelIconizedHeight)
  		this.sethighPanelHeight(remainHeight);
		this.resize();
  } 
  
   this.deiconizeLow = function(){
  		this.sethighPanelHeight(this.oldhighPanelHeight);
		this.resize();
  }   
 
  this.openLow = function(){
  		this.lowPanelCollapsed = false;
		this.lowPanel.show();
		this.dividerPanel.show();
		this.resize();
  }



  documentEventsDispacher.addDocumentMouseMoveHandler(this);
  documentEventsDispacher.addDocumentMouseUpHandler(this);
}











/*
Panel class rapresent a generic Div idenfied by _id that can be
managed my other js classes as a docked panel.
 
_parentContainer 
*/

function Panel(_parentPanel, _id, _width, _height, _visible) {

	this.parentPanel = _parentPanel;
  	this.defaultWidth = _width;
  	this.defaultHeight= _height;
  	this.id= _id;
  	this.border = 0;
  	this.visible= _visible;
  	this.element = document.getElementById(_id);
  	this.elementInfo = (new ElementInfoFactory()).getElementInfo(_id);

	this.childPanels = new Array();
	
	this.addPanel = function(panel) {
	    if (panel == null) throw new Error();
	    this.childPanels.push(panel);
  	}

  	
  	//if (this.element == null) throw new Error('Unable to init panel '+_id);
  	//if (this.parentPanel == null) throw new Error('Unable to init panel, missing parent element');

	if (this.element != null)
  		if (_visible) this.element.style.display='block';
  		else this.element.style.display='none';

  
  	this.parseSize = function(stringSize) {
		stringSize = stringSize.replace('%','');
		stringSize = stringSize.replace('px','');
		stringSize = stringSize.replace(' ','');

		return parseFloat(stringSize);
  	}


	this.getFloatWidth  = function() {
		percentPos = this.defaultWidth.indexOf('%');
		floatSize = this.parseSize(this.defaultWidth);
		//alert(this.id + ' ' + this.defaultWidth + ' - ' + percentPos );
		if (percentPos > 0) 
		{
			//alert(this.id + ' ' + this.defaultWidth + ' - ' + this.parentPanel.id + ' ' + this.parentPanel.getFloatWidth());
			return this.parentPanel.getFloatWidth() * floatSize / 100;
		}
		if (this.defaultWidth == '*')
		{
			floatSize = this.elementInfo.Width();
		}
		return floatSize;
	}
	
	this.getFloatHeight  = function() {
		percentPos = this.defaultHeight.indexOf('%');
		floatSize = this.parseSize(this.defaultHeight);
		if (percentPos > 0) 
		{
			return this.parentPanel.getFloatHeight() * floatSize / 100;
		}
		if (this.defaultHeight == '*')
			floatSize = this.elementInfo.Height();

		return floatSize;

	}


	this.resize = function() {
		for(var i=0; i < this.childPanels.length; i++) {
	  		panel = this.childPanels[i];
	        panel.resize();
		}
	}
	
	this.hide = function() {
      this.element.style.display='none';
      this.visible= false;
      this.requestParentResize();
    }

	this.show = function() {
      this.element.style.display='block';
      this.visible= true;
      this.requestParentResize();
    }
    
    this.requestParentResize = function() {
      	this.parentPanel.requestParentResize();
    }


}

function PanelNull(_parentPanel, _id, _width, _height, _visible) {

    this.parentPanel = _parentPanel;
    this.defaultWidth = _width;
    this.defaultHeight = _height;
    this.id = _id;
    this.border = 0;
    this.visible = _visible;
    this.element = document.getElementById(_id);
    this.elementInfo = (new ElementInfoFactory()).getElementInfo(_id);

    this.childPanels = new Array();

    this.addPanel = function(panel) {
    }


    this.parseSize = function(stringSize) {
        stringSize = stringSize.replace('%', '');
        stringSize = stringSize.replace('px', '');
        stringSize = stringSize.replace(' ', '');

        return parseFloat(stringSize);
    }


    this.getFloatWidth = function() {
        percentPos = this.defaultWidth.indexOf('%');
        floatSize = this.parseSize(this.defaultWidth);
        //alert(this.id + ' ' + this.defaultWidth + ' - ' + percentPos );
        if (percentPos > 0) {
            //alert(this.id + ' ' + this.defaultWidth + ' - ' + this.parentPanel.id + ' ' + this.parentPanel.getFloatWidth());
            return this.parentPanel.getFloatWidth() * floatSize / 100;
        }
        if (this.defaultWidth == '*') {
            floatSize = this.elementInfo.Width();
        }
        return floatSize;
    }

    this.getFloatHeight = function() {
        percentPos = this.defaultHeight.indexOf('%');
        floatSize = this.parseSize(this.defaultHeight);
        if (percentPos > 0) {
            return this.parentPanel.getFloatHeight() * floatSize / 100;
        }
        if (this.defaultHeight == '*')
            floatSize = this.elementInfo.Height();

        return floatSize;

    }


    this.resize = function() {
    }

    this.hide = function() {
    }

    this.show = function() {
    }

    this.requestParentResize = function() {
    }


}

function VRPanelsNull(_parentPanel, _id, _width, _height, _visible) {
    PanelNull.call(this, _parentPanel, _id, _width, _height, _visible);
    this.panels = new Array();
    this.addPanel = function(panel) {}

    this.resize = function() {}


    this.requestParentResize = function() {}

}
VRPanelsNull.prototype = new Panel();
VRPanelsNull.prototype.constructor = VRPanelsNull;


function SplitterHRPanelNull(_parentPanel, _highPanel, _lowPanel, _dividerPanel, _collapsedDividerPanel) {
    this.parentPanel = _parentPanel;
    this.highPanel = _highPanel;
    this.lowPanel = _lowPanel;
    this.dividerPanel = _dividerPanel;
    this.collapsedDividerPanel = _collapsedDividerPanel;
    this.highPanelHeight = 250;
    this.lowPanelCollapsed = false;
    this.lowPanelIconizedHeight = 60;
    this.resizeOffset = this.parentPanel.elementInfo.Top();
    this.resizing = false;
    this.isResizing = function() {
        return this.resizing;
    }
    this.resizeOn = function() {
        this.resizeOffset = this.parentPanel.elementInfo.Top();
        this.resizing = true;
    }
    this.resizeOff = function() {
        this.resizing = false;
    }
    this.gethighPanelHeight = function() {
        return this.highPanelHeight;
    }
    this.sethighPanelHeight = function(height) {
        this.highPanelHeight = height;
    }
    this.resize = function() {}
    this.onMouseUp = function() {}
    this.onMouseMove = function(evt) {return true; }
    this.collapseLow = function() {}
    this.oldhighPanelHeight = 250;
    this.iconizeLow = function() {}
    this.deiconizeLow = function() {}
    this.openLow = function() {}
}
function SplitterVRPanelNull(_parentPanel, _leftPanel, _rightPanel, _dividerPanel, _collapsedDividerPanel) {
    this.parentPanel = _parentPanel;
    this.leftPanel = _leftPanel;
    this.rightPanel = _rightPanel;
    this.dividerPanel = _dividerPanel;
    this.collapsedDividerPanel = _collapsedDividerPanel;
    //TODO  manage cookies
    this.cookieManager = new CookiesManager();
    this.leftMaxWidth = 800;
    this.leftMinWidth = 20;
    this.leftWidth = 250;
    this.leftCollapsed = false;
    //if (this.cookieManager.hasCookie("wsx")) this.leftWidth = parseFloat(this.cookieManager.readCookie("wsx"));
    this.resizing = false;
    this.isResizing = function() {
        return this.resizing;
    }
    this.resizeOn = function() {
        this.resizing = true;
    }
    this.resizeOff = function() {
        this.resizing = false;
        this.cookieManager.createCookie("wsx", this.leftWidth, 0);
    }
    this.getLeftWidth = function() {
        return this.leftWidth;
    }
    this.setLeftWidth = function(width) {
        this.leftWidth = width;
    }
    this.resize = function() {}
    this.onMouseUp = function() {
    }
    this.onMouseMove = function(evt) {
        return true;
    }
    this.closeLeft = function() {
    }
    this.collapseLeft = function() {
    }
    this.openLeft = function() {
    }
}