var Popup = new Class({
	
	Implements: [Chain, Options, Events],

	options: {
		heading: "Oops, no title!",		// The Title of the popup (can be html)
		message: "Oops, no message!",		// If it's not an iFrame popup you add your message here (can be html)
		footerMessage: null,			// Keep it short and sweet if used (can be html)
		url: null,					// If it's an iFrame set the url
		width: null,					// Popup width
		height: null,					// Popup height (usually leave null for auto height)
		opacity: 0.8,					// Opacity for the popup mask
		bgColor: "#000000",				// Popup mask color
		type: "alert",					// Type of popup (alert, confirm or iframe)
		focusElement: null,				// An element in the popup to give focus to?
		autoClose: false,				// Automatically close the popup?
		autoCloseTime: 3000,			// Autoclose delay
		showButtons: true,				// Show the buttons? (only consider using with autoClose obviously)
		confirmBtnText: "OK",			// Text for confirm button
		cancelBtnText: null,			// Text for cancel button
		onOpen: $empty,				// Event to fire when popup shows
		onClosed: $empty,				// Event to fire when popup is closed
		onBeforeClosed: $empty,			// Event to fire before popup is closed
		onConfirm: $empty,				// Event to fire when user confirms
		onCancel: $empty,				// Event to fire when user cancels
		isError: false					// Class for popup (popup or popuperror)
		//confirmOnClose: false			// Don't put your function in onConfirm, use the close method
	},
	
	//initialization
	initialize: function(options) {
		this.setOptions(options);
		var timestamp = new Date();
		this.options.uniqueId = timestamp.getTime();
		this.wincoords = $(document.body).getCoordinates();
		this.maxwidth = (this.wincoords.width > 1020)?1000:Math.round(this.wincoords.width*.95)-80;
		this.maxheight = (this.wincoords.height > 885)?820:Math.round(this.wincoords.height*.95)-125;
		this.popupHeight = ($(window).getScrollSize().y > $(window).getSize().y)?$(window).getScrollSize().y:$(window).getSize().y;
		if(this.options.type == "iframe" && !this.options.width)
			this.options.width = this.maxwidth;
		if(!this.options.width)
			this.options.width = 350;
		this.popupClass = (this.options.isError==false)?'popup':'popup_error';	
		this.html = '<div class="popup_content_wrapper" id="popup_content_wrapper" style="width:100%; height: 100%">'
					+'<div class="popup_tl"></div>'
					 +'<div class="popup_t" id="popup_t" style="width:100%"></div>'
					 +'<div class="popup_tr"></div>'
					 +'<div class="popup_l" id="popup_l"></div>'
					 +'<div class="popup_r" id="popup_r"></div>'
					 +'<div class="popup_bl"></div>'
					 +'<div class="popup_b" id="popup_b" style="width:100%"></div>'
					 +'<div class="popup_br"></div>'
					 +'<div class="popup_header" id="popup_header"></div>'
					 +'<div class="popup_body" id="popup_body"></div>'
					 +'<div class="popup_footer" id="popup_footer">'
						 +'<div class="popup_buttons" id="popup_buttons"></div>'
						 +'<div class="popup_footer_message" id="popup_footer_message"></div>'
						 +'<div class="clearfix"></div>'
					 +'</div>'
					 +'<div class="clearfix"></div>'
				 +'</div>';
		
		//$$('.popup_container').each(function(el){
		//	el.destroy();
		//});
	
		
		// Create the Popup Container
		this.popup_container = new Element('div', {
			'class':'popup_container',
			'id': 'popup_container'+this.options.uniqueId
		}).inject($(document.body), 'top');
		
		this.popup_container.setStyles({
			'margin-left': '0',
			'margin-top': '0',
			'position': 'absolute',
			'top': 0,
			'left': 0,
			'display': 'block',
			'height': this.popupHeight,
			'width': '100%',
			'opacity': 0
		});
		
		// Create the Popup Mask
		this.mask = new Element('div', {
			'class':'popup_mask',
			'id': 'popup'
		}).inject($('popup_container'+this.options.uniqueId), 'top');
		
		this.mask.setStyles({
			'margin-left': '0',
			'margin-top': '0',
			'display': 'block',
			'background-color': this.options.bgColor,
			'height': this.popupHeight,
			'width': '100%',
			'opacity': this.options.opacity
		});
		
		this.popup_window = new Element('div', {
			'class': 'popup_window',
			'id': 'popup_window'
		}).inject($('popup'), 'after');
		this.popup_window.addClass(this.popupClass);
		this.popup_window.setStyle('width', this.options.width);
		
		this.popup_window.set('html', this.html);
		
		this.confirmBtn = new Element('a', {
			'class':'pos_action_btn',
			'href':'#',
			'id':'popup_confirm'
		});
		this.confirmBtn.set('text', this.options.confirmBtnText);
				
		switch (this.options.type){
			case "alert":
				if(this.options.cancelBtnText){
					this.cancelBtn = new Element('a', {
						'class':'neg_action_btn',
						'href':'#',
						'id':'popup_cancel',
						'text': this.options.cancelBtnText
					});
				}
				break;
			
			case "confirm":
				this.cancelBtn = new Element('a', {
					'class':'neg_action_btn',
					'href':'#',
					'id':'popup_cancel',
					'text': (this.options.cancelBtnText)?this.options.cancelBtnText:'Cancel'
				});
				break;
				
			case "ajax":
				if(this.options.cancelBtnText){
					this.cancelBtn = new Element('a', {
						'class':'neg_action_btn',
						'href':'#',
						'id':'popup_cancel',
						'text': this.options.cancelBtnText
					});
				}
				break;
			
			case "iframe":
				// Should be no need for anything but confirm button?
				break;
				
			case "error":
				// Should be no need for anything but confirm button?
				break;
		}
				
		var divCap = new Element('div');
		if(this.confirmBtn)
			divCap.clone().inject(this.confirmBtn, 'top');
		if(this.cancelBtn)
			divCap.clone().inject(this.cancelBtn, 'top');
		
		var buttons=$('popup_buttons');
		if(this.cancelBtn)
			this.cancelBtn.inject(buttons, 'top');
		this.confirmBtn.inject(buttons, 'top');
	},
	
	show: function(){
		
		if(this.options.footerMessage)
			$('popup_footer_message').set('html', this.options.footerMessage);
			
		$('popup_header').set('html', this.options.heading);
			
		var contentwrapper=$('popup_content_wrapper');
		var content=$('popup_body');
				
		if(this.options.type == 'iframe'){
			content.set('html', '<iframe src="'+this.options.url+'" id="popup_iframe" onload="$(\'popup_loading_bg\').destroy();" frameborder="0" width="100%" style="z-index:100"></iframe>');
			this.render();
		}
		else if(this.options.type == 'ajax'){
			var request = new Request({
				url: this.options.url,
				method: 'get',
				evalResponse: 'true',
				onComplete: function(response){  
					content.set('html', response);
					this.render();
				}.bind(this)
			}).send();
		}
		else{
			if($type(this.options.message) == 'element'){
				this.copyEl = this.options.message.clone();
				this.el = this.options.message;
				this.copyEl.set('id', this.el.get('id')+'_clone');
				this.copyEl.inject(this.el, 'after');
				this.el.inject(content, 'top');
				if(this.el.hasClass('hidden_popup_content'))
					this.el.setStyle('display', 'block');
				this.render();
			}
			else{
				content.set('html', this.options.message);
				this.render();
			}
		}
	},
	
	render: function(){
		var contentwrapper=$('popup_content_wrapper');
		var content=$('popup_body');
		
		this.popup_window.setStyles({
			'left': -3000,
			'display': 'block'
		});
		
		if(this.options.type == "iframe"){
			if(!this.options.height){
				this.popup_window.setStyle('height', this.maxheight);
				$('popup_iframe').set('height', this.maxheight - 71 - $('popup_header').getCoordinates().height);
			}
			else{
				this.popup_window.setStyle('height', this.options.height);
				$('popup_iframe').set('height', this.options.height - 71 - $('popup_header').getCoordinates().height);
			}
		}
		else
			this.popup_window.setStyle('height', contentwrapper.getSize().y);
		
		this.popup_window.setStyles({
			'left': (this.mask.getSize().x - this.options.width)/2,
			'top': (this.wincoords.height/2 - this.popup_window.getSize().y/2)
		});
		
		if(this.options.focusElement)
			$(this.options.focusElement).focus();
		
		
		this.fx = new Fx.Tween($('popup_container'+this.options.uniqueId), {
			'property': 'opacity',
			'duration': 500,
			'onComplete': function(){
				this.open();
			}.bind(this)
		}).start(0,1);	
		
		this.loadingDiv = new Element('div', {
			'class': 'popup_loading_bg',
			'id': 'popup_loading_bg',
			'styles': {
				'height': content.getCoordinates().height - 20,
				'width': content.getCoordinates().width -20,
				'position': 'absolute',
				'z-index': '10000'
			}
		}).inject($('popup_body'), 'top');
		
		$('popup_confirm').addEvent('click', function(e){ 
			if(e) e.preventDefault();
			this.confirm();
		}.bind(this));
		
		if($('popup_cancel')){
			$('popup_cancel').addEvent('click', function(e){ 
				if(e) e.preventDefault();
				this.cancel();
			}.bind(this));
		}
		
		if(this.options.showButtons === false){
			$('popup_buttons').destroy();
		}
		
		if(this.options.autoClose){
			(function(){ 
				this.beforeclosed();
			}.bind(this)).delay(this.options.autoCloseTime);
		}
			
	},
	
	beforeopen: function(){
		this.fireEvent('beforeopen');
	},
	
	open: function(){
		this.fireEvent('open');
		if(this.options.type != "iframe")
			$('popup_loading_bg').destroy();
	},
	
	confirm: function(){
		this.fireEvent('confirm');
		this.beforeclosed();
	},
	
	cancel: function(){
		this.fireEvent('cancel');
		this.beforeclosed();
	},
	
	beforeclosed: function(){
		this.fireEvent('beforeclosed');
		this.closed();
	},
	
	closed: function(){
		if($('popup_container'+this.options.uniqueId)){
			this.fx = new Fx.Tween($('popup_container'+this.options.uniqueId), {
				'property': 'opacity',
				'duration': 300,
				'onComplete': function(){
					if($type(this.options.message) == 'element'){
						this.options.message.inject(this.copyEl, 'after');
						this.copyEl.destroy();
						if(this.el.hasClass('hidden_popup_content'))
							this.el.setStyle('display', 'none');
						if($('popup_container'+this.options.uniqueId))
							$('popup_container'+this.options.uniqueId).destroy();
						this.fireEvent('closed');
					}
					else{
						if($('popup_container'+this.options.uniqueId))
							$('popup_container'+this.options.uniqueId).destroy();
						this.fireEvent('closed');
					}
				}.bind(this)
			}).start(1,0);
		}
	},
	
	resize: function(width, height){
		this.popup_window.setStyles({
			'width': width,
			'height': height + 71 + $('popup_header').getCoordinates().height,
			'left': (this.mask.getSize().x - width)/2,
			'top': (this.wincoords.height/2 - height/2)
		});
		if(this.options.type == "iframe")
			$('popup_iframe').set('height', height);
	}
});