// JavaScript Document
var OverlayImage=new Class({
							Implements:[Options,Events],
							options:{url:'',id:'launcher',background:'#333333',opacity:0.7,speed:500,size:{width:100,height:100}},
							initialize:function(options){
								this.setOptions(options);
								this.options.id.each(function(item){$(item).addEvent('click',this.launch.bind(this))},this);
								this.fadeDiv=new Element('div',{'styles':{'display':'block','position':'absolute','top':0,'left':0,'width':this.getgreyoutsize().width,'height':this.getgreyoutsize().height,'background':this.options.background,'opacity':0,'z-index':99}});
								this.imageDiv=new Element('div',{'styles':{'display':'block','position':'absolute','z-index':99,'width':this.options.size.width,'height':this.options.size.height,'opacity':1, 'top':this.getMidDivPosition().top, 'left':this.getMidDivPosition().left}});
								this.closeDiv=new Element('div',{'styles':{'width':'85px','height':'70px','display':'block', 'float':'right', 'background':'#0052C2','position':'absolute', 'top':0,'right':0,'cursor':'pointer','z-index':100 }, events:{'click':this.remove.bind(this)}}).adopt(new Element('p',{html:'close',styles:{'font-weight':'bold','color':'#ffffff', 'margin':'20px 0 0 25px'}}));
								this.imageDiv.adopt(new Element('img',{'width':this.options.size.width,'height':this.options.size.height, 'src':this.options.url}));
								this.imageDiv.adopt(this.closeDiv);
								
								},
								getMidDivPosition:function(){
								
														   var t=((window.getSize().y-this.options.size.height)/2<0)?0:(window.getSize().y-this.options.size.height)/2;
														   
														   var l=((window.getSize().x-this.options.size.width)/2<0)?0:(window.getSize().x-this.options.size.width)/2;
														   return {'left':l, 'top':t}
								}
								,getgreyoutsize:function(){
								
														  var h=($(document.body).getScrollSize().y>window.getSize().y)?$(document.body).getScrollSize().y+25:window.getSize().y+25;
														  var w=($(document.body).getScrollSize().x>window.getSize().x)?$(document.body).getScrollSize().x:window.getSize().x;
														   return {'width':w, 'height':h}
								}
								,
								
								launch:function(){
									$(document.body).adopt(this.fadeDiv);
									$(document.body).adopt(this.imageDiv);
									this.resize_overlay();
									window.addEvent('resize',this.resize_overlay.bind(this));
									myEffect=new Fx.Morph(this.fadeDiv,{duration:this.options.speed,transition:Fx.Transitions.Sine.easeOut,onComplete:function(){this.fadeDiv.addEvent('click',this.remove.bind(this))}.bind(this)});
									myEffect.start({'opacity':[this.options.opacity]});
									return false;
									},
									
									
									remove:function(){
										this.imageDiv.dispose();
										myEffect=new Fx.Morph(this.fadeDiv,{duration:this.options.speed,transition:Fx.Transitions.Sine.easeIn,onComplete:function(){this.fadeDiv.dispose();}.bind(this)});
										myEffect.start({'opacity':[0]});
										window.removeEvent('resize',this.resize_overlay.bind(this));},
										resize_overlay:function(){
										this.fadeDiv.setStyles({'width':this.getgreyoutsize().width,'height':this.getgreyoutsize().height});
											this.imageDiv.setStyles({'top':this.getMidDivPosition().top, 'left':this.getMidDivPosition().left});

 }});