/*

	Modal dialog component
	Singleton class, will create "modal" variable where included

	Public functions:

		Open
			Description:
				Opens a modal window displaying the specified element
			Parameters:
				Id				The id of the element to display
				Options			optional. Object containing one or more of the following options:
					onOpen		Callback function when the modal open transition is complete, defaults to null
					Width		Width of the object, in pixels, defaults to 400
					HideClose	Hide's the default close-button in the upper right corner, defaults to false

		Close
			Description:
				Closes the open modal box, if any
			Parameters:
				Options			optional. Object containing one or more of the following options:
					onClose		Callback function when the modal close transition is complete, defaults to null

		Adjust
			Description:
				Moves the modal box to the center of the screen, if it isn't
				Call this method when the content (i.e. dimensions) of the modal box has been altered
			Parameters:
				None

	viz.

	<div id="myModal" style="display: none;">
		<a href="javascript:void(0);" onclick="modal.Close();">Close</a>
	</div>

	<a href="javascript:void(0);" onclick="modal.Open('myModal', { onOpen: function() { alert('it is open'); } });">Open</a>
*/

var ModalWindow = Class.create();

ModalWindow.prototype =
{
	initialize: function()
	{
		this.CurrentElement = '';
		this.IsOpen = false;
		this.ScrollPos = 0;

		this.Overlay = document.createElement('div');
		this.Overlay.id = 'overlay';
		this.Overlay.style.zIndex = '2000';
		this.Overlay.style.display = 'none';
		this.Overlay.style.position = 'absolute';
		this.Overlay.style.top = '0';
		this.Overlay.style.left = '0';
		this.Overlay.style.width = '100%';
		this.Overlay.style.height = '100%';
		this.Overlay.style.position = 'fixed';
		this.Overlay.style.backgroundColor = 'black';

		document.write('<div id="modalWindow"></div><div id="modalTrash" style="display: none;"></div>');

		Event.observe(window, 'resize', this.Resized.bind(this));
	},

	prepareIE: function(height, overflow)
	{
		var arVersion = navigator.appVersion.split("MSIE")
		var version = parseFloat(arVersion[1])

		if(!isNaN(version) && version < 7)
		{
			if(height != 'auto')
			{
				if (document.documentElement && document.documentElement.scrollTop)
					this.ScrollPos = document.documentElement.scrollTop;
				else if (document.body)
					this.ScrollPos = document.body.scrollTop;
			}

			htm = document.getElementsByTagName('html')[0];
			htm.style.height = height;
			htm.style.overflow = overflow;

			if(height == 'auto' && this.ScrollPos > 0 && window.scrollTo)
				window.scrollTo(0, this.ScrollPos);
		}
	},

	prepare: function(mod, options)
	{
		element = $('modalWindow');
		element.innerHTML = '';

		if(!options || !options.HideClose)
			//element.innerHTML = '<a style="padding-top: 0;" class="right" href="javascript:void(0);" onclick="modal.Close();"><img id="miniLogo" style="border: 0;" name="miniLogo" alt="Close window" src="' + globalRoot + '/img/miniDeleteLogo.png"/></a>';
			element.innerHTML = '<a style="padding-top: 0;" class="right" href="javascript:void(0);" onclick="modal.Close();"><img id="miniLogo" style="border: 0;" name="miniLogo" alt="Close window" src="' + globalRoot + '/img/deleteTag.png"/></a>';

		element.appendChild($(mod));
		element.childNodes[(!options || !options.HideClose) ? 1 : 0].show();

		element.style.zIndex = '2001';
		element.style.textAlign = 'left';
		element.style.backgroundColor = 'white';
		element.style.padding = '10px';
		element.style.border = '1px solid black';
		element.style.width = (!options || !options.Width) ? '400px' : options.Width + 'px';
		//originally 400px, hody changed it to 500px, ha ha
		

		clear = document.createElement('div');
		clear.style.clear = 'both';
		element.appendChild(clear);

		return element;
	},

	Resized: function()
	{
		if(this.IsOpen)
			this.Adjust();
	},

	Open: function(element)
	{
		if(!this.IsOpen)
		{
			if(!$(element))
				return;

			var options = arguments[1] ? arguments[1] : null;

			this.CurrentElement = this.prepare(element, options);

			if(!document.getElementById('overlay'))
				document.body.appendChild(this.Overlay);

			Element.setOpacity(this.CurrentElement, 0);
			Element.setOpacity(this.Overlay, 0);

			this.prepareIE('100%', 'hidden');

			Effect.Center(this.CurrentElement);
			$(this.Overlay).show();
			new Effect.Opacity(this.Overlay, { from: 0, to: 0.6, duration: 0.3 });
			Effect.Appear(this.CurrentElement, { duration: 0.25 });

			if(options && typeof options.onOpen == 'function')
				setTimeout(function() { options.onOpen(); }, 300);

			this.IsOpen = true;
		}
	},

	Close: function()
	{
		if(this.IsOpen)
		{
			new Effect.Parallel([
				Effect.DropOut(this.CurrentElement, { sync: true } ),
				Effect.Fade(modal.Overlay, { sync: true })
			], { duration: 0.5 });

			this.prepareIE('auto', 'auto');
			this.IsOpen = false;

			var options = arguments[0] ? arguments[0] : null;

			setTimeout(function() {
				ix = (this.CurrentElement.childNodes[0].tagName == 'A') ? 1 : 0;
				$('modalTrash').appendChild(this.CurrentElement.childNodes[ix]);

				if(options && typeof options.onClose == 'function')
					options.onClose();
			}.bind(this), 500);
		}
	},

	Adjust: function()
	{
		if(this.IsOpen)
		{
			var opt = getCenter(this.CurrentElement);
			opt.mode = 'absolute';
			opt.duration = 0.2;

			new Effect.Move(this.CurrentElement, opt);
		}
	}
};

var modal = new ModalWindow();