var modal = new Class({
	Implements:Options,
	 
	options:{
		styles:{
			label:{
				'background':'#f0f0f0',
				'padding':'5px',
				'color':'#000',
				'font-weight':'bold',
				'font-size':'14px'
			},
			html:{
 
				'padding':'5px',
				'color':'#000',
				'font-weight':'100',
				'font-size':'12px'
			},
			body:{
				'background':'#fff',
				'border':'5px solid #fff',
				'width':350,
				'height':200
			},
			background:{
				'background':'#000',
				'opacity':0.6
			},
			bt_close:{
				'background':'#ccc',
				'width':'100',
				'color':'#fff',
				'font-weight':'100',
				'font-size':'12px',
				'cursor':'pointer'
			}
		},
		lang:{
			'close':'close'
		}
	},
	
	initialize: function(){
		this.e={};
    },
    
    open:function(d){ 
    	
    	
    	this._constructor(d);
    	
    	this.e.g.fade(this.options.styles.background.opacity);
 
		(function(){this.e.b.fade('1');}.bind(this)).delay(500);
		window.onscroll = function(){window.fireEvent('resize');}.bind(this);
		window.addEvents({
		 	'resize':function(){
				var s=this._size();
				var l=(s.w/2)-(this.e.b.getSize().x.toInt()/2);
				var t=(s.h/2)-(this.e.b.getSize().y.toInt()/2);
				this.e.g.setStyles({'width':s.sx+s.bx,'height':s.sy+s.sy});
				$(this.e.b).morph({left:l, top: t});
			}.bind(this) 
		}).fireEvent('resize');
	 
    },
    
    close:function(d){
		(function(){
			this.e.g.fade(0);
			if(d.events)d.events();
		}.bind(this)).delay(500);	
		this.e.b.fade(0);	
		/*(function(){this.e.b.destroy();}).delay(200);*/
	},
    
    _size:function(){
    	var o={}
    	o.sx=$(window).getScrollSize().x;
    	o.bx=$(window).getScroll().x;
    	o.sy=$(window).getScrollSize().y;
    	o.by=$(window).getScroll().y;
    	o.w=$(document.body).clientWidth;
    	o.h=$(document.body).clientHeight;
    	return o;
    },
    
    _constructor:function(d){ 
    	var mw=d.width?d.width:this.options.styles.body.width;
    	var mh=d.height?d.height:this.options.styles.body.height;
    	var oo=$('modal_bg');
		var s=this._size();
		if(oo){$('modal_bg').destroy();$('modal_body').destroy();}
		/*body*/
		
		
		if($('modal_body')){$('modal_body').destroy();}
		if($('modal_background')){$('modal_background').destroy();}
		
		this.e.b=new Element('div',{
			'id':'modal_body',
			'styles':this.options.styles.body,
			'class':'modal_body modal_body_'+d.type
		})
		.inject($(document.body))
		.setStyles({
			'top':((s.h/2))-(mh/2),
			'left':((s.w/2))-(mw/2),
			'position':'fixed',
			'z-index':400
		})
		.addClass('modal_body') 
		.addClass('modal_body_'+d.type) 
		.fade('hide');
		
		/*background*/
		this.e.g= new Element('div',{
			'id':'modal_background',
			'styles':this.options.styles.background,
			'class'	:'modal_background modal_background_'+d.type
		})
		.inject($(document.body))
		.setStyles({
			'opacity'	:this.options.opacity,
			'width'		:s.sx+s.bx,
			'height'	:s.sy+s.by,
			'top'		:0,
			'position'	:'fixed',
			'z-index'	:'398'
		})
		.addClass('modal_background')
		.addClass('modal_background_'+d.type) 
		.fade('hide');
		 
		/*label*/
		if(d.label&&d.label!=''){ 
			this.e.l=new Element('div',{
				'id':'modal_label',
				'html':d.label,
				'styles':this.options.styles.label,
				'class':'modal_label modal_label_'+d.type
			})
			.addClass('modal_label') 
			.addClass('modal_label_'+d.type) 
			.inject($('modal_body'));
		}
		
		/*html*/
		if(d.html&&d.html!=''){ 
			
			this.e.l=new Element('div',{
				'id':'modal_html',
				'html':d.html,
				'styles':this.options.styles.html,
				'class':'modal_html modal_html_'+d.type
			})
			.addClass('modal_html') 
			.addClass('modal_html_'+d.type) 
			.inject($('modal_body'));
		}
		
		
		
		
		
		/*bt_close*/
		if(d.html&&d.html!=''){ 
			if(d.type=='confirm'){
				
					new Element('br')
					.inject($('modal_html'));
 
					this.e.l=new Element('span',{
						'id':'modal_bt_reset',
						'html':this.options.lang.reset,
						'styles':this.options.styles.bt_reset,
						'class':'modal_bt_reset modal_bt_reset'+d.type, 
						'events':{
							'click':function(){
								d.events=false;
								this.close(d);
							}.bind(this)
						}
					})
					.addClass('modal_bt_reset') 
					.addClass('modal_bt_reset'+d.type) 
					.inject($('modal_html'));
					
					this.e.l=new Element('span',{
						'id':'modal_bt_confirm',
						'html':this.options.lang.confirm,
						'styles':this.options.styles.bt_confirm,
						'class':'modal_bt_confirm modal_bt_confirm'+d.type, 
						'events':{
							'click':function(){
								this.close(d);
							}.bind(this)
						}
					})
					.addClass('modal_bt_confirm') 
					.addClass('modal_bt_confirm'+d.type) 
					.inject($('modal_html'));
 
			}else{
					
					/*bt_close*/
 
					this.e.l=new Element('div',{
						'id':'modal_bt_close',
						'html':this.options.lang.close,
						'styles':this.options.styles.bt_close,
						'class':'modal_bt_close modal_bt_close'+d.type, 
						'events':{
							'click':function(){
								this.close(d);
							}.bind(this)
						}
					})
					.addClass('modal_bt_close') 
					.addClass('modal_bt_close'+d.type) 
					.inject($('modal_html'));
	 
			}
		}
		
		
		/*
		 * ajust body size
		 */
		var nh=$('modal_html').getSize().y;
		nh+=$('modal_label')?$('modal_label').getSize().y:0;
		$('modal_body').setStyle('height',nh);
		
    }
});
