jQuery.fn.graphicInput = function(_options){

	var _options = jQuery.extend({
		new_element: '<div class="checkbox"></div>',
		onClass: 'checkbox_on'
	}, _options);

	return $(this).each(function(){
		var el = $(this);
		var el_name = $(el).attr('name');
		var el_type = $(el).attr('type');
		
		var new_object = jQuery(_options.new_element);
		
		if (el_type == "checkbox")
		{			
			new_object.click(function(){
				$(this).toggleClass(_options.onClass);
				if (new_object.hasClass(_options.onClass))
				{
					el.attr('checked', true);
				}
				else
					el.attr('checked', false);
			});
		}
		else if (el_type == "radio")
		{
			var el_name = $(this).attr('name');
			var el_id = $(this).attr('id');
			var el_checked = $(this).attr('checked');
			$(new_object).attr('rel', el_name);
			$(new_object).attr('id',el_id);
			
			if (el_checked)
				$(new_object).addClass(_options.onClass);
			
			/* Grafisch gedoe */
			new_object.click(function(){
				$('[rel='+$(this).attr('rel')+']').removeClass(_options.onClass);
				$(this).toggleClass(_options.onClass);
				
				$('input[name='+$(this).attr('rel')+']').attr('checked', false);
				$('input[id='+$(this).attr('id')+']').attr('checked', true);
			});
		}
		
		el.hide();
		new_object.insertBefore(el);
	});
	
}

$(document).ready(function(){

	$(".checkbox-box input").graphicInput({
		new_element: '<em class="grapCheckBox"></em>',
		onClass: 'grapCheckBox-on'
	});
});