// topbox door: Maarten Hunink
// afhankelijk van ScrollTo

$.fn.topbox = function(options){
	
	var options = $.extend({}, $.fn.topbox.defaults, options);

	return this.each(function(){
		obj = $(this);
		
		obj.bind('click', function(){
			link = $(this).attr('href');
			if(!$('#topbox').length){
				$('body').append('<div id="topboxOverlay" style="display: none;"></div>')
				$('body').append('<div id="topbox" style="display: none;"><div id="topboxContentWrapper"><div id="topboxClose"></div><div id="topboxContent"></div></div></div>')
			}
			
			// creating the overlay
			var d_height = $(document).height();
			var d_width = $(document).width();	

					
			$('#topboxOverlay').css({height : d_height, width: d_width, display: 'block'});
			
			// setting width of content
			if(options.width){
				$('#topboxContentWrapper').width(options.width);
			} else {
				$('#topboxContentWrapper').width('');
			}
			
			// close on click outside of box
			$('#topboxClose').bind('click', function(){
				$.fn.topbox.close();
			})				
			
			// scrolling up just in case
			$.scrollTo(0, 200)	
			
			
			// gettin the content
			$.ajax({
				url: link,
				success: function(result){
					$('#topboxContent').html(result)
										
					$('#topbox').effect('slide', {direction: 'up'}).bind('click', function(event){
						if($(event.target).is('#topbox') && options.overlayClose){
							$.fn.topbox.close();							
						}
					})
					
					// doing the callback
					options.onComplete.call(this); 
				}
			})
			return false;
		})
	})
}

$.fn.topbox.defaults = {
	width: '',
	overlayClose: true,
	onComplete : function(){}
};

$.fn.topbox.close = function(){
	$('#topboxOverlay').css('display', 'none')
	$('#topbox').effect('slide', {direction: 'up', mode: 'hide'});
	$('#topbox, #topboxClose').unbind('click')
}