// JavaScript Document

// Tot aquest control és degut al I.E.7.
var prev_windows_height = 0;
var prev_windows_width = 0;
var prev_image_ratio = 0;

function showMessage(p_strFunction, p_strMessage)
{
	//alert("[" + p_strFunction + "]" + p_strMessage);
}

// -----------------------------------------------------
// Get window width in pixels; returns 0 if unidentifiable.
// -----------------------------------------------------
function getWindowWidth(){
  var ww = 0;
  d = document;
   if ( typeof window.innerWidth != 'undefined' )
     ww = window.innerWidth;  // NN and Opera version
   else
   {
     if ( d.documentElement
       && typeof d.documentElement.clientWidth!='undefined'
       && d.documentElement.clientWidth != 0 )
       ww = d.documentElement.clientWidth;
     else
       if ( d.body
         && typeof d.body.clientWidth != 'undefined' )
         ww = d.body.clientWidth;
     else alert ("Can't identify window width - please tell me which browser you are using.")
   }
   return ww;
}

// -----------------------------------------------------
// Get window height in pixels; returns 0 if unidentifiable.
// -----------------------------------------------------
function getWindowHeight(){
  var hh = 0;
  d = document;
   if ( typeof window.innerHeight != 'undefined' )
     hh = window.innerHeight;  // NN and Opera version
   else
   {
     if ( d.documentElement
       && typeof d.documentElement.clientHeight!='undefined'
       && d.documentElement.clientHeight != 0 )
       hh = d.documentElement.clientHeight;
     else
       if ( d.body
         && typeof d.body.clientHeight != 'undefined' )
         hh = d.body.clientHeight;
     else alert ("Can't identify window height - please tell me which browser you are using.")
   }
   return hh;
}

function showSize(objecte)
{
	alert ("w=" + objecte.width + ", h=" + objecte.height);
}

function getImageWidth(image_id)
{
	//return document.images[image_name].width;
	return document.getElementById(image_id).width;
}

function getImageHeight(image_id)
{
	//return document.images[image_name].height;
	return document.getElementById(image_id).height;
}

function setImageWidth(image_id, new_width)
{
	//document.images[image_name].width = new_width;
	document.getElementById(image_id).width = new_width;
}

function setImageHeight(image_id, new_height)
{
	//document.images[image_name].height = new_height;
	document.getElementById(image_id).height = new_height;
}

function showImage(image_id)
{
	//document.images[image_name].style.display = 'block';
	document.getElementById(image_id).style.display = "block";
}

// Tot aquest control és degut al I.E.7.
function controlRepeat(window_width, window_height)
{
	showMessage("ControlRepeat", "ww=" + window_width + ", wh=" + window_height);
	if (prev_windows_width > 0 && prev_windows_height > 0)
	{
		// No és la primera execució del codi
		if (prev_image_ratio > 0)
		{
			// Anteriorment la lectura d'informació va funcionar bé.
			// No és la primera vegada, actuem
			if ((prev_windows_width == window_width) && (prev_windows_height == window_height))
			{
				// Realment no hi ha hagut cap canvi des de l'última crida, sortim (en I.E. 7 això passa si no cridem a "showImage" abans de recollir les dimensions de la imatge).
				return -1;
			}
		}
		else
		{
			// Anteriorment hi va haver un error en recuperar el tamany de la imatge.
			showMessage("ControlRepeat", "pir=" + prev_image_ratio);
		}
	}
	// Inicialitzem o actualitzem les variables
	prev_windows_width = window_width;
	prev_windows_height = window_height;
	
	return 0;
}

function get_iframe_height(iframe_id, iframe_name){
	// Variable para Height del iFrame
	var hFrame;
	
	if(document.frames){
		// ES IE
		// Miramos el contenido del iframe para IE
		hFrame = document.frames(iframe_name).document.body.scrollHeight;
		// NOTA: sumamos 4 por borde del iframe?!?
		//*POR DEFINIR
	}
	else
	{
		// ES OTRO
		// Miramos el contenido del iframe para
		//GEKO/MOZILLA/...
		hFrame = frames[iframe_name].document.body.scrollHeight;
	}
	//alert(hFrame);
	return hFrame;
}

function resize_text_center(text_id)
{
	showMessage("resize_text_center", "html");
	
	showImage(text_id);
	
	var window_width = getWindowWidth();
	var window_height = getWindowHeight();

	// Tot aquest control és degut al I.E.7.
	if (controlRepeat(window_width, window_height) < 0)
	{
		//showMessage("resize_image_fit", "return");
		return -1;
	}
	
	//Ara recuperem el tamany del que hi ha dins del iframe per ajustar el tamany del iframe i la capa al que toqui.
	//document.getElementById("iframe_id").width = window_width * 0.98;
	document.getElementById("iframe_id").height = get_iframe_height("iframe_id", "iframe_name");
}

function resize_image_fit(image_id)
{
	showMessage("resize_image_fit", "fit");
	
	showImage(image_id);

	var window_width = getWindowWidth();
	var window_height = getWindowHeight();

	// Tot aquest control és degut al I.E.7.
	if (controlRepeat(window_width, window_height) < 0)
	{
		//showMessage("resize_image_fit", "return");
		return -1;
	}
	
	var image_width = getImageWidth(image_id);
	var image_height = getImageHeight(image_id);
	var image_ratio;
	if (image_height > 0)
		image_ratio = image_width / image_height;
	else
	{
		image_ratio = 0;
	}
	prev_image_ratio = image_ratio;

	var new_width = image_width;
	var new_height = image_height;

	showMessage("resize_image_fit", "iw=" + image_width + ", ih=" + image_height + ", ir=" + image_ratio);
	if (image_ratio > 0)
	{
		// Amb aquest mètode reescalem per separat l'alçada i l'amplada, de manera que si algún dels costats (o tots dos) són massa llargs, es reescalen fins a entrar dins de les dimensions.
		// Primer fem la imatge el més gran possible (sense superar la seva mida original)
		/*if (new_width <= original_width)
		{
			// La imatge és més petita, reescalem
			new_width = window_width;
			new_height = new_width / image_ratio;
			showMessage("resize_image_fit", "1: iw=" + new_width + ", ih=" + new_height);
		}
		if (new_height <= original_height)
		{
			// La imatge és més petita, reescalem
			new_height = window_height;
			new_width = new_height * image_ratio;
			showMessage("resize_image_fit", "2: iw=" + new_width + ", ih=" + new_height);
		}*/
		// A continuació ajustem el tamany de la imatge si és massa petita
		if (new_width <= window_width)
		{
			// La imatge és més ampla del permès, reescalem
			new_width = window_width;
			new_height = new_width / image_ratio;
			showMessage("resize_image_fit", "1: iw=" + new_width + ", ih=" + new_height);
		}
		if (new_height <= window_height)
		{
			// La imatge és més alta del permès, reescalem
			new_height = window_height;
			new_width = new_height * image_ratio;
			showMessage("resize_image_fit", "2: iw=" + new_width + ", ih=" + new_height);
		}
		// A continuació ajustem el tamany de la imatge si és massa gran
		if (new_width > window_width)
		{
			// La imatge és més ampla del permès, reescalem
			new_width = window_width;
			new_height = new_width / image_ratio;			
			showMessage("resize_image_fit", "3: iw=" + new_width + ", ih=" + new_height);
		}
		if (new_height > window_height)
		{
			// La imatge és més alta del permès, reescalem
			new_height = window_height;
			new_width = new_height * image_ratio;
			showMessage("resize_image_fit", "4: iw=" + new_width + ", ih=" + new_height);
		}
		
		showMessage("resize_image_fit", "iw=" + image_width + ", ih=" + image_height + ", ir=" + image_ratio + ", ww=" + window_width + ", wh=" + window_height + "\ndw=" + new_width + ", dh=" + new_height);
		new_width *= 0.98;
		new_height *= 0.98;
		setImageWidth(image_id, new_width);
		setImageHeight(image_id, new_height);
	}
	else
	{
		//En I.E. 7 això passa si no cridem a "showImage" abans de recollir les dimensions de la imatge
		showMessage("resize_image_fit", "ir=" + prev_image_ratio);
	}
	
	return 0;
}

function resize_image_none(image_id)
{
	showMessage("resize_image_none", "none");
	// Aquí juguem a un joc diferent. En comptes de treballar sobre l'objecte image, usarem la capa que conté la imatge ("imatge_div_id").
	// Ficarem com a "background-image" el mateix fitxer d'imatge i modificarem la propietat "background-position" per a centrar la imatge en pantalla.
	// Idea extreta de "http://www.guistuff.com/css/css_imagetech1.html".
	//var divOjb = document.getElementById("imatge_div_id");
	//var imageObj = document.getElementById(image_id);
	//divOjb.style.backgroundImage = imageObj.src;	
	var divOjb = document.getElementById("imatge_back_div_id");
	var imageObj = document.getElementById(image_id);
	var newImage = "url(" + imageObj.src + ")";
	divOjb.style.backgroundImage = newImage;
	divOjb.style.height = getWindowHeight() + "px";
}

function resize_image(image_id)
{
	// Consultem el nom del fitxer de la imatge per a saber com ens hem de comportar
	var imageObj = document.getElementById(image_id);
	var iframeObj = document.getElementById("iframe_id");
	if (iframeObj.src.toLowerCase().indexOf('.htm') > -1)
	{
		document.getElementById("text_div_id").style.display = "block";
		document.getElementById("imatge_div_id").style.display = "none";
		document.getElementById("imatge_back_div_id").style.display = "none";
		resize_text_center("iframe_id");
	}
	else if (imageObj.src.toLowerCase().indexOf('_fit') > -1)
	{
		document.getElementById("text_div_id").style.display = "none";
		document.getElementById("imatge_div_id").style.display = "block";
		document.getElementById("imatge_back_div_id").style.display = "none";
		resize_image_fit(image_id);
	}
	else
	{
		document.getElementById("text_div_id").style.display = "none";
		document.getElementById("imatge_div_id").style.display = "none";
		document.getElementById("imatge_back_div_id").style.display = "block";
		resize_image_none(image_id);
	}
	
	var window_height = getWindowHeight();
	
	// Amb Chrome el centrat de la imatge no em funcionan bé i farem la imatge més petita.
	var is_chrome = (navigator.userAgent.toLowerCase().indexOf('chrome') > -1);
	// Amb Opera tampoc funciona bé.
	var is_opera = (navigator.userAgent.toLowerCase().indexOf('opera') > -1);

	// Centrem verticalment els elements.
	if (!is_chrome && !is_opera)
	{
		// Centrem verticalment els elements
		var el = document.getElementById("imatge_div_id");
		el.style.top = (window_height - getImageHeight(image_id)) / 2 + "px";
		//el.style.left = (window_width - new_width) / 2; // Això no ho fem ja que ho podem centrar per CSS
		
		var el = document.getElementById("text_div_id");
		el.style.top = (window_height - getImageHeight("iframe_id")) / 2 + "px";
		
		el = document.getElementById("prev_div_id")
		el.style.top = (window_height - getImageHeight("prev_id")) / 2 + "px";
	
		el = document.getElementById("next_div_id")
		el.style.top = (window_height - getImageHeight("next_id")) / 2 + "px";
	}
}

function onLoadEvent(image_id)
{
	//alert ("onload");
	resize_image(image_id);
}

function onResizeEvent(image_id)
{
	//alert ("onresize");
	resize_image(image_id);
}

function changeImageSrc(image_id, new_src)
{
	img = document.getElementById(image_id);
	img.src = new_src;
}

function mouseOver(image_id, new_src)
{
	changeImageSrc(image_id, new_src);
}

function mouseOut(image_id, new_src)
{
	changeImageSrc(image_id, new_src);
}

function clickImage(image_id, new_src)
{
	changeImageSrc(image_id, new_src);
	resize_image(image_id);
}

function position_info(div_id)
{
	var window_height = getWindowHeight();
	
	// Amb Chrome el centrat de la imatge no em funcionan bé i farem la imatge més petita.
	var is_chrome = (navigator.userAgent.toLowerCase().indexOf('chrome') > -1);
	// Amb Opera tampoc funciona bé.
	var is_opera = (navigator.userAgent.toLowerCase().indexOf('opera') > -1);

	// Centrem verticalment els elements.
	if (!is_chrome && !is_opera)
	{
		// Centrem verticalment els elements
		var el = document.getElementById(div_id);
		el.style.top = (window_height - 160) / 2 + "px";
		//el.style.left = (window_width - new_width) / 2; // Això no ho fem ja que ho podem centrar per CSS

		el = document.getElementById("prev_div_id")
		el.style.top = (window_height - getImageHeight("prev_id")) / 2 + "px";
	
		el = document.getElementById("next_div_id")
		el.style.top = (window_height - getImageHeight("next_id")) / 2 + "px";
	}
}

function onLoadEventInfo(div_id)
{
	//alert ("onload");
	position_info(div_id);
}

function onResizeEventInfo(div_id)
{
	//alert ("onresize");
	position_info(div_id);
}