//Cargo las CSS

isIE = (window.ActiveXObject) ? true : false;

var $ = document; // shortcut

var head  = $.getElementsByTagName('head')[0];
var link  = $.createElement('link');
link.rel  = 'stylesheet';
link.type = 'text/css';


link.href = '../css/BigGallery_Others.css';
link.media = 'all';
head.appendChild(link);






var GalleryFiles = new Array();
var GalleryWidths = new Array();
var GalleryHeights = new Array();
var PreloadImages = new Array();
var SizeTimer;
var AlphaTimer;
var FirstCharge = true;

var WindowWidth;
var WindowHeight;
var ActivePhoto = 0;

var IsLoaded = false;
var ExtraTimeOut;

SetWindowSize();

function SetWindowSize(){

	if (document.body && document.body.offsetWidth) {
		WindowWidth = document.body.offsetWidth;
		WindowHeight = document.body.offsetHeight;
	}
	if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetWidth ) {
		WindowWidth = document.documentElement.offsetWidth;
		WindowHeight = document.documentElement.offsetHeight;
	}
	if (window.innerWidth && window.innerHeight) {
		WindowWidth = window.innerWidth;
		WindowHeight = window.innerHeight;
	}
	
	
}

function IniBigGall(){
	document.write('<div id="BiggerPhotoContainer">');
	document.write('	<div id="BiggerPhotoAlpha" onClick="GallHideMe();"></div>');
	document.write('	<div id="BiggerPhotoPortrait">');
	document.write('		<div id="BiggerPhotoCont"><img id="BiggerPhotoImage" src=""></div>');
	document.write('		<div id="BiggerPhotoPrev" onMouseOver="HideShowButtons(\'BiggerPhotoGall_Prev\', true);" onmouseout="HideShowButtons(\'BiggerPhotoGall_Prev\', false);"><img id="BiggerPhotoGall_Prev" src="../images/BiggerPhotoGall_Prev.png" class="BiggerPhotoButtons" onClick="ChangePhoto(0);"></div>');
	document.write('		<div id="BiggerPhotoNext" onMouseOver="HideShowButtons(\'BiggerPhotoGall_Next\', true);" onmouseout="HideShowButtons(\'BiggerPhotoGall_Next\', false);"><img id="BiggerPhotoGall_Next" src="../images/BiggerPhotoGall_Next.png" class="BiggerPhotoButtons" onClick="ChangePhoto(1);"></div>');
	document.write('		<div id="BiggerPhotoLegend"></div>');
	document.write('		<div id="BiggerPhotoClose"><div id="BiggerPhotoCloseText" onClick="GallHideMe();">Cerrar&nbsp;&nbsp;X</div></div>');
	document.write('	</div>');
	document.write('</div>');
}

function HideShowButtons(ObjID, Visible){
	
	if(GalleryFiles.length == 1 || IsLoaded == false){Visible = false;}
	
	var Obj = document.getElementById(ObjID);
	var Visibility;

	if(Visible){Visibility = "visible";}
	else{Visibility = "hidden";}
	Obj.style.visibility = Visibility;
}


function ChangePhoto(Direction){
	
	var NextPhoto;
	
	if(Direction == 0){
		if(ActivePhoto == 0){NextPhoto = GalleryFiles.length - 1;}
		else{NextPhoto = ActivePhoto - 1;}
	}
	else{
		if(ActivePhoto == (GalleryFiles.length - 1)){NextPhoto = 0;}
		else{NextPhoto = ActivePhoto + 1;}
	}

	ShowGalleryPhoto(NextPhoto);
}


function LoadListGallery(IDItem, FirstPhoto){
	
	var PostURL = "../js/BigGallery.php";
	var RespReq = "";
	var RespReqArr = new Array();
	var req = getXMLHttpRequest();
	FirstCharge = true;

	SetWindowSize();
	
	clearTimeout(AlphaTimer);
	document.getElementById("BiggerPhotoImage").src = "";
	document.getElementById("BiggerPhotoContainer").style.display="block";
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	FrameObj.style.width = '200px';
	FrameObj.style.height = '100px';

	if(req){
		
		req.open("GET", PostURL +"?acc=GetListImages&IDItem="+IDItem+"&MaxWidth="+WindowWidth+"&MaxHeight="+(WindowHeight - 250),true);
		req.send(null);

		req.onreadystatechange = function() {
			if (req.readyState == 4 && (req.status == 200 || req.status == 304)) {
			
				//Ahora trato lo que me ha devuelto el request
				//alert(req.responseText);
				RespReq = req.responseText;
				RespReqArr = RespReq.split("|");

				//Si la respuesta es correcta
				if(RespReqArr[0] == 'OK'){

					//Paso la segunda parte de la respuesta por "eval" para obtener los arrays
					
					eval(RespReqArr[1]);
					
					GalleryFiles = ImagesFile;
					GalleryWidths = ImagesWidth;
					GalleryHeights = ImagesHeight;
					
					for(i=0;i<GalleryFiles.length;i++){
						PreloadImages[i] = document.createElement('img'); // new Image(1, 1); 
						PreloadImages[i].src = GalleryFiles[i]; 
					}

					ShowGalleryPhoto(FirstPhoto);
				}

				//Si PHP me devuelve un error
				else{

				}
			}
		}
	}
}

function LoadGallery(IDProducto, FirstPhoto){
	
	var PostURL = "../js/BigGallery.php";
	var RespReq = "";
	var RespReqArr = new Array();
	var req = getXMLHttpRequest();
	FirstCharge = true;

	SetWindowSize();


	document.getElementById("BiggerPhotoContainer").style.display="block";
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	FrameObj.style.width = '200px';
	FrameObj.style.height = '100px';

	if(req){

		req.open("GET", PostURL +"?acc=GetImages&IDProducto="+IDProducto+"&MaxWidth="+WindowWidth+"&MaxHeight="+(WindowHeight - 250),true);
		req.send(null);

		req.onreadystatechange = function() {
			if (req.readyState == 4 && (req.status == 200 || req.status == 304)) {
			
				//Ahora trato lo que me ha devuelto el request

				RespReq = req.responseText;
				RespReqArr = RespReq.split("|");

				//Si la respuesta es correcta
				if(RespReqArr[0] == 'OK'){

					//Paso la segunda parte de la respuesta por "eval" para obtener los arrays
					
					eval(RespReqArr[1]);
					
					GalleryFiles = ImagesFile;
					GalleryWidths = ImagesWidth;
					GalleryHeights = ImagesHeight;
					
					for(i=0;i<GalleryFiles.length;i++){
						PreloadImages[i] = document.createElement('img'); // new Image(1, 1); 
						PreloadImages[i].src = GalleryFiles[i]; 
					}

					ShowGalleryPhoto(FirstPhoto);
				}

				//Si PHP me devuelve un error
				else{

				}
			}
		}
	}
}


function LoadSingleImage(ImageFile){

	var PostURL = "../js/BigGallery.php";
	var RespReq = "";
	var RespReqArr = new Array();
	var req = getXMLHttpRequest();
	FirstCharge = true;

	SetWindowSize();

	document.getElementById("BiggerPhotoContainer").style.display="block";
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	FrameObj.style.width = '200px';
	FrameObj.style.height = '100px';

	if(req){

		req.open("GET", PostURL +"?acc=GetSingleImage&ImageFile="+ImageFile+"&MaxWidth="+WindowWidth+"&MaxHeight="+(WindowHeight - 250),true);
		req.send(null);

		req.onreadystatechange = function() {
			if (req.readyState == 4 && (req.status == 200 || req.status == 304)) {
			
				//Ahora trato lo que me ha devuelto el request
				
				RespReq = req.responseText;
				RespReqArr = RespReq.split("|");
				
				//Si la respuesta es correcta
				if(RespReqArr[0] == 'OK'){

					//Paso la segunda parte de la respuesta por "eval" para obtener los arrays
					
					eval(RespReqArr[1]);
					
					GalleryFiles = ImagesFile;
					GalleryWidths = ImagesWidth;
					GalleryHeights = ImagesHeight;
					
					for(i=0;i<GalleryFiles.length;i++){
						PreloadImages[i] = document.createElement('img'); // new Image(1, 1); 
						PreloadImages[i].src = GalleryFiles[i]; 
					}

					ShowGalleryPhoto(0);
				}

				//Si PHP me devuelve un error
				else{

				}
			}
		}
	}
}

function ShowGalleryPhoto(PhotoNumber){
	
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	var ImgObj = document.getElementById("BiggerPhotoImage");
	
	clearTimeout(AlphaTimer);
	ImgObj.src = "";

	ActivePhoto = PhotoNumber;
	ImgObj.style.display = "none";

	if(FirstCharge){
		FrameObj.style.width = '200px';
		FrameObj.style.height = '100px';
		FirstCharge = false;
	}

	SizeTimer = setInterval("SetFrameSize("+PhotoNumber+")", 40);
}


function SetFrameSize(PhotoNumber){
	
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	var ImgObj = document.getElementById("BiggerPhotoImage");
	var LegendObj = document.getElementById("BiggerPhotoLegend");

	var ActWidth = FrameObj.offsetWidth;
	var ActHeight = FrameObj.offsetHeight;

	var IsRightSize = true;
	var NextWidth;
	var NextHeight;

	if(ActWidth < GalleryWidths[PhotoNumber]){
		IsRightSize = false;
		NextWidth = parseInt(((GalleryWidths[PhotoNumber] - ActWidth)/5));
		if(NextWidth < 1){NextWidth = 1;}

		FrameObj.style.width = (ActWidth + NextWidth) + "px";
	}

	if(ActWidth > GalleryWidths[PhotoNumber]){
		IsRightSize = false;
		NextWidth = parseInt(((ActWidth - GalleryWidths[PhotoNumber])/5));
		if(NextWidth < 1){NextWidth = 1;}
		
		FrameObj.style.width = (ActWidth - NextWidth) + "px";
	}

	if(ActHeight < GalleryHeights[PhotoNumber]){
		IsRightSize = false;
		NextHeight = parseInt(((GalleryHeights[PhotoNumber] - ActHeight)/5));
		if(NextHeight < 1){NextHeight = 1;}

		FrameObj.style.height = (ActHeight + NextHeight) + "px";
	}

	if(ActHeight > GalleryHeights[PhotoNumber]){
		IsRightSize = false;
		NextHeight = parseInt(((ActHeight - GalleryHeights[PhotoNumber])/5));
		if(NextHeight < 1){NextHeight = 1;}

		FrameObj.style.height = (ActHeight - NextHeight) + "px";
	}
	
	LegendObj.style.top = (FrameObj.offsetHeight - 23) + "px";
	LegendObj.style.width = FrameObj.style.width;
	LegendObj.innerHTML = "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Mostrando fotografía " + (PhotoNumber + 1) + " de " + GalleryFiles.length;
	LegendObj.style.display = "block";

	if(IsRightSize){
		
		clearInterval(SizeTimer);
		ImgObj.src= PreloadImages[PhotoNumber].src;
		ImgObj.onload = ImgAlphaUp;
		clearTimeout(ExtraTimeOut);
		ExtraTimeOut = setTimeout('ImgAlphaUp()', 2000);
	}
}


function ImgAlphaUp(){
	clearTimeout(ExtraTimeOut);
	AlphaTimer = setTimeout('SubeAlpha(0, "BiggerPhotoImage")', 1000);
}


function GallHideMe(){
	clearInterval(SizeTimer);
	clearInterval(AlphaTimer);
	
	document.getElementById("BiggerPhotoContainer").style.display="none";
	
	var FrameObj = document.getElementById("BiggerPhotoPortrait");
	var ImgObj = document.getElementById("BiggerPhotoImage");
	var LegendObj = document.getElementById("BiggerPhotoLegend");
	
	ImgObj.style.display = "none";
	LegendObj.style.display = "none";
	FrameObj.style.width = '200px';
	FrameObj.style.height = '100px';

	IsLoaded = false;
}

function getXMLHttpRequest(){
	if (window.XMLHttpRequest) {
		return new window.XMLHttpRequest;
	}
	else {
		try {
			return new ActiveXObject("MSXML2.XMLHTTP.3.0");
		}
		catch(ex) {
			return null;
		}
	}
}

function SubeAlpha(opacity, IDObjeto) {
	
	var object = document.getElementById(IDObjeto).style;
	var FFOpac;
	var Velocidad = 4;
	
	IsLoaded = true;

	object.display = 'block';
	opacity = opacity + Velocidad;
	
	if(opacity < (100 + Velocidad)){
		
		if (document.getElementById(IDObjeto)){
			FFOpac = opacity / 100;
			document.getElementById(IDObjeto).style.opacity = FFOpac;
			document.getElementById(IDObjeto).style.filter = 'alpha(opacity=' + opacity + ')';
		}
		
		AlphaTimer = setTimeout('SubeAlpha('+opacity+', "'+IDObjeto+'");',10);
	}

}
