/*jslint nomen: true, regexp: true, unparam: true, sloppy: true, white: true, node: true */
/*global window, console, document, $, jQuery, google */

/**
 * On document ready
 */
$(document).ready(function () {
	
	$.ajax({
		url: "/constructor/get_current_view", //Адрес подгружаемой страницы
		type: "POST", 
		dataType: "html",
		success: function (data) {

			$('.model .current, .model .loading').addClass('model_img-' + data);
			// var materialsCookie = get_cookie ( "materials" );
			// $('.choice_fabrics_item[data-color-id="' + materialsCookie + '"]').addClass('active');

		},
		error: function (data) { 

		}
	});


	var parent = 0;
	window.body = $('body');
	window.constructor = $('.constructor');
	window.model = $('.model');
	window.sidebar = $('.sidebar');
	window.space = $('.space', sidebar);
	window.bottom = $('.bottom');
	window.sh = 0;

	/*** MODEL ***/
	updateModel();

	initForms();

	$('body').on('click', '.delete_product_from_cart', function() {
		var id = $(this).attr('data-id');
		update_cart(id, '', '', true);
		return false;
	});	
	

	var checkInline = $('.checkbox-inline > .checkbox').length;
	if(checkInline < 3) {
		$('.checkbox-inline').addClass('checkbox-inline-two');
	}


	var scrollVar = 0;
	////сброс определенного элемента формы
	$('body').on('click', '.reset_param', function() {
		parent_id = $(this).parents('section').attr('data-parent-id');
		$.ajax({
			url: "/constructor/get_action",
			dataType: "json",
			type: "POST",
			data: "aj=1&action=reset&parent_id=" + parent_id,
			success: function (data) {
				////в data есть значение default_icon - id иконки, которую необходимо сделать активной.
				updateModel(data);

				$('.sidebar .space:not(.hide) .params li').each(function(){
					if($(this).hasClass('active')){
						var dateDisable = $(this).attr('data-disable');
						var list = [];
		
						dateDisable.split(',').forEach(function (entry) {
							list.push(+entry);
							$('[data-id="' + entry + '"]').removeClass('disabled');
						});

	
					}
				});


				$('.sidebar .space:not(.hide) .params li').removeClass('active');
				$('.sidebar .space:not(.hide) .params li[data-icon-id="' + data.default_icon + '"]').addClass('active');



				if(data.default_icon != undefined) {

					var srcSpaceItem = $('.space[data-parent-id="' + parent_id + '"] .item[data-icon-id="' + data.default_icon + '"]').find('img').attr('src');
					
					$('.link-two-img[data-id="' + parent_id + '"]').find('.second-img-menu').css('background-image', 'url(' + srcSpaceItem + ')');
				}

				// $('[data-id]').removeClass('disabled');
			}
		});

		return false;
	});


	var twoImgSuccer = 0;


	function resecColors(twoImgSuccer, thisNavLength, thisNav) {

	 	var parent_id = thisNav.children(':nth-child(' + twoImgSuccer +')').children().attr('data-id');

		$.ajax({
			url: "/constructor/get_action",
			dataType: "json",
			type: "POST",
			data: "action=reset&parent_id=" + parent_id,
			success: function (data) {
				////в data есть значение default_icon - id иконки, которую необходимо сделать активной.


				if(data.default_icon != undefined) {
					$('.space[data-parent-id="' + parent_id + '"] .item').removeClass('active');
					$('.space[data-parent-id="' + parent_id + '"] .item[data-icon-id="' + data.default_icon + '"]').addClass('active');

					var srcSpaceItem = $('.space[data-parent-id="' + parent_id + '"] .item[data-icon-id="' + data.default_icon + '"]').find('img').attr('src');
					
					$('.link-two-img[data-id="' + parent_id + '"]').find('.second-img-menu').css('background-image', 'url(' + srcSpaceItem + ')');

				}


				twoImgSuccer++;

				if(twoImgSuccer <= thisNavLength) {


					resecColors(twoImgSuccer, thisNavLength, thisNav);


				}else {


					updateModel(data);

					thisNav.children().children().each(function(){

						thisLink = $(this);



						if($('.space[data-parent-id="' + parent_id + '"]').children().hasClass('color_choice')) {



							if ( thisLink.children().hasClass('two-img') ) {


								var srcColorSecond = thisLink.find('.main-img-menu').css('background-image').slice(5, -2);
								thisLink.children('.two-img').remove();
								

								thisLink.children('.update').after('<img class="icon" src="' + srcColorSecond + '" alt="">');

							}

						}else {



						}




					});

				}


				// $('[data-id]').removeClass('disabled');
			}




		});


	}

    $('body').on('submit','form.form-change-name', function() {
    	var form = $(this);
		$.ajax({
			url: "/constructor/add_to_cart",
			type: "POST",
			data: form.serialize(),
			success: function (data) {
				if (data) {
					if (data=='error') {
						window.location.replace(window.location.href);
					} else {
						$.magnificPopup.open({
							items: {
								src: '/sizes/get_sizes_choice/shirt'
							},
							type: 'ajax'
						});
						$(this).addClass('inited');
						 
					     //обновляем корзину
					     $.ajax({
					        url:     "/main/get_cart_constructor", //Адрес подгружаемой страницы
					        type:     "POST", //Тип запроса
					        data: "aj=1", 
					        success: function(data) { //Если все нормально
								$('span#s_cart').empty().html(data)
					        }
						});							
					}

					
				}
			}
		});
		return false;
    });

	$('body').on('click', '.secondary .reset', function() {


		// parent_id = $(this).parents('section').attr('data-parent-id');


		parent_id = 56;

		var thisNav = $(this).closest('.nav');
		var thisNavLength = thisNav.find('.link-two-img').length;
		twoImgSuccer = 1;

		thisNav.children().removeClass('active');
		$('.sidebar > .space:not(.hide)').addClass('hide');

		$('.space .nav li').removeClass('active');
		resecColors(twoImgSuccer, thisNavLength, thisNav);


		return false;

	});


	$('body').on('click', '[data-color] .reset_param', function() {

		var thisWrap = $(this).closest('.space');

		thisWrap.find('.choice_fabrics_item').removeClass('active');

		var thisWrapAttr = thisWrap.attr('data-parent-id');

		var thisLink = $('.bottom .space .link[data-id="' + thisWrapAttr + '"]');

		if(thisLink.hasClass('link-two-img')){

			if ( thisLink.children('.two-img') ) {
				var srcColorSecond = thisLink.find('.main-img-menu').css('background-image').slice(5, -2);
				thisLink.children('.two-img').remove();
				
				console.log(srcColorSecond);

				thisLink.children('.update').after('<img class="icon" src="' + srcColorSecond + '" alt="">');
			}else {
			
			}
			

		}else {
			var attrDataDefaultcolor = thisLink.find('.icon-color').attr('data-defaultcolor');
			thisLink.find('.icon-color').css('background-image', 'url(' + attrDataDefaultcolor + ')');
		}

	});
	
	

	var isCtrl = false;
	$(document).keyup(function (e) {
		if (e.which == 17) isCtrl = false;
	}).keydown(function (e) {
		if (e.which == 17) isCtrl = true;
		if (e.which == 81 && isCtrl == true) {
			$.ajax({
				url: "/constructor/save_shirt",
				type: "POST",
				success: function (data) {
					alert(data);
				}
			});
			return false;
		}
	});

	/*** AJAX POPUP ***/
	$('.js-ajax').magnificPopup({
		type: 'ajax'
	});
	
	////чтобы получить значение текущего вида, нужно выполнить ajax-запрос по адресу /constructor/get_current_view

	/*** CART-DROPDOWN ***/
	$('body').on('click', '.cart-dropdown .link', function () {

		var _cart = $(this).parent(), _space = _cart.find('.space'), _body = $('body');
		if (_cart.hasClass('active')) {
			_cart.removeClass('active');
			_space.stop().fadeOut(100);
		} else {
			_cart.addClass('active');
			_space.stop().fadeIn(100);
		}
		return false
	});

	$(document).mouseup(function (e) {
	    var container = $(".cart-dropdown");
	    if (container.has(e.target).length === 0){

	        container.removeClass('active');
			container.find('.space').stop().fadeOut(100);
	    }
	});


	/*** FASTCLICK ***/
	FastClick.attach(document.body);

	var activeButton = false;
	/*** BOTTOM ***/
	bottom.each(function () {
		var self = $(this);
		$('.square', self).append('<span class="corner"></span>');
		/** Navigation */
		$('.nav', this).each(function () {

			// $('[data-view-type]', this).click(function (e) {
			$('.link:not(.sizes):not(.reset)', this).click(function (e) {

				if($('.nav .active .link').length > 0){

					var thisAttr2 = $(this).attr('data-view-type');
			
					if( $('.model').hasClass('model-' + thisAttr2) ){
						activeButton = false;
					}else {
						activeButton = true;
					}

				}else {

					var thisAttr = $(this).attr('data-view-type');

					if($('.model_img-' + thisAttr).length > 0) {
					 	activeButton = false;
					}else {
						activeButton = true;
					}

				}

				$('.bottom .starthere').hide();


				if (!$(this).hasClass('disabled')) {
					
					
					if ($(this).hasClass('toggle')) {


						$('.space', self).removeClass('active').filter('[data-parent-id=' + $(this).attr('data-id') + ']').addClass('active');

						var activeMenu = $('.space', self).filter('[data-parent-id=' + $(this).attr('data-id') + ']').find('.active');
						// if($('.space', self).filter('[data-parent-id=' + $(this).attr('data-id') + ']').find('li').hasClass('active')){
							
							// getModel("view_id=" + activeMenu.children('.link').attr('data-view-id'));
							// $('.sidebar > .space:not(.hide)').addClass('hide');
							// $('[data-parent-id="' + activeMenu.children('.link').attr('data-id') + '"]').removeClass('hide');
						// }


					} else {

							$('.space .nav li.active').removeClass('active');

							$(this).closest('li').addClass('active');
							space.addClass('hide');
							$('[data-parent-id=' + $(this).attr('data-id') + ']', sidebar).removeClass('hide');
	
							if ($(this).hasClass('act')) {
								//getModel("aj=1&icon_id=" + $(this).attr('data-id'));						
							} else if ($(this).attr('data-view-type') && activeButton){
								//getModel("aj=1&view_icon_id=" + $(this).attr('data-id') + "&view_id=" + $(this).attr('data-view-id'));
							}						

						onResize();
					}
				}

				scrollVar = 0;
				e.preventDefault();
			});
		});
		// $('.space', this).perfectScrollbar();
	});


	/*** SIDEBAR ***/
	sidebar.each(function () {

		/** Toggle disabled items */
		function toggleDisabled(state) {
			var list = [], _this = $(this);
			if (_this[0].hasAttribute('data-disable')) {
				if (_this.attr('data-disable').indexOf(',') > 0) {
					_this.attr('data-disable').split(',').forEach(function (entry) {
						list.push(+entry);
					});
				} else {
					if (+_this.data('disable') > 0) {
						list.push(+_this.data('disable'));
					}
				}
				if (list.length > 0) {
					if (state) {
						console.log('Disabling items: ' + list);
						list.forEach(function (entry) {
							$('[data-icon-id=' + entry + '],[data-id=' + entry + ']').addClass('disabled');
						});
					} else {
						console.log('Enabling items: ' + list);
						list.forEach(function (entry) {
							$('[data-icon-id=' + entry + '],[data-id=' + entry + ']').removeClass('disabled');
						});
					}
				}
			}
		}


		$('.space', this).each(function () {
			var _space = $(this);

			/** Init scrollbar */
			// if($(body).width() > 1030) {
			// 	$('.scroll', _space).perfectScrollbar();
			// }
			$('.scroll', _space).perfectScrollbar();
			$('.scroll', _space).on('ps-scroll-y', function () {
				scrollVar++
			});

			/** Reset model */
			$('.reset-all', _space).on('click', function (e) {

				resetModel();
				e.preventDefault();
			});

			/** Close sidebar */
			$('.close', _space).on('click', function (e) {
				_space.addClass('hide');
				e.preventDefault();
			});

			/** Params init */
			$('.params .item', _space).each(function () {

				var _item = $(this);
				if (_item.hasClass('active')) {
					toggleDisabled.call(this, true);
				}
				_item.on('mouseup', function (e) {

				var dataParentId = $(this).closest('.space').attr('data-parent-id');
				$('.link[data-id="' + dataParentId + '"] span.update').addClass('active');
				var dataParentIdSecond = $('.link[data-id="' + dataParentId + '"]').closest('.space').attr('data-parent-id');
				$('.link[data-id="' + dataParentIdSecond + '"] span.update').addClass('active');



					if(scrollVar == 0 || e.type == 'mouseup') {

						if (!_item.hasClass('disabled')) {

							var itemActive =  $(this).find('img').attr('src');

							$('.link-two-img[data-id="' + dataParentId + '"] .second-img-menu').css('background-image', 'url(' + itemActive + ')');

							

							if($(window).width() < 767) {
								$(this).closest('.space').addClass('hide');
							}
							_item.siblings('.active').each(function () {
								toggleDisabled.call(this, false);
								$(this).removeClass('active');
							});
							_item.each(function () {
								toggleDisabled.call(this, true);
								$(this).addClass('active');
							});
							getModel("aj=1&icon_id=" + $(this).attr('data-icon-id'));


						}
					}

					console.log(itemActive);
					$('.link[data-id="' + dataParentId + '"] .icon').attr('src',  itemActive);

					scrollVar = 0;
					window.localStorage.setItem('zoom', 0);		
					$('.fullscreen-out').hide();
				  $('.fullscreen-in').show();			
				});

				// scrollVar
			});
		});


	});

	body.on('click', '.tab_head', function () {
		var tab_id = $(this).attr('data-id');
		$(this).siblings('.tab_head').removeClass('active');
		$(this).addClass('active');
		$(this).closest('form').find('.constructor_tab').removeClass('active');
		$(this).closest('form').find('.constructor_tab[data-tab-id=' + tab_id + ']').addClass('active');
		$(window).trigger('resize');
	});

	body.on('click', '.fabric_list', function () {
		$(this).siblings('.fabric_list').removeClass('active');
		$(this).addClass('active');
		$(this).siblings('.fabric_list').children('input').val('0');
		$(this).children('input').val('1');
		$(this).parents('.color_choice_form').stop().submit();
		$(window).trigger('resize');
	});

	body.on('change', '.color_choice_form', function () {
		$(this).stop().submit();
	});

	body.on('submit', '.color_choice_form', function () {
		form = $(this);
		form.parents('div.color_choice').find('.choice_fabrics').empty().html('<div class="load"></div>');
		$.ajax({
			url: "/constructor/get_fabrics", //Адрес подгружаемой страницы
			type: "POST", //Тип запроса
			dataType: "html", //Тип данных
			data: form.serialize(),
			success: function (data) { //Если все нормально
				var result = $.parseJSON(data);
				form.parents('div.color_choice').find('#fabrics').empty().html(result.fabrics);
				onResize();
				canvasMaterialFun();


				// var materialsCookie = get_cookie ( "materials" );
				// $('.choice_fabrics_item[data-color-id="' + materialsCookie + '"]').addClass('active');

			},
			error: function (data) { //Если ошибка

			}
		});
		$(window).trigger('resize');
		return false;
	});



	body.on('click', '.make_layer', function () {
		$.ajax({
			url: "/constructor/get_action",
			dataType: "json",
			type: "POST",
			data: "id=" + $(this).attr('data-icon-id'),
			success: function (data) {
				updateModel();
			}
		});
	});

	body.on('mouseup', '.choice_fabrics_item:not(.disable_icon):not(.choice_fabrics_link_open)', function (e) {

		var dataParentId = $(this).closest('.space').attr('data-parent-id');
		$('.link[data-id="' + dataParentId + '"] span.update').addClass('active');
		var dataParentIdSecond = $('.link[data-id="' + dataParentId + '"]').closest('.space').attr('data-parent-id');
		if( dataParentIdSecond){ $('.link[data-id="' + dataParentIdSecond + '"] span.update').addClass('active'); }


		if ((scrollVar == 0 || e.type == 'mouseup') && e.target.className != 'choice_fabrics_link_open') {

			var color_id = $(this).attr('data-color-id');
			var icon_id = $(this).parents('.space').attr('data-parent-id');

			$(this).siblings().removeClass('active');
			$(this).addClass('active');



			var attrDataParentId = $(this).closest('.space').attr('data-parent-id');
			var srcColor = $(this).children('.canvas-wrap').attr('data-src');
			$('.space .link[data-id="' + attrDataParentId + '"]  .second-img-menu-content').css('background-image', 'url(/uploads/product/thumb/' + srcColor + ')');
			$('.space .link[data-id="' + attrDataParentId + '"]  .icon-color').css('background-image', 'url(/uploads/product/thumb/' + srcColor + ')');

			$('.form-text').css('background-image', 'url(/uploads/product/thumb/' + srcColor + ')');

			if( $('.space .link[data-id="' + attrDataParentId + '"]').children().hasClass('icon') ){
				var srcImgColor = $('.space .link[data-id="' + attrDataParentId + '"]').children('.icon').attr('src');
				$('.space .link[data-id="' + attrDataParentId + '"]').children('.icon').remove();
				$('.space .link[data-id="' + attrDataParentId + '"]').children('.update').after('<div class="two-img"> <div class="main-img-menu" style="background-image: url(' + srcImgColor + ')"></div> <div class="second-img-menu"> <div class="second-img-menu-content" style="background-image: url(/uploads/product/thumb/' + srcColor + ');"></div> </div> </div>');


			}
				
			// var materialsActive = $(this).attr('data-color-id');
			// document.cookie = "materials=" + materialsActive;

			window.localStorage.setItem('zoom', 0);		
			window.localStorage.setItem('view-id', 0);	
			$('.fullscreen-out').hide();
			$('.fullscreen-in').show();		

			console.log('fab');

			$.ajax({
				url: "/constructor/get_action",
				dataType: "json",
				type: "POST",
				data: "aj=1&color_id=" + color_id + "&icon_id=" + icon_id,
				success: function (data) {


				$.post( "/constructor/get_action", { view_id: 1 })
					.done(function( data ) {
						set_zoom();
						window.localStorage.setItem('zoom', 0);
						window.localStorage.setItem('view-id', 0);
						updateModel();
				});

					updateModel(data);

				}
			});

			if($(window).width() < 767) {
				$(this).closest('.space').addClass('hide');
			}

		}

		scrollVar = 0;



	});

	body.on('click', '.choice_fabrics_link_open', function (e) {

		e.stopPropagation();
		e.preventDefault();
		$.magnificPopup.open({
			items: {
				src: $(this).attr('href')+'/1'
			},
			type: 'ajax'
		});

		$('body').on('click', '.popup-fabric-thumb', function () {
			var path = $(this).data('big-src');
			$('.popup-fabric-photo img').attr('src', path );
		});

		$('body').on('click', '.popup-fabric-button', function (e) {
			e.preventDefault();
			e.stopImmediatePropagation();

			var choice = $(this).attr('data-choice-fabrics-item');
			$('#color_choice_2 .choice_fabrics_item[data-color-id="' + choice + '"]').trigger("mouseup");
			$('.mfp-close').trigger("click");
		});


	});

	function animateFinish(){		
		$(window).trigger('resize');	
	}
	var animateFinishclear;
	$('.button-filter .cat_choice_item').click(function(){
		$(this).toggleClass('active');


		$('.choice_fabrics').css('max-height', '100%');
		$('.ps-scrollbar-y-rail').css('height', '100%');

		
		if($(this).hasClass('active')){
			$('.filter-block').slideDown(300, function(){
				animateFinishFun();
			});
		}else {
			$('.filter-block').slideUp(300, function(){
				animateFinishFun();
			});
		}
	
	});
	function animateFinishFun() {
		clearInterval(animateFinishclear);
		animateFinishclear = setTimeout(animateFinish, 1000);
	}

	$(window).on('resize', onResize).trigger('resize');

	/*

	function toggleFullScreen() {
	  if ((document.fullScreenElement && document.fullScreenElement !== null) ||    
	   (!document.mozFullScreen && !document.webkitIsFullScreen)) {
	    if (document.documentElement.requestFullScreen) {  
	      document.documentElement.requestFullScreen();  
	    } else if (document.documentElement.mozRequestFullScreen) {  
	      document.documentElement.mozRequestFullScreen();  
	    } else if (document.documentElement.webkitRequestFullScreen) {  
	      document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);  
	    }  
	  } else {  
	    if (document.cancelFullScreen) {  
	      document.cancelFullScreen();  
	    } else if (document.mozCancelFullScreen) {  
	      document.mozCancelFullScreen();  
	    } else if (document.webkitCancelFullScreen) {  
	      document.webkitCancelFullScreen();  
	    }  
	  }  
	}

*/

	function toggleFullScreen() {

		var zoom = parseInt(window.localStorage.getItem('zoom'));
		var view_id = parseInt(window.localStorage.getItem('view-id'));
		
		if(view_id && !!!zoom){
			console.log('>1' + ' ' + zoom);

			$.post( "/constructor/get_action", { view_id: 1 })
			  .done(function( data ) {
					window.localStorage.setItem('zoom', view_id);
					updateModel();
					set_zoom(1);
			});

		} else {
			console.log('==1' + ' ' + zoom);

			$.post( "/constructor/get_action", { view_id: zoom })
			  .done(function( data ) {
					set_zoom();
					window.localStorage.setItem('zoom', 0);
					window.localStorage.setItem('view-id', zoom);
					updateModel();
			});


		}

	}

	$('.fullscreen').click(function(){
		toggleFullScreen();
	});

	$('.checkbox-color').each(function (index, value) {

		if ( $(this).data('hex') ) {
			$(this).find('.square span').css('background-color', $(this).data('hex'));
		}

	});


});

function update_cart(id, qty, use_bonuses, delete_product) {
	$.ajax({
	   url: "/cart/update_cart",
	   type: "POST",
	   data: "ajax=1&id=" + id + "&qty=" + qty + "&use_bonuses=" + use_bonuses + "&delete_product=" + delete_product,
	   success: function (data) {
    		var res = jQuery.parseJSON(data);
    		if ($('span#shopping_cart').length && res.shopping_cart) {
    			$('span#shopping_cart').html(res.shopping_cart);
			}
    		if ($('span#s_cart_main').length && res.cart) {
    			$('span#s_cart_main .space').html(res.cart);
    			$('span#s_cart_main .amount').html(res.qty);
			}
    		if ($('span#s_cart').length && res.cart_constructor) {
    			$('span#s_cart .space').html(res.cart_constructor);
    			$('span#s_cart .amount').html(res.qty);
			}
           
        	if($('.js-ajax').length) {
			  $('.js-ajax').magnificPopup({
					type: 'ajax'
				});
			}
	   }
	});
}


function onResize() {
	sh = +(+sidebar.outerHeight(true) - +$('.head', sidebar).outerHeight(true)) - 10;
	$('.scroll', sidebar).each(function () {
		if ($(this).hasClass('choice_fabrics')) {
			$(this).css('max-height', sh - +$(this).siblings('.color_choice_pad').outerHeight(true));
		} else {
			$(this).css('max-height', sh);
		}
		if ($(this).is(':visible')) {
			$(this).perfectScrollbar('update');
		}
	});
}


/**
 * Init forms
 * @param scope
 */
function initForms(scope) {
	if (typeof scope === 'undefined') {
		scope = document;
	}

	$('select', scope).selectric({
		maxHeight: 200,
		disableOnMobile: false,
		responsive: true
	});
}


/**
 * Get model from server
 * @param data
 */
function getModel(data) {
	$.ajax({
		url: "/constructor/get_action",
		dataType: "json",
		type: "POST",
		data: data,
		success: updateModel
	});
}


/**
 * Reset model
 */
function resetModel() {
	$.ajax({
		url: "/constructor/reset",
		dataType: "json",
		type: "POST",
		success: updateModel
	});
}

/**
 * Update model from data
 * @param data
 */
function updateModel(data) {
	
	///alert(data);

	if (!data || data['update']) {
		$('body').append('<div class="loading_constructor"><div></div></div>')

		var preload = $('<img/>'), current, loading,
			dt = new Date(), timestamp = dt.getTime();

		model.attr('class', 'model');

		if (typeof data == 'undefined') {
			$('<div/>').addClass('current').appendTo(model);
			$('<div/>').addClass('loading').appendTo(model);
			//preload.attr('src', '/constructor/get_shirt/');
		} else {
			model.addClass('model-' + data['view']);
			$('.header .price').html(data['price']);
			// preload.attr('src', '/constructor/get_shirt/' + timestamp);
		}

		current = $('.current', model);
		loading = $('.loading', model);


		var w = loading.width();
		var h = loading.height();

		var pic = new Image();   
	    pic.src = '/constructor/get_shirt/' + timestamp + '/0/' + w + '/' + h +'';
		
		$(pic).load(function () {

			$('.loading_constructor').remove();

			// var loadImg = loading.css('background-image', 'url(/constructor/get_shirt/' + timestamp + ')');

			var loadImg = loading.css('background-image', 'url(' + pic.src + ')');

			if (typeof data != 'undefined') {

				current.attr('class','current');
				loading.attr('class','loading');
				current.addClass('model_img-' + data['view']);
				loading.addClass('model_img-' + data['view']);


			}


			model.toggleClass('model-landscape', $(this).width() > $(this).height()).addClass('model-loaded');

			setTimeout(function () {


				current.css('background-image', loading.css('background-image'));
				
				loading.removeAttr('style');
				model.removeClass('model-loaded');
			}, 550);
		});		
	}

	get_zoom();

}


function get_zoom() {

		var zoom = !!parseInt(window.localStorage.getItem('zoom'));
		var view_id = !!parseInt(window.localStorage.getItem('view-id'));

		console.log(view_id + '!!!' + zoom);
		
		$.post( "/constructor/get_action", { aj: 1 })
		.done(function( data ) {

			data = $.parseJSON(data);

			if(!zoom){
				window.localStorage.setItem("view-id", data["zoom"]);
				view_id = !!parseInt(data["zoom"]);
			}

			if(!zoom && !view_id){
				console.log(zoom + ' ' + view_id);
				$('.fullscreen').hide();
				set_zoom();
			} else {
				$('.fullscreen').show();
			}


			

	});
}

function set_zoom(x){

	if(x){
		$('.fullscreen').removeClass('fullscreen-zoom-in');
    $('.fullscreen').addClass('fullscreen-zoom-out');
		$('.fullscreen-out').show();
		$('.fullscreen-in').hide();	

	} else {
		$('.fullscreen').addClass('fullscreen-zoom-in');
    $('.fullscreen').removeClass('fullscreen-zoom-out');
		$('.fullscreen-out').hide();
		$('.fullscreen-in').show();	

	}


}


// get_cookie
function get_cookie ( cookie_name )
{
  var results = document.cookie.match ( '(^|;) ?' + cookie_name + '=([^;]*)(;|$)' );
 
  if ( results )
    return ( unescape ( results[2] ) );
  else
    return null;
}





/**
 * Magnific Popup default settings
 */
$.extend(true, $.magnificPopup.defaults, {
	tClose: 'Закрыть (Esc)',
	closeMarkup: '<div title="%title%" class="mfp-close">&times;</div>',
	tLoading: 'Загрузка&hellip;',
	gallery: {
		tPrev: 'Назад',
		tNext: 'Вперед',
		tCounter: '%curr% из %total%',
		arrowMarkup: '<div title="%title%" class="mfp-arrow mfp-arrow-%dir%"></div>',
		cursor: null
	},
	image: {
		tError: '<a href="%url%">Изображение</a> не найдено.',
		cursor: null
	},
	ajax: {
		tError: '<a href="%url%">Контент</a> не найден.'
	},
	settings: {
		cache: false
	},
	midClick: true,
	mainClass: 'mfp-fade',
	removalDelay: 300,
	callbacks: {
		ajaxContentAdded: function () {
			initForms(this.container);

			// if($('.content-comment').length){
			// 	$('.content-comment').perfectScrollbar();
			// }

			var submitStep = 0;
			$('.form-change-name').submit(function( event ) {
				if(submitStep != 0){
					return false
				}
				submitStep = submitStep + 1;
			});

		}
	}
});



// function canvasRectangle(srcImg, dataColorId) {

$(document).ready(function(){


	if($('.podklad .image').length) {
		$('.podklad .image').addClass('canvas-wrap').removeClass('image');

		var podkladSrc = $('.podklad img').attr('src');
		var podkladSrc2 = podkladSrc.substr(podkladSrc.lastIndexOf("/")+1,podkladSrc.length);

		$('.podklad img').parent().attr('data-src', podkladSrc2);
	}


	monogramm_font();
	monogramm_fontcolor();

	$("input[name='monogramm_font']").change(function () {
		monogramm_font();

		var thisInput = $(this);
		updateMonogram(thisInput);
	});

	$("input[name='monogramm_color']").change(function () {
		monogramm_fontcolor();

		var thisInput = $(this);
		updateMonogram(thisInput);
	});

	$("input[name='monogramm_position[]']").change(function () {
		var thisInput = $(this);
		updateMonogram(thisInput);
	});

	$('.monogramm .form-text').keyup(function (e) {


		var reg = /[а-яА-ЯёЁ]/g;
		if (this.value.search(reg) != -1) {

			this.value = this.value.replace(reg, '');

		}

		if (e.keyCode == 13) {

			var thisParam = $(this);
			updateMonogram(thisParam);

		}

	});

	$('.monogramm .form-text').keydown(function (event) {
		if (event.keyCode == 13) {
			event.preventDefault();
			return false;
		}
	});

	$('.monogramm .checkbox-color .square').on('click', function () {
		$('.monogramm .checkbox-color .square').css('borderColor', '#d5d5d5');
		$(this).css('borderColor', '#516aa4');
		$('.link[data-id="13"] span.update').addClass('active');
		console.log('!!');
	});


})


function canvasMaterialFun() {

	var widthDoc = $(document).width();

	if(widthDoc > 1024) {

		$('.canvas-wrap').each(function(i){


			if($(this).children().hasClass('canvasMaterial')){

			}else {
				$(this).append('<canvas class="canvasMaterial"></canvas>');
			}

			var canvasSrc = $(this).children('img').attr('data-src');
			// var canvasSrc = $(this).attr('data-src');

			var canvas = $(this).children('canvas')[0];

			var ctx = canvas.getContext('2d');
			// var img = canvasWrap.children('img');

			var img = new Image();


			var srcImg = canvasSrc;
			// var srcImg = '/uploads/product/thumb/' + canvasSrc;


			// canvas.width = canvasWrap.width();
		 //    canvas.height = canvasWrap.width() * 0.6666666666;	

		 	canvas.width = 300;
		    canvas.height = 200;
		    // canvas.height = canvas.width * 0.6666666666;

			var widthImg = canvas.width - 4;
			var heightImg = canvas.height - 4;

			img.onload = function() {
				var heightImgFirst = img.height;
				var widthImgFirst = img.width;
				ctx.beginPath();
				ctx.shadowColor = 'transparent';
				ctx.lineWidth = 0;
				roundRect(ctx,0,0,widthImg,heightImg,10,0,1);
				ctx.clip();
				ctx.drawImage(img, 0, 0, widthImgFirst, heightImgFirst, 0, 0, widthImg, heightImg);
				// ctx.drawImage(img, 0, 0);
			}



			img.src = srcImg;



			var proportionWidth = 300;
			var proportionHeight = 200;



			function roundRect(ctx, x, y, width, height, radius, fill, stroke) {


				if (typeof stroke == "undefined" ) {
					stroke = true;
				}
				if (typeof radius === "undefined") {
					radius = 5;
				}

				ctx.beginPath();
				ctx.moveTo(20 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(40 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(60 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(80 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(100 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(120 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(140 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(160 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(180 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(200 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(220 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(240 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));
				ctx.lineTo(260 * (widthImg / proportionWidth), 0 * (heightImg / proportionHeight));
				ctx.lineTo(280 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));






				ctx.lineTo(260 * (widthImg / proportionWidth), 40 * (heightImg / proportionHeight));
				ctx.lineTo(280 * (widthImg / proportionWidth), 60 * (heightImg / proportionHeight));
				ctx.lineTo(260 * (widthImg / proportionWidth), 80 * (heightImg / proportionHeight));
				ctx.lineTo(280 * (widthImg / proportionWidth), 100 * (heightImg / proportionHeight));
				ctx.lineTo(260 * (widthImg / proportionWidth), 120 * (heightImg / proportionHeight));
				ctx.lineTo(280 * (widthImg / proportionWidth), 140 * (heightImg / proportionHeight));
				ctx.lineTo(260 * (widthImg / proportionWidth), 160 * (heightImg / proportionHeight));
				ctx.lineTo(280 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(260 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));



				ctx.lineTo(240 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(220 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));

				ctx.lineTo(200 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(180 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));

				ctx.lineTo(160 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(140 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));

				ctx.lineTo(120 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(100 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));

				ctx.lineTo(80 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(60 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));

				ctx.lineTo(40 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));
				ctx.lineTo(20 * (widthImg / proportionWidth), 200 * (heightImg / proportionHeight));
				ctx.lineTo(0 * (widthImg / proportionWidth), 180 * (heightImg / proportionHeight));



				ctx.lineTo(20 * (widthImg / proportionWidth), 160 * (heightImg / proportionHeight));
				ctx.lineTo(0 * (widthImg / proportionWidth), 140 * (heightImg / proportionHeight));
				ctx.lineTo(20 * (widthImg / proportionWidth), 120 * (heightImg / proportionHeight));
				ctx.lineTo(0 * (widthImg / proportionWidth), 100 * (heightImg / proportionHeight));
				ctx.lineTo(20 * (widthImg / proportionWidth), 80 * (heightImg / proportionHeight));
				ctx.lineTo(0 * (widthImg / proportionWidth), 60 * (heightImg / proportionHeight));
				ctx.lineTo(20 * (widthImg / proportionWidth), 40 * (heightImg / proportionHeight));
				ctx.lineTo(0 * (widthImg / proportionWidth), 20 * (heightImg / proportionHeight));


				ctx.closePath();

				ctx.strokeStyle = 'transparent';
				if (stroke) {
					ctx.stroke();
				}
				if (fill) {
					ctx.fill();
				}


			}

			// shadow
			ctx.beginPath();

			ctx.shadowOffsetX = 1;
			ctx.shadowOffsetY = 1;
			ctx.shadowBlur = 2;
			ctx.fillStyle = 'rgba(0, 0, 0, 0.5)';
			ctx.shadowColor ='rgba(0, 0, 0, 1)';
			ctx.lineWidth = 0;
			roundRect(ctx,0,0,150,100,10,1,0);
			ctx.closePath();





		// }
		})

	} else {
		$('.canvas-wrap img').each(function (index) {
			$(this).attr('src', $(this).data('src') );
		});	
		
	}
}


function monogramm_font() {
	var dataFontname = $('input[name="monogramm_font"]:checked').attr('data-fontname');
	$('.monogramm .form-text').css('font-family', dataFontname);
}


function monogramm_fontcolor() {

	var dataFontColor = $('input[name="monogramm_color"]:checked').attr('data-fontcolor');
	$('.monogramm .form-text').css('color', '#' + dataFontColor);
	
}


document.addEventListener("DOMContentLoaded", function (event) {
  
	$('.post-load').each(function (index) {
		$(this).attr('src', $(this).data('src') );
	});

	$('.secondary').show();

	canvasMaterialFun();

});


function updateMonogram(thisParam) {

	var valueForm = thisParam.closest('form');

	var formParam = valueForm.serialize();
	if ($("[name='monogramm_position[]']:checked").length || thisParam.attr('name') == 'monogramm_position[]') {
		$.ajax({
			url: "/constructor/get_action",
			dataType: "json",
			type: "POST",
			data: formParam,
			success: function (data) {
				updateModel();
			}
		});
	}
}