var bag = '';
var bag_changeable = true;

function reset_bag_choose_bag() {
	bag = '';
	
	$('.bag').css('opacity', 1.0);
	
	$('#choose_bag_next').css('opacity', 0.3);
}

$('document').ready(
	function() {
		$('.bag').hover(
			function() {
				$(this).css('border', '3px solid #EE1D23');
			}, function() {
				$(this).css('border', '3px solid black');
			}
		);
		
		$('.bag').click(
			function() {
				if(bag_changeable && bag != $(this).attr('id')){
					bag_changeable = false;
					
					bag = $(this).attr('id');
					
					$('.bag').stop().not(this).animate({'opacity': 0.3}, 400);
					$(this).stop().animate({'opacity': 1.0}, 400);
					
					$('#choose_bag_next').animate({'opacity': 1.0}, 400);
					
					setTimeout('bag_changeable = true', 400);
				}
			}
		);
		
		$('#bag1').tooltip(
			{
				delay: 0,
				showURL: false,
				fade: 250,
				bodyHandler: function() {
					return $('#bag1_tooltip').html();
				},
				fixPNG: true,
				track: true,
				left: -100
			}
		);
		
		$('#bag2').tooltip(
			{
				delay: 0,
				showURL: false,
				fade: 250,
				bodyHandler: function() {
					return $('#bag2_tooltip').html();
				},
				fixPNG: true,
				track: true,
				left: -100
			}
		);
		
		$('#bag3').tooltip(
			{
				delay: 0,
				showURL: false,
				fade: 250,
				bodyHandler: function() {
					return $('#bag3_tooltip').html();
				},
				fixPNG: true,
				track: true,
				left: -100
			}
		);
		
		$('#bag4').tooltip(
			{
				delay: 0,
				showURL: false,
				fade: 250,
				bodyHandler: function() {
					return $('#bag4_tooltip').html();
				},
				fixPNG: true,
				track: true,
				left: -100
			}
		);
		
		$('#choose_bag_next').click(
			function() {
				if($(this).css('opacity') == 1){
					show_next();
				}
			}
		);
		
		$('.step_header_back', $('#step_bag_choose_bag')).click(
			function() {
				reset_steps('step_bag_choose_bag');
			}
		);
	}
);