// carousel 1 [+]
var t_1 //смена картинок
var t2_1 //левая/правая планки
var t3_1 //нижняя планка

var arrowWidth_1
var barWidth_1
var bottomTextHeight_1
var dist_1

var flag_1 = false
var flag2_1 = false
var flag_left_1 = false
var flag_right_1 = false

var w_1
var i_1
var img_1 = new Array()
var txt_1 = new Array()
var title_1 = new Array()
var link_1 = new Array()

var curpos_1
var left_1
var right_1
var center_1
var leftleft_1
var rightright_1

var center_pos_1
var left_pos_1
var leftleft_pos_1
var rightright_pos_1
var right_pos_1
var count_1

var mouseOverTxt = false
var mouseOverPic = false

var mouseOverLeftBar = false
var mouseOverLeftArrow = false


function setConst() {
	center_pos_1 = (w_1 - i_1)/2 + 'px 0px'
	left_pos_1 = (-3*i_1 + w_1)/2 + 'px 0px'
	leftleft_pos_1 = (-5*i_1 + w_1)/2 + 'px 0px'
	right_pos_1 = (w_1 + i_1)/2 + 'px 0px'
	rightright_pos_1 = (w_1 + 3*i_1)/2 + 'px 0px'
}

function setBackgroundPosition(){
	center_1.style.backgroundPosition = center_pos_1
	left_1.style.backgroundPosition = left_pos_1
	right_1.style.backgroundPosition = right_pos_1
	leftleft_1.style.backgroundPosition = leftleft_pos_1
	rightright_1.style.backgroundPosition = rightright_pos_1
	document.getElementById('inner_1').innerHTML = txt_1[curpos_1];
}

function setDivs(){
	left_1 = document.getElementById('left')
	leftleft_1 = document.getElementById('leftleft')
	right_1 = document.getElementById('right')
	rightright_1 = document.getElementById('rightright')
	center_1 = document.getElementById('center')
	
	left_1.style.zIndex = 0;
	leftleft_1.style.zIndex = 0;
	right_1.style.zIndex = 0;
	rightright_1.style.zIndex = 0;
	center_1.style.zIndex = 10;

	$('#sideLeft').css('width', (w_1-i_1)/2 + 'px').css('left', 0).css('display', 'block')
	$('#sideRight').css('width', (w_1-i_1)/2 + 'px').css('left', (w_1+i_1)/2 + 'px').css('display', 'block')

	// $('#inner_1').css('margin-left', (w_1-i_1)/2 + 'px')
	$('#pic').css('margin-left', (w_1-i_1)/2 + 'px')
	$('#arrowLeft').css('margin-left', ((w_1-i_1)/2 - arrowWidth_1 - dist_1) + 'px')
	$('#arrowRight').css('margin-left', ((w_1+i_1)/2 + dist_1) + 'px')
	
	$('.txt').css('margin-left', (w_1-i_1)/2 + 'px')
	$('.txt').css('width', i_1 + 'px')
}

function setBackgroundImage(){
	setConst()
	var val
	document.getElementById('inner_1').innerHTML = txt_1[curpos_1];
	
	// if (link_1[curpos_1] != null && link_1[curpos_1] != '') {
	if (link_1[curpos_1] != null) {
		if (link_1[curpos_1] != '')
		{
			$('#pic').html('<a style="line-height:0px; padding:0 '+(i_1/2)+'px 275px '+(i_1/2)+'px;" href="'+link_1[curpos_1]+'"></a>')
		}
		else
		{
			$('#pic').html('')
		}
	}

	val = curpos_1-2
	if (val<0) val = count_1+val
	leftleft_1.style.backgroundImage = 'url('+img_1[val]+')'

	val = curpos_1-1
	if (val<0) val = count_1-1
	left_1.style.backgroundImage = 'url('+img_1[val]+')'

	val = curpos_1
	center_1.style.backgroundImage = 'url('+img_1[val]+')'

	val = (curpos_1+1)%count_1
	right_1.style.backgroundImage = 'url('+img_1[val]+')'

	val = (curpos_1+2)%count_1
	rightright_1.style.backgroundImage= 'url('+img_1[val]+')'
}

function initGallery(){
	curpos_1 = 0
	t_1 = 500 //смена картинок
	t2_1 = 200 //левая/правая планки
	t3_1 = 200 //нижняя планка
	arrowWidth_1 = 70
	barWidth_1 = 261
	dist_1 = 35
	w_1 = getScreenWidth()
	i_1 = 982
	bottomTextHeight_1 = 148

	setDivs()
	setBackgroundImage()
	setBackgroundPosition()

	$('#pic').mouseover(function(){mouseOverPic = true}) 
	$('#pic').mouseout(
		function(){
			if (!mouseOverTxt) mouseOverPic = false;
		}) 

	$('#pic').hover(showBottomText, hideBottomText)

	$('#bottomText').mouseover(function() {mouseOverTxt = true;} )
	$('#bottomText').mouseout(function() {if (!mouseOverPic) mouseOverTxt = false;})

	$('#bottomText').hover(
		showBottomText,
		hideBottomText
	)

	$('#arrowLeft').mouseover(showLeftBar)
	$('#arrowLeft').click(nextImage)
	$('#barLeft').click(nextImage)
	$('#barLeft').mouseout(hideLeftBar)

	$('#arrowRight').mouseover(showRightBar)
	$('#arrowRight').click(prevImage)
	$('#barRight').click(prevImage)
	$('#barRight').mouseout(hideRightBar)
}

function nextImage(){
	if (!flag_1 && !flag_left_1) {
		curpos_1 = (curpos_1-1);
		if (curpos_1 < 0) curpos_1 = count_1-1
		
		w_1 = getScreenWidth()
		flag_1 = true;

		var val
		val = '"('+ left_pos_1 +')"' // LL -> L
		$('#leftleft').stop().animate({backgroundPosition: val}, {duration: t_1})
		
		val = '"('+ center_pos_1 +')"' // L -> C
		$('#left').animate({backgroundPosition: val}, {duration: t_1})
		
		val = '"('+ right_pos_1 +')"' // C -> R
		$('#center').stop().animate({backgroundPosition: val}, {duration: t_1})
		
		val = '"('+ rightright_pos_1 +')"' // R -> RR
		$('#right').stop().animate(
			{backgroundPosition: val}, 
			{duration: t_1, complete:
				function() {
					rightright_1.style.backgroundPosition = leftleft_pos_1 //RR -> LL
					center_1.setAttribute('id', 'right')
					right_1.setAttribute('id', 'rightright')
					rightright_1.setAttribute('id', 'leftleft')
					left_1.setAttribute('id', 'center')
					leftleft_1.setAttribute('id', 'left')
					
					if ($('#barLeft').width() >= barWidth_1 - arrowWidth_1/2 ) {
						
						var val = curpos_1 - 1
						if (val < 0) val = count_1 -1
						$('#barLeft').html('<div class="inner_text_left"><table><tr><td><a>'+title_1[ val ]+'</a></td></tr></table></div>');
					}
					
					if ($('#barRight').width() >= barWidth_1 - arrowWidth_1/2 ) {
						$('#barRight').html('<div class="inner_text_right"><table><tr><td><a>'+title_1[ (curpos_1 + 1) % count_1 ]+'</a></td></tr></table></div>');
					}
					setDivs()
					setBackgroundImage()
					flag_1 = false
				}
			}
		)

	}
}

function prevImage(){
	if (!flag_1 && !flag_right_1) {
		curpos_1 = (curpos_1+1)%count_1;

		var val
		w_1 = getScreenWidth();
		flag_1 = true;

		val = '"('+ right_pos_1 +')"' // RR -> R
		$('#rightright').stop().animate({backgroundPosition: val}, {duration: t_1})

		val = '"('+ center_pos_1 +')"' // R -> C
		$('#right').animate({backgroundPosition: val}, {duration: t_1})

		val = '"('+ left_pos_1 +')"' // C -> L
		$('#center').stop().animate({backgroundPosition: val}, {duration: t_1})

		val = '"('+ leftleft_pos_1 +')"' // L -> LL
		$('#left').stop().animate(
			{backgroundPosition: val},
			{duration: t_1,  complete:
				function() {
					leftleft_1.style.backgroundPosition = rightright_pos_1 //LL -> RR
					center_1.setAttribute('id', 'left')
					right_1.setAttribute('id', 'center')
					rightright_1.setAttribute('id', 'right')
					left_1.setAttribute('id', 'leftleft')
					leftleft_1.setAttribute('id', 'rightright')

					if ($('#barRight').width() >= barWidth_1 - arrowWidth_1/2 ) {
						$('#barRight').html('<div class="inner_text_right"><table><tr><td><a>'+title_1[ (curpos_1 + 1) % count_1 ]+'</a></td></tr></table></div>');
					}

					if ($('#barLeft').width() >= barWidth_1 - arrowWidth_1/2 ) {
						var val = curpos_1 - 1
						if (val < 0) val = count_1 -1
						$('#barLeft').html('<div class="inner_text_left"><table><tr><td><a>'+title_1[ val ]+'</a></td></tr></table></div>');
					}

					setDivs()
					setBackgroundImage()
					flag_1 = false
				}
			}
		)
	}
}

function showBottomText() {
	// if (!flag2_1)
	{
		flag2_1 = true
		$('#inner_1').stop().animate({top: 0}, {duration: t3_1, complete:function(){flag2_1 = false}})
	}
}

function hideBottomText() {
	if (!mouseOverTxt && !mouseOverPic) 
	{
		// flag2_1 = true
		$('#inner_1').stop().animate({top: bottomTextHeight_1},{duration: t3_1, complete:function(){flag2_1 = false}})
	}
}

function showLeftBar() {
	if (!flag_left_1)
	{
		var val = (w_1-i_1)/2 - arrowWidth_1
		$('#barLeft').animate({marginLeft: val}, 0)
		flag_left_1 = true;
		$('#barLeft').stop().animate({width: barWidth_1 - arrowWidth_1/2},{duration: t2_1, complete:function(){
				$('#barLeft').animate({marginLeft: '-='+arrowWidth_1/2+'px'}, 0)
				$('#barLeft').animate({width: '+='+arrowWidth_1/2+'px'}, 0)

				val = curpos_1 - 1
				if (val < 0) val = count_1 - 1
				$('#barLeft').html('<div class="inner_text_left"><table><tr><td><a>'+title_1[ val ]+'</a></td></tr></table></div>');
				
				flag_left_1=false
				$('#barLeft').css("z-index", 105)
			}
		})
	}
}

function hideLeftBar() {
	if ( !mouseOverLeftBar && !mouseOverLeftArrow) // if ( !flag_left_1 )
	{
		$('#barLeft').html('');
		flag_left_1 = true;
		$('#barLeft').animate({marginLeft: '+='+arrowWidth_1/2+'px'}, 0)
		$('#barLeft').animate({width: '-='+arrowWidth_1/2+'px'}, 0)
		$('#barLeft').css("z-index", 95)
		$('#barLeft').stop().animate({width: 0},{duration: t2_1, complete:function(){
				flag_left_1=false
				// $('#barLeft').css("z-index", 95)
			}
		})
	}
}

function showRightBar() {
	if (!flag_right_1) {
		var val = (w_1+i_1)/2 + 70
		$('#barRight').animate({marginLeft: val}, 0)
		flag_right_1 = true;
		val = '-='+(barWidth_1 - arrowWidth_1/2) + 'px'
		$('#barRight').stop().animate({marginLeft: val, width: barWidth_1 - arrowWidth_1/2},{duration: t2_1, complete:function(){
				val = '+=' + arrowWidth_1/2 + 'px'
				$('#barRight').animate({width: val}, 0)
				$('#barRight').html('<div class="inner_text_right"><table><tr><td><a>'+title_1[ (curpos_1 + 1) % count_1 ]+'</a></td></tr></table></div>');
				flag_right_1=false
				$('#barRight').css("z-index", 105)
			}
		})
	}
}

function hideRightBar() {
	if (!flag_right_1) 
	{
		$('#barRight').html('');
		flag_right_1 = true;
		var val = (w_1+i_1)/2 + arrowWidth_1
		$('#barRight').animate({width: '-='+arrowWidth_1/2+'px'}, 0)
		$('#barRight').css("z-index", 95)
		$('#barRight').stop().animate({width: 0, marginLeft: val},{duration: t2_1, complete:function(){
				flag_right_1=false
				// $('#barRight').css("z-index", 95)
			}
		})
	}
}

function getScreenWidth() {
	return document.compatMode=='CSS1Compat' && !window.opera?document.documentElement.clientWidth:document.body.clientWidth
}

// carousel 1 [-]

/************************************************************************************************************/

// carousel 2 [+]
var count_in_block_2 = 10;
var i_2; //counter
var imageWidth_2 = 176;
var imageHeight_2 = 114;
var imageMargin_2 = 8;
var curpos_2 = 0;
var flag_2 = false;
var t_2 = 700;
var img_2 = new Array();
var text_2 = new Array();
var count_2 = 0;

var inner_2 = new Array();
var id_2 = new Array();

function next_2() {
	if (!flag_2) {

		// var bigWidth_2 = (imageWidth_2+imageMargin_2)*count_in_block_2/2+imageMargin_2;
		var bigWidth_2 = 964;

		flag_2 = true
		$('.item').addClass('remove')

		curpos_2 = curpos_2 - count_in_block_2
		if (curpos_2 < 0) {
			curpos_2 = count_2 - count_2%count_in_block_2;
		}

		if (inner_2[curpos_2] == null) {
			$.ajax({
				type: "POST",
				url: "/js/ajax_index.php",
				data: ({
					type: 'gallery2',
					pos: curpos_2
				}),
				success: function(msg){
					var arr = msg.split('+++')

					for (var i = 0; i<count_in_block_2; i++) {
						if (arr[i]!=null) {
							var arr2 = arr[i].split('###')
							inner_2[i+curpos_2] = arr2[0]
							id_2[i+curpos_2] = arr2[1]
						}
					}

					fillDivByWorks(curpos_2, count_in_block_2, -bigWidth_2)
					$('.item').animate({left: '+='+bigWidth_2+'px'},
						{
							duration:700, specialEasing: { left: 'easeInBack' },
							complete: function(){
								$('.remove').remove()
								flag_2 = false;
							}
						}
					)
				},
				error: function() {console.log('error!');flag_2 = false; return false;}
			});
		}
		else {
			fillDivByWorks(curpos_2, count_in_block_2, -bigWidth_2)
			$('.item').animate({left: '+='+bigWidth_2+'px'},
				{
					duration:700, specialEasing: { left: 'easeInBack' },
					complete: function(){
						$('.remove').remove()
						flag_2 = false;
					}
				}
			)
		}
	}
}

function prev_2() {
	if (!flag_2) {

		// var bigWidth_2 = (imageWidth_2+imageMargin_2)*count_in_block_2/2+imageMargin_2;
		var bigWidth_2 = 964;
		flag_2 = true
		$('.item').addClass('remove')

		curpos_2 = curpos_2 + count_in_block_2
		if (curpos_2 >= count_2) curpos_2 = 0;

		if (inner_2[curpos_2] == null) {
			$.ajax({
				type: "POST",
				url: "/js/ajax_index.php",
				data: ({
					type: 'gallery2',
					pos: curpos_2
				}),
				success: function(msg){
					var arr = msg.split('+++')

					for (var i = 0; i<count_in_block_2; i++) {
						if (arr[i]!=null) {
							var arr2 = arr[i].split('###')
							inner_2[i+curpos_2] = arr2[0]
							id_2[i+curpos_2] = arr2[1]
						}
					}

					fillDivByWorks(curpos_2, count_in_block_2, bigWidth_2)
					$('.item').animate({left: '-='+bigWidth_2+'px'},
						{
							duration:700, specialEasing: { left: 'easeInBack' },
							complete: function(){
								$('.remove').remove()
								flag_2 = false;
							}
						}
					)
				},
				error: function() {console.log('error!');flag_2 = false; return false;}
			});
		}
		else {
			
			fillDivByWorks(curpos_2, count_in_block_2, bigWidth_2 )
			$('.item').animate({left: '-='+bigWidth_2+'px'},
				{
					duration:700, specialEasing: { left: 'easeInBack' },
					complete: function(){
						$('.remove').remove()
						flag_2 = false;
					}
				}
			)
		}
	}
}


function init_gal2(){
	$('#arrow_left').click(next_2)
	$('#arrow_right').click(prev_2)
	$('#gal2').html('');
	fillDivByWorks(0, count_in_block_2, 0)

	$.ajax({
		type: "POST",
		url: "/js/ajax_index.php",
		data: ({
			type: 'total_count'
		}),
		success: function(msg){
			count_2 = msg
		},
		error: function() {console.log('error!');}
	});
}

function fillDivByWorks(startPos, howMuch, startLeft) {
	var html = ''
	var top2
	var left2
	for (var i = 0; i<howMuch/2; i++) {
		if (inner_2[startPos+i] != null) {
			top2 = imageMargin_2
			left2 = startLeft+i*(imageWidth_2+2*imageMargin_2)
			html+= '<div class="item" style="top: '+top2+'px; left:'+left2+'px;"'
				+' onmouseover="show_txt('+id_2[startPos+i]
				+');" onmouseout="hide_txt('+id_2[startPos+i]+');">'
				+inner_2[startPos+i]
				+'</div>';
		}
	}

	for (i = 0; i<howMuch/2; i++) {
		if (inner_2[startPos+i+howMuch/2] != null) {
			top2 = imageMargin_2*2 + imageHeight_2
			left2 = startLeft+i*(imageWidth_2+2*imageMargin_2)
			html+= '<div class="item" style="top: '+top2+'px; left:'+left2+'px;"'
				+' onmouseover="show_txt('+id_2[startPos+i+howMuch/2]
				+');" onmouseout="hide_txt('+id_2[startPos+i+howMuch/2]+');"> '
				+inner_2[startPos+i+howMuch/2]
				+'</div>';
		}
	}

	var curHTML = $('#gal2').html()
	$('#gal2').html(curHTML + html)
}

function show_txt(id) {
	document.getElementById('alt_'+id).style.display = 'block';
}

function hide_txt(id) {
	document.getElementById('alt_'+id).style.display = 'none';
}

// carousel 2 [-]

/************************************************************************************************************/

// carousel 3 [+]
var count_3;
var count_in_block_3 = 5;
var i_3;
var curpos_3 = 0;
var img_3 = new Array();
var links_3 = new Array();
var title_3 = new Array();

function init_gal3(){
	// for (i_3=0; i_3<count_in_block_3; i_3++) { $('#gal3').append('<a class="img_3" href="'+links_3[i_3]+'" title="'+title_3[i_3]+'"><img src="'+img_3[i_3]+'"></a>')}
	$('.img_3').fadeTo(0, 1)
	$('#gal_3_left').click(gal_3_left)
	$('#gal_3_right').click(gal_3_right)
}

function gal_3_left() {
	$('.img_3').fadeTo(400, 0)
	setTimeout(function(){
		var val
		$('.img_3').remove();
		curpos_3 = curpos_3 - count_in_block_3
		if (curpos_3 < 0) {
			curpos_3 = count_3 + curpos_3; 
		}

		for (i_3=0; i_3<count_in_block_3; i_3++) {
			val = (curpos_3 + i_3)%count_3
			// if (val < 0) val = count_3+val;
			$('#gal3').append('<a class="img_3" href="'+links_3[val]+'" title="'+title_3[val]+'"><img src="'+img_3[val]+'"></a>')
		}
		$('.img_3').fadeTo(400, 1)
	}, 400)
}


function gal_3_right() {
	$('.img_3').fadeTo(1000, 0)
	setTimeout(function(){
		var val
		$('.img_3').remove();
		curpos_3 = (curpos_3 + count_in_block_3)%count_3
		for (i_3=0; i_3<count_in_block_3; i_3++) {
			val = (curpos_3 + i_3)%count_3
			$('#gal3').append('<a class="img_3" href="'+links_3[val]+'" title="'+title_3[val]+'"><img src="'+img_3[val]+'"></a>')
		}
		$('.img_3').fadeTo(1000, 1)
	}, 401)
}
// carousel 3 [-]

/************************************************************************************************************/

function bodyOnLoad()
{
	initGallery();
	init_gal2();
	init_gal3();
}
