$(function() {
	
	var helperData, isDownloaded = false, currentStep = 1, animLength = 351, reelInitPos = 0, slideAnimTime = 500, vpHeight = 0;
	var $viewport, $up, $down, $reel;
	
	var showHelper = function() {
	
		if (!isDownloaded) {
			$('<div id="helperoverlay"><p id="hmsg">Загрузка...</p></div>').appendTo('body')
				.load('/js/helper.html', function(data, status) {
					if (status == 'success') {
						getData();
					} else {
						handleError();
					}
				});
		} else {
			$('#helperoverlay').css({display: 'block'});
		}
		
	}
	
	function getData() {
		$.ajax({
			url : '/js/helper.json',
			dataType : 'json',
			success : function(data) {
				isDownloaded = true;
				helperData = data;
				$('#hmsg').css({display : 'none'});
				initialize();
			},
			error : function() {
				handleError();
			}
		});
	}
	
	function handleError() {
		$('#hmsg').text('Произошла ошибка, приносим свои извинения...');
		setTimeout(function() {
			$('#helperoverlay').remove();
		}, 2000);
	}
	
	var moveReelUp = function() {
		$up.unbind('click', moveReelUp);
		$reel.animate({top: '+=' + animLength}, slideAnimTime, function() {
			checkReelPos();
			$up.bind('click', moveReelUp);
		});
		$down.css({display: 'block'});
	}
	
	var moveReelDown = function() {
		$down.unbind('click', moveReelDown);
		$reel.animate({top: '-=' + animLength}, slideAnimTime, function() {
			checkReelPos();
			$down.bind('click', moveReelDown);
		});
		$up.css({display: 'block'});
	}
	
	function checkReelPos() {

		var top = parseInt($('#helperreel').css('top'), 10);
		var reelHeight = $reel.height();
		
		if (top > 0) {
			$up.css({display: 'none'});
		} else {
			$up.css({display: 'block'});
		}
		if (top  < -reelHeight + vpHeight) {
			$down.css({display: 'none'});
		} else {
			$down.css({display: 'block'});
		}
	}
	
	var closeButton = function() {
		$('#helperoverlay').css({display: 'none'});
	}
	
	function initialize() {
		
		$viewport = $('#helperviewport');
		$up = $('#hscrollup');
		$down = $('#hscrolldown');
		$reel = $('#helperreel');
		
		$viewport.animate({opacity: 1}, slideAnimTime);
		
		vpHeight = $viewport.height();
		reelInitPos = parseInt(vpHeight / 2 - 160);
		$reel.css({top: reelInitPos});
		
		$('#helperclose').bind('click', closeButton);
		
		$up.bind('click', moveReelUp);
		$down.bind('click', moveReelDown);
		
		// set first question
		
		var $slide = $('#helperreel .slide:first');
		
		$slide.attr({'data-step' : currentStep}).addClass('current');
		$slide.children('.question').append(helperData.q1.question).children('span').text(currentStep);
		$slide.children('.description').text(helperData.q1.description);

		var numberOfAnswers = calcNOA(helperData.q1.answers);
		
		for (i=1; i<=numberOfAnswers; i++) {
			var str = 'a' + i;
			$('<li>' + helperData.q1.answers[str].text + '</li>').appendTo('.answers').attr('data-result', helperData.q1.answers[str].result);
		}
		
		$('.answers li').live('click', answerClicked);
	}
	if (  window.location.pathname.toLowerCase() == '/products/' || window.location.pathname.toLowerCase().indexOf( 'dalnomer' ) > 0 ) {
		$('<a id="helperbtn"></a>').appendTo('body').bind('click', showHelper);
	}
	
	
	$('.magazine_list a[href="#helper"]').bind('click', function() {	
		showHelper();
		return false;
	});
	
	function calcNOA(obj) {
		var count = 0;
		for (var prop in obj) {
			if(obj.hasOwnProperty(prop)) {
				++count;
			}
		}
		return count;
	}
	
	// handle clicks here
	var answerClicked = function () {
		if (!$(this).hasClass('checked')) {
			$(this).siblings().removeClass('checked');
			$(this).addClass('checked');
			var parent = $(this).parents('.slide');
			animateReel($(this), parent);
		}
	}
	
	var nextStep = function(target, parentSlide) {
		
		if (parentSlide.next().length) {
			parentSlide.nextAll().remove();
		}
		parentSlide.removeClass('current');
		var nextQuestion = target.attr('data-result');
		
		if (nextQuestion == 'success') {
			
			$('#helperreel').append('<div class="slide" id="prodslide"><p id="pmsg">Идет поиск продукта...</p></div>');
			
			var prodUrl = target.attr('data-url');
			
			$.ajax({
				url : prodUrl,
				dataType : 'html',
				success : function(data) {
					var image = $(data).find('.tovar_name img.active').attr('src');
					var desc = $(data).find('.tovar_name img.active').attr('data-desc');
					var name = $(data).find('#prodname').text();
					var price = $(data).find('.tvoya_cena:first').text();
					var form = $(data).find('#prodbuyform').html();
					
					var prodString = '<div class="slideimg"><img src="' + image + '" height="260"></div><h1><a href="' + prodUrl + '">' + name + '</a></h1>';
					prodString += '<p class="description">' + desc + '</p><p class="prodpr">' + price + '</p><p><a href="' + prodUrl + '" class="prodrm">Подробнее о товаре</a></p>' + form + '<a href="" id="startagain">Начать выбор сначала</a>';
					$('#prodslide').html(prodString);
				},
				error : function(xhr, errorText, errorThrown) {
					$('#pmsg').text('Произошла ошибка, приносим свои извинения.' + errorText + ' ' + errorThrown);
				}
			});
			
			$('#startagain').live('click', function() {
				$('#helperreel').animate({top: reelInitPos}, 1000, function() {
					checkReelPos();
				});
				currentStep = 1;
				return false;
			});
			return;
		}
		
		var nextSlide = parentSlide.clone().appendTo('#helperreel');
		
		var nextNum = parseInt(parentSlide.attr('data-step')) + 1;
		currentStep = nextNum;
		nextSlide.attr({'data-step' : nextNum}).addClass('current');
		nextSlide.children('h2').html('<span class="hmarker">' + nextNum + '</span>' + helperData[nextQuestion].question);
		nextSlide.children('.slideimg').html('<img src="' + helperData[nextQuestion].image + '">');

		if (helperData[nextQuestion].description) {
			nextSlide.children('.description').text(helperData[nextQuestion].description);
		} else {
			nextSlide.children('.description').empty();
		}
		nextSlide.children('.description').text(helperData[nextQuestion].description);
		
		var numberOfAnswers = calcNOA(helperData[nextQuestion].answers);
		var list = nextSlide.children('.answers');
		list.empty().removeClass('long');
		
		for (i=1; i<=numberOfAnswers; i++) {
			var str = 'a' + i;
			var listItem = $('<li>');
			listItem.text(helperData[nextQuestion].answers[str].text);
			
			if (helperData[nextQuestion].answers[str].result == 'success') {				
				listItem.attr({'data-result': helperData[nextQuestion].answers[str].result, 'data-url': helperData[nextQuestion].answers[str].product});
			} else {
				listItem.attr('data-result', helperData[nextQuestion].answers[str].result);
			}
			
			if (helperData[nextQuestion].answers[str].description) {
				listItem.append('<p class="description">' + helperData[nextQuestion].answers[str].description + '</p>');
			}
			listItem.appendTo(list);
			
			if (i > 4) {
				list.addClass('long');
			}
		}
	}
	
	var animateReel = function(target, parent) {

		if (parent.hasClass('current')) {
			
			$reel.animate({top: '-=' + animLength}, slideAnimTime, function() {
				checkReelPos();
			});
			
			nextStep(target, parent);
		
		} else {
			parent.addClass('current');
			var rpos = parseInt(parent.attr('data-step'));
			$reel.animate({top: reelInitPos - animLength * rpos}, slideAnimTime, function() {
				checkReelPos();
			});
			
			nextStep(target, parent);
		}
	}	
	
});
