/**
 * AFRAME
 * It stands for Awesome Frame.
 *
 * Requires prototype (1.6.0.2 or higher), and
 * scriptaculous (1.8.1 or higher).
 */

var Aframe = Class.create();
Aframe.prototype = {
	initialize: function() {
		this.history = [];
		this.historyParms = [];
		this.historyTitles = [];
		this.options = Object.extend({
			width: 300,
			height: 300
		}, arguments[2] || {});
		this.showing = false;

		if(!$('aframe_overlay')) {
			var ao = new Element('div', { id: 'aframe_overlay' });
			ao.setOpacity(0.8);
			ao.style.display = 'none';
			$(document.body).insert({ bottom: ao });
		}
		if(!$('aframe_win')) {
			var aw = new Element('div', { id: 'aframe_win' });
			aw.style.display = 'none';
			$(document.body).insert({ bottom: aw });
		}
		if(!$('aframe_title')) {
			var at = new Element('div', { id: 'aframe_title' });
			at.style.display = 'none';
			$('aframe_win').insert({ bottom: at });
		}
		if(!$('aframe_content')) {
			var ac = new Element('div', { id: 'aframe_content' });
			$('aframe_win').insert({ bottom: ac });
		}
		if(!$('aframe_waiting_overlay')) {
			var awo = new Element('div', { id: 'aframe_waiting_overlay' });
			awo.style.display = 'none';
			awo.setOpacity(0.8);
			$(document.body).insert({ bottom: awo });
		}
		if(!$('aframe_waiting')) {
			var aw = new Element('div', { id: 'aframe_waiting' });
			var ai = new Element('img', { src: '/images/loading.gif' });
			aw.style.display = 'none';
			aw.insert({ bottom: ai });
			$(document.body).insert({ bottom: aw });
		}

		this.overlay = $('aframe_overlay');
		this.waiting_overlay = $('aframe_waiting_overlay');
		this.waiting = $('aframe_waiting');
		this.win = $('aframe_win');

		var url = arguments[0] || '';
		var pageOptions = Object.extend({
			method: 'get',
			parameters: {}
		}, arguments[1] || {});

		if(url.length) this.forward(url, pageOptions);
	},

	keyWatcher: function(e) {
		var code = e.keyCode || e.which || 0;
		if(code == 27) {
			this.hide();
		}
	},

	wait: function() {
		this.place();

		this.placeRef = this.place.bind(this);
		Event.observe(window, "scroll", this.placeRef);
		Event.observe(window, "resize", this.placeRef);

		if(this.win.visible()) this.waiting_overlay.show();
		if(!this.win.visible()) this.overlay.show();
		this.waiting.show();
	},

	unWait: function() {
		this.waiting_overlay.hide();
		this.waiting.hide();
		if(!this.win.visible()) this.overlay.hide();
	},

	show: function() {
		if(!this.showing) {
			this.placeRef = this.place.bind(this);
			Event.observe(window, "scroll", this.placeRef);
			Event.observe(window, "resize", this.placeRef);

			this.keyWatcherRef = this.keyWatcher.bind(this);
			Event.observe(window, "keydown", this.keyWatcherRef);

			this.closeRef = this.close.bind(this);
			Event.observe(this.overlay, "click", this.closeRef);

			this.place();
			this.overlay.show();
			this.win.show();
		}
	},

	hide: function() {
		Event.stopObserving(window, "scroll", this.placeRef);
		Event.stopObserving(window, "resize", this.placeRef);
		Event.stopObserving(this.overlay, "click", this.hideRef);
		this.win.hide();
		this.overlay.hide();
	},

	close: function() {
		this.history = [];
		this.historyParms = [];
		this.hide();
	},

	place: function() {
		var vpd = document.viewport.getDimensions();
		this.overlay.style.width = vpd.width + 'px';
		this.overlay.style.height = vpd.height + 'px';
		var so = document.viewport.getScrollOffsets();
		this.overlay.style.left = so[0] + 'px';
		this.overlay.style.top = so[1] + 'px';
		if(this.win.visible()) Element.clonePosition(this.waiting_overlay, this.win);
		if(this.options.margin) {
			var win = Position.getWindowSize();
			this.win.setStyle({
				width: win.width-(this.options.margin*2) + 'px',
				height: win.height-(this.options.margin*2) + 'px'
			});
		} else {
			this.win.setStyle({
				width: this.options.width + 'px',
				height: this.options.height + 'px'
			});
		}
		Position.Center(this.waiting);
		Position.Center(this.win);
	},

	getPage: function() {
		this.wait();
		new Ajax.Updater('aframe_content', this.history.last(), this.historyParms.last());
	},

	reload: function() {
		var pageOptions = Object.extend(this.historyParms.last(), arguments[0] || {});
		this.historyParms[this.historyParms.length-1] = pageOptions;
		this.getPage();
	},

	forward: function(url) {
		var pageOptions = Object.extend(Object.extend({
			method: 'get',
			parameters: {}
		}, arguments[1] || {}),{
			evalScripts: true,
			onComplete: function() {
				this.unWait();
				this.show();
				this.place();
			}.bind(this)
		});

		this.history.push(url);
		this.historyParms.push(pageOptions);

		this.getPage();
	},

	back: function() {
		/* Remove the current page from the history, because we are leaving it. */
		this.history.pop();
		this.historyParms.pop();

		if(!this.history.last() || !this.historyParms.last()) {
			this.hide();
			return;
		}

		var pageOptions = Object.extend(this.historyParms.last(), arguments[0] || {});
		this.historyParms[this.historyParms.length-1] = pageOptions;

		this.getPage();
	}
}

var aframe;
Event.observe(window, "load", function() {
	aframe = new Aframe('', {}, { margin: 100 });
});