/****** studiato e realizzato da Massimo Andreotti max@webjoy.it 				******/
/****** copyright 2008-2009, vietato l'utilizzo senza un'autorizzazione scritta	******/
/*
	[string] thisObjVarName		- nome assegnato a questa variabile
	[string] photoDir			- directory in cui sono presenti le foto 
	[array] aLsImg				- elenco immagini
	[array] aLsLabel			- elenco etichette immagini
	[obj] ext_obj_label			- div per inserire i dati dell'etichetta (null se no etichetta)
	[int] N,					- numero di immagini in anteprima
	[int] width1				- dimensione miniatura
	[int] width2				- dimensione miniatura con mouseover
	[int] widthBig				- 0 -> dimensione automatica, != 0 -> dimensione immagine grande
	[int] offsetY				- spostamento verticale delle miniature
	[string] tblContainer, 		- tabella dove viene visualizzato l'output
	[string] divThumbs, 		- divThumbs in cui vengono inserite le miniature
	[string] containerImgBig	- parent dell'immagine
	[string] imgBig				- img destinazione immagine piena

*/

function imgViewer(
	thisObjVarName, 
	photoDir, 
	aLsImg, 
	aLsLabel,
	ext_obj_label,
	N, 
	width1, 
	width2,
	widthBig,
	offsetX, 
	offsetY, 
	tblContainer, 
	divThumbs, 
	containerImgBig, 
	imgBig, 
	fCallBack,
	ext_desc
)
{
	var o = this;
	var m_ie = (navigator.userAgent.indexOf("MSIE") != -1);

	if (widthBig == 0) {
		var sw = screen.width;
		if (sw >= 1680)
			widthBig = 1140;
		else if (sw >= 1440)
			widthBig = 970;
		else if (sw >= 1280)
			widthBig = 860;
		else {
			widthBig = 680;
			width1 *= 0.8;
			width2 *= 0.8;
		}
	}
	var m_widthBig;
	var m_heightBig;

// impostazioni visualizzazione img
	var m_timeoutShowImgBig = 15; // n grandi -> ritardo elevato
	var m_bDelayWidth = true;
	var m_bDelayHeight = true;
	var m_startOpacityImgBig = 100; // %
	var m_stepOpacityImgBig  = 5;
	var m_bThumbsSizeDelay = true;
	var m_timeoutThumbsStartOpacity = 1000;
	var m_endThumbsOpacity = 30; // %

	var m_moveYThumbResize = parseInt((width2-width1)/((m_ie) ? 5 : 5));
	if (m_moveYThumbResize==0) m_moveYThumbResize=1;
////

	var m_iCurrImg = 0;
	var m_bLoading = true;

	var m_currBigImg;
	var m_currBigImgWidth;
	var m_currBigImgHeight;
	var m_currBigImgXStep;
	var m_currBigImgYStep;

	o.m_timerLoadImg = -1;
	o.m_timerThumbsOpacity = -1;
	
	// preload gif attesa caricamento
	var img_wait = new Image();
	img_wait.src = "img/wait.gif";
	var obj_wait;
	
	var obj_thumbs;
	var obj_thumb;
	var obj_thumbsAction;
	var btn_hide_show_thumbs;
	
	// preload miniature
	var m_aImgPreload = new Array();
	var t;
	for (t=0;t<aLsImg.length;t++) {
		m_aImgPreload[t] = new Image();
		m_aImgPreload[t].src = photoDir + "/" + aLsImg[t];
	}

	var m_xoffset = ((m_ie) ? offsetX : offsetX + 8);

	var obj_container = document.getElementById(tblContainer);
	
	var img_big = document.getElementById(imgBig);
	img_big.style.display = "none";
	img_big.alt = "";

	var m_bShowBig = false;

	if (aLsImg.length < N)
		N = aLsImg.length;
	var N_ = parseInt(N/2);
	
	function setLabel(i)
	{
		if (ext_obj_label != null) {
			if (aLsLabel != null) {
				ext_obj_label.innerHTML = aLsLabel[i];
				ext_obj_label.style.display = "";
				ext_obj_label.style.width = m_widthBig - 6; // per il padding
			}
			else
				ext_obj_label.style.display = "none";
		}
	}
	
	function setImgSize1()
	{
		// setLabel(m_iCurrImg);
		//if (parseInt(this.style.height) != width1)
			setTimeout(thisObjVarName + ".setImgSize1Delayed('" + this.id + "'," + ((m_bThumbsSizeDelay) ? width2 : width1) + ")", 20);
	}
	
	function setImgSize2()
	{
		// setLabel(this.flag);
		this.style.cursor="pointer";
		this.style.width = width2;
	}
	
	o.setImgSize1Delayed = function setImgSize1Delayed(id, v)
	{
		var obj = document.getElementById(id);
		if (v<width1)
			v = width1;
		else
			setTimeout(thisObjVarName + ".setImgSize1Delayed('" + id + "'," + (v-m_moveYThumbResize) + ")", 20);

		obj.style.width = v;
	}
	
	function setImg(i,dir)
	{
		
		if (this.src) {
			var f = this.flag;
			if (m_iCurrImg == f)
				return;
//			dir = ((f > m_iCurrImg) ? 1 : 2);
			dir = ((this.n > N_) ? 1 : 2);
			m_iCurrImg = f;
		}
		else
			m_iCurrImg = i;
			
		document.getElementById("ivTbCountThumbs").innerHTML = 
			"foto <b>" + (m_iCurrImg+1) + "</b> di <b>"+ aLsImg.length + "</b>";	

		m_currBigImg = new Image();
		m_currBigImg.src = photoDir + "/" + widthBig + "/" + aLsImg[m_iCurrImg];
		if (!m_currBigImg.complete) {
			obj_wait.style.left = parseInt(screen.width/2 -18);
			obj_wait.innerHTML = "<img src='" + img_wait.src  + "'>";
		}
		o.setImgBig();
		setThumbs(dir);
		
		if (fCallBack)
			eval(fCallBack + "(" + m_iCurrImg + ")");
	}

	o.setImgBig = function setImgBig()
	{
		if (o.m_timerLoadImg != -1)
			clearTimeout(o.m_timerLoadImg);
			
		if (m_currBigImg.complete) {
			img_big.src = ((m_bDelayWidth) ? "img/dot_brown.gif" : "img/trasp.gif");
			img_big.className = "ivImgBigBorderStart";
			img_big.style.display = "";
			
			// riduzione percentuale della dimensione delle immagini verticali
			m_widthBig = ((m_currBigImg.src.indexOf("_V.") != -1) ? parseInt(widthBig*0.66) : widthBig);
			
			setLabel(m_iCurrImg);
			
			img_big.style.width = m_currBigImgWidth = ((m_bDelayWidth) ? 1 : m_widthBig);
			m_currBigImgXStep = parseInt(m_widthBig / 20);
			
			obj_container.style.height =
			m_heightBig = parseInt(m_currBigImg.height * m_widthBig / m_currBigImg.width);
			img_big.style.height = m_currBigImgHeight =  ((m_bDelayHeight) ? 2 : m_heightBig);
			m_currBigImgYStep = parseInt(m_heightBig / 4);
			
			if (m_startOpacityImgBig != 100)
				setOpacity(img_big, m_startOpacityImgBig);
			document.getElementById(containerImgBig).style.height = m_heightBig+10;
			
			obj_wait.innerHTML = "";
			
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigWidthDelayed()", m_timeoutShowImgBig);
			ext_desc.style.width = m_widthBig+2;
//			o.setImgBigWidthDelayed();
		}
		else
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBig()", 30);
	}
	
	o.setImgBigWidthDelayed = function setImgBigWidthDelayed()
	{
		m_currBigImgWidth += m_currBigImgXStep;
		if (m_currBigImgWidth < m_widthBig) {
			img_big.style.width = m_currBigImgWidth;
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigWidthDelayed()", m_timeoutShowImgBig);
		}
		else {
			img_big.style.width = m_widthBig;
			img_big.src = m_currBigImg.src;
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigHeightDelayed()", m_timeoutShowImgBig);
//			o.setImgBigHeightDelayed();
		}
	}

	o.setImgBigHeightDelayed = function setImgBigHeightDelayed()
	{
		m_currBigImgHeight += m_currBigImgYStep;
		if (m_currBigImgHeight < m_heightBig) {
			img_big.style.height = m_currBigImgHeight;
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigHeightDelayed()", m_timeoutShowImgBig);
		}
		else {
			img_big.className = "ivImgBigBorderEnd";
			img_big.style.height = m_heightBig;
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigOpacity(" + m_startOpacityImgBig + ")", m_timeoutShowImgBig);
//			o.setImgBigOpacity(m_startOpacityImgBig);
		}
	}

	function setOpacity(obj, v)
	{
		if (m_ie)
			obj.style.filter = "alpha (opacity=" + v + ")";	
		else
			obj.style.opacity = v/100;
	}

	o.setImgBigOpacity = function setImgBigOpacity(v)
	{
		var inc = parseInt((100-m_startOpacityImgBig)/m_stepOpacityImgBig);
		if (inc < 1)
			inc = 1;
		v += inc;
		if (v < 100) {
			setOpacity(img_big, v);
			o.m_timerLoadImg = setTimeout(thisObjVarName + ".setImgBigOpacity(" + v + ")", m_timeoutShowImgBig);
		}
		else {
			if (m_startOpacityImgBig != 100)
				setOpacity(img_big, 100);
			o.m_timerLoadImg = -1;
			if (m_bLoading) {
				setThumbsOpacity(2000);
				m_bLoading = false;
			}
		}
	}	
	
	function setThumbsOpacity(n)
	{
		o.m_timerThumbsOpacity = setTimeout(thisObjVarName + ".setThumbsOpacityDelayed(100)",((parseInt(n)) ? n : m_timeoutThumbsStartOpacity));
	}

	o.setThumbsOpacityDelayed = function setThumbsOpacityDelayed(v)
	{
		v -= 3;
		if (v > m_endThumbsOpacity) {
			thumbsOpacity(v);
			o.m_timerThumbsOpacity = setTimeout(thisObjVarName + ".setThumbsOpacityDelayed("+v+")",30);
		}
		else
			thumbsOpacity(m_endThumbsOpacity);
	}
	
	o.delThumbsOpacity = function delThumbsOpacity()
	{
		if (o.m_timerThumbsOpacity != -1) clearTimeout(o.m_timerThumbsOpacity);
		thumbsOpacity(100);
	}
	
	function thumbsOpacity(v)
	{
		if (m_ie) {
			var s =  ((v == 100)
				? ""
				: "alpha (opacity=" + v + ")"
			);
			
			obj_thumbsAction.style.filter = s;
			
			if(obj_thumb) {
				var i;
				for (i=0; i<N; i++)
					obj_thumb[i].style.filter = s;
			}
		}
		else
			obj_thumbs.style.opacity = v/100;
	}
	
	// dir: 1 -> direzione dx, 2 -> sx
	function setThumbs(dir)
	{
		if (m_iCurrImg <= N_ && obj_thumb[0].flag == 0 || N == aLsImg.length) {
			setThumbs_();
		}
		else
			setTimeout(thisObjVarName + ".setThumbsDelayed(" + dir + ",100)", 100);
	}
	
	function setThumbs_()
	{
		var i,j;
		var thumb;
		var k = aLsImg.length - 
			(((m_iCurrImg >= N_ || obj_thumb[0].flag != 0) && N != aLsImg.length) 
			? N_
			: m_iCurrImg // no scorrimento
		);
		for (i=0; i<N; i++) {
			thumb = obj_thumb[i];
			j = (m_iCurrImg+i+k) % aLsImg.length;
			thumb.src =  m_aImgPreload[j].src;
			thumb.flag = j;
			thumb.className = ((j == m_iCurrImg) ? "ivThumbSelected" : "ivThumb");
			thumb.style.width = width1;
		}

		o.posThumbs();
	}
	
	o.setThumbsDelayed = function setThumbsDelayed(dir, v)
	{
		var m = ((m_ie) ? 40 : 20);
		v -= m;
		var thumb = obj_thumb[((dir == 1) ? 0 : N-1)];
		var moveY = parseInt(thumb.height) / (100/m);
		var i;
		if (v > 0) {
			if (dir == 1) {
				for (i=1; i<N; i++)
					obj_thumb[i].style.top = parseInt(obj_thumb[i].style.top) - moveY;
			}
			else if (dir == 2) {
				for (i=0; i<N-1; i++)
					obj_thumb[i].style.top = parseInt(obj_thumb[i].style.top) + moveY;
			}
				
			// setOpacity(thumb, 0);
			thumb.style.visibility = "hidden";
			setTimeout(thisObjVarName + ".setThumbsDelayed(" + dir + "," + v + ")", 100);
		}
		else {
			// setOpacity(thumb, 100);
			thumb.style.visibility = "visible";
			setThumbs_()
		}
	}
	
	o.prevImg = function prevImg()
	{
		m_iCurrImg = (--m_iCurrImg + aLsImg.length) % aLsImg.length;
		setImg(m_iCurrImg, 2);
		this.blur();
	}

	o.nextImg = function nextImg()
	{
		m_iCurrImg = ++m_iCurrImg % aLsImg.length;
		setImg(m_iCurrImg, 1);
		this.blur();
	}

	loadThumbs = function loadThumbs()
	{
		var i;
		var s = "";
		
		// barra thumbs action
		s += "<table id='ivTblThumbsAction' border=0 cellpadding=0 cellspacing=0><tr style='height:17px'><td class=ivNull>&nbsp;</td>" +
			 "<td style='width:21px' class=ivLink valign=top align=right id='ivPrevImg' nowrap><img width=21 height=17 src='img/left_.gif' border=0></td>" +
			 "<td style='width:" + (width1-40) + "px' class=ivCount align=center id='ivTbCountThumbs' nowrap></td>" +
			 "<td style='width:21px' class=ivLink valign=top align=left id='ivNextImg' nowrap><img width=21 height=17 src='img/right_.gif' border=0></td>" +
			 "<td class=ivNull>&nbsp;</td></tr></table>"; 
			 
		// thumbs
		for (i=0; i<N; i++)
			s += "<img style='z-index:"+(N-i)+";position:absolute;width:" + width1 + "px;' id='ivThumb" + i + "'>";

		obj_thumbs = document.getElementById(divThumbs);
		obj_thumbs.style.top =  obj_container.offsetTop + offsetY;
		m_xoffset = offsetX; // per reload firefox

		obj_thumbs.innerHTML = 
			s + "<div id='ivDivWait' style='position:absolute;" +
			"left:" + parseInt(obj_container.offsetLeft + obj_container.offsetWidth/2 -18) + "px;"+
			"top:"  + parseInt(obj_container.offsetTop + 50) + "px;"+
			"'></div>";
		
		obj_thumbs.onmouseover = o.delThumbsOpacity;
		obj_thumbs.onmouseout  = setThumbsOpacity;
		obj_thumbs.style.left = m_xoffset;

		obj_thumbsAction = document.getElementById("ivTblThumbsAction");

		// elimina la trasparenza
		thumbsOpacity(100);

		obj_wait = document.getElementById("ivDivWait");

		var prev_img = document.getElementById('ivPrevImg');
		prev_img.onclick = o.prevImg;

		var next_img = document.getElementById('ivNextImg');
		next_img.onclick = o.nextImg;

		obj_thumb = new Array();
		for (i=0; i<N; i++) {
			obj_thumb[i] = document.getElementById("ivThumb" + i);
			obj_thumb[i].onmouseout  = setImgSize1;
			obj_thumb[i].onmouseover = setImgSize2;
			obj_thumb[i].flag = i;
			obj_thumb[i].n = i;
			obj_thumb[i].onclick = setImg;
		}

		o.posThumbs();
		setImg(0);

//		setTimeout(thisObjVarName + ".posThumbs()", 50);
	}
	

////////////// metodi per cambiare i valori di default
	o.setThumbsDelay = function setThumbsDelay()
	{
		m_bThumbsSizeDelay = !m_bThumbsSizeDelay;
		loadThumbs();
	}

	o.setThumbsWidth = function setThumbsWidth(v1,v2,n)
	{
		width1 = v1;
		width2 = v2;
		N = n;		
		loadThumbs();
	}
///////////////

	o.posThumbs = function posThumbs()
	{
		hiddenThumbs(true);
		
		var fromTop = obj_thumbsAction.offsetHeight + 4;
		var thumb, h, w, hTot;
		var i;
		obj_thumb[0].style.top  = fromTop;
		for (i=0, hTot=fromTop; i<N; i++) {

			thumb = obj_thumb[i];
			thumb.style.left = 0;
		
			if(thumb.flag == -1)
				continue;

			if (m_aImgPreload[(m_iCurrImg+i)%N].complete) {

				h = ((thumb.width == width1) ? thumb.height : parseInt(thumb.width / thumb.height * width1));
				hTot += h + 6;
				
				if (i == N-1)
					break;

				obj_thumb[i+1].style.top = hTot;
			}
			else {
				setTimeout(thisObjVarName + ".posThumbs()", 50);
				return;	
			}
		}

		hiddenThumbs(false);
	}
	
	function hiddenThumbs(b)
	{	
		var i, v = ((b) ? "hidden" : "visible");
		obj_thumbsAction.style.visibility = v;
		for (i=0; i<N; i++)
			obj_thumb[i].style.visibility = v;
	}
	
	o.getCurrIndex = function getCurrIndex()
	{
		return m_iCurrImg;
	}

	img_big.onclick = o.nextImg;
	img_big.style.cursor = "pointer";
	
	loadThumbs();
}