$(document).ready(function() {
	
	bindtryon();
	
	bindUploadClick();
	
	bindBigUploadClick();
	
});

$.extend({URLEncode:function(c){var o='';var x=0;c=c.toString();var r=/(^[a-zA-Z0-9_.]*)/;
  while(x<c.length){var m=r.exec(c.substr(x));
    if(m!=null && m.length>1 && m[1]!=''){o+=m[1];x+=m[1].length;
    }else{if(c[x]==' ')o+='+';else{var d=c.charCodeAt(x);var h=d.toString(16);
    o+='%'+(h.length<2?'0':'')+h.toUpperCase();}x++;}}return o;},
URLDecode:function(s){var o=s;var binVal,t;var r=/(%[^%]{2})/;
  while((m=r.exec(o))!=null && m.length>1 && m[1]!=''){b=parseInt(m[1].substr(1),16);
  t=String.fromCharCode(b);o=o.replace(m[1],t);}return o;}
});

function bindtryon() {

	$('.tryon').each(function() {
		
		$(this).click(function() {
			
			var hash 													= $(this).attr('tryonhash');
			
			var product_title_html										= $(this).parent().find('.tryon-product-title');
			
			var pd														= $('.pd-value').val();

			var src														= $('#face').attr('src');
			
			var facehash												= $('#face').attr('hash');
			
			if (hash && pd) {
				
				$.ajax({
			
					type: 'post',
					
					url: '/ajax/external/tryon',
					
					data: 'hash=' + hash + '&pd=' + pd + '&facehash=' + facehash,
					
					dataType: 'html',
					
					beforeSend: function() {
						
						$('.showroom .showroom-border').html('');
						
						$('html, body').animate({scrollTop:200}, 'slow');
						
					},
					
					success: function(html) {
						
						$('.showroom .showroom-border').html(html);
						
						$('.showroom .bottom-model').append(product_title_html.clone());
						
						bindHints();
						
						bindPdChangeClick();
						
					}
				
				});
				
			}
			
		});
		
		
	});
	
	$('.tryonfullsize').each(function() {
		
		$(this).click(function() {
			
			var hash 													= $(this).attr('tryonhash');
			
			var pd														= $('.pd-value').val();

			var src														= $('#face').attr('src');
			
			var facehash												= $('#face').attr('hash');
			
			if (hash && pd) {
				
				$.ajax({
			
					type: 'post',
					
					url: '/ajax/external/tryon_big',
					
					data: 'hash=' + hash + '&pd=' + pd + '&facehash=' + facehash,
					
					dataType: 'html',
					
					beforeSend: function() {
						
						$('.virtual-tryon .showroom-border').html('');
						
						$('html, body').animate({scrollTop:570}, 'slow');
						
					},
					
					success: function(html) {
						
						$('.virtual-tryon .showroom-border').html(html);
						
						//bindHints();
						
						bindPdChangeClickFullSize();
						
					}
				
				});
				
			}
			
		});
		
		
	});
	
}

function dofullsizetryon() {
	
	var hash 															= $('.tryonfullsize').attr('tryonhash');
			
	var pd																= $('.pd-value').val();

	var src																= $('#face').attr('src');
	
	var facehash														= $('#face').attr('hash');
	
	if (hash && pd) {
		
		$.ajax({
	
			type: 'post',
			
			url: '/ajax/external/tryon_big',
			
			data: 'hash=' + hash + '&pd=' + pd + '&facehash=' + facehash,
			
			dataType: 'html',
			
			beforeSend: function() {
				
				$('.virtual-tryon .showroom-border').html('');
				
				$('html, body').animate({scrollTop:570}, 'slow');
				
			},
			
			success: function(html) {
				
				$('.virtual-tryon .showroom-border').html(html);
				
				//bindHints();
				
				bindPdChangeClickFullSize();
				
			}
		
		});
		
	}
	
}

function bindFaces(i) {		
	
	var pos	= (i == $('#facesul li').length) ? i - 1 : i;
	
	$('#facesul').jcarousel({wrap: 'circular', start: pos, scroll: 1}); 
	
	$('.tryon-thumb-img').each(function() {
		
		$(this).find('img').hover(function() {
			
			$(this).parent().parent().attr('oa',$(this).parent().parent().css('opacity'));
			
			$(this).parent().parent().css('opacity',1);
			
		},
		function() {
			
			$(this).parent().parent().css('opacity',$(this).parent().parent().attr('oa'));
			
		});
		
		$(this).click(function() {
			
			$('.facethumbs li').each(function() {		
					
				$(this).css('opacity','0.6');
				
			});
			
			$(this).parent().css('opacity','1');
			$(this).parent().attr('oa','1');
			
			$('#framewithglass').remove();
			
			$('.ccw').hide();
			$('.cw').hide();
			
			$('#face').attr('src',$(this).attr('href'));
			$('#face').attr('hash',$(this).attr('facehash'));			
			
			$('.bottom-model').html('');
			
			$('.share-icons').html('');
			
			var hash 	= $(this).attr('facehash');
			
			var pd 		= $(this).attr('pd');
			
			$('.pd-value').val(pd);
			
			try {
			
				$('#pdtextvalue').html(pd);
				
			}
			catch(e) {}
			
			$.ajax({
				
				type: 'post',
					
				url: '/ajax/external/tryon/set_face_hash',
				
				data: 'hash=' + hash + '&pd=' + pd,
				
				dataType: 'html',								
				
				success: function(html) {}
				
			});
			
			return false;
			
		});
		
	});
	
	$('.facethumbs li').each(function() {
		
		if (i != $(this).attr('jcarouselindex')) {
			
			$(this).css('opacity','0.6');
			
		}
		
	});
	
	$('.upload_face_big a').click(function() {
		
		if ($('.upload_dialog').css('display') == 'none') {
			
			$('.upload_dialog').show();
			
			$('.upload_dialog').stop().animate({width: 586},1000,function() {});
			
		}								
		else {
			
			$('.upload_dialog').stop().animate({width: 0},1000,function() {$(this).hide();});						
			
		}
		
	});
	
	if (!$('.upload_face_big').length) {
		
		$('.upload_face a').click(function() {
		
			if ($('.upload_dialog').css('display') == 'none') {
				
				$('.upload_dialog').show();
				
				$('.upload_dialog').stop().animate({left: -589, width: 586},1000,function() {});
				
			}								
			else {
				
				$('.upload_dialog').stop().animate({left: 0, width: 0},1000,function() {$(this).hide();});						
				
			}
			
		});		
		
	}
	
}

function moveFrame(l, t, fullsize) {
	
	$(document).ready(function() {
		
		if (typeof(fullsize) != 'undefined') {
			
			var fs		= parseInt(fullsize);
			
		}
		else {
			
			var fs		= 0;
			
		}
		
		$("#framewithglass").animate({left: l, top: t}, 1000, function() {
			
			$("#framemover").hide("slow");
			
			var left 	= $('#framewithglass').css('left');
			
			var top 	= $('#framewithglass').css('top');
			
			$.ajax({
			
				type: 'post',
				
				url: '/ajax/external/tryon/set_coordinates',
				
				data: 'l=' + left + '&t=' + top + '&fs=' + fs,
				
				dataType: 'html',								
				
				success: function(html) {}
			
			});
			
		});
		
		$("#framewithglass").draggable({
		
			stop: function() {
				
				var left 	= $('#framewithglass').css('left');
				
				var top 	= $('#framewithglass').css('top');
				
				$.ajax({
				
					type: 'post',
					
					url: '/ajax/external/tryon/set_coordinates',
					
					data: 'l=' + left + '&t=' + top + '&fs=' + fs,
					
					dataType: 'html',								
					
					success: function(html) {}
				
				});
				
			}		
			
		});	
			
	});
	
}

function bindHints() {
	
	bindpdtooltip();
	
}

function bindpdtooltip() {
		
	$('.pd').tooltip({	
			
		showURL: false,
		left: -200,
		bodyHandler: function() {
			
			return '<div><p><b>PD</b> - расстояние между зрачками</p></div>';
			 
		} 
	
	});
	
}		

function clearFace() {
	
	$('.showroom-border').html('<img id="face" src="/i/blank.gif" alt="" />');
	
}

function loadFace() {
	
	$.ajax({
			
		type: 'get',
		
		url: '/ajax/external/tryon/face',
		
		dataType: 'html',
						
		success: function(html) {
			
			$('#face').replaceWith(html);
			
			bindPdChangeClick();
			
		}
	
	});
	
}

function loadFaceBig() {
	
	$.ajax({
			
		type: 'get',
		
		url: '/ajax/external/tryon/face_big',
		
		dataType: 'html',
						
		success: function(html) {
			
			$('#face').replaceWith(html);
			
			bindPdChangeClickFullSize();
			
			if (typeof(_______autotryon) != 'undefined' && _______autotryon == 1) {
				
				setTimeout(function() {dofullsizetryon();},1000);
				
			}
			
		}
	
	});
	
}

function loadFaces() {
	
	$.ajax({
		
		type: 'get',
		
		url: '/ajax/external/tryon/faces',
		
		dataType: 'html',
						
		success: function(html) {
			
			$('.faces').html(html);
			
		}
		
	});
	
}

function loadFacesBig() {
	
	$.ajax({
		
		type: 'get',
		
		url: '/ajax/external/tryon/faces_big',
		
		dataType: 'html',
						
		success: function(html) {
			
			$('.faces').html(html);
			
		}
		
	});
	
}		

var uploadCounter												= 0;

function bindUploadClick() {
	
	if ($('.button-upload').length) {
	
		$('.button-upload').click(function() {
									
			try {
			
				var up_error 										= 0;
			
				if ($('select[name="yourpd"]').val() == '') {
					
					$('select[name="yourpd"]').addClass('upload-error');
					
					up_error										= 1;
					
				}
				else {
					
					$('select[name="yourpd"]').removeClass('upload-error');
					
				}
				
				if ($('input[name="photo"]').val() == '') {
					
					$('input[name="photo"]').addClass('upload-error');
					
					up_error										= 1;
					
				}
				else {
					
					$('input[name="photo"]').removeClass('upload-error');
					
				}
				
				if (up_error) {
					
					return false;
					
				}
				
				// try to ajax upload
				
			}
			catch(e) {}						
			
		});
		
		// bind ajax
			
		$('#photo_upload_form').iframePostForm({
				
			iframeID: 'iframepostform',
			
			post : function () {
				
				// first of all lock the button
				
				$('.upload-loading-block').show();
				
				$('.button-upload').attr('disabled',1);
		
				$('.button-upload').addClass('button-upload-disabled');
			
			},
			complete : function (response) {										
				
				// unlock button																						
				
				$('.upload-loading-block').hide();
				
				$('.button-upload').attr('disabled',0);
		
				$('.button-upload').removeClass('button-upload-disabled');
				
				if (response == 'OK') {
					
					$('#photo_upload_form').get(0).reset();
					
					clearFace();
					loadFace();
					loadFaces();
					
					uploadClose();
					
				}
				else {
					
					$('#photo_upload_form').get(0).reset();
					
					// here will be a manual eyes detection
					
					// but now just display failure notification message
					
					$.ajax({
				
						type: 'get',
						url: '/ajax/external/tryon/erroruploadmessage',
						dataType: 'html',					
						
						success: function (html) {
						
							$.blockUI({
							
								message : html,
								
								css : {
									
									border: 'none',
									backgroundColor:'transparent',
									width:'500px',							
									margin:'0 0 0 -230px',
									left:'50%',
									top:'106px',
									cursor: 'default'					
								
								},
								
								overlayCSS : {
								
									background: 'url(\'/i/bg_block_ui.png\')',
									cursor: 'default'
								
								},
								
								applyPlatformOpacityRules : false,
								
								timeout : 120000
								
							});												
						
						}
						
					});
					
				}
			
			}
		
		});
		
	}	
		
}

function bindBigUploadClick() {
	
	if ($('.button-upload-big').length) {
	
		$('.button-upload-big').click(function() {
									
			try {
			
				var up_error 										= 0;
			
				if ($('select[name="yourpd"]').val() == '') {
					
					$('select[name="yourpd"]').addClass('upload-error');
					
					up_error										= 1;
					
				}
				else {
					
					$('select[name="yourpd"]').removeClass('upload-error');
					
				}
				
				if ($('input[name="photo"]').val() == '') {
					
					$('input[name="photo"]').addClass('upload-error');
					
					up_error										= 1;
					
				}
				else {
					
					$('input[name="photo"]').removeClass('upload-error');
					
				}
				
				if (up_error) {
					
					return false;
					
				}
				
				// try to ajax upload
				
			}
			catch(e) {}						
			
		});
		
		// bind ajax
			
		$('#photo_upload_form').iframePostForm({
				
			iframeID: 'iframepostform',
			
			post : function () {
				
				// first of all lock the button
				
				$('.upload-loading-block').show();
				
				$('.button-upload-big').attr('disabled',1);
		
				$('.button-upload-big').addClass('button-upload-disabled');
			
			},
			complete : function (response) {										
				
				// unlock button																						
				
				$('.upload-loading-block').hide();
				
				$('.button-upload-big').attr('disabled',0);
		
				$('.button-upload-big').removeClass('button-upload-disabled');
				
				if (response == 'OK') {
					
					$('#photo_upload_form').get(0).reset();
					
					clearFace();
					loadFaceBig();
					loadFacesBig();
					
					uploadCloseBig();
					
				}
				else {
					
					$('#photo_upload_form').get(0).reset();
					
					// here will be a manual eyes detection
					
					// but now just display failure notification message
					
					$.ajax({
				
						type: 'get',
						url: '/ajax/external/tryon/erroruploadmessage',
						dataType: 'html',					
						
						success: function (html) {
						
							$.blockUI({
							
								message : html,
								
								css : {
									
									border: 'none',
									backgroundColor:'transparent',
									width:'500px',							
									margin:'0 0 0 -230px',
									left:'50%',
									top:'106px',
									cursor: 'default'					
								
								},
								
								overlayCSS : {
								
									background: 'url(\'/i/bg_block_ui.png\')',
									cursor: 'default'
								
								},
								
								applyPlatformOpacityRules : false,
								
								timeout : 120000
								
							});												
						
						}
						
					});
					
				}
			
			}
		
		});
		
	}	
		
}

function uploadClose() {
	
	$('.upload_dialog').stop().animate({left: 0, width: 0},1000,function() {$(this).hide();});
	
}

function uploadCloseBig() {
	
	$('.upload_dialog').stop().animate({width: 0},1000,function() {$(this).hide();});
	
}

function TryOnRemoveImage() {
	
	$.ajax({
				
		type: 'post',
		url: '/ajax/external/tryon/removeface',
		data: 'hash=' + $('#face').attr('hash'),
		dataType: 'html',					
		
		success: function (html) {
		
			$.blockUI({
			
				message : html,
				
				css : {
					
					border: 'none',
					backgroundColor:'transparent',
					width:'500px',							
					margin:'0 0 0 -230px',
					left:'50%',
					top:'106px',
					cursor: 'default'					
				
				},
				
				overlayCSS : {
				
					background: 'url(\'/i/bg_block_ui.png\')',
					cursor: 'default'
				
				},
				
				applyPlatformOpacityRules : false,
				
				timeout : 120000
				
			});												
		
		}
		
	});
	
}

function TryOnRemoveImageBig() {
	
	$.ajax({
				
		type: 'post',
		url: '/ajax/external/tryon/removeface_big',
		data: 'hash=' + $('#face').attr('hash'),
		dataType: 'html',					
		
		success: function (html) {
		
			$.blockUI({
			
				message : html,
				
				css : {
					
					border: 'none',
					backgroundColor:'transparent',
					width:'500px',							
					margin:'0 0 0 -230px',
					left:'50%',
					top:'106px',
					cursor: 'default'					
				
				},
				
				overlayCSS : {
				
					background: 'url(\'/i/bg_block_ui.png\')',
					cursor: 'default'
				
				},
				
				applyPlatformOpacityRules : false,
				
				timeout : 120000
				
			});												
		
		}
		
	});
	
}

function bindPdChangeClick() {
	
	$('.changepd').each(function() {
	
		$(this).click(function() {
			
			var facehash												= $('#face').attr('hash');
			
			if (facehash) {
				
				$.ajax({
			
					type: 'post',
					
					url: '/ajax/external/tryon/pd',
					
					data: 'hash=' + facehash,
					
					dataType: 'html',
					
					success: function(html) {
						
						$.blockUI({
			
							message : html,
							
							css : {
								
								border: 'none',
								backgroundColor:'transparent',
								width:'500px',							
								margin:'0 0 0 -230px',
								left:'50%',
								top:'106px',
								cursor: 'default'					
							
							},
							
							overlayCSS : {
							
								background: 'url(\'/i/bg_block_ui.png\')',
								cursor: 'default'
							
							},
							
							applyPlatformOpacityRules : false,
							
							timeout : 120000
							
						});	
						
					}
				
				});
				
			}
			
		});
		
	});
	
}

function bindPdChangeClickFullSize() {
	
	$('.changepd').each(function() {
	
		$(this).click(function() {
			
			var facehash												= $('#face').attr('hash');
			
			if (facehash) {
				
				$.ajax({
			
					type: 'post',
					
					url: '/ajax/external/tryon/pdfullsize',
					
					data: 'hash=' + facehash,
					
					dataType: 'html',
					
					success: function(html) {
						
						$.blockUI({
			
							message : html,
							
							css : {
								
								border: 'none',
								backgroundColor:'transparent',
								width:'500px',							
								margin:'0 0 0 -230px',
								left:'50%',
								top:'106px',
								cursor: 'default'					
							
							},
							
							overlayCSS : {
							
								background: 'url(\'/i/bg_block_ui.png\')',
								cursor: 'default'
							
							},
							
							applyPlatformOpacityRules : false,
							
							timeout : 120000
							
						});	
						
					}
				
				});
				
			}
			
		});
		
	});
	
}

function rotateFrame(dir) {
	
	if (typeof(dir) != 'undefined') {

		var url_frame														= $('.tryon-frame').attr('src').split('/');
		var url_glass														= $('.tryon-glass').attr('src').split('/');
		
		var url_frame_string												= ''; 
		var url_glass_string												= '';
		
		if (url_frame[6] && url_glass[6] && url_frame[6] == url_glass[6]) {
				
			if (dir == 'ccw') {
				
				url_frame[6]												= parseFloat(url_frame[6]) + 0.5;
				url_glass[6]												= parseFloat(url_glass[6]) + 0.5;
				
			}
			else if (dir == 'cw') {
				
				url_frame[6]												= parseFloat(url_frame[6]) - 0.5;
				url_glass[6]												= parseFloat(url_glass[6]) - 0.5;
				
			}
			
			for (i = 0; i < url_frame.length; i++) {
					
				if (url_frame[i] && url_glass[i]) {
				
					url_frame_string										+= '/' + url_frame[i].toString();
					url_glass_string										+= '/' + url_glass[i].toString();
					
				}
				
			}						
			
			url_frame_string												+= '/';
			url_glass_string												+= '/';
			
			$.ajax({
			
				type: 'post',
				
				url: '/ajax/external/tryon/angle',
				
				data: 'degree=' + parseFloat(url_frame[6]) + '&frame_url=' + url_frame_string + '&glass_url=' + url_glass_string,
				
				dataType: 'html',
				
				success: function(html) {
					
					if (html == 'OK') {
						
						$('.tryon-frame').attr('src',url_frame_string);
						$('.tryon-glass').attr('src',url_glass_string);
						
					}
					
				}
			
			});
			
		}
		
	}
	
}
