$(document).ready(function(){

	var strChecked = '/bilder/gif/lager_exempel_gron.png';
	var strUnchecked = '/bilder/gif/lager_exempel_gul.png';

	$('.checkbox_replace').each(function(){
		// Byt ut checkbox mot bild
		$(this).css('display', 'none');
		if ($(this).attr('checked') == true) {
			img = strChecked;
		} else {
			img = strUnchecked;
		}
		$(this).after('<img src="'+img+'" id="check_'+$(this).val()+'">');
		$('#check_'+$(this).val()).css('vertical-align', '-15%');
		
		// Ta bort <label> och ersätt med en vanlig sträng, blir knas annars
		var strText = $('#label_'+$(this).val()).text();
		$('#label_'+$(this).val()).after('<span style="cursor: pointer;" id="label_'+$(this).val()+'">'+strText+'</span>');
		$('#label_'+$(this).val()).remove()
		
		// Bind klickningar till att ändra checked/unchecked
		$('#check_'+$(this).val()).bind('click', $(this), changeValue);
		$('#label_'+$(this).val()).bind('click', $(this), changeValue);
	});

	function changeValue(e) {
		var strId = '#'+e.data[0].id;
		var intVal = e.data[0].value;
		if ($(strId).attr('checked') == true) {
			$(strId).attr('checked', false);
			$('#check_'+intVal).attr('src', strUnchecked);
		} else {
			$(strId).attr('checked', true);
			$('#check_'+intVal).attr('src', strChecked);
		}
		$('#check_'+intVal).bind('click', $(strId), changeValue);
		$('#label_'+intVal).bind('click', $(strId), changeValue);
	}

});