var wfBoxLinksArray = new Array(); // Массив ссылок текущей галлереи
var currentImgIndex = 0;           // Индекс текущего изображения

// Вспомогательная ф-ция получения размера документа
function getPageSizeWithScroll(){
	if( window.innerHeight && window.scrollMaxY ) {  // Firefox 
		pageWidth = window.innerWidth + window.scrollMaxX;
		pageHeight = window.innerHeight + window.scrollMaxY;
	} else if( document.body.scrollHeight > document.body.offsetHeight ) { // all but Explorer Mac
		pageWidth = document.body.scrollWidth;
		pageHeight = document.body.scrollHeight;
	} else { // works in Explorer 6 Strict, Mozilla (not FF) and Safari
		pageWidth = document.body.offsetWidth + document.body.offsetLeft; 
		pageHeight = document.body.offsetHeight + document.body.offsetTop; 
	}
	arrayPageSizeWithScroll = new Array(pageWidth, pageHeight);
	//alert( 'The height is ' + yWithScroll + ' and the width is ' + xWithScroll );
	return arrayPageSizeWithScroll;
}

// Ф-ция анимирует изменение размеров блока при разнице размеров загружаемых изображений
function resizeWfBox() 
{
	var wfBox              = document.getElementById('wfBox');
	var mainImg            = document.getElementById('wfBoxMainImage');
	var mainImgPreload     = document.getElementById('wfBoxPreloadContainer');
	var wfBoxMainImageWrap = document.getElementById('wfBoxMainImageWrap');
	var wfBoxSideBorders   = document.getElementById('wfBoxSideBorders');
	var captionHeight      = document.getElementById('wfBoxCaption').offsetHeight;
	if (wfBox && mainImg && wfBoxMainImageWrap) {
		var leftInnerMargin   = parseInt(wfBoxMainImageWrap.style.marginLeft);
		var rightInnerMargin  = parseInt(wfBoxMainImageWrap.style.marginRight);
		var leftInnerPadding  = parseInt(wfBoxSideBorders.style.paddingLeft);
		var rightInnerPadding = parseInt(wfBoxSideBorders.style.paddingRight);
		var topInnerPadding   = 0;
		var botInnerPadding   = 0;
		if (leftInnerMargin == NaN) {
			leftInnerMargin = 0;
		}
		if (rightInnerMargin == NaN) {
			rightInnerMargin = 0;
		}
		var deltaWidth       = wfBox.offsetWidth - mainImgPreload.offsetWidth - leftInnerMargin - rightInnerMargin - leftInnerPadding - rightInnerPadding;
		var deltaHeight      = wfBoxMainImageWrap.offsetHeight - mainImgPreload.offsetHeight - topInnerPadding - botInnerPadding;

		var widthResizeStep  = Math.ceil(Math.abs(deltaWidth / 8));
		var heightResizeStep = Math.ceil(Math.abs(deltaHeight / 8));
		
		if (Math.abs(deltaHeight) > heightResizeStep) {
			var signNum = (deltaHeight > 0) ? -1 : 1;
			newHeight   = wfBoxMainImageWrap.offsetHeight   + signNum*heightResizeStep;
			wfBoxMainImageWrap.style.height = newHeight + 'px'; // Изменение высоты внутреннего блока
		}
		if (Math.abs(deltaWidth) > widthResizeStep) {
			var signNum = (deltaWidth > 0) ? -1: 1;
			var newWidth = wfBox.offsetWidth + signNum*widthResizeStep;
			wfBox.style.width              = newWidth + 'px'; // Изменение высоты внешнего блока
		}
		if ((Math.abs(deltaHeight) > (heightResizeStep)) || (Math.abs(deltaWidth) > (widthResizeStep))) {
			setTimeout('resizeWfBox()', 40);
		} else {
			wfBoxMainImageWrap.style.height = mainImgPreload.offsetHeight + 'px';
			wfBox.style.width     = mainImgPreload.offsetWidth + leftInnerMargin + rightInnerMargin + leftInnerPadding + rightInnerPadding + 'px';
			mainImg.src           = mainImgPreload.src;
		    mainImg.style.display = 'block';
			lightenMainImage();
		}  
	}
}

function navigateWfImages(domNode)
{
	var mainImgPreload = document.getElementById('wfBoxPreloadContainer');
	var wfBoxLoading   = document.getElementById('wfBoxLoading');
	
	wfBoxLoading.style.display = 'block';
	if (mainImgPreload) {
		mainImgPreload.src = domNode.href;
	}
	return false;
}

// Показ предыдущего изображения
function navigateNext() 
{
	var mainImgPreload = document.getElementById('wfBoxPreloadContainer');
	var wfBoxLoading   = document.getElementById('wfBoxLoading');
	wfBoxLoading.style.display = 'block';
	
	var nextImgIndex = currentImgIndex + 1;
	if (mainImgPreload && (nextImgIndex < wfBoxLinksArray.length)) {
		currentImgIndex    = nextImgIndex;
		mainImgPreload.src = wfBoxLinksArray[nextImgIndex].href;
	}
	return false;
}

// Показ следующего изображения
function navigatePrevious() 
{
	var mainImgPreload = document.getElementById('wfBoxPreloadContainer');
	var wfBoxLoading   = document.getElementById('wfBoxLoading');
	wfBoxLoading.style.display = 'block';
	
	var prevImgIndex = currentImgIndex - 1;
	if (mainImgPreload && (prevImgIndex >= 0)) {
		currentImgIndex    = prevImgIndex;
		mainImgPreload.src = wfBoxLinksArray[prevImgIndex].href;
	}
	return false;		
}

function showMainWfImage()
{
	var nextLink         = document.getElementById('nextWfBoxLink');
	var prevLink         = document.getElementById('prevWfBoxLink');
	var mainImg          = document.getElementById('wfBoxMainImage');
	var wfBoxNumber      = document.getElementById('wfBoxNumberOfImage');
	var previousImgIndex = currentImgIndex - 1;
	if (previousImgIndex >= 0) {
		prevLink.style.display = '';
	} else { 
		prevLink.style.display = 'none'; // Скрыть ссылку
	}
	var nextImgIndex = currentImgIndex + 1;
	if (nextImgIndex < wfBoxLinksArray.length) {
		nextLink.style.display = '';
	} else { 
		nextLink.style.display = 'none'; // Скрыть ссылку
	} 
	wfBoxNumber.innerHTML = currentImgIndex + 1 + "/" + wfBoxLinksArray.length;
	if (mainImg) {
		dimMainImage(10); 	// Затемняем предыдущее изображение
	}
	var wfBoxLoading = document.getElementById('wfBoxLoading');
	wfBoxLoading.style.display = 'none';
}

// Увеличивает прозрачность изображения от заданного в opacity значения до нуля (диапазон opacity [0-10]) 
function dimMainImage(opacity)
{
	var mainImg = document.getElementById('wfBoxMainImage');
	var newOpacity;
	if (opacity) {
		newOpacity = opacity; // первый вызов ф-ции, задаем свойство 
	} else {
		var step   = 0.5;
		newOpacity = mainImg.style.opacity*10 - step; // Изменяем значение
	}
	mainImg.style.opacity = newOpacity/10;
	mainImg.style.filter  = 'alpha(opacity=' + newOpacity*10 + ')';
	if (mainImg.style.opacity > 0) { 
		setTimeout('dimMainImage()', 10);
	} else {
		mainImg.style.opacity = 0;
		mainImg.style.display = 'none';
		resizeWfBox(); 	// Ресайзим бокс
	}
}

// Уменьшает прозрачность изображения от текщего значения до полностью непрозрачного
function lightenMainImage()
{
	var mainImg = document.getElementById('wfBoxMainImage');
	var delta   = 10 - mainImg.style.opacity*10;
	var step = delta/100;
	if (step < 0.5) {
		step = 0.5;
	}
	var newOpacity        = mainImg.style.opacity*10 + step;
	mainImg.style.opacity = newOpacity/10;
	mainImg.style.filter  = 'alpha(opacity=' + newOpacity*10 + ')';
	
	if ((mainImg.style.opacity < 1)) {
		setTimeout('lightenMainImage()',10);
	} else {
		mainImg.style.opacity = 1;
		mainImg.style.filter  = '';
	}
}

function hideAllwfBoxes()
{
	var wfBoxMainImage = document.getElementById('wfBoxMainImage');
	var wfBox = document.getElementById('wfBox');
	var wrapWfBox = document.getElementById('wrapWfBox');
	wfBox.style.display = 'none';
	wrapWfBox.style.display = 'none';
  wfBoxMainImage.src= '/html/wfbox/images/blank.gif';
	return false;
}

// Отправляет изображение на просмотр в боксе
function showWfBox(domNode)
{
	var linkNodes    = document.getElementsByTagName('a');
	var wfBoxLoading = document.getElementById('wfBoxLoading');
	wfBoxLoading.style.display = 'block';
	wfBoxLinksArray  = new Array(); 
	// Пройдемся по всему списку ссылок для того чтобы найти элементы с заданным rel
	if (domNode.rel != '') {
		for (var i = 0; i < linkNodes.length; i++){
			if (linkNodes[i].rel == domNode.rel) {
				wfBoxLinksArray.push(linkNodes[i]); // Добавим найденный элемент в массив
			}
			if (linkNodes[i] == domNode) {
				currentImgIndex = wfBoxLinksArray.length - 1;
			}
		}
	}

	var wfBox          = document.getElementById('wfBox');
	var mainImg        = document.getElementById('wfBoxMainImage');
	var mainImgPreload = document.getElementById('wfBoxPreloadContainer');
	if (mainImgPreload && wfBox) {
		mainImg.src         = '/html/wfbox/images/blank.gif';
		mainImgPreload.src  = '';
		var wrap            = document.getElementById('wrapWfBox');     //
		wrap.style.display  = 'block';                           // Сделать общий темный фон
		var pagesize        = getPageSizeWithScroll();
		wrap.style.height   = pagesize[1] + 'px'; //
		wrap.style.width    = document.body.offsetWidth + 'px'; //
		//alert(document.documentElement.scrollTop);
		var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
		wfBox.style.top     = (top + 200) + 'px'
		wfBox.style.display = 'block';
		mainImgPreload.src  = domNode.href;
	}
	return false;
}   
if (!document.getElementById('wfBox')) {
	var boxHTMLCode = '<div id="wrapWfBox"></div>'
					 +'<img src="#" id="wfBoxPreloadContainer" onload="showMainWfImage();" />'
                     +'<div id="WfBoxAlignCenter">'
                     +'    <div id="wfBox">'
                     +'      <div id="wfBoxSideBorders" style="padding: 0 3px;">'
			         +'          <div id="wfBoxBorders">'
				     +'            <p id="wfBoxCaption">'
					 +'              <img src="/html/wfbox/images/ajax-loader2.gif" alt="" id="wfBoxLoading" />'
				     +'            </p>'
				     +'            <div id="wfBoxMainImageWrap" style="margin: 0px 16px; overflow: hidden;">'
					 +'              <img src="/html/wfbox/images/blank.gif" id="wfBoxMainImage" alt="" />'
				     +'            </div>'
					 +'              <a href="#" id="closeLink" onclick="return hideAllwfBoxes();"><img src="/html/wfbox/images/close.gif" width="25" height="25" alt="close" /></a>'
					 +'              <span id="controlWfBoxArrows">'
					 +'                <a href="#" id="prevWfBoxLink" onclick="return navigatePrevious();"><img src="/html/wfbox/images/arrow_1.gif" width="25" height="25" alt="Prev" /></a>'
					 +'                <a href="#" id="nextWfBoxLink" onclick="return navigateNext();"><img src="/html/wfbox/images/arrow_2.gif" width="25" height="25" alt="Next" /></a>'
					 +'              </span>'
					 +'              <span id="wfBoxNumberOfImage"></span>'
					 +'              <div class="clear">&#160;</div>'
			         +'          </div>'
		             +'      </div>'
                     +'    </div>'
                     +'</div>';
	document.write(boxHTMLCode);
}