(function($){

var defaultConfig = {
	back: true,
	offset: 0,
	bg: false
};

$.bb = $.borderbox = function()
{};

function configure(config)
{
	config = $.extend({}, defaultConfig, config || {});
	if (this.length > 1) {
		this.each(function(){
			$(this).bb(config);
		});
		return this;
	}

	if ($.isArray(config.offset)) {
		config.offset = {
			top: config.offset[0],
			right: config.offset[1],
			bottom: config.offset[2],
			left: config.offset[3]
		};
	}
	else if (typeof config.offset !== 'object') {
		config.offset = {
			top: config.offset,
			right: config.offset,
			bottom: config.offset,
			left: config.offset
		};
	}

	return config;
}

$.fn.bb = $.fn.borderbox = function(config)
{
	config = configure(config);

	this.addClass('jbb-container');
	var body,
		border = {
			t: '<div class="jbb-border jbb-border-line jbb-border-line-h jbb-border-t"><div class="jbb-border-img"/></div>',
			r: '<div class="jbb-border jbb-border-line jbb-border-line-v jbb-border-r"><div class="jbb-border-img"/></div>',
			b: '<div class="jbb-border jbb-border-line jbb-border-line-h jbb-border-b"><div class="jbb-border-img"/></div>',
			l: '<div class="jbb-border jbb-border-line jbb-border-line-v jbb-border-l"><div class="jbb-border-img"/></div>',
			lt: '<div class="jbb-border jbb-border-corner jbb-border-lt"><div class="jbb-border-img"/></div>',
			rt: '<div class="jbb-border jbb-border-corner jbb-border-rt"><div class="jbb-border-img"/></div>',
			rb: '<div class="jbb-border jbb-border-corner jbb-border-rb"><div class="jbb-border-img"/></div>',
			lb: '<div class="jbb-border jbb-border-corner jbb-border-lb"><div class="jbb-border-img"/></div>'
		};

	switch (this.css('display')) {
		case 'block':
			body = this.wrapInner('<div class="jbb-body"/>').children();
			break;
		case 'inline':
		case 'inline-block':
			body = this.wrapInner('<span class="jbb-body"/>').children();
			break;
		default:
			throw new Error('kaka');
	}

	for (var i in border) {
		border[i] = config.back ? $(border[i]).prependTo(this) : $(border[i]).appendTo(this);
	}

	this[0].bb = {
		config: config,
		body: body,
		border: border
	};


	if (config.bg) {
		var bg = this[0].bb.bg = $('<div class="jbb-bg"/>').prependTo(this);
	}

	this.bbSync();

	return this;
};

$.fn.bbSync = function()
{
	var body = this[0].bb.body,
		border = this[0].bb.border,
		bg = this[0].bb.bg,
		config = this[0].bb.config,
		w = body.width(),
		h = body.height(),
		lt = [border.lt.width(), border.lt.height()],
		rt = [border.rt.width(), border.rt.height()],
		rb = [border.rb.width(), border.rb.height()],
		lb = [border.lb.width(), border.lb.height()],
		t = border.t.height(),
		r = border.r.width(),
		b = border.b.height(),
		l = border.l.width();

	border.t.css({
		width: w - lt[0] - rt[0] + config.offset.left + config.offset.right,
		left: lt[0] - config.offset.left,
		top: 0 - config.offset.top
	});
	border.r.css({
		height: h - rt[1] - rb[1] + config.offset.top + config.offset.bottom,
		top: rt[0] - config.offset.top,
		right: 0 - config.offset.right
	});
	border.b.css({
		width: w - lb[0] - rb[0] + config.offset.left + config.offset.right,
		left: lb[0] - config.offset.left,
		bottom: 0 - config.offset.bottom
	});
	border.l.css({
		height: h - lt[1] - lb[1] + config.offset.top + config.offset.bottom,
		top: lt[0] - config.offset.top,
		left: 0 - config.offset.left
	});

	border.lt.css({
		left: 0 - config.offset.left,
		top: 0 - config.offset.top
	});

	border.rt.css({
		right: 0 - config.offset.right,
		top: 0 - config.offset.top
	});

	border.rb.css({
		right: 0 - config.offset.right,
		bottom: 0 - config.offset.bottom
	});

	border.lb.css({
		left: 0 - config.offset.left,
		bottom: 0 - config.offset.bottom
	});

	if (config.bg) {
		bg.css({
			left: 0 + l - config.offset.left,
			top: 0 + t - config.offset.top,
			width: w - l - r + config.offset.left + config.offset.right,
			height: h - t - b + config.offset.top + config.offset.bottom
		});
	}
};

})(jQuery);