var jsiBox = {
	boxBorderColor : '#727272',          
	boxBorderWidth : '1px',             
 	boxBgColor     : '#fff',          
	imgBgColor     : '#fff',          
	overlayColor   : '#000',          
	nextArrow      : '→',         
	prevArrow      : '←',         
	closeSymbol    : '×',          
	statusString   : '', 
	selfDir        : ''	                
};

function jsiBoxInit()
{
	if (jsiBox.selfDir == '') {
		var scriptNodes = document.getElementsByTagName('script');
		for (var i = 0; i < scriptNodes.length; i++) {
			if (scriptNodes[i].src && scriptNodes[i].src.match('jsibox_basic.js')) {
				jsiBox.selfDir = scriptNodes[i].src.split('jsibox_basic.js')[0];
				break;
			}
		}
	}
	jsiBox.boxBorderWidth1 = '15px';
	var boxHTML =  '<style type="text/css">#jsiMainBox * { margin: 0; padding: 0; border: 0; text-decoration: none; } #jsiMainBox a.jsiBtn {outline: none; float:right; color: #fff; font-size: 18px; width: 40px;  vertical-align:middle;font-weight:normal; } #jsiMainBox a.jsiNavn {background: url("'+jsiBox.selfDir+'img/4.gif"); align: right; text-align: right; margin: -21px 0 0 53%; display: block; width: 138px; height: 21px; border: 0px; z-index: 2001;} #jsiMainBox a.jsiNavn:hover {background: url("'+jsiBox.selfDir+'img/2.gif"); display: block; width: 138px; height: 21px; border: 0px;}  #jsiMainBox a.jsiNavp {background: url("'+jsiBox.selfDir+'img/3.gif"); align: left; text-align: left; margin: -21px 0px 0px 14%; display: block; width: 138px; height: 21px; border: 0px; z-index: 2001;} #jsiMainBox a.jsiNavp:hover {background: url("'+jsiBox.selfDir+'img/1.gif"); display: block; width: 138px; height: 21px; border: 0px;} </style>'
                  +'<div id="wrapJsiBox" style="position: absolute; top:0; left:0; display: none; z-index: 1000; background-color:'+jsiBox.overlayColor+'; opacity: 0.87; filter: alpha(opacity=\'87\');" onClick="return jsiBoxClose();"></div>'
                  +'<div style="position: absolute; top: -150px; left: 0; width: 100%; z-index: 2000;">'
                  +'  <div id="jsiMainBox" style="color: #000; align: left; text-align:left;position: relative; display: none; margin: auto; z-index: 2; width: 400px; background:'+jsiBox.boxBgColor+'; border: '+jsiBox.boxBorderWidth+' solid '+jsiBox.boxBorderColor+'; padding-bottom: 4px;">'
                  +'      <p style="text-align: right; font: bold 1px Tahoma; padding-top: 0;width:100%;overflow:hidden;padding-bottom:0;">'
                  +'        <img src="'+jsiBox.selfDir+'img/ajax-loader.gif" width="0px" height="0px" alt="" id="jsiBoxLoading" style=" float:left; display: none; " />'
                  +'        <a href="#" style="color: #f00; padding:0 2px 0 0;width:28px;line-height:22px;margin-top:-2px" onclick="return jsiBoxClose();" class="jsiBtn">'+jsiBox.closeSymbol+'</a>'
                  +'      </p>'
                  +'        <p id="jsiBoxNumberOfImage" style="color: #fff; font: normal 2px Tahoma; margin-top:-7px; padding:0 12px 2px 0;text-align:right;"></p>'
                  +'      <p id="jsiBoxMainImageWrap" style="background-color:'+jsiBox.imgBgColor+'; background-image: url('+jsiBox.selfDir+'img/ajax-loader2.gif); background-position: center; background-repeat: no-repeat; align: center; text-align:center; margin: 0 '+jsiBox.boxBorderWidth1+' 10px '+jsiBox.boxBorderWidth1+'; overflow: hidden; position: relative;">'
                  +'        <img src="'+jsiBox.selfDir+'img/blank.gif" id="jsiBoxMainImage" alt="" style="display: block;" />'
                  +'      </p>'
                  +'      <div style="background-image: url(../design/js/jsibox/img/6.gif); background-color: #fff; display: block; width: 138px; height: 21px; align: left; text-align: left; margin:  0px 0px -21px 53%;  width: 138px; height: 21px; border: 0px; z-index: 2008;">'
                  +'      </div>'
                  +'      <div style="background-image: url(../design/js/jsibox/img/5.gif); background-color: #fff; display: block; width: 138px; height: 21px; align: left; text-align: left; margin: 0px 0px 0px 14%;  width: 138px; height: 21px; border: 0px; z-index: 2008;">'
                  +'      </div>'
                  +'      <p>'
                  +'          <a href="#" id="nextJsiBoxLink" onclick="return jsiBoxNext();" style=" color: #000; display: none; " class="jsiNavn"></a>'
                  +'          <a href="#" id="prevJsiBoxLink" onclick="return jsiBoxPrev();" style="color: #000; display: none;" class="jsiNavp"></a>'
                  +'      </p>'
                  +'      <span id="jsiBoxTitle" style="margin:0 8px; font: normal 11px Tahoma;">'
                  +'      </span>'
                  +'  </div>'
                  +'</div>';
	jsiBox.wrapNode = document.getElementById('wrapJsiBox');
	if (!jsiBox.wrapNode) {
		document.write(boxHTML);
	}
	jsiBox.preloadImg        = new Image();
	jsiBox.preloadImg.onload = jsiBoxDisplayMainImg;
	jsiBox.wrapNode      = document.getElementById('wrapJsiBox');
	jsiBox.boxNode       = document.getElementById('jsiMainBox');
	jsiBox.progressImg   = document.getElementById('jsiBoxLoading');
	jsiBox.prevLinkNode  = document.getElementById('prevJsiBoxLink');
	jsiBox.nextLinkNode  = document.getElementById('nextJsiBoxLink');
	jsiBox.infoNode      = document.getElementById('jsiBoxNumberOfImage');
	jsiBox.wrapImgNode   = document.getElementById('jsiBoxMainImageWrap');
	jsiBox.mainImg       = document.getElementById('jsiBoxMainImage');
	jsiBox.titleNode     = document.getElementById('jsiBoxTitle');
	jsiBox.mainImg.style.display    = 'block';
	jsiBox.currentImgIndex = 0;           
	jsiBox.linkNodesArray  = new Array();
 
}

function jsiBoxDisplayMainImg()
{
	var previousImgIndex = jsiBox.currentImgIndex - 1;
	if (previousImgIndex >= 0) {
		jsiBox.prevLinkNode.style.display = '';
	} else { 
		jsiBox.prevLinkNode.style.display = 'none'; 
	}
	var nextImgIndex = jsiBox.currentImgIndex + 1;
	if (nextImgIndex < jsiBox.linkNodesArray.length) {
		jsiBox.nextLinkNode.style.display = '';
	} else { 
		jsiBox.nextLinkNode.style.display = 'none'; 
	} 

	if (jsiBox.linkNodesArray.length > 1) {
		var info = jsiBox.statusString.replace('[num]', jsiBox.currentImgIndex + 1);
		info     = info.replace('[total]', jsiBox.linkNodesArray.length);
		jsiBox.infoNode.innerHTML = info; 
	} 
	jsiBoxDimMainImage(10);                    
	jsiBox.progressImg.style.display = 'none'; 
	jsiBox.titleNode.innerHTML       = '';
	jsiBox.titleNode.style.display   = 'none'; 
}

function jsiBoxDimMainImage(opacity)
{
	var newOpacity;
	if (opacity) {
		newOpacity = opacity; 
	} else {
		var step   = 2;     
		newOpacity = jsiBox.mainImg.style.opacity*10 - step; 
	}
	jsiBox.mainImg.style.opacity = newOpacity/10;                         
	jsiBox.mainImg.style.filter  = 'alpha(opacity=' + newOpacity*10 + ')'; 
	if (jsiBox.mainImg.style.opacity > 0) { 
		setTimeout('jsiBoxDimMainImage()', 35); 
	} else {
		jsiBox.mainImg.style.display = 'none';
		jsiBox.mainImg.style.opacity = 0;
		jsiBox.mainImg.style.filter  = 'alpha(opacity=100)';
		jsiBoxResize(); 
	}
}

function jsiBoxResize() 
{
	var leftInnerMargin   = 10; 
	var rightInnerMargin  = 10;
	var leftBorder        = parseInt(jsiBox.boxNode.style.borderLeftWidth, 10) || 0;
	var rightBorder       = parseInt(jsiBox.boxNode.style.borderRightWidth, 10) || 0;
	var deltaWidth  = jsiBox.wrapImgNode.offsetWidth - jsiBox.preloadImg.width;
	var deltaHeight = jsiBox.wrapImgNode.offsetHeight - jsiBox.preloadImg.height; 
	
	var widthResizeStep  = deltaWidth / 4;
	var heightResizeStep = deltaHeight / 4;
	widthResizeStep      = (widthResizeStep > 0) ? Math.ceil(widthResizeStep) : Math.floor(widthResizeStep); 
	heightResizeStep     = (heightResizeStep > 0) ? Math.ceil(heightResizeStep) : Math.floor(heightResizeStep);
	
	var newWidth              = 430;
	jsiBox.boxNode.style.width = newWidth + 'px'; 
	var newHeight                  = 405;
	jsiBox.wrapImgNode.style.height = newHeight + 'px'; 

		if ( (jsiBox.preloadImg.width/jsiBox.preloadImg.height)>1 ){
		jsiBox.boxNode.style.width      = 430 + 'px';
		jsiBox.mainImg.style.width      = 400 + 'px';
		jsiBox.wrapImgNode.style.height = 280 + 'px';
		}
		else {
		jsiBox.boxNode.style.width      = 330 + 'px';
		jsiBox.mainImg.style.width      = 300 + 'px';
		jsiBox.wrapImgNode.style.height = 405 + 'px';		
		}
		jsiBox.mainImg.src              = jsiBox.preloadImg.src;
		jsiBox.mainImg.style.display    = 'block';
		var imageTitle = (jsiBox.linkNodesArray[jsiBox.currentImgIndex]) ? jsiBox.linkNodesArray[jsiBox.currentImgIndex].title : '';
		if (imageTitle != '') {
			jsiBox.titleNode.style.display = 'block';
			jsiBox.titleNode.innerHTML     = imageTitle;
		}
		jsiBoxLightenMainImage(); 

}

function jsiBoxLightenMainImage()
{
	var step        = 1;
	var tem=1;	
	var newOpacity  = jsiBox.mainImg.style.opacity*100 + step;
	if (newOpacity < 2) {
		setTimeout('jsiBoxLightenMainImage()', 1000);
	jsiBox.mainImg.style.opacity = '0.01';
	jsiBox.mainImg.style.filter  = 'alpha(opacity=1)';
	} else {
		jsiBox.mainImg.style.opacity = '1';
		jsiBox.mainImg.style.filter  = 'alpha(opacity=100)';
	}
}

function jsiBoxNext() 
{
	jsiBox.progressImg.style.display = 'none';
	
	var nextImgIndex = jsiBox.currentImgIndex + 1;
	if (nextImgIndex < jsiBox.linkNodesArray.length) {
		jsiBox.currentImgIndex = nextImgIndex;
		jsiBox.preloadImg.src  = jsiBox.linkNodesArray[nextImgIndex].href;
	}
	return false;
}

function jsiBoxPrev() 
{
	jsiBox.progressImg.style.display = 'none'; 
	
	var prevImgIndex = jsiBox.currentImgIndex - 1;
	if (prevImgIndex >= 0) {
		jsiBox.currentImgIndex = prevImgIndex;
		jsiBox.preloadImg.src  = jsiBox.linkNodesArray[prevImgIndex].href;
	}
	return false;
}

function jsiBoxClose()
{
	jsiBox.wrapNode.style.display   = 'none';
	jsiBox.boxNode.style.display    = 'none';
	return false;
}

function jsiBoxOpen(domNode)
{
	var docLinks = document.getElementsByTagName('a');
	jsiBox.progressImg.style.display = 'none'; 
	jsiBox.linkNodesArray            = new Array(); 
	if (domNode.rel != '') {
		for (var i = 0; i < docLinks.length; i++){
			if (docLinks[i].rel == domNode.rel) {
				jsiBox.linkNodesArray.push(docLinks[i]); 
			}
			if (docLinks[i] == domNode) {
				jsiBox.currentImgIndex = jsiBox.linkNodesArray.length - 1;
			}
		}
	} else {
		jsiBox.linkNodesArray.push(domNode);
		jsiBox.currentImgIndex = 0;
	}
	jsiBox.infoNode.innerHTML  = '&#160;';
	jsiBox.titleNode.innerHTML = '';

	var pagesize                 = getPageSizeWithScroll();
	jsiBox.wrapNode.style.display = 'block';
	jsiBox.wrapNode.style.height  = pagesize[1] + 'px';
	jsiBox.wrapNode.style.width   = pagesize[0] + 'px';
	var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;
	jsiBox.boxNode.style.top         = (top + 200) + 'px';
	jsiBox.mainImg.src               = jsiBox.selfDir+'img/blank.gif';
	jsiBox.wrapImgNode.style.height  = '30px';
	jsiBox.boxNode.style.width       = '200px';
	jsiBox.boxNode.style.display     = 'block';
	jsiBox.preloadImg.src            = domNode.href; 
	return false;
}

function getPageSizeWithScroll()
{
	if( window.innerHeight && window.scrollMaxY ) { 
		pageWidth = document.body.clientWidth + window.scrollMaxX;
		pageHeight = window.innerHeight + window.scrollMaxY;
	} else if( document.body.scrollHeight > document.body.offsetHeight ) { 
		pageWidth = document.body.scrollWidth;
		pageHeight = document.body.scrollHeight;
	} else {
		pageWidth = document.body.offsetWidth + document.body.offsetLeft;
		pageHeight = document.body.offsetHeight + document.body.offsetTop;
	}
	arrayPageSizeWithScroll = new Array(pageWidth, pageHeight);
	return arrayPageSizeWithScroll;
}

jsiBoxInit();