/**
 * Pod1 PodBox extension
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Open Software License (OSL 3.0)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * http://opensource.org/licenses/osl-3.0.php
 *
 *
 * @category   Pod1
 * @package    Pod1_PodBox
 * @extends    PodCore
 * @copyright  Copyright (c) 2010 Pod1 (http://www.pod1.com)
 * @license    http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
 */

if(typeof PodBox == 'undefined') {
    var PodBox = {};
}

// Super globals
var box;
var frame;

/**************************** PODBOX OVERLAY ********************************/
PodBox.Overlay = Class.create(PodCore, {

	initialize: function(content, closable, show, link) {
		if(!$(content)){ throw new Error('Content must be a valid element') }
		this.url		= null;
		this.closable 	= closable;
		this.content	= content;
		this.container 	= $$('body')[0];
		this.overlay 	= new Element('div').addClassName('podbox-overlay').hide();
		this.pwindow	= new Element('div').addClassName('podbox-window').hide();
		this.dialog 	= new Element('div').addClassName('podbox-dialog');
		this.container.insert(this.overlay);
		this.container.insert(this.pwindow);
		this.pwindow.insert(this.dialog);
		this.dialog.insert(this.content);
		this.content.hide();
		$$('a.'+(link ? link : 'podbox')).each(this.addLink.bind(this)); // Add link observers
		if(false !== this.closable) {
			this.toolbar	= new Element('div').addClassName('podbox-toolbar');
			this.closeLink 	= new Element('a', { 'href': '#', 'title': 'Close window'}).addClassName('podbox-close');
			this.closeLink.update('Close');
			this.pwindow.insert({'top': this.toolbar});
			this.toolbar.insert({'top': this.closeLink});
			Event.observe(this.overlay, 'click', this.close.bindAsEventListener(this));
			Event.observe(this.closeLink, 'click', this.close.bindAsEventListener(this));		
		}
		if(show === true){ this.show() }
		// Handles window resizing on browser resize
		Event.observe(document.onresize ? document : window, 'resize', this.updateWindow.bindAsEventListener(this));
	},
	
	getToolbarHeight: function() {
		if(typeof(this.toolbarHeight) == 'undefined') {
			this.toolbarHeight = (typeof(this.toolbar) !== 'undefined') ? this.toolbar.getHeight() : 0;
		}
		return this.toolbarHeight;
	},
	
	getElementPadding: function(element) {
		var padding = {width: 0, height: 0};
		var element = $(element);
		if(element) {
			padding = {
            	width:	Number(element.getStyle('padding-left').replace('px', ''))+Number(element.getStyle('padding-right').replace('px', '')),
            	height:	Number(element.getStyle('padding-top').replace('px', ''))+Number(element.getStyle('padding-bottom').replace('px', ''))
    		};
		}
		return padding;
	},
	
	evalTransport: function(transport) {
		try { response = eval('('+transport.responseText+')') } catch(e) { response = {} }
		return response;
	},
	
	updateWindow: function(event) {
		var eWidth 		= this.content.getWidth();
		var dWidth 		= document.viewport.getWidth();
		var pwHeight 	= this.pwindow.getHeight();
		this.dialog.setStyle({height: parseInt(100*((pwHeight-this.getToolbarHeight())/pwHeight))+'%' })
		this.pwindow.setStyle({left: parseInt(((100*(dWidth-eWidth)/dWidth))/2)+'%' });
	},
	
	resize: function() {
		// Get container and document dimensions
		var eDimensions = this.content.getDimensions();
		var dDimensions = document.viewport.getDimensions();
		var ePadding	= this.getElementPadding(this.content);
		var tHeight 	= this.getToolbarHeight();	
		// Set height offset
		eDimensions.height += tHeight+ePadding.height+20;
		// Set width to screen width with padding
		if(eDimensions.width > dDimensions.width) {
			eDimensions.width = dDimensions.width-40;
		}
		// Set height to screen height with padding
		if(eDimensions.height > dDimensions.height) {
			eDimensions.height = dDimensions.height-40;
		}
		// Resize window
		var windowSize = {
			width: 	parseInt(eDimensions.width+10)+'px',
			height: parseInt(100*(eDimensions.height/dDimensions.height))+'%',
			left:	parseInt(((100*(dDimensions.width-eDimensions.width)/dDimensions.width))/2)+'%',
			top:	parseInt(((100*(dDimensions.height-eDimensions.height)/dDimensions.height))/2)+'%'
		}
		this.pwindow.setStyle(windowSize);
		// Resize dialog
		var pwHeight 	= this.pwindow.getHeight();
		var dialogSize 	= {height: parseInt(100*((pwHeight-tHeight)/pwHeight))+'%'}
		this.dialog.setStyle(dialogSize);
	},
	
	reset: function() {
		this.content.update('').hide();
	},

	addLink: function(link) {
		Event.observe(link, 'click', this.load.bindAsEventListener(this)); 		
	},
	
	load: function(event) {
		Event.stop(event);
		this.url = Event.findElement(event, 'a').href;
		this.show();
	},
	
	show: function() {
		var effect = new Effect.Appear(this.overlay, { duration: 0.3, to: 0.7, afterFinish: this.showAfter.bindAsEventListener(this) });
	},
	
	close: function(event) {
		if(false !== this.closable) {
			this.pwindow.hide();
			this.overlay.hide();
			this.reset();
		}	
		if(event){
			Event.stop(event);
		}
	},
	
	redirect: function(transport) {
		var response = this.evalTransport(transport);
		window.location = response.redirect;
		this.close(false);
	},
	
	showAfter: function(event) { 
		var effect = new Effect.Appear(this.pwindow, { duration: 0.3, afterFinish: this.finish.bindAsEventListener(this) });
	},

	finish: function(event) {},
	display: function(event) {},
	showLoader: function(event) {},
	hideLoader: function(event) {}
});

/**************************** PODBOX AJAX OVERLAY ********************************/
PodBox.Ajax = Class.create(PodBox.Overlay, {

	initialize: function($super, closable, show, link) {
		var content = new Element('div').addClassName('podbox-content');
		$super(content, closable, show, link);
	},
		
	display: function($super, transport) {
		$super(transport);
		this.content.update(transport.responseText).show();
		this.resize();
	},
	
	showAfter: function($super, event) {
		$super(event);
		var request = new Ajax.Request(this.url, {
	   		method: 	'post',
	   		parameters:	{isAjax: 1},
	   		onCreate: 	this.showLoader.bindAsEventListener(this),
	  		onComplete: this.hideLoader.bindAsEventListener(this),
	  		onSuccess:	this.display.bindAsEventListener(this),
	  		on403: 		this.redirect.bindAsEventListener(this)
		});
	}
});

/**************************** PODBOX IFRAME OVERLAY ********************************/
PodBox.IFrame = Class.create(PodBox.Overlay, {

	initialize: function($super, closable, show, link) {
		var content = new Element('iframe', { 'frameborder': '0'}).addClassName('podbox-iframe');
		$super(content, closable, show, link);
	},
	
	reset: function() {
		this.content.src = '';
		this.content.hide();
	},
	
	showAfter: function($super, event) {
		$super(event);
		this.content.src = this.url+'?isAjax=1';
		this.content.show();
	},
	
	finish: function($super, event) {
		this.resize();
	}
});


/**************************** INITIALIZE ********************************/
Event.observe(window, 'load', function() { 
	box 	= new PodBox.Ajax(true, false, 'podbox');
	frame 	= new PodBox.IFrame(true, false, 'podframe');
});