// JavaScript Document
//Global variables
var cont, mainImgCont, thep, bigImg, links, bigImgMainSrc, linkEnding, prev, next, currScreen, thumbsContWidth;
var imgTypeArray, imgType;
//Customizable variables
var imgWidth; //The big image width
var startIndex = 0; // The picture to start with
//var thumbRows = 2;
//var thumbCols = 4;
var thumbScreens;
var isMSIE = /*@cc_on!@*/false;
var tempAlt = "";

function pics() {
	if (document.getElementById('gallery')) {
		//Init the div for descriptions of the images
		$('body').append("<div class='alt-text'>Няма описание</div>");
		cont = document.getElementById('gallery');
		imgWidth = $(cont).width();
		$("p.gallery span").css("width", imgWidth + "px");
		$("p.gallery").css("width", 3*imgWidth + 30 + "px");
		//alert(imgWidth);
		mainImgCont = document.getElementById('mainImgCont');
		mainImgCont.style.width = imgWidth + "px";
		thep = cont.getElementsByTagName('p');
		bigImg = thep[0].firstChild.firstChild;
		//links = cont.getElementsByTagName('a');
		links = $("ul.gallery a");
		imgTypeArray = bigImg.src.split('.');
		imgType = imgTypeArray[imgTypeArray.length-1];
		//alert();
		bigImgMainSrc = bigImg.src.substring(0, bigImg.src.length-(imgType.length+1));
		//alert(bigImgMainSrc);
		thumbsContWidth = $("#thumbsCont").width();
		//alert(thumbsContWidth);
		$("ul.gallery").css("width", thumbsContWidth + "px");
		thumbScreens = $("ul.gallery").length;
		//$("div.thumbsCont").css("width", "600px");
		$("div.thumbsCont div").css("width", thumbScreens*imgWidth + 30 + "px");
		
		thep[0].style.marginLeft = "-" + imgWidth + "px";
		thep[0].style.paddingLeft = imgWidth + "px";
		//thep[0].style.marginLeft = + "px";
		/*var lis = $("ul.gallery li");
		var thumbsOnScreen = Math.floor(lis.length/thumbScreens);
		//alert(Math.floor(lis.length/thumbScreens));
		for (var k = 0; k < thumbScreens; k++) {
			alert($(lis[k*thumbsOnScreen]).html());
		}*/
		
		
		//"Click on thumnails" events
		for (var i = 0; i < links.length; i++) {
			links[i].onclick = function () {
				imgTypeArray = this.firstChild.src.split('.');
				imgType = imgTypeArray[imgTypeArray.length-1];
				//alert();
				bigImgMainSrc = bigImg.src.substring(0, bigImg.src.length-(imgType.length+1));
				//alert(imgWidth);
				document.location = this.href;
				linkEnding = this.firstChild.src.substring(0, this.firstChild.src.length-6-(imgType.length+1));
				var curLink = this;
				$("ul.gallery a").removeAttr("class");
				this.className = "currentLink";
				
				//Sliding
				var newImg = document.createElement('img');
				var newImgSpan = document.createElement('span');
				newImgSpan.style.width = imgWidth + "px";
				//newImg.appendChild(thep[0]);
				if (this.firstChild.className == "noBig") {
					newImg.src = "/i/design/noImage.jpg";
				}
				else {
					newImg.src = linkEnding + "." + imgType;
				}
				newImg.alt = this.firstChild.alt;
				newImg.id = this.rel;
				newImgSpan.appendChild(newImg);
				//newImg.onload = function () {
				
				//Check to move backward or forward
				if (parseInt(curLink.rel) > parseInt(thep[0].firstChild.firstChild.id)) {
					thep[0].appendChild(newImgSpan);
					$(thep[0].firstChild).animate({
						marginLeft: "-" + imgWidth + "px"
					}, 500, function(){
						addNewImgAfter();
					});
				}
				else if (parseInt(curLink.rel) < parseInt(thep[0].firstChild.firstChild.id)) {
					thep[0].style.paddingLeft = 0 + "px";
					thep[0].insertBefore(newImgSpan,thep[0].firstChild);
					thep[0].lastChild.style.marginRight = 0 + "px";
					$(thep[0]).animate({
						paddingLeft: imgWidth + "px"
					}, 500, function(){
						addNewImgBefore();
					});
				}
				//}

				$("ul.gallery a").addClass('over');
				
				var tempHeading = $('#h4_for_' + this.rel).text();
				var tempDesc = $('#p_for_' + this.rel).text();
				if (tempHeading != "" || tempDesc != "") {				
					$('#detailed-desc').css("display", "block");					
					$('#img-heading').text(tempHeading);
					$('#img-desc').text(tempDesc);
				}
				else {
					$('#detailed-desc').css("display", "none");
				}
				return false;
			}
		}
		//currScreen = 0;
		prev = document.getElementById('prev');
		next = document.getElementById('next');
		$(prev).click(function () { 
		  $("#thumbsInner").animate({
									
				marginLeft: (parseInt(-currScreen) + 1)*parseInt(thumbsContWidth) + "px"
			}, 500, function(){
				thumbBtnPrev();
			});
		  return false;
		});
		$(next).click(function () {
		  $("#thumbsInner").animate({
								
				marginLeft: (parseInt(currScreen) + 1)*parseInt(thumbsContWidth)*(-1) + "px"
			}, 500, function(){
				thumbBtnNext();
			});
		  return false;
		});
	}
	$("ul.gallery").hover(
      function () {
		$("ul.gallery a").addClass('over');
		//alert(xMousePos);
		//$('div.alt-text').css('display', 'block');
		//$('div.alt-text').css('left', xMousePos + 20 + 'px');
		//$('div.alt-text').css('top', yMousePos - 10 + 'px');
      }, 
      function () {
		$("ul.gallery a").removeClass('over');
		//$('div.alt-text').css('display', 'none');
      }
    );
	$("ul.gallery img").hover(
      function () {
		//alert(xMousePos);
		$('div.alt-text').css('display', 'block');
		$('div.alt-text').text(this.alt);
		tempAlt = this.alt;
		this.alt = "";
		//$('div.alt-text').css('left', xMousePos + 20 + 'px');
		//$('div.alt-text').css('top', yMousePos - 10 + 'px');
      }, 
      function () {
		this.alt = tempAlt;
		$('div.alt-text').css('display', 'none');
      }
    );
	
}
function addNewImgAfter () {
	thep[0].removeChild(thep[0].firstChild);
}
function addNewImgBefore () {
	thep[0].removeChild(thep[0].lastChild);
}
function thumbBtnPrev () {
	currScreen--;
	if (currScreen == 0) {
		$(prev).css("visibility", "hidden");
		$(next).css("visibility", "visible");
	}
	else {
		$(next).css("visibility", "visible");
	}
}
function thumbBtnNext () {
	currScreen++;
	if (currScreen == parseInt(thumbScreens) -1) {
		$(next).css("visibility", "hidden");
		$(prev).css("visibility", "visible");
	}
	else {
		$(prev).css("visibility", "visible");
	}
}
function currentImg() {
	//Get current image loaded in the address bar
	var urlNum = String(document.location).split('#');
	var currUrl;
	if (typeof(urlNum[1]) == "undefined" || urlNum[1] >= links.length) {
		currUrl = startIndex;
	}
	else {
		currUrl = parseInt(urlNum[1]);
	}
	//alert(links[currUrl].firstChild.src);
	if (links[currUrl].firstChild.className == "noBig") {
		bigImg.src = "/i/design/noImage.jpg";
	}
	else {
		linkEnding = links[currUrl].firstChild.src.substring(0, links[currUrl].firstChild.src.length-6-(imgType.length+1));
		bigImg.src = linkEnding + "." + imgType;
	}
	
	//Add the current thumbnail a class
	links[currUrl].className = "currentLink";
	
	//Finding the thumbnails position
	var myList;
	var lists = $("ul.gallery");
	for (var i = 0; i < lists.length; i++) {
		var innerLinks = lists[i].getElementsByTagName("a");
		for (var j = 0; j < innerLinks.length; j++) {
			if(/currentLink/.test(innerLinks[j].className)) {
				currScreen = i;
			}
		}
	}
	//Hiding the not necessery paging buttons
	if (currScreen == 0) {
		$(prev).css("visibility", "hidden");
		if (currScreen == parseInt(thumbScreens) -1) {
			$(next).css("visibility", "hidden");
		}
	}
	if (currScreen == parseInt(thumbScreens) -1) {
		$(next).css("visibility", "hidden");
		if (currScreen == 0) {
			$(prev).css("visibility", "hidden");
		}
	}
	
	//Moving to current section with thumbnails
	$("#thumbsInner").css("margin-left", (parseInt(-currScreen))*parseInt(thumbsContWidth) + "px");
}
$(document).ready(function(){
   if (document.getElementById('gallery') && $("div.vertical").length == 0 && $("div.video-gallery").length == 0) {
   	pics();
   	currentImg();
   	focusGallery();
   	detectMouse();
   }
 });
 if (document.getElementById('gallery') && $("div.vertical").length == 0 && $("div.video-gallery").length == 0) {
	$(window).resize(function(){
		cont = document.getElementById('gallery');
		imgWidth = $(cont).width();
		$("p.gallery span").css("width", imgWidth + "px");
		$("p.gallery").css("width", 3*imgWidth + 30 + "px");
		//alert(imgWidth);
		if(mainImgCont) {
			mainImgCont.style.width = imgWidth + "px";
		}
		
		thumbsContWidth = $("#thumbsCont").width();
		//alert(thumbsContWidth);
		$("ul.gallery").css("width", thumbsContWidth + "px");
		$("div.thumbsCont div").css("width", thumbScreens*imgWidth + 30 + "px");
		
		thep[0].style.marginLeft = "-" + imgWidth + "px";
		thep[0].style.paddingLeft = imgWidth + "px";
	});
 }

//Scroll down the window
var num = 0;
var timeID;
function focusGallery() {
	var urlVar = String(document.location).split('?');
	if (urlVar[urlVar.length - 1] == "cmspagemode=edit") {
		//alert("In Edit mode!");
	}
	else {
		timeID = setInterval('moveWindow()', 20);
	}
}
function moveWindow () {
	if (num < 195) {
		window.scrollTo(0,num);
		num+=5;
	}
	else {
		clearInterval(timeID);
	}
}

//Capturing the mouse position
function detectMouse() {
	if (document.layers) { // Netscape
			document.captureEvents(Event.MOUSEMOVE);
			document.onmousemove = captureMousePosition;
	} else if (document.all) { // Internet Explorer
			document.onmousemove = captureMousePosition;
	} else if (document.getElementById) { // Netcsape 6
			document.onmousemove = captureMousePosition;
	}
}
function captureMousePosition(e) {
	var posx = 0;
	var posy = 0;
	if (!e) var e = window.event;
	if (e.pageX || e.pageY) 	{
		posx = e.pageX;
		posy = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		posx = e.clientX + document.body.scrollLeft
			+ document.documentElement.scrollLeft;
		posy = e.clientY + document.body.scrollTop
			+ document.documentElement.scrollTop;
	}
	// posx and posy contain the mouse position relative to the document
	// Do something with this information
	if (isMSIE) {
		$('div.alt-text').css('left', posx + 40 + 'px');
		$('div.alt-text').css('top', posy - 30 + 'px');
	}
	else if (navigator.userAgent.indexOf('Opera') != -1) {
		$('div.alt-text').css('left', posx + 40 + 'px');
		$('div.alt-text').css('top', posy - 30 + 'px');
	}
	else {
		$('div.alt-text').css('left', posx + 50 + 'px');
		$('div.alt-text').css('top', posy - 35 + 'px');
	}
}