jQuery.fn.totalHeight = function() {
	var self = $(this);
	var height = self.height();
	var offsets = [
		self.css('border-top-width'),
		self.css('border-bottom-width'),
		//self.css('margin-top'),
		//self.css('margin-bottom'),
		self.css('padding-top'),
		self.css('padding-bottom')
	];
	
	if (offsets[0] == '0px') offsets[1] = offsets[0];
	if (offsets[2] == '0px') offsets[3] = offsets[0];
	if (offsets[4] == '0px') offsets[5] = offsets[0];
	
	jQuery.each(offsets, function(index, value) {
		value = parseInt(value);
		
		if (value) height += value;
	});
	
	return height;
};

jQuery.fn.totalWidth = function() {
	var self = $(this);
	var width = self.width();
	var offsets = [
		self.css('border-left-width'),
		self.css('border-right-width'),
		self.css('margin-left'),
		self.css('margin-right'),
		self.css('padding-left'),
		self.css('padding-right')
	];
	
	if (offsets[0] == '0px') offsets[1] = offsets[0];
	if (offsets[2] == '0px') offsets[3] = offsets[0];
	if (offsets[4] == '0px') offsets[5] = offsets[0];
	
	jQuery.each(offsets, function(index, value) {
		value = parseInt(value);
		
		if (value) width += value;
	});
	
	return width;
};


$(document).ready(function() {
	var url = $('script:first').attr('src').split('/workspace/scripts/')[0];
	var backdrop = $('<div />')
		.hide()
		.addClass('backdrop')
		.appendTo('body');
	
	// Point it at the HTTP handler:
	$.fn.bitter.defaults.handler = url + '/workspace/bitter/assets/jquery.bitter.php';
	
	// Use the 'tabsize-4' format:
	$.fn.bitter.defaults.format = 'tabsize-4';
	
	// Enable debug mode globally:
	$.fn.bitter.defaults.debug = true;
	
	$('pre.language-css').bitter({
		language:	'css'
	});
	$('pre.language-js').bitter({
		language:	'js'
	});
	$('pre.language-html').bitter({
		language:	'html'
	});
	$('pre.language-php').bitter({
		language:	'php'
	});
	$('pre.language-xml').bitter({
		language:	'xml'
	});
	$('pre.language-xsl').bitter({
		language:	'xsl'
	});
	
	// Image lightbox:
	$('img').load(function() {
		var image = $(this);
		var clone = image.clone()
			.hide()
			.addClass('popup')
			.insertAfter(backdrop);
		var clone_height = clone.totalHeight();
		var clone_width = clone.totalWidth();
		var image_height = image.totalHeight();
		var image_width = image.totalWidth();
		
		if (clone.width() <= image.width()) {
			clone.remove(); return;
		}
		
		image.addClass('zoomable');
		image.click(function() {
			var stack = backdrop.add(clone);
			var start = function() {
				stack.bind('click', remove);
			};
			var stop = function() {
				stack.hide();
			};
			var remove = function() {
				stack.unbind('click', remove);
				stack.animate(
					{
						'opacity':	'0'
					},
					'fast', 'linear', stop
				);
			};
			var position = image.offset();
			var top = position.top - ((clone_height - image_height) / 2);
			var left = position.left - ((clone_width - image_width) / 2);
			
			clone
				.css('top', top + 'px')
				.css('left', left + 'px');
			
			stack
				.css('opacity', '0')
				.css('z-index', '10')
				.show();
			
			stack.animate(
				{
					'opacity':	'1'
				},
				'fast', 'linear', start
			);
		});
	});
})