// moodows version 0.2
// originally coded by jean-nicolas jolivet (silvertab(at)videotron.ca)
// extended by Benjamin Hutchins (ben(at)xvolter.com)
// made avaible for mootools 1.2 by Moritz Wilfer (www.mooosoft.de)
// DESC: an extremely simple window class for mootools

var moodows = new Class({
	
	Implements: [Options],
	
	options: {
			id: 			'moodow_' + new Date().getTime(),
			width:			300,
			height:			200,
			top:			100,
			left:			100,
			title:			'Moodows!',
			status:			'',
			closable:		true,
			minimize:		true,
			maximize:		true,
			resize:			true,
			flash:			false,
			showLayer:		true,
			oldHeight: 0, oldWidth: 0, oldPosTop: 0, oldPosLeft: 0		
	},
	
	initialize: function(options) {
			if((this.el = $(options.id)) != null) {
				this.el.parentNode.removeChild(this.el);
			}
				
			this.el = new Element('div');
			this.el.addClass('moodows_win');
	
			this.setOptions(options);
	
			this.id = this.el.id = this.options.id;
			this.el.style.zIndex = 1;
			
			this.el.setStyles({
				width: this.options.width + 'px',
				height: this.options.height + 'px',
				top: this.options.top + 'px',
				left: this.options.left + 'px'
			});
			
			this.innerContent = "<table id='title_" + this.id + "' class='moodows_title'>\
				<tr>\
					<td id='titleText_" + this.id + "'>top</td>\
				</tr>\
			</table>\
			<table id='middle_" + this.id + "' style='width:100%'>\
				<tr>\
					<td>\
					<div id='content_" + this.id + "'  class='moodows_body'>content</div>\
					</td>\
				</tr>\
			</table>\
			<table id='status_" + this.id +"' class='moodows_status'>\
				<tr>\
					<td id='statusText_" + this.id + "'>Status Text</td>\
				</tr>\
			</table>";
			
			this.el.innerHTML = this.innerContent;
			
			this.el.injectInside(document.body);
			this.titleHeight = $('title_' + this.id).getSize().y;
			this.statusHeight = $('status_' + this.id).getSize().y;
	
			this.contentHeight = this.options.height - (this.titleHeight + this.statusHeight) - 6;
			
			$('content_' + this.id).setStyle('height', this.contentHeight + 'px');
			
			this.dragOptions = {
				handle: $('title_' + this.id),
				onStart: function() {
					if(!this.options.flash)
						this.el.setStyle('opacity', 0.9);
					this.el.style.zIndex = this.getLastZIndex();
				}.bind(this),
				
				onComplete: function() {
					if(!this.options.flash)
						this.el.setStyle('opacity', 1);
					this.renew();
				}.bind(this)
			};
	
			this.titleWidth = 0;
	
			//everything is drawn, we can set titles etc..
			this.setTitle(this.options.title);
			this.setStatus(this.options.status);
			
			this.contentDiv = $('content_' + this.id);
			
			if(this.options.closable)
			{
				this.closeButton = new Element('div', {id: 'closeButton_'+this.id});
				this.closeButton.addClass('moodows_close');
				this.closeButton.set('html', '<b>x</b>');
				this.closeButton.setStyle('right', this.titleWidth + 'px');
				this.closeButton.injectInside(this.el);
				this.titleWidth = this.titleWidth + 20;
			}
			
			if(this.options.minimize)
			{
				this.miniButton = new Element('div', {id: 'miniButton_'+this.id});
				this.miniButton.addClass('moodows_minimize');
				this.miniButton.set('html', '<b>_</b>');
				this.miniButton.setStyle('right', this.titleWidth + 'px');
				this.miniButton.injectInside(this.el);
				this.titleWidth = this.titleWidth + 20;
			}
	
			if(this.options.maximize)
			{
				this.maxButton = new Element('div', {id: 'maxButton_'+this.id});
				this.maxButton.addClass('moodows_maximize');
				this.maxButton.set('html', '<b>[]</b>');
				this.maxButton.setStyle('right', this.titleWidth + 'px');
				this.maxButton.injectInside(this.el);
				this.titleWidth = this.titleWidth + 20;
			}
	
			if(this.options.resize)
			{
				this.resizeButton = new Element('div');
				this.resizeButton.addClass('moodows_resize');
				this.resizeButton.set('html', '<b>&lt;&gt;</b>');
				this.resizeButton.injectInside(this.el);
	
				this.resizeOptions = {
					handle: this.resizeButton,
					onComplete: function() {
						this.maximized = false;
						this.renew();
					}.bind(this)
				}
			}
	
			this.minimized = false;
			this.maximized = false;
			//this.ajax = '';
			this.waiting_to_maximize = false;
			this.el.makeDraggable(this.dragOptions);
			if(this.options.resize)
				this.el.makeResizable(this.resizeOptions);
			this.el.setStyle('display', 'none');
			this.watchEvents();
			this.getCoords();	
	},
	
	getLastZIndex: function() {
		var allMoodows = $$('div.moodows_win');
		var zindexArray = [];
		//if its's our first window, leave the zindex to 1...
		if(allMoodows.length <= 0)
		{
			return 1;
		}
		else
		{
			allMoodows.forEach(function(item) {
				zindexArray.push(item.style.zIndex);
			});
			zindexArray.sort(this.sortNumber);
			return 99 + zindexArray[zindexArray.length-1].toInt() + 1;
		}
	},
	
	sortNumber: function(a, b) {
		return a - b;
	},
	
	setContent: function(content) {
		$('content_' + this.id).set('html', content);
	},
	
	setTitle: function(content) {
		$('titleText_' + this.id).set('html', content);
	},
	
	setStatus: function(content) {
		$('statusText_' + this.id).set('html', content);
	},
	
	setUrl: function(url) {
		new Element('iframe', {
			'src': url,
			'style': 'width: 99%; height:98%; background-color: #FFFFFF'
		}).injectInside($('content_' + this.id).empty());
	},

	setAjax: function(url, method) {
		var ajax = new Request.HTML({ url: url, method: (method==null ?'get':method), evalScripts:true, update: 'content_'+this.id+'',
								onSuccess: function(html) {
									$('loader').style.display = 'none';	
								}});
		$('loader').style.display = 'inline';
		ajax.send();
	},
	
	watchEvents: function()
	{
		if(this.options.closable)
		{
			this.closeButton.onclick = function() { 
				this.hide();
			}.bind(this);
		}
		
		if(this.options.minimize)
		{
			this.miniButton.onclick = function() {
				this.minimize();
			}.bind(this);
		}

		if(this.options.maximize)
		{
			this.maxButton.onclick = function() {
				this.maximize();
			}.bind(this);
		}
	},
	
	hide: function()
	{
		if(this.options.showLayer) {
			$('blackLayer').style.display = 'none';
		}
        this.el.fade(0);
	},
	
	show: function()
	{
		if(this.options.showLayer) {
			$('blackLayer').style.display = 'inline';
		}
        // correct top & left
		this.el.setStyles({
						 top: (this.options.top + window.getScroll().y) + 'px',
						 left: (this.options.left + window.getScroll().x) + 'px'
						 });
		this.el.style.zIndex = this.getLastZIndex();
        this.el.setStyle('opacity', 0);
		this.el.setStyle('display', 'block');
        this.el.fade(1);
    },

	minimize: function()
	{
		if(!this.minimized)
		{
			this.contentDiv.oldHeight = this.contentDiv.getSize().y;
			this.middleTableOldHeight = $('middle_' + this.id).getSize().y;

			this.contentDiv.tween('height', 0);
			this.el.tween('height', 63);
			$('middle_' + this.id).tween('height', 0);
			this.minimized = true;
		}
		else
		{
			this.contentDiv.tween('height', this.contentDiv.oldHeight);
			this.el.tween('height', this.options.height);
			$('middle_' + this.id).tween('height', this.middleTableOldHeight);
			this.minimized = false;

			if( this.waiting_to_maximize )
				this.maximize();
		}
	},
	
	maximize: function()
	{
		if(this.minimized)
		{
			this.waiting_to_maximize = true;
			this.minimize();
			return false;
		}

		this.waiting_to_maximize = false;

		if(!this.maximized)
		{
			this.options.oldHeight = this.options.height;
			this.options.oldWidth  = this.options.width;
			this.options.oldPosTop = this.options.top;
			this.options.oldPosLeft= this.options.left;

			this.options.height = this.screenY - 20;
			this.options.width  = this.screenX - 20;
			this.contentHeight  = this.options.height - (this.titleHeight + this.statusHeight) - 6;
			this.contentWidth   = this.options.width;

			this.el.setStyles({
				width: this.options.width + 'px',
				height: this.options.height + 'px',
				top: (window.scrollY + 5) + 'px',
				left: (window.scrollX + 5) + 'px'
			});

			this.maximized = true;
		}
		else
		{
			this.options.height = this.options.oldHeight;
			this.options.width  = this.options.oldWidth;
			this.options.top    = this.options.oldPosTop;
			this.options.left   = this.options.oldPosLeft;

			this.el.setStyles({
				width: this.options.width + 'px',
				height: this.options.height + 'px',
				top: this.options.top + 'px',
				left: this.options.left + 'px'
			});

			this.maximized = false;
			this.renew();
		}
	},

	getCoords: function()
	{
		if (navigator.appVersion.toLowerCase().indexOf('safari')+1) {
			this.screenX = window.innerWidth;
			this.screenY = window.innerHeight;
		} else {
			this.screenX = document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth;
			this.screenY = document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight;
		}
	},

	renew: function(){
		this.options.height = this.el.getStyle('height').toInt();
		this.options.width  = this.el.getStyle('width').toInt();
		this.options.top    = this.el.getStyle('top').toInt();
		this.options.left   = this.el.getStyle('left').toInt();

		this.contentDiv.height  = this.options.height;
		this.contentDiv.width   = this.options.width;
		//$('middle_' + this.id).height = this.middleTableOldHeight;
		//$('middle_' + this.id).width  = this.middleTableOldWidth;

		this.el.setStyles({
			width: this.options.width + 'px',
			height: this.options.height + 'px',
			top: this.options.top + 'px',
			left: this.options.left + 'px'
		});
	}
});