﻿var activeStepPositions = {
	design: '246',
	selection: '295',
	production: '305',
	sell: '360',
	investing: '435'
};

var rateOverList;

var stepHistory = {
	previous: '#step-design',
	current: '#step-design'
}

$(function(){
	var stepsList = $('.tutorial-steps');
	
	$('li:not(.active) p', stepsList).hide();
	
	// Разметка для перекрытия плюсиков и минусиков
	addRateOverList();
	
	$('h3 a', stepsList).click(function(){
		// Аккордион
		stepsList.children().removeClass('active').children('p').hide();
		
		$(this).parent().parent().addClass('active');
		$(this).parent().siblings('p').show();
		
		// Анимация руки с пальцем
		var step = $(this).attr('href');
		step = step.slice(6);
		
		$('.active-step').animate({
			top: activeStepPositions[step]
		});
		
		setStepHistory( $(this).attr('href') );
		
		// Прячем предыдущие изображения
		resetAllImages();
		resetRateOverList();
		
		// Выполняем анимацию
		setEventHandlers( $(this) );
		
		return false;
	});
});

function setEventHandlers( _link ){
	switch( _link.attr('href') ){
		case '#step-design':
			$('.show-process .border').fadeIn();
		break
		case '#step-selection':
			$('.show-process .rate-over').show();
			showNextRateOverItem();
			$('.show-process .rate').show();
		break
		case '#step-production':
			$('.show-process .t-shirt').fadeIn();
		break
		case '#step-sell':
			$('.show-process .man').fadeIn();
		break
		case '#step-investing':
			if( stepHistory.previous != '#step-sell' ){
				$('.show-process .man').fadeIn(function(){
					headAnimation( $(this).children() );
				});
			}
			else{
				setTimeout(function(){
					headAnimation( $('.show-process .man span') );
				}, 500);
			}
		break
	};
};

// Сохранение истории переходов по шагам туториала
function setStepHistory( _currentStep ){
	stepHistory.previous = stepHistory.current;
	stepHistory.current = _currentStep;
};

// Скрытие всех изображений, кроме льва. Также выполняется остановка летающей головы.
function resetAllImages(){
	$('.show-process img:not(.main-picture)').fadeOut();
	
	if( !(stepHistory.previous == '#step-sell' && stepHistory.current == '#step-investing') ){
		$('.show-process .man').fadeOut();
	}
	$('.show-process .man span').stop().css('top', '24px')
};

// Добавление html-разметки списка для раздела Отбор (плюсы и минусы)
function addRateOverList(){
	rateOverList = '<ul class="rate-over" style="display: none">';
	for( var i = 0; i < 12; i++ ){
		rateOverList += '<li class="rate-over-item-' + (i + 1) + '"></li>';
	}
	rateOverList += '</ul>';
	
	rateOverList = $( rateOverList );
	
	$('img.rate').after( rateOverList );
};

// Функция скрывает список для показа плюсов и минусов
function resetRateOverList(){
	rateOverList.hide().children().show();
};

// Рекурсивная функция для показа плюсов и минусов
function showNextRateOverItem(){
	var remainItemsCount = rateOverList.children(':visible').length;
	
	if( remainItemsCount ){
		var randomItem = Math.floor( Math.random() * remainItemsCount );
		rateOverList.children(':visible').eq( randomItem ).fadeOut(100, function(){
			showNextRateOverItem();
		});
	}
};

// Анимация головы: сначала вылет, затем левитация
function headAnimation( _headElement ){
	_headElement.animate({ top: '5px' }, 'slow');
	headFly( _headElement );
};

// Левитация головы
function headFly( _headElement, _direction ){
	if( _direction == '+' ){
		_headElement.animate({ top: '+=5px' }, 'slow', function(){ headFly( _headElement, '-' )});
	}
	else{
		_headElement.animate({ top: '-=5px' }, 'slow', function(){ headFly( _headElement, '+' )});
	}
};