var hat_arr = Array(5);
var text_arr = Array();
var curr_step = 0;
$(function() {
	$('#unactive_shadow').css('opacity','0.6');
	$('#unactive_shadow').show();
});

hat_arr[1] = 'G';

function ajaxRequest(urli,datai) {
	var ajvote = $.ajax({
		  type: "get",
		  url: urli,
		  data: datai,
		  dataType: "json",
		  success: getResponse,
		  beforeSend: showLoad
});
}
function getResponse(oReq) {
	var json = oReq;
	if (json.status == 1){
		var price = parseFloat(json.price);
		switch (curr_step){
			case 1: price+=parseFloat(json.color.price);break;
			case 2: price+=parseFloat(json.color.price)+parseFloat(json.finish.price);break;
			case 3: price+=parseFloat(json.color.price)+parseFloat(json.finish.price)+parseFloat(json.shape.price);break;
			case 4:
			case 5:
				price+=parseFloat(json.color.price)+parseFloat(json.finish.price)+parseFloat(json.shape.price)+parseFloat(json.band.price);
			break;
		
		}
		
		$('#hat_price').html(price);
		$('#option_productid').val(json.id_hat);
		
		$('#option_color').attr('name','option['+json.color.id+']');
		$('#option_color').val(json.color.name_id);
		
		
		$('#option_finish').attr('name','option['+json.finish.id+']');
		$('#option_finish').val(json.finish.name_id);
		
		
		$('#option_shape').attr('name','option['+json.shape.id+']');
		$('#option_shape').val(json.shape.name_id);
		
		
		$('#option_band').attr('name','option['+json.band.id+']');
		$('#option_band').val(json.band.name_id);
		
		
		$('#option_size').attr('name','option['+json.size.id+']');
		$('#option_size').html('');
		for (i in json.size.values){
			$('#option_size').append('<option value="'+json.size.values[i].id+'">'+json.size.values[i].size_val+json.size.values[i].price+'</option>');
		}
		
		
	}
	if (curr_step!=5) $('#hat_price_div').css('visibility','visible');
	else $('#hat_order_form').css('visibility','visible');
	
}
function showLoad () {

	//$('#vote_load').css('display', 'block');
}


function HideBigBand(){
	$('#hats_band_table').show();
	$('#hats_band_div').hide();
}

function LoadHat(hat_arr){
	addr = '/themes/'+settings['theme']+'/images/hats/'+hat_arr[1]+hat_arr[2]+hat_arr[3]+hat_arr[4]+'_'+hat_arr[5]+'.jpg';
	var objImagePreloader = new Image();
	
	objImagePreloader.onload = function() {
		$('#big_hat').attr('src',addr);
		objImagePreloader.onload=function(){};
		//$('#ico-loading').hide();
		$('#big_hat').animate({ opacity: '1' }, 700);
	}

	$('#big_hat').animate({ opacity: '0' }, 700, function(){
		//$('#ico-loading').show();
		objImagePreloader.src = addr;
	});
}
function ChangeText(text_arr){
	if (text_arr['style_name']!='') $('#hat_style_name').text(text_arr['style_name']);
	if (text_arr['type_zippy']!=''){
	   if (text_arr['type_zippy']=='BIG MINNIE')$('#hat_type_face').text('Kassi');
	   if (text_arr['type_zippy']=='GUS') $('#hat_type_face').text('Zippy');
	   if (text_arr['type_zippy']=='SWIFT KICK') $('#hat_type_face').text('Nancy');
	   $('#hat_type_zippy').text(text_arr['type_zippy']);
	}
	if (text_arr['color']!='') $('#hat_color').text(text_arr['color']);
	if (text_arr['finish']!='') $('#hat_finish').text(text_arr['finish']);
	if (text_arr['shape']!='') $('#hat_shape').text(text_arr['shape']);
	if (text_arr['band_style']!='') $('#hat_band_style').text(text_arr['band_style']);
}
function ChangeHat(step, action){
	
	var elem_arr = {
		"1" : ['S', 'G', 'B'],
		"2" : ['B', 'C', 'S'],
		"3" : ['C', 'D'],
		"4" : ['R', 'T'],
		"5" : ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '13', '14', '15', '16']

	}
	
	
	for(k=step+1;k<=5;k++){
		if(k!=4){
			for (i in elem_arr[k]){
				$('#img_'+k+elem_arr[k][i]).css('border','none');
			}
		}else{
			for (i in elem_arr[k]){
				$('#a_'+k+elem_arr[k][i]).css('text-decoration','underline');
			}
		}
	}
		
	switch (step){
		case 1:
			
			curr_step = 1;
			$('#unactive_shadow').show();
			HideBigBand();
			$('#unactive_shadow').css('height','375px').css('margin-top','273px');
			hat_arr[1]=action;hat_arr[2]='S';hat_arr[3]='C';hat_arr[4]='R';hat_arr[5]='00';
						
				
			switch (action){
				case 'S':
				text_arr['style_name']='Swift Kick';
				text_arr['type_zippy']='SWIFT KICK';

				break;
				case 'G':
					text_arr['style_name']='Gus';
					text_arr['type_zippy']='GUS';
				break;
				case 'B':
					text_arr['style_name']='Big Minnie';
					text_arr['type_zippy']='BIG MINNIE';
				break;
			}
			
			/*text_arr['color']='Silverbelly';
			text_arr['finish']='Clean';
			text_arr['shape']='Relaxed';
			text_arr['band_style']='No style';*/
			
			text_arr['color']='---';
			text_arr['finish']='---';
			text_arr['shape']='---';
			text_arr['band_style']='---';
			
			ChangeText(text_arr);
			$('#hat_order_form').css('visibility','hidden');
			LoadHat(hat_arr);
			
			HatOrderFormOn();
		
		break;
		case 2:			
			curr_step = 2;
			$('#unactive_shadow').show();
			HideBigBand();
			$('#unactive_shadow').css('height','275px').css('margin-top','376px');
			hat_arr[2]=action;hat_arr[3]='C';hat_arr[4]='R';hat_arr[5]='00';

			switch (action){
				case 'B':
					text_arr['color']='Black';
				break;
				case 'C':
					text_arr['color']='Chocolate';				
				break;
				case 'S':
					text_arr['color']='Silverbelly';				
				break;
			}
			
			/*text_arr['finish']='Clean';
			text_arr['shape']='Relaxed';
			text_arr['band_style']='No style';*/
			
			text_arr['finish']='---';
			text_arr['shape']='---';
			text_arr['band_style']='---';
			
			ChangeText(text_arr);
			$('#hat_order_form').css('visibility','hidden');
			LoadHat(hat_arr);
			
			HatOrderFormOn();
		
		break;
		case 3:
			
			curr_step = 3;
			$('#unactive_shadow').show();
			HideBigBand();
			$('#unactive_shadow').css('height','230px').css('margin-top','424px');
			hat_arr[3]=action;hat_arr[4]='R';hat_arr[5]='00';
			switch (action){
				case 'C':
					text_arr['finish']='Clean';
				break;
				case 'D':
					text_arr['finish']='Distressed';				
				break;
			}
			
			/*text_arr['shape']='Relaxed';
			text_arr['band_style']='No style';*/
			
			text_arr['shape']='---';
			text_arr['band_style']='---';
			
			ChangeText(text_arr);
			
			$('#hat_order_form').css('visibility','hidden');
			LoadHat(hat_arr);
			
			HatOrderFormOn();
		
		break;
		case 4:
			curr_step = 4;
			$('#unactive_shadow').hide();
			HideBigBand()
			
			hat_arr[4]=action;hat_arr[5]='00';
			switch (action){
				case 'R':
					text_arr['shape']='Relaxed';
				break;
				case 'T':
					text_arr['shape']='Tight';				
				break;
			}
			/*text_arr['band_style']='No style';*/
			text_arr['band_style']='---';
			ChangeText(text_arr);
			$('#hat_order_form').css('visibility','hidden');
			LoadHat(hat_arr);
			
			HatOrderFormOn();
			
			//$('#productid').val(hat_arr[1]+hat_arr[2]+hat_arr[3]+hat_arr[4]+'_'+hat_arr[5]);
			//$('#hat_order_form').css('visibility','visible');
		
		break;
		case 5:
			curr_step = 5;
			$('#hats_band_table').hide();
			hat_arr[5]=action;
			text_arr['band_style']=action;
			ChangeText(text_arr);
			LoadHat(hat_arr);
			
			var band_addr = '/themes/'+settings['theme']+'/images/BANDS/'+action+'.jpg';
			$('#hats_band_img').attr('src',band_addr);
			$('#hats_band_div').show();
			
			$('#productid').val(hat_arr[1]+hat_arr[2]+hat_arr[3]+hat_arr[4]+'_'+hat_arr[5]);
			HatOrderFormOn();
			//$('#hat_order_form').css('visibility','visible');

		break;
	}
	
	
	if(step!=4){
		for (i in elem_arr[step]){
			$('#img_'+step+elem_arr[step][i]).css('border','none');
			//if (i==1)$('#img_'+step+elem_arr[step][i]+'1').css('border','none');
		}
		if (step!=1)$('#img_'+step+action).css('border','1px solid #555555');
		else $('#img_'+step+action).css('border-top','1px solid #555555').css('border-right','1px solid #555555').css('border-left','1px solid #555555');
		
		
		//if (step==1)$('#img_'+step+action+'1').css('border','1px solid #555555');
	}else{
		for (i in elem_arr[step]){
			$('#a_'+step+elem_arr[step][i]).css('text-decoration','underline');
		}
		$('#a_'+step+action).css('text-decoration','none');
	}
	
}

function HatOrderFormOn(){
	var send_data = '&p='+hat_arr[1]+hat_arr[2]+hat_arr[3]+hat_arr[4]+'_'+hat_arr[5];
	ajaxRequest(settings['shopurl']+'index.php', 'l=get_hat_info'+send_data);

}


function ajaxZippy(urli,datai) {
	var ajvote = $.ajax({
		  type: "get",
		  url: urli,
		  data: datai,
		  dataType: "json",
		  success: getResponseZippy,
		  beforeSend: showLoad
});
}
function getResponseZippy(oReq) {
	var json = oReq;
	if (json.status == 1){
		addr = settings['shopurl']+'images/products/'+json.large_image;
		
		var objZippyImagePreloader = new Image();
		objZippyImagePreloader.onload = function() {
			$('#unactive_shadow').html('<a href="javascript://" onclick="HideZippy();"><img src="'+addr+'" /></a>');
			objZippyImagePreloader.onload=function(){};
			$('#unactive_shadow').css('opacity','1');
			$('#unactive_shadow').show();
		}

		objZippyImagePreloader.src = addr;
	}
	
}


function ShowZippy(){
	$('#right_block').css('margin-left','0');
	$('#unactive_shadow').css('height','648px').css('margin-top','0');
	
	$hat_id = 0;
	switch (hat_arr[1]){
		case 'S': $hat_id = 1; break;
		case 'G': $hat_id = 2; break;
		case 'B': $hat_id = 3; break;
	}
	
	ajaxZippy(settings['shopurl']+'index.php', 'l=get_product_info&p='+$hat_id+'&c=3');
	

}
function HideZippy(){
	$('#unactive_shadow').html('');
	$('#right_block').css('margin-left','3px');
	$('#unactive_shadow').css('opacity','0.6');
	
	switch (curr_step){
		case 0: $('#unactive_shadow').css('height','490px').css('margin-top','160px'); break;
		case 1: $('#unactive_shadow').css('height','375px').css('margin-top','273px'); break;
		case 2: $('#unactive_shadow').css('height','275px').css('margin-top','376px'); break;
		case 3: $('#unactive_shadow').css('height','230px').css('margin-top','424px'); break;
		case 4: $('#unactive_shadow').hide(); break;
		case 5: $('#unactive_shadow').hide(); break;
	}
	
}

var objPopup1ImagePreloader = new Image();
var objPopup2ImagePreloader = new Image();
objPopup1ImagePreloader.src = "themes/"+settings['theme']+"/images/choose-size-hat-notype.jpg";
objPopup2ImagePreloader.src = "themes/"+settings['theme']+"/images/about-hats-notype.jpg";

function ShowSizeDiv(){
	var h = $('#hat_choise_td').height();
	var w = $('#hat_choise_td').width();
	$('#size_div').css('height', h+'px').css('width', w+'px').show();
}

function HideSizeDiv(){
	$('#size_div').hide();
}

function ShowAboutDiv(){
	var h = $('#hat_choise_td').height();
	var w = $('#hat_choise_td').width();
	$('#about_div').css('height', h+'px').css('width', w+'px').show();
}

function HideAboutDiv(){
	$('#about_div').hide();
}

function showPopup(type){
	var img = $('#img_1'+type+'1').offset();
	$('#popup'+type).css('top',img.top+16+'px').css('left',img.left).toggle();
}

function hidePopup(type){
	$('#popup'+type).hide();
}