/**
 * @author Sascha
 */
var tricos_Ui = Class.create({
    
   closePaneOnClick:true,
    
   initialize:function()
   {
       Event.observe(window, 'load', function() { 
           // PANE
    		var pane = new Element('div', { id:'pane' });
    		$(document.body).appendChild(pane);
    		pane.setStyle({
    			display:'none',
    			zIndex:8000,
    			position:'absolute',
    			backgroundColor:'#000',
    			opacity:0.5
    		});
    		pane.observe('click', this.clearPane.bindAsEventListener(this));
       }.bind(this));
   },
   
   
   centerDivInDiv:function(divToCenter, divToCenterIn, xOffset, yOffset) {
       if (xOffset == null) xOffset = 0;
       if (yOffset == null) yOffset = 0;
		var fullDIVSize=document.viewport.getDimensions();
		var fullDivWidth=fullDIVSize.width;
		var fullDivHeight=fullDIVSize.height;
		var divToCenterSize=divToCenter.getDimensions();
		var divToCenterWidth=divToCenterSize.width;
		var divToCenterHeight=divToCenterSize.height;
		var divOffsetX=Math.round((fullDivWidth-divToCenterWidth)/2);
		var divOffsetY=Math.round((fullDivHeight-divToCenterHeight)/2);
        
  //      console.log(divOffsetX);
//        console.log(divOffsetY);
		$(divToCenter).setStyle({
			left:(divOffsetX+xOffset)+'px',
			top:(divOffsetY+yOffset)+'px'
		});
	},

   showPane:function(callback, closeOnClick)
	{
        if (typeof closeOnClick == 'undefined' || closeOnClick == null || closeOnClick == true) {
            var closeOnClick = true;
        } else {
            var closeOnClick = false;
        }
        this.closePaneOnClick = closeOnClick;
		var dims = $(document.body).getDimensions();
			
		if(navigator.appVersion.indexOf('MSIE') != -1) {
			var bodyDims = $(document.body).getDimensions();
			$('pane').setStyle({
				top:0,
				left:0,
				width:bodyDims.width,
				height:bodyDims.height
			});
		} else {
			Element.clonePosition($('pane'), $(document.body));
		}
		new Effect.Appear($('pane'), { to:0.5, duration:0.4, afterFinish:callback});
	},
	
	
	hidePane:function(callback)
	{
		new Effect.Fade($('pane'), { duration:0.4, afterFinish:callback });
	},
	
	
	clearPane:function(e)
	{
		if (e != null) {
            Event.stop(e);
            if (this.closePaneOnClick == false) {
                return;
            }
        }
		//new Effect.Fade(this.infoDiv);
		//if($('photoOverlay') != null) new Effect.Fade($('photoOverlay'));
		this.hidePane();
        this.closePaneOnClick = true;
	}
});

tricos.ui = new tricos_Ui();