var mmDialog = new Class({
	Implements: [Options, Class.Occlude, Events]
	, options: {	
		size: { width: 400, height: 120 }
		, minSize: {width: 400, height: 32}
		, offset: { x: 0, y: 0 }
		, zIndex: 9010
		, container: document.id(document.body)
		, classes: {
			dialogContainer: 'mmDialogContainer'
			, dialogMask: 'mmDialogMask rnd-10 bgc-w'
			, dialog: 'mmDialog rnd-10'
			, dialogHeader: 'mmDialogHeader m-0'
			, dialogBody: 'mmDialogBody mlr-15 mtb-0'
			, dialogFooter: 'mmDialogFooter m-0 tR ptb-15 plr-15' //
			, dialogTitle: 'mmDialogTitle'	
			, dialogQuit: 'mmDialogQuit abs abs-tr mr-10 mt-5 dIB plr-0 ptb-0'		
		}
		, quitHtml: '<span class="mmIcon icon-round-delete"></span>'
		, autosize: false
		, overflow: {
			body : 'auto'
		}
		, title: null
		, scroll: true
		, useEscKey: false
		, disposeOnClose: false
		, closeable: true
		, closeOnOverlayClick: false
		, dialogFx: {
			type: 'tween'
			, open: 1
			, close: 0
			, options: {
				property: 'opacity'
				, duration: 400
			}		
		}
		, overlay: {
			id: 'mmDialogOverlay'
			, color: '#000'
			, duration: 400
			, opacity: 0.2
			, zIndex: 9000
		}
		/*
		, onOpen: $empty  // overlay open
		, onCLose: $empty  // overly close
		, onShow: $empty  // dialog show
		, onHide: $empty  // dialog hide
		*/
	}
	// , property: 'mmDialog'	
	, initialize: function(options){
		this.setOptions(options);
		if (this.options.container == undefined) { this.options.container = document.body; }		
		this.setupElements();
		this.setupEvents();
	}
	, setupElements:function() {
		this.dialogContainer = new Element('div', {'class': this.options.classes.dialogContainer, styles: { width: this.options.size.width, height: this.options.size.height, cursor:'default',position: this.options.scroll ? 'fixed' : 'absolute', 'z-index': this.options.zIndex,opacity: 0} }).inject(this.options.container);
		// this.dialog = new Element('div', {'class': this.options.classes.dialog, styles: {position:'absolute',top:'0px', left:'0px',bottom:'0px',right:'0px','z-index':1} }).inject(this.dialogContainer);
		this.dialog = new Element('div', {'class': this.options.classes.dialog, styles: {position:'relative','z-index':1} }).inject(this.dialogContainer);		
		this.dialogMask = new Element('div', {'class': this.options.classes.dialogMask, styles: {position:'absolute',top:'0px', left:'0px',bottom:'0px',right:'0px','z-index':2,display:'none'} }).inject(this.dialogContainer);		
		this.dialogHeader = new Element('div', { 'class': this.options.classes.dialogHeader, styles: { position:'relative'}}).inject(this.dialog);		
		this.dialogBody = new Element('div', { 'class': this.options.classes.dialogBody, styles: { position:'relative'}}).inject(this.dialog);
		this.dialogFooter = new Element('div', { 'class': this.options.classes.dialogFooter, styles: { position:'relative'}}).inject(this.dialog);				
		// this.dialogTitle = new Element('div', { 'class': this.options.classes.dialogTitle, styles: { position:'relative'}}).inject(this.dialogHeader);				
		if (this.options.closeable) {		
			this.dialogQuit = new Element('a', { 'href':'#','class': this.options.classes.dialogQuit, styles: { position:'absolute','z-index':10, opacity:0},html:this.options.quitHtml}).inject(this.dialog);		
		}
		this.overlay = new Overlay(this.options.container, {			
			 id: this.options.overlay.id			
			, color: this.options.overlay.color
			, duration: this.options.overlay.duration
			, opacity: this.options.overlay.opacity
			, zIndex: this.options.overlay.zIndex
		});		
		this.overlay.overlay.setStyle('cursor','default');
		this.curSize = {width:this.options.size.width, height: this.options.size.height}
	}
	, setupEvents: function() {
		this.rePosition();
		if(!this.fx){
			this.fx = this.options.dialogFx.type == 'morph' ? new Fx.Morph(this.dialogContainer,this.options.dialogFx.options) : new Fx.Tween(this.dialogContainer,this.options.dialogFx.options) ;
		}
		this.fx.addEvent('complete',function(){
			this.fireEvent(this.isOpen ? 'show' : 'hide');
			if (this.options.disposeOnClose && !this.isOpen) {
				this.dispose();
			} else if (!this.options.disposeOnClose && !this.isOpen) {
				this.dialogContainer.setStyle('display','none');
			}
			if (this.isOpen && this.options.closeable && this.dialogBody.getStyle('display')!='none') {
				this.dialogQuit.setStyle('opacity',0).show().fade(1);
			}			
		}.bind(this));
		
		if (this.options.closeable) {
			this.dialogQuit.addEvent('click',function(e) {
				e.stop();
				this.close();
			}.bind(this));
			if (this.options.closeOnOverlayClick) {
				this.overlay.overlay.addEvent('click',function(e){
					e.stop();
					this.close();				
				}.bind(this));				
			}
		}
		
		if(this.options.useEscKey){
			document.id(document.body).addEvent('keydown', function(e){
				if (e.key == 'esc') this.close();
			}.bind(this));
		}		
		
		window.addEvent('resize', function(e){
			this.rePosition();
		}.bind(this));
			
	}
	, rePosition: function() {
// mm.log('rePosition');
		var docSize = document.id(this.options.container).getSize();
// mm.log(docSize);
// mm.log(this.curSize);
// mm.log('x:'+(docSize.x - this.curSize.width)/2 +' y:'+(docSize.y - this.curSize.height)/2);		
		this.setPosition((docSize.x - this.curSize.width)/2,(docSize.y - this.curSize.height)/2);		
	}
	, reSize: function() {
// mm.log('mmDialog reSize...');		
		var opt = {
			styles: ['padding', 'border', 'margin']
		};		
		var totalHeight = 0;	
		this.dialogContainer.setStyle('display','block');			
		if (this.options.autosize) {
// mm.log('reSize is autosize..');			
			this.dialogBody.setStyle('height','auto');
			this.dialog.setStyle('height','auto');							
			var bsize = this.dialogBody.getComputedSize(opt);
			var dsize = this.dialog.getComputedSize(opt);
// mm.log('dsize:')
// mm.log(dsize);			
			totalHeight += dsize.totalHeight;
			if (totalHeight < this.options.minSize.height) {
				totalHeight = this.options.minSize.height;
				// this.dialog.setStyles({'height': totalHeight });	
				// - bsize.height
				this.dialogBody.setStyles({'height': (totalHeight), 'overflow':'visible'});				
// mm.log('totalheight = '+totalHeight+' bsize height = '+bsize.height+' dsize height = '+dsize.height);				
			} else {			
				this.dialogBody.setStyles({'height':bsize.height, 'overflow':'visible'});
			}
			this.dialogContainer.setStyles({'height': totalHeight });
			this.curSize.width = dsize.totalWidth;
			this.curSize.height = totalHeight;			
// mm.log(this.curSize.height);		
		} else {
				
			var hChild = this.dialogHeader.getFirst('*');
			if (hChild) {
				var hsize = this.dialogHeader.getComputedSize(opt);
				totalHeight += hsize.totalHeight;
// mm.log('headerH:'+hsize.totalHeight);			
			}

			var fChild = this.dialogFooter.getFirst('*');
			if (fChild) {
				var fsize = this.dialogFooter.getComputedSize(opt);
				totalHeight += fsize.totalHeight;
// mm.log('footerH:'+fsize.totalHeight);					
			}			
			this.curSize.height = this.options.size.height;			
			var remainingH = this.curSize.height - totalHeight;
// mm.log('remainingH = '+remainingH+' curH:'+this.curSize.height+' - '+totalHeight);
// 			var bsize = this.dialogBody.getComputedSize(opt);
// mm.log('bodyH:'+bsize.totalHeight);		
// 			totalHeight += bsize.totalHeight;			
			this.dialogBody.setStyles({'height':remainingH, 'overflow':this.options.overflow.body});
		}
		this.rePosition();	
	}
	, setPosition: function(x,y,relative){
		x = x + this.options.offset.x;
		y = y + this.options.offset.y;
		x = x < 10 ? 10 : x;
		y = y < 10 ? 10 : y;
		if(this.dialogContainer.getStyle(relative || 'position') != 'fixed'){
			var scroll = document.id(this.options.container).getScroll();
			x = x + scroll.x;
			y = y + scroll.y
		}
		this.dialogContainer.setStyles({
			left: x, top: y
		});
		return this;
	}	
	, setContent: function(content){
// mm.log('mmDialog setContent...');		
		this.dialogBody.empty();
		this.dialogBody.show();		
		switch(typeOf(content)){
			case 'element':
			case 'elements':			
				this.dialogBody.adopt(content);
			break;
			case 'string':
			case 'number':
				this.dialogBody.set('html',content);
			break;
		}

		var html = this.dialogBody.get('html');
		if (mm && mm.objects) {
			mm.objects.scan(this.dialogBody);
		}
		var scripts = html.stripScripts.delay(10, html, true);
		this.reSize();		
		return this;
	}	
	, setFooter: function(content) {
		this.dialogFooter.empty();
		this.dialogFooter.show();		
		switch(typeOf(content)) {
			case 'element':
			case 'elements':			
				this.dialogFooter.adopt(content);
			break;
			case 'string':
			case 'number':
				this.dialogFooter.set('html', content);
			break;
			case 'boolean':
				if (!content) {
					this.dialogFooter.hide();
				}
			break;
		}
		return this;
	}
	, setHeader: function(content) {
		this.dialogHeader.empty();
		switch(typeOf(content)) {
			case 'element':
			case 'elements':			
				this.dialogHeader.adopt(content);
			break;
			case 'string':
			case 'number':
				this.dialogHeader.set('html', content);
			break;
		}
		return this;
	}	
	, open: function(){
		this.isOpen = true;
		this.beforeOpen();		
		this.fireEvent('open');
		this.dialogContainer.setStyle('display','block');
		if (this.options.closeable) {
			this.dialogQuit.hide();	
		}	
		this.fx.start(this.options.dialogFx.open);
		this.overlay.open();
		return this;
	}	
	, close: function(){
		this.isOpen = false;
		this.fireEvent('close');
		this.fx.start(this.options.dialogFx.close);
		this.overlay.close();
		this.afterClose();
		return this;
	}	
	, dispose: function(){
		this.dialogContainer.destroy();
		this.overlay.overlay.destroy();
	}
	, beforeOpen:function() {
		// alert('before');
// mm.log('beforeOpen');
		// this.dialogContainer.setStyle('display','block');
		this.rePosition();
	}	
	, afterClose:function() {
// mm.log('afterClose');		
		// this.dialogContainer.setStyle('display','none');
	}
	, toElement: function(){
		return this.dialogContainer;
	}
});

Element.implement({
	mmDialog: function(options){
		var dialog = new mmDialog(options).setContent(this).show();
		this.store('mmDialog',dialog);
		return this;
	}
});