var globalCarousel = null;

function fncItemVisibleInCallback(carousel, item, i, state, evt){
    var idx = carousel.index(i, itemSliderList.length);
    carousel.add(i, getSliderItem(itemSliderList[idx-1], idx));
};
 
function fncItemVisibleOutCallback(carousel, item, i, state, evt){
	globalCarousel = carousel;
	setMegaSliderSrc(carousel, item, i, state);
	carousel.remove(i);
	
};

function getSliderItem(item, idx){
    //return '<img src="' + urlCloudFront + "/entradas/" + item.imgPeq + '" onclick="viewItem('+ idx +');return false;" onmouseover="stopCarousel();" onmouseout="startCarousel();" alt="' + item.descripcion + '" />';
	return '<img src="' + item.imgPeq + '" onclick="viewItem('+ idx +');return false;" onmouseover="stopCarousel();" onmouseout="startCarousel();" alt="' + item.descripcion + '" />';
};

function setMegaSliderSrc(carousel, item, i, action){
	var objCanvas = $('#canvasImg');
	var objExtendInfo = $("#extendInfo");
	var idx = null;
	objCanvas.fadeOut(0);
	objExtendInfo.fadeOut(0);
	var idx = carousel.index(i,itemSliderList.length);
	objCanvas.attr("src", "" + itemSliderList[idx-1].imgMega);
	$('#canvasImgAnchor').attr("href", itemSliderList[idx-1].urlCompra);
	$('#canvasImgAnchor').attr("onclick", itemSliderList[idx-1].abrirventana);	
	fillEventDataRunning(carousel, item, i, action);
	objCanvas.fadeIn(200);
	objExtendInfo.fadeIn(600);
};

function startCarousel(){
	if(globalCarousel){globalCarousel.startAuto();}
}
function stopCarousel(){
	if(globalCarousel){globalCarousel.stopAuto();}
}

function viewItem(itemId){
	if(globalCarousel){setMegaSliderSrc(globalCarousel, null, itemId, '');}
}

function fillEventDataRunning(carousel, item, i, action){
	var objItem = itemSliderList[carousel.index(i,itemSliderList.length)-1];
	fillEventData(objItem);
}

function fillEventDataOnInit(){
	var objItem = itemSliderList[0];
	fillEventData(objItem);
}

function fillEventData(objItem){
	var objInnerHTML = '<div class="info"><div class="inner">';
	objInnerHTML+='<div class="datos">';
	objInnerHTML+= (objItem.genero!="")?'<div class="genero">'+ objItem.genero +'</div>':'<div class="genero">&nbsp;</div>';
	objInnerHTML+= (objItem.titulo!="" && objItem.urlCompra!="")?'<h2 id="titulo"><a href="'+ objItem.urlCompra +'">'+ objItem.titulo +'</a></h2>':'<h2 id="titulo"><a>'+ objItem.titulo +'</a></h2>';
	objInnerHTML+= (objItem.localidad!="" || objItem.recinto!="")?'<div class="t-place"><strong>'+ objItem.localidad +'</strong> '+ objItem.recinto +'</div>':'<div class="t-place"><strong>&nbsp;</strong> &nbsp;</div>';
	objInnerHTML+='</div>';
	//objInnerHTML+='<div class="comprar">';
	//objInnerHTML+= (objItem.fecha!="")?'<div class="t-date">'+ objItem.fecha +'</div>':'<div class="t-date">&nbsp;</div>';
	//objInnerHTML+= (objItem.precioDesde!="")?'<div class="info-compra">desde <strong>'+ objItem.precioDesde +'</strong></div>':'<div class="info-compra">&nbsp; <strong>&nbsp;</strong></div>';
	//objInnerHTML+= (objItem.urlCompra!="")?'<div><a href="'+ objItem.urlCompra +'" title="comprar entradas" class="min_comprar btnCompra">COMPRAR</a></div>':'<div class="prox" style="font-size:1.1em;font-weight:900;margin-left:-15px;padding-right:10px;color:#fff;">PRÓXIMAMENTE</div>';
	//objInnerHTML+='</div></div></div>';
	objInnerHTML+='</div></div>';
	$('#extendInfo').html(objInnerHTML);
}

function loadSliderCanvas(){
	if($('#sliderCanvas')){
		var oFragment = document.createDocumentFragment();

		var oDivIDCanvas = document.createElement("div");
		oDivIDCanvas.setAttribute("id", "canvas");
		var oAIDCanvasAnchor = document.createElement("a");
		oAIDCanvasAnchor.setAttribute("id", "canvasImgAnchor");
		oAIDCanvasAnchor.setAttribute("href", "#");
		oDivIDCanvas.appendChild(oAIDCanvasAnchor);
		var oDivIDCanvasImg = document.createElement("img");
		oDivIDCanvasImg.setAttribute("id", "canvasImg");
		oDivIDCanvasImg.setAttribute("name", "canvasImg");
		oDivIDCanvasImg.setAttribute("width", "650");
		oDivIDCanvasImg.setAttribute("height", "245");
		oDivIDCanvasImg.setAttribute("onmouseover", "stopCarousel();");
		oDivIDCanvasImg.setAttribute("onmouseout", "startCarousel();");
		oDivIDCanvasImg.setAttribute("alt", "");
		oAIDCanvasAnchor.appendChild(oDivIDCanvasImg);

		var oDivCarousel = document.createElement("div");
		oDivCarousel.setAttribute("id", "carousel");
		var oDivCarouselULCarouselList = document.createElement("ul");
		oDivCarouselULCarouselList.setAttribute("id", "carouselList");
		oDivCarouselULCarouselList.setAttribute("class", "jcarousel");
		oDivCarousel.appendChild(oDivCarouselULCarouselList);

		var oDivExtendInfo = document.createElement("div");
		oDivExtendInfo.setAttribute("id", "extendInfo");
		oDivExtendInfo.setAttribute("class", "mod");
		oDivExtendInfo.setAttribute("onmouseover", "stopCarousel();");
		oDivExtendInfo.setAttribute("onmouseout", "startCarousel();");

		var oDivIDSlider = document.createElement("div");
		oDivIDSlider.setAttribute("id", "slider");

		oDivIDSlider.appendChild(oAIDCanvasAnchor);
		oDivIDSlider.appendChild(oDivCarousel);
		oDivIDSlider.appendChild(oDivExtendInfo);

		oFragment.appendChild(oDivIDSlider);
		$('#sliderCanvas').append(oFragment);
	}
}

$(document).ready(function(){
	if(itemSliderList && itemSliderList.length>0){
		loadSliderCanvas();
		$('#carouselList').jcarousel({
			vertical:true,
			wrap: 'circular',
			start:parseInt(1)+Math.round(Math.random()*(itemSliderList.length-1)),
			scroll:1,
			auto:3,
			itemVisibleInCallback:{onBeforeAnimation: fncItemVisibleInCallback},
			itemVisibleOutCallback:{onAfterAnimation: fncItemVisibleOutCallback}
		});
		$('#canvasImg').attr('src', itemSliderList[0].imgMega);
		$('#canvasImg').attr('alt', itemSliderList[0].descripcion);
		$('#canvasImgAnchor').attr("href", itemSliderList[0].urlCompra);
		fillEventDataOnInit();
	}
	else{$('#sliderCanvas').remove();}
});