
_actualImage = -1;
_newImage = -1;
_fadeTime = 500; // Acá se modifica el tiempo del fade
_imageTime = 5000; // Acá se modifica el tiempo que dura cada imagen
_timer = 0;
_playing = 0;
_contentResolution = 0;

function _fadeIn(imageNumber) {
	$('#image_slide_'+imageNumber).fadeIn(_fadeTime,function() {
		_actualImage = imageNumber;
	});
}

function changeToImage(imageNumber) {
	if(_actualImage == imageNumber) return;
	if(_actualImage >= 0) {
		_newImage = imageNumber;
		$('#image_slide_'+_actualImage).fadeOut(_fadeTime,function() {
			_fadeIn(imageNumber);
		});
	}
	else {
		_fadeIn(imageNumber);
	}
}

function startTimer() {
	if(_playing) return;
	_timer = window.setInterval(next, _imageTime);
	_playing = 1;
} 

function stopTimer() {
	if(!_playing) return;
	window.clearInterval(_timer);
	_playing = 0;
}

function pause() {
	if(_playing) {
		$('#pausa').addClass('play');
		$('#pausa').removeClass('pausa');
		stopTimer();
	} else {
		$('#pausa').addClass('pausa');
		$('#pausa').removeClass('play');
		startTimer();
	}
}

function prev() {
	if(_actualImage > 0) {
		changeToImage(_actualImage-1);
	}
	else {
		changeToImage(images.length-1);
	}
}

function next() {
	if(_actualImage < images.length-1) {
		changeToImage(_actualImage+1);
	}
	else {
		changeToImage(0);
	}
}

function getContentResolution() {
	var _width = $(window).width();
	if(_width < 1020) return "760";
	if(_width < 1276) return "1024";
	return "1280";
}

function addImage(folder,imageNumber,imageFile) {
	if(_contentResolution == "760") imageWidth = "777";
	else if(_contentResolution == "1024") imageWidth = "1003";
	else imageWidth = "1259px";
	$('#image_content').append('<div class="image" id="image_slide_'+imageNumber+'"><img width="'+imageWidth+'" src="'+folder+'/'+imageFile+'" alt="" /></div>');
}

$(document).ready(function() {

	// resolution detect
	_contentResolution = getContentResolution();
	imageFolder = _contentResolution;
	
	// Avisos de debug
	//alert("Pagina configurada para "+_contentResolution);
	//alert("Imagenes de "+imageFolder);
	
	$('#content').addClass('content_'+_contentResolution);
	$('#controlador').addClass('controlador_'+_contentResolution);
	$('#menu_content').addClass('menu_content_'+_contentResolution);
	$('#image_content').addClass('image_content_'+_contentResolution);
	
	
	for(i=0;i<images.length;i++) {
		addImage(imageFolder,i,images[i]);
	}
	
	changeToImage(0);
	
	$('#retroceder').click(function() {
		__playing = _playing;
		stopTimer();
		prev();
		if(__playing) startTimer();
	});
	$('#pausa').click(function() {
		pause();
	});
	$('#siguiente').click(function() {
		__playing = _playing;
		stopTimer();
		next();
		if(__playing) startTimer();
	});
	
	startTimer();
	
});

