var color = '';

var color_changeable = true;

var temporary_thermos = 1;
var temporary_thermos2 = 1;
var temporary_thermos_img = '';

function thermos_choose_color_load() {
	if(temporary_thermos == 13){
		temporary_thermos = 1;
		temporary_thermos2++;
	}
	
	if(temporary_thermos2 <= 5){
		if(temporary_thermos_img == '' || (temporary_thermos_img.width != undefined && temporary_thermos_img.height != undefined && temporary_thermos_img.width > 0 && temporary_thermos_img.height > 0)){
			temporary_thermos_img = new Image;
			
			if(temporary_thermos == 12){
				temporary_thermos_img.src = 'img/thermoses/thermos' + temporary_thermos2 + '_front.png';
			}else{
				temporary_thermos_img.src = 'img/thermoses/thermos' + temporary_thermos2 + '_front_color' + temporary_thermos + '.png';
			}
			
			temporary_thermos++;
		}
		
		setTimeout('thermos_choose_color_load()', 50);
	}else{
		//alert('LOADING READY!');
	}
}

function hide_thermos_sketch() {
	$('.thermos_sketch_front', $('#step_thermos_choose_color')).hide();
	$('.thermos_sketch_front_color', $('#step_thermos_choose_color')).hide();
	$('.thermos_front_cover', $('#step_thermos_choose_color')).hide();
}

function reset_thermos_choose_color() {
	color = '';
	
	hide_thermos_sketch();
	
	$('.thermos_sketch_front').attr('src', 'img/thermoses/front_cover.png');
	$('.thermos_sketch_front_color').attr('src', 'img/thermoses/front_cover.png');
	
	$('.color', $('#step_thermos_choose_color')).css('opacity', 1.0);
	
	$('#thermos_pms').attr('src', 'img/pms/tempty.png');
	
	$('#choose_color_next').css('opacity', 0.3);
}

function start_before_thermos_choose_color() {
	if(thermos == 'thermos1'){
		$('.thermos_sketch_front').attr('src', 'img/thermoses/thermos1_front.png');
	}else if(thermos == 'thermos2'){
		$('.thermos_sketch_front').attr('src', 'img/thermoses/thermos2_front.png');
	}else if(thermos == 'thermos3'){
		$('.thermos_sketch_front').attr('src', 'img/thermoses/thermos3_front.png');
	}else if(thermos == 'thermos4'){
		$('.thermos_sketch_front').attr('src', 'img/thermoses/thermos4_front.png');
	}else if(thermos == 'thermos5'){
		$('.thermos_sketch_front').attr('src', 'img/thermoses/thermos5_front.png');
	}
}

function start_after_thermos_choose_color() {
	$('.thermos_sketch_front', $('#step_thermos_choose_color')).fadeIn(400);
	$('.thermos_sketch_front_color', $('#step_thermos_choose_color')).fadeIn(400);
	$('.thermos_front_cover', $('#step_thermos_choose_color')).fadeIn(400);
}

function end_thermos_choose_color() {
	hide_thermos_sketch();
}

$('document').ready(
	function() {
		thermos_choose_color_load();
		
		$('.color', $('#step_thermos_choose_color')).hover(
			function() {
				$(this).css('border', '2px solid #EE1D23');
				
				$('#thermos_pms').attr('src', 'img/pms/t' + $(this).attr('id') + '.png');
			}, function() {
				$(this).css('border', '2px solid black');
				
				if(color == ''){
					$('#thermos_pms').attr('src', 'img/pms/tempty.png');
				}else{
					$('#thermos_pms').attr('src', 'img/pms/t' + color + '.png');
				}
			}
		);
		
		$('.color', $('#step_thermos_choose_color')).click(
			function() {
				if(color_changeable){
					color_changeable = false;
					
					color = $(this).attr('id');
					
					$('.color', $('#step_thermos_choose_color')).not(this).animate({'opacity': 0.3}, 400);
					$(this).animate({'opacity': 1.0}, 400);
					
					if(thermos == 'thermos1'){
						$('.thermos_sketch_front_color').attr('src', 'img/thermoses/thermos1_front_' + color + '.png');
					}else if(thermos == 'thermos2'){
						$('.thermos_sketch_front_color').attr('src', 'img/thermoses/thermos2_front_' + color + '.png');
					}else if(thermos == 'thermos3'){
						$('.thermos_sketch_front_color').attr('src', 'img/thermoses/thermos3_front_' + color + '.png');
					}else if(thermos == 'thermos4'){
						$('.thermos_sketch_front_color').attr('src', 'img/thermoses/thermos4_front_' + color + '.png');
					}else if(thermos == 'thermos5'){
						$('.thermos_sketch_front_color').attr('src', 'img/thermoses/thermos5_front_' + color + '.png');
					}
					
					setTimeout('color_changeable = true', 400);
					
					$('#choose_color_next').animate({'opacity': 1.0}, 400);
				}
			}
		);
		
		$('#choose_color_next').click(
			function() {
				if($(this).css('opacity') == 1){
					show_next();
				}
			}
		);
		
		$('.step_header_back', $('#step_thermos_choose_color')).click(
			function() {
				reset_steps('step_thermos_choose_color');
			}
		);
	}
);

