var PROMOTION_TYPE_CARD = {
	SPECIAL_PRICE : '0',
	LOYALTY : '1',
	PRESALE : '2',
	GIFT_CARD: '4',
	INVITATION : '5'
};

var CARD_DESIGN = {
	ONE_COLOR : '1',
	LINEAR_GRADIENT_TOP_DOWN : '2',
	LINEAR_GRADIENT_LEFT_RIGHT : '3',
	LINEAR_GRADIENT_RIGHT_BOTTOM : '4',
	LINEAR_GRADIENT_RIGHT_LEFT : '5',
	LINEAR_GRADIENT_LEFT_TOP : '6',
};

var TYPE_LOYALTY_OPERATION = {
		ACUMULAR : 'A',
		REDIMIR : 'R',
		CADUCAR : 'C',
		CODIGO_DESCUENTO : 'D',
		MANUAL_RECHARGE : 'P',
		MANUAL_TAKE_OUT : 'E'
};

var loyaltyPoints = [];
var cardTransactions = [];
var currentSession = null;
var sessionPromotions = [];
var promosWithPreselection = [];
var promosWithoutPreselection = [];
var promotionPreselected = null;

function preloadPromotionsAndShowLoyaltyModal()
{
	const idSession = productosSesion.idSesion;
	
	if (idSession == currentSession)
	{
		showLoyaltyCodeModal();
		return;
	}
	
	promosWithPreselection = [];
	sessionPromotions = [];
	promotionPreselected = null;
	const items = productosSesion.entradas;
	const availablePromos = []; 
	
	if (items != null)
	{
		for (let item of items)
		{
			const prices = item.precios;
			if (prices != null)
			{
				for (let price of prices)
				{
					if (price.fidePromocionMostrar != null && !availablePromos.includes(price.fidePromocionMostrar))
					{
						availablePromos.push(price.fidePromocionMostrar);
					}
				}
			}
		}		
	}
	
	if (availablePromos.length > 0)
	{
		crearVentanaEspera();
		EntradasAjax.loadPromotionsForSession(idEvento, availablePromos, onSessionPromosLoaded);
	}
	else
	{
		showLoyaltyCodeModal();
	}
}

function onSessionPromosLoaded(sessionPromos)
{
	currentSession = productosSesion.idSesion;
	sessionPromotions = sessionPromos;
	
	if (sessionPromotions != null)
	{
		for (let promo of sessionPromotions)
		{
			if (promo.preselectBeforeEnteringCode)
			{
				promosWithPreselection.push(promo);
			}
			else
			{
				promosWithoutPreselection.push(promo);
			}
		}
	}
	
	cambiarVentanaEsperaOK();
	showLoyaltyCodeModal();
	
	setTimeout(function(){
		if(isBlockUIVisible())
		{
			cambiarVentanaEsperaOK();
		}
	},200);
}

function showLoyaltyCodeModal()
{
	//page modal
	$("#form-insert-code-promotion").show();
	$("#result-code-finded").hide();

	//hide error
	$("#code-notification-error").hide();

	//footer
	$("#footer-find-code").show();
	$("#footer-apply-code").hide();
	$("#footer-select-promotion").hide();
	
	//hide error
	$("#code-notification-error").hide();

	//page modal
	//User is loggued and has promotions?
	if(idBuyerLoged != null)
	{
		crearVentanaEspera();
		
		var idBuyer = parseInt(idBuyerLoged);
		var idCompanyBuyer = parseInt(idCompanyBuyerLoged);
		
		CompraAjax.getCardsUserJson(idBuyer, idCompanyBuyer, loadCardsBuyer);
	}
	else
	{
		showPromotionsList();
	}
}

function showPromotionsList()
{
	if (promosWithPreselection.length > 0)
	{
		drawPromotionsCards();
		
		$("#form-promotion-preselection").show();
		
		$("#form-insert-code-promotion").hide();
		$("#popup_loyalty .body-popup").addClass("with-footer");
		$("#coupons-list").hide();
		$("#result-code-finded").hide();
	
		$("#footer-find-code").hide();
		$("#footer-apply-code").hide();
		$("#footer-select-promotion").show();
		
		$("#popup_loyalty").addClass("show");
		$("#promotions-cards-wrapper").show();
	}
	else
	{
		showPromotionalCode();
	}
}

function showPromotionalCode(idPromoSelected)
{
	let promoSelected = null;
	if (typeof idPromoSelected != "undefined" && idPromoSelected != null)
	{
		promoSelected = getObjetoPorId(idPromoSelected, sessionPromotions, "idPromocion");
	}

	if (promoSelected == null)
	{
		if (typeof sessionPromotions != "undefined" && sessionPromotions.length == 1)
		{
			promoSelected = sessionPromotions[0];
		}
	}
	
	$('#code-observations-wrapper').hide();
	$('#promo-code-label').text(polyglot.t("promotions.promotional_code")); //TODO tag
	
	if (promoSelected != null)
	{
		// Customize the code input and add observations if promo is preselected
		const codeInputLabel = promoSelected.promoCodeCustomLabel;
		const observations = promoSelected.promoCodeObservations;
		
		if (codeInputLabel != null)
		{
			const text = getTextMultilanguage(codeInputLabel);
			if (text != null)
			{
				$('#promo-code-label').text(text);
			}
		}
		
		if (observations != null)
		{
			const text = getTextMultilanguage(observations);
			if (text != null)
			{
				$('#promo-code-observations').html(text);				
				$('#code-observations-wrapper').show();
			}
		}
	}
	
	$("#form-insert-code-promotion").show();
	$("#popup_loyalty .body-popup").addClass("with-footer");
	$("#coupons-list").hide();
	$("#promotions-cards-wrapper").hide();
	$("#result-code-finded").hide();

	$("#footer-find-code").show();
	$("#footer-apply-code").hide();
	$("#footer-select-promotion").hide();
	
	$("#popup_loyalty").addClass("show");
}

function drawPromotionsCards()
{
	let promosHtml = "";
	
	for (let promo of promosWithPreselection)
	{
		promosHtml += '<div class="row" id="promo_card_' + promo.idPromocion + '"><div class="large-12 columns">' +
					     '<div class="loyalty_card_list_element" >' +
							 getVisualCardPreSelection(promo) +
						  '</div>' +
					  '</div></div>';
	}
	
	if (promosWithoutPreselection.length > 0)
	{
		promosHtml += '<div class="row"><div class="large-12 columns">'
					+ '<div class="loyalty_card_list_element" id="promo_card_others">'	
						+ '<div class="card_wrapper">'
							 + '<div class="credit-card credit-card--loyalty">'
							    + '<div class="credit-card__club">'
							     	 + '<div class="credit-card__club_loyalty">'
							     	 	+ '<div class="brand_card">' + polyglot.t("Promo.Other_promotions") + '</div>'
							     	 + '</div>'
							     	 + '<div class="credit-card__club_logo image_full">'
							     	 	+ ""
							     	 + '</div>' 
							    + '</div>'
							  + '</div>'
						+ '</div>'
						+ '<div class="info_wrapper">'
							+ '<button class="btn primary expand" onclick="onPromotionSelected(' + null + '); return false;">' + polyglot.t("Apply") + '</button>'
						+ '</div>'
		+ '</div></div></div>';
	}
	
	$("#promotions-cards-wrapper").html(promosHtml);
}

function onPromotionSelected(idPromotion)
{
	promotionPreselected = idPromotion;
	showPromotionalCode(promotionPreselected)
}

function loadCardsBuyer(cards)
{
	var cardsList = JSON.parse(cards);
	
	var htmlCards = "";
	if(cardsList != null && cardsList.length > 0)
	{
		for(var x = 0; x < cardsList.length; x++)
		{
			var card = cardsList[x];
			htmlCards += getInfoCardCode(card);
		}
	}	
	
	if (typeof in_cards_screen !== 'undefined' && in_cards_screen == true)
	{
		$("#loyalty_card_list").html();				
		
		document.getElementById("loyalty_card_list").innerHTML = htmlCards;
	}
	else
	{
		$("#loyalty_cards_vouchers_list").html("");
		
		if(cardsList != null && cardsList.length > 0)
		{
			
			//Add new card button
			htmlCards += '<div class="loyalty_card_list_element button_wrapper">' +
							'<button class="button primary expand small radius" onclick="addNewCodeVoucher();"><i class="palco4icon palco4icon-plus"></i> '+polyglot.t("Add_new_card_or_code")+'</button>' +
						'</div>';
			
			$("#loyalty_cards_vouchers_list").append(htmlCards);
		
			$("#coupons-list").show();
			$("#popup_loyalty .body-popup").removeClass("with-footer");
			$("#form-insert-code-promotion").hide();
			$("#result-code-finded").hide();

			$("#footer-find-code").hide();
			$("#footer-apply-code").hide();
			$("#footer-select-promotion").hide();
		}
		else
		{
			showPromotionsList();
			/*$("#form-insert-code-promotion").show();
			$("#popup_loyalty .body-popup").addClass("with-footer");
			$("#coupons-list").hide();
			$("#result-code-finded").hide();

			$("#footer-find-code").show();
			$("#footer-apply-code").hide();	*/
		}
		
		cerrarVentanaEspera();
		
		$("#popup_loyalty").addClass("show");
	}
	
}

function resultadoBusquedaTarjetaFidelizacion(datosTarjetaFidelizacion)
{
	borrarCacheTooltip();
	loyaltyCardNotApplied = null;

	//PROMO CODE NO EXISTS
	if (datosTarjetaFidelizacion == null)
	{
		tarjetaFidelizacion = null;
		$("#code-notification-error").show();
	}
	else
	{
		$("#dNumTarjetaFidelizacionBuscar").val("");

		loyaltyCardNotApplied = datosTarjetaFidelizacion;

		var idPromocion = 0;
		var idCategoryLoyalty = loyaltyCardNotApplied.idCategoriaFidelizacion;
		var balancePromosArray = loyaltyCardNotApplied.saldoPromociones;
		if(balancePromosArray != null && balancePromosArray.length > 0)
		{
			var objPromoBalance = balancePromosArray[0];
			if(objPromoBalance != null)
			{
				idPromocion = objPromoBalance.idPromocion;
			}
		}

		CompraAjax.getPromotion(idCategoryLoyalty, idPromocion, showInfoPromoLoyaltyModal);

		//hide find code
		$("#form-insert-code-promotion").hide();

		//show code finded
		$("#result-code-finded").show();

		//clean datas
		$("#desc-promo-text").html("");
		$("#tablaDatosFidelizacion tbody").html("");

		//change footer
		$("#footer-find-code").hide();
		$("#footer-select-promotion").hide();
		$("#footer-apply-code").show();
	}

	cambiarVentanaEsperaOK();
}

function searchResultLoyaltyCardAndApply(dataCard)
{
	borrarCacheTooltip();
	loyaltyCardNotApplied = null;
	
	if (dataCard != null)
	{
		tarjetaFidelizacion = null;
		loyaltyCardNotApplied = dataCard;
		loyaltyCardAppliedAuto();
	}
}

function showInfoPromoLoyaltyModal(promoObj)
{
	promoFidelizacion = promoObj;
	var htmlTablaDatosFidelizacion = "";
	var hasPromotionAplied = false;

	if (promoFidelizacion == null)
	{
		alertaExcepcion(polyglot.t("loyalty.Promotion_expired"), polyglot.t("loyalty.Promo_code_expired_msg", {code: loyaltyCardNotApplied.numTarjeta}));
		$('#popup_loyalty').hide();
		return;
	}

	if (loyaltyCardNotApplied.tipoTarjeta == FIDELIZACION_TIPO_TARJETA_FIDELIZACION)
	{
		htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Card") + "</th><td colspan='2'>" + loyaltyCardNotApplied.numTarjeta + "</td></tr>";
		htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Holder_name") + "</th><td colspan='2'>" + loyaltyCardNotApplied.comprador.nombre + " " + loyaltyCardNotApplied.comprador.apellidos + "</td></tr>";
	}
	else if (loyaltyCardNotApplied.tipoTarjeta == FIDELIZACION_TIPO_TARJETA_CODIGO_DESCUENTO)
	{
		htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Discount_code") + "</th><td colspan='2'><div class='code'>" + loyaltyCardNotApplied.numTarjeta + "</div></td></tr>";
	}

	if (loyaltyCardNotApplied.saldoPromociones == null || loyaltyCardNotApplied.saldoPromociones.length == 0)
	{
		htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Balance") + "</th><td colspan='2'>" + polyglot.t("No_active_promotions") + "</td></tr>";
	}
	else
	{
		var htmlTabla = "";

		for (var i=0; i<loyaltyCardNotApplied.saldoPromociones.length; i++)
		{
			var saldoPromo = loyaltyCardNotApplied.saldoPromociones[i];

			hasPromotionAplied = true;

			if (loyaltyCardNotApplied.tipoTarjeta == FIDELIZACION_TIPO_TARJETA_CODIGO_DESCUENTO)
			{
				if(i==0)
				{
					htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Name_promotion") + "</th>";
					htmlTablaDatosFidelizacion += "<td>" + saldoPromo.litPromocion + "</td></tr>";
				}
				else
				{
					htmlTablaDatosFidelizacion += "<tr><th>&nbsp;</th>";
					htmlTablaDatosFidelizacion += "<td>" + saldoPromo.litPromocion + "</td><td>&nbsp;</td></tr>";
				}

				if(saldoPromo.saldo < SALDO_MOSTRAR_ULTIMAS_ENTRADAS_CODIGO_DESCUENTO)
				{
					if((promoFidelizacion != null && promoFidelizacion.noShowRemainingUses == null) || promoFidelizacion.noShowRemainingUses == false)
					{
						htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Availability") + "</th><td>" + polyglot.t("last_quantity_tickets", { quantity: saldoPromo.saldo }) + "</td></tr>";	
					}
					
				}
				
			}
			else
			{
				if(i==0){
					htmlTablaDatosFidelizacion += "<tr><th>" + polyglot.t("Balance") + "</th>";
				}else{
					htmlTablaDatosFidelizacion += "<tr><th>&nbsp;</th>";
					htmlTablaDatosFidelizacion += "<td>" + saldoPromo.litPromocion + "</td>";
				}
				
				
				var namePoint = polyglot.t("points");
				if(promoFidelizacion != null) {
					namePoint = promoObj.loyaltyPointsName;
				}
				
				htmlTablaDatosFidelizacion += "<td>" + saldoPromo.saldo + " " + namePoint + " · " + saldoPromo.litPromocion + "</td></tr>";
			}
		}

		$("#tablaDatosFidelizacion tbody").html(htmlTablaDatosFidelizacion);
	}

	//DESCRIPTION
	var descripcionMultiIdioma = promoObj.descripcion;
	var descriptionLang = getTextMultilanguage(descripcionMultiIdioma);

	if(descriptionLang != null)
	{
		$("#desc-promo-text").html(descriptionLang);
		$("#description-promotion").show();
	}
	else
	{
		$("#description-promotion").hide();
	}

	//show page info code
	$("#result-code-finded").show();

}

function setPromoLoyalty(promoObj)
{
	promoFidelizacion = promoObj;
}


function setVoucherOfWallet(id_card)
{
	$(".loyalty_card_list_element").removeClass("selected");

	$("#voucher_card_"+id_card).addClass("selected");
}

function addNewCodeVoucher()
{

	$("#coupons-list").hide();
	$("#result-code-finded").hide();
	$("#footer-apply-code").hide();
	$("#footer-select-promotion").hide();

	$("#form-insert-code-promotion").show();
	$("#popup_loyalty .body-popup").addClass("with-footer");

	$("#footer-find-code").show();

	$("#btn_back_to_wallet").show();

}

function goBackToWallet()
{
	$("#coupons-list").show();
	$("#popup_loyalty .body-popup").removeClass("with-footer");
	$("#form-insert-code-promotion").hide();
	$("#result-code-finded").hide();

	$("#footer-find-code").hide();
}

function manageLoyalty(purchaseDetailRow, product, loyaltyCardNumber)
{
	if (loyaltyCardNumber != null && loyaltyCardNumber.numTarjeta != null
		&& loyaltyCardNumber.saldoPromociones != null && product.fidePromocionMostrar != null)
	{
		for (let balance of loyaltyCardNumber.saldoPromociones)
		{
			if (balance.idPromocion == product.fidePromocionMostrar)
			{
				purchaseDetailRow.loyaltyCardNumber = loyaltyCardNumber.numTarjeta;
				break;					
			}				
		}
	}

	if (product.fidePromocionRedimir != null)
	{
		purchaseDetailRow.idLoyaltyPromotion = product.fidePromocionRedimir;
		purchaseDetailRow.points = product.puntosRedimir;
		purchaseDetailRow.loyaltyOperationType = FIDELIZACION_OPERACION_REDIMIR;
	}
	else if (product.fidePromocionAcumular != null)
	{
		purchaseDetailRow.idLoyaltyPromotion = product.fidePromocionAcumular;
		purchaseDetailRow.points = product.puntosAcumular;
		purchaseDetailRow.loyaltyOperationType = FIDELIZACION_OPERACION_ACUMULAR;
	}
	else if (loyaltyCardNumber != null && loyaltyCardNumber.tipoTarjeta == FIDELIZACION_TIPO_TARJETA_CODIGO_DESCUENTO && product.fidePromocionMostrar != null)
	{
		purchaseDetailRow.idPromotionApplied = product.fidePromocionMostrar;
		purchaseDetailRow.promotionAmountUsed = 1;
		purchaseDetailRow.loyaltyOperationType = FIDELIZACION_OPERACION_CODIGO_DESCUENTO;
	}
}

function getInfoCardCode(card)
{
	var code = '';
	var classSelected = "";
	if (typeof in_cards_screen === 'undefined' && tarjetaFidelizacion == card.cardNumber)
	{
		classSelected = "applied";
	}
	
	if(card.puntos != 0)
	{
		code += '<div class="loyalty_card_list_element '+classSelected+'" id="voucher_card_'+card.cardNumber+'">';
		code += getVisualCard(card);
		code += '</div>';
	}
		
	return code;
}

function getVisualCardPreSelection(card)
{
	
	var code = '';
	
	var dayStr = getWeekDayLongLiteral(card.strFechaFin);
	var dateEnd = formatDateTime(card.strFechaFin);		
	var expirationDateStr = polyglot.t("Valid_until_(date)", {dateStr: dayStr + ' ' + dateEnd});
	var titleExpirationDateStr = polyglot.t("Valid_until") + " " + dayStr + ' ' + dateEnd;
	var dayEndStrPoints = getWeekDayLongLiteral(card.fechaCaducidadPuntos);
	var dateEndPoints = formatDateTime(card.fechaCaducidadPuntos);		
	var strTitlePointsOfValid = polyglot.t("Expiration_date_of_points") + ": " + dayEndStrPoints + ' ' + dateEndPoints;
	
	var strLitPromotion = card.litPromotionCard;
	if(card.promoCodeCustomLabel != undefined && card.promoCodeCustomLabel != null)
	{
		strLitPromotion = getTextMultilanguage(card.promoCodeCustomLabel);
	}
	
	
	var pointsStr = "";
	var pointsStrPresale = "";
	var currentPointsStr = "";
	var accumulatedPointsStr = "";
	if(card.puntos != undefined)
	{
		//TODO: formatear como dinero?
		var strPoints = "pts";
		if(card.loyaltyPointsName != null)
		{
			strPoints = card.loyaltyPointsName;
			loyaltyPoints.push({ id: card.idPromocion, name: card.loyaltyPointsName });
		}
		pointsStr = card.puntos + " " + strPoints;		
		pointsStrPresale = polyglot.t("Valid_for(number)tickets", {number: card.puntos});
		currentPointsStr = polyglot.t("Balance") + ": " + card.puntos + " " + strPoints;
		accumulatedPointsStr = polyglot.t("Accumulated_points") + ": " + card.acumPoints + " " + strPoints;
	}

	var codeLogo = "";
	if(card.imagen != undefined && card.imagen != null)
	{
		var urlLogo = urlEstaticos + "empresa/"+ (typeof venueOwnerId != "undefined" && venueOwnerId != null && venueOwnerId != "" ? venueOwnerId : idEmpresa)+"/"+"promotions"+"/"+card.idPromocion+"/logo.png";
		codeLogo = '<img src="'+urlLogo+'"></img>';
	}
	
	var codeBg = "";
	if(card.imagenBg != undefined && card.imagenBg != null)
	{
		var urlBgImg = urlEstaticos + "empresa/"+(typeof venueOwnerId != "undefined" && venueOwnerId != null && venueOwnerId != "" ? venueOwnerId : idEmpresa)+"/"+"promotions"+"/"+card.idPromocion+"/bg.png";
		codeBg = '<div class="image_covered" style="background-image:url('+urlBgImg+')"></div>';
	}
	
	var styleCard = "color:" + card.colorTextCard + ";";
	if(card.bgDesign == CARD_DESIGN.ONE_COLOR)
	{
		styleCard += "background-color:" + card.colorBgCard1 + " !important;";
		styleCard += " text-shadow: 0px 0px 2px "+card.colorBgCard1+";";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_TOP_DOWN)
	{
		styleCard += "background: linear-gradient("+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_LEFT_RIGHT)
	{
		styleCard += "background: linear-gradient(to right, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_RIGHT_BOTTOM)
	{
		styleCard += "background: linear-gradient(to right bottom, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_RIGHT_LEFT)
	{
		styleCard += "background: linear-gradient(-90deg, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_LEFT_TOP)
	{
		styleCard += "background: linear-gradient(33deg, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	
	var strBrandPromotion = "";
	if(strLitPromotion != null && strLitPromotion != "")
	{
		strBrandPromotion = '<div class="brand_card">'+strLitPromotion+'</div>';
	}
	
	var strDescription = "";
	if(card.descripcion != undefined && card.descripcion != null)
	{
		strDescription = "<p>" + getTextMultilanguage(card.descripcion) + "</p>";
	}
	
	code += '<div class="card_wrapper">';
	
	
	
	var strStatusPoints = "";

	
	if(card.promotionType == PROMOTION_TYPE_CARD.SPECIAL_PRICE)
	{

		var stylesSpan = "";		
		
		//Si hay imagen de background ocultamos el color de fondo
		if(card.imagenBg != undefined && card.imagenBg != null)
		{
			styleCard = "border-color: " + card.colorTextCard+ " !important; ";
			
			if(card.imagenBg != undefined && card.imagenBg != null)
			{
				var urlBgImg = urlEstaticos + "empresa/"+(typeof venueOwnerId != "undefined" && venueOwnerId != null && venueOwnerId != "" ? venueOwnerId : idEmpresa)+"/"+"promotions"+"/"+card.idPromocion+"/bg.png";
				codeBg = '<div class="image_covered" style="background-image:url('+urlBgImg+'); opacity:1;"></div>';
			}
		}
		else
		{
			if(card.colorBgCard2 != null)
			{
				styleCard += "border-color: " + card.colorBgCard2+ " !important; ";
			}
		}
		
		//Si hay color de textos
		var strColor = '';
		if(card.colorTextCard != null && card.colorTextCard != "") 
		{
			strColor = 'color: ' + card.colorTextCard + ';'
		}
		
		
		code += '<div style="'+styleCard+'" class="credit-card credit-card--coupon" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
				 	'<div class="coupon_wrapper" style="background-color: transparent">' + 
					 	'<div class="name_coupon" style="'+strColor+'">'+strLitPromotion+'</div>' +
					 	codeBg +
				 	'</div>' +
				 '</div>';
	
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.PRESALE)
	{
		code +='<div style="'+styleCard+'" class="credit-card credit-card--voucher" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
					'<div class="credit-card__club">' +
						'<div class="credit-card__club_loyalty">' +
						'<div class="brand_logo">'+codeLogo+'</div>' +
							strBrandPromotion +
						'</div>' +											 	
					'</div>' +
					codeBg +
				'</div>';

	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.LOYALTY)
	{
		code +='<div style="'+styleCard+'" class="credit-card credit-card--loyalty" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
				    '<div class="credit-card__club">' +
				     	 '<div class="credit-card__club_loyalty">' +
				     	 	'<div class="brand_logo">'+codeLogo+'</div>' +
				     	 	strBrandPromotion +
				     	 	'<div class="number_card">'+card.cardNumber+'</div>' +
				     	 '</div>' +				     	 
				     	 '<div class="credit-card__club_logo image_full">' +
				     	 	codeBg +
				     	 '</div>' +
				    '</div>' +
				    '<div class="credit-card__info">' +
				    	'<div class="credit-card__info_points"><p>'+pointsStr+'</p></div>' +
				    '</div>' +
			    '</div>';
		
		var dayEndStr = getWeekDayLongLiteral(card.fechaCaducidadPuntos);
		var dateEnd = formatDateTime(card.fechaCaducidadPuntos);		
		
		strStatusPoints = currentPointsStr; //cambiar por Puntos acumulados: x	
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.INVITATION)
	{
		pointsStrInvitation = polyglot.t("Invitations(number)", {number: card.puntos});
		
		code +='<div style="'+styleCard+'" class="credit-card credit-card--invitation" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
					'<div class="credit-card__club">' +
						'<div class="credit-card__club_invitation">' +						
							'<div class="brand_card">'+card.litPromocion+'</div>' +
							'<div class="date_card">'+expirationDateStr+'</div>' +
						'</div>' +											 	
					'</div>' +
					'<div class="credit-card__info">' +
						'<div class="credit-card__info_invitations">'+pointsStrInvitation+'</div>' +
					'</div>' +
				'</div>';
		
		strLitPromotion = card.litPromocion;

	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.GIFT_CARD)
	{
		pointsStrInvitation = polyglot.t("Invitations(number)", {number: card.puntos});
		
		code +='<div style="'+styleCard+'" class="credit-card credit-card--invitation" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
					'<div class="credit-card__club">' +
						'<div class="credit-card__club_invitation">' +						
							'<div class="brand_card">'+card.litPromocion+'</div>' +
							'<div class="date_card">'+expirationDateStr+'</div>' +
						'</div>' +											 	
					'</div>' +
					'<div class="credit-card__info">' +
						'<div class="credit-card__info_invitations">'+pointsStrInvitation+'</div>' +
					'</div>' +
				'</div>';
		
		strLitPromotion = card.litPromocion;
	}
	
	code += '</div>';
	
	code += '<div class="info_wrapper">' +
				'<div class="info_wrapper_title">' +
					strLitPromotion + 
				'</div>' +
				'<div class="info_wrapper_description">' +
					strDescription +
				'</div>';
					
	if(card.promotionType == PROMOTION_TYPE_CARD.LOYALTY)
	{
		let cardNumberStr = card.cardNumber.toString();
		code += `<div class="info_wrapper_description_info_status">
					<a class="info_operations_link" onclick="loadCardOperations('${cardNumberStr}', ${card.idCategoriaFidelizacion})">${polyglot.t('loyalty.transactions.Show_transactions')}</a>
				</div>
				<div class="info_operations" style="display: none;">
					<div class="row mb1">
						<div class="large-10 medium-10 small-9 columns">
							<h5>${polyglot.t('loyalty.transactions')}</h5>
						</div>
						<div class="large-2 medium-2 small-3 columns text-right" style="line-height: 2.3rem;">
							<a onclick="closeCardOperations('${cardNumberStr}')">${polyglot.t('Close')}</a>		
						</div>
					</div>
				</div>`;
	}
	
	
	if (typeof in_cards_screen === 'undefined')	
	{
		code += '<div class="info_wrapper_action_button w100">' +
					'<button type="button" onclick="onPromotionSelected(\''+card.idPromocion +'\');" class="button primary expand tiny radius">'+polyglot.t("Apply")+'</button>' +
				'</div>';
	}
	
	code += '</div>';
	
	code += '</div>';
	
	
	return code;
}

function getVisualCard(card)
{
	var code = '';
	
	var dayStr = getWeekDayLongLiteral(card.strFechaFin);
	var dateEnd = formatDateTime(card.strFechaFin);		
	var expirationDateStr = polyglot.t("Valid_until_(date)", {dateStr: dayStr + ' ' + dateEnd});
	var titleExpirationDateStr = polyglot.t("Valid_until") + " " + dayStr + ' ' + dateEnd;
	var dayEndStrPoints = getWeekDayLongLiteral(card.fechaCaducidadPuntos);
	var dateEndPoints = formatDateTime(card.fechaCaducidadPuntos);		
	var strTitlePointsOfValid = polyglot.t("Expiration_date_of_points") + ": " + dayEndStrPoints + ' ' + dateEndPoints;
	
	var strLitPromotion = card.litPromocion;
	if(card.litPromotionCardMultiidioma != undefined && card.litPromotionCardMultiidioma != null)
	{
		strLitPromotion = getTextMultilanguage(card.litPromotionCardMultiidioma);
	}
	
	var pointsStr = "";
	var pointsStrPresale = "";
	var currentPointsStr = "";
	var accumulatedPointsStr = "";
	if(card.puntos != undefined)
	{
		//TODO: formatear como dinero?
		var strPoints = "pts";
		if(card.loyaltyPointsName != null)
		{
			strPoints = card.loyaltyPointsName;
			loyaltyPoints.push({ id: card.idPromocion, name: card.loyaltyPointsName });
		}
		pointsStr = card.puntos + " " + strPoints;		
		pointsStrPresale = polyglot.t("Valid_for(number)tickets", {number: card.puntos});
		currentPointsStr = polyglot.t("Balance") + ": " + card.puntos + " " + strPoints;
		accumulatedPointsStr = polyglot.t("Accumulated_points") + ": " + card.acumPoints + " " + strPoints;
	}

	var codeLogo = "";
	if(card.imagen != undefined && card.imagen != null)
	{
		var urlLogo = urlEstaticos + "empresa/"+(typeof venueOwnerId != "undefined" && venueOwnerId != null && venueOwnerId != "" ? venueOwnerId : idEmpresa)+"/"+"promotions"+"/"+card.idPromocion+"/logo.png";
		codeLogo = '<img src="'+urlLogo+'"></img>';
	}
	
	var codeBg = "";
	if(card.imagenBg != undefined && card.imagenBg != null)
	{
		var urlBgImg = urlEstaticos + "empresa/"+(typeof venueOwnerId != "undefined" && venueOwnerId != null && venueOwnerId != "" ? venueOwnerId : idEmpresa)+"/"+"promotions"+"/"+card.idPromocion+"/bg.png";
		codeBg = '<div class="image_covered" style="background-image:url('+urlBgImg+')"></div>';
	}
	
	var styleCard = "color:" + card.colorTextCard + ";";
	if(card.bgDesign == CARD_DESIGN.ONE_COLOR)
	{
		styleCard += "background-color:" + card.colorBgCard1 + " !important;";
		styleCard += " text-shadow: 0px 0px 2px "+card.colorBgCard1+";";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_TOP_DOWN)
	{
		styleCard += "background: linear-gradient("+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_LEFT_RIGHT)
	{
		styleCard += "background: linear-gradient(to right, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_RIGHT_BOTTOM)
	{
		styleCard += "background: linear-gradient(to right bottom, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_RIGHT_LEFT)
	{
		styleCard += "background: linear-gradient(-90deg, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	else if(card.bgDesign == CARD_DESIGN.LINEAR_GRADIENT_LEFT_TOP)
	{
		styleCard += "background: linear-gradient(33deg, "+card.colorBgCard1+", "+card.colorBgCard2+") !important;";
		styleCard += " text-shadow: 0px 0px 1px #000000;";
	}
	
	var strBrandPromotion = "";
	if(strLitPromotion != null && strLitPromotion != "")
	{
		strBrandPromotion = '<div class="brand_card">'+strLitPromotion+'</div>';
	}
	
	var strDescription = "";
	if(card.descripcion != undefined && card.descripcion != null)
	{
		strDescription = "<p>" + getTextMultilanguage(card.descripcion) + "</p>";
	}
	
	code += '<div class="card_wrapper">';
	
	
	var strTitleOfValid = "";
	var strStatusPoints = "";
	var strStatusAcumPoints = "";
	
	if(card.promotionType == PROMOTION_TYPE_CARD.SPECIAL_PRICE)
	{
		
		var stylesSpan = "";		
		//border
		if(card.colorBgCard2 != null)
		{
			styleCard += "border-color: " + card.colorBgCard2+ " !important; ";
			stylesSpan += "background-color: " + card.colorBgCard2+ " !important; ";
		}
		
		
		code += '<div style="'+styleCard+'" class="credit-card credit-card--coupon" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
				 	'<div class="coupon_wrapper">' +
					 	'<div class="expiration_date">'+expirationDateStr+'</div>' +
					 	'<div class="name_coupon">'+strLitPromotion+'</div>' +
					 	'<div class="promo_code">'+polyglot.t("PROMO_CODE")+' <span style="'+stylesSpan+'">'+card.cardNumber+'</span></div>' +
				 	'</div>' +
				 '</div>';
		
		strTitleOfValid = titleExpirationDateStr;		
		strStatusPoints = polyglot.t("Available_at_(num)_tickets_left", {tickets: card.puntos});
	
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.PRESALE)
	{
		code +='<div style="'+styleCard+'" class="credit-card credit-card--voucher" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
					'<div class="credit-card__club">' +
						'<div class="credit-card__club_loyalty">' +
						'<div class="brand_logo">'+codeLogo+'</div>' +
							strBrandPromotion +
							'<div class="number_card with_border">'+card.cardNumber+'</div>' +
						'</div>' +											 	
					'</div>' +
					'<div class="credit-card__info">' +
							'<div class="credit-card__info_points_half">'+pointsStrPresale+'</div>' +
							'<div class="credit-card__info_points_valid">'+expirationDateStr+'</div>' +
					'</div>' +
				'</div>';
		
		strTitleOfValid = titleExpirationDateStr;
		strStatusPoints = polyglot.t("Available_at_(num)_tickets_left", {tickets: card.puntos});
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.LOYALTY)
	{
		code +='<div style="'+styleCard+'" class="credit-card credit-card--loyalty" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
				    '<div class="credit-card__club">' +
				     	 '<div class="credit-card__club_loyalty">' +
				     	 	'<div class="brand_logo">'+codeLogo+'</div>' +
				     	 	strBrandPromotion +
				     	 	'<div class="number_card">'+card.cardNumber+'</div>' +
				     	 '</div>' +				     	 
				     	 '<div class="credit-card__club_logo image_full">' +
				     	 	codeBg +
				     	 '</div>' +
				    '</div>' +
				    '<div class="credit-card__info">' +
				    	'<div class="credit-card__info_points"><p>'+pointsStr+'</p></div>' +
				    '</div>' +
			    '</div>';
		
		var dayEndStr = getWeekDayLongLiteral(card.fechaCaducidadPuntos);
		var dateEnd = formatDateTime(card.fechaCaducidadPuntos);		
		
		strTitleOfValid = polyglot.t("Expiration_date_of_points") + ": " + dayEndStr + ' ' + dateEnd; //cambiar por fecha de caducidad de los puntos
		strStatusPoints = currentPointsStr; //cambiar por Puntos acumulados: x
		strStatusAcumPoints = accumulatedPointsStr;	
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.INVITATION)
	{
		pointsStrInvitation = polyglot.t("Invitations(number)", {number: card.puntos});
		
		code +='<div style="'+styleCard+'" class="credit-card credit-card--invitation" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
					'<div class="credit-card__club">' +
						'<div class="credit-card__club_invitation">' +						
							'<div class="brand_card">'+card.litPromocion+'</div>' +
							'<div class="date_card">'+expirationDateStr+'</div>' +
						'</div>' +											 	
					'</div>' +
					'<div class="credit-card__info">' +
						'<div class="credit-card__info_invitations">'+pointsStrInvitation+'</div>' +
					'</div>' +
				'</div>';
		
		strLitPromotion = card.litPromocion;
		
		strTitleOfValid = titleExpirationDateStr;
		strStatusPoints = pointsStrInvitation;
	}
	else if(card.promotionType == PROMOTION_TYPE_CARD.GIFT_CARD)
	{
		let amountStr = card.amount + " " + strPoints;
		
		codeBg = "";
		if(card.themeImage != undefined && card.themeImage != null)
		{
			var urlBgImg = routeImagesStr + "/" + card.themeImage; //urlEstaticos + "empresa/"+idEmpresa+"/"+"promotions"+"/"+card.idPromocion+"/bg.png";
			codeBg = '<div class="image_covered" style="background-image:url('+urlBgImg+')"></div>';
		}
		
		code +='<div style="'+styleCard+'" class="credit-card credit-card--gift_card" onclick="setVoucherOfWallet(\''+card.cardNumber+'\')">' +
				    codeBg +
				    '<div class="credit-card__club">' +
				     	 '<div class="credit-card__club_gift_card">' +
				     	 	'<div class="info-gift-card-wrapper">' +
				     	 		strBrandPromotion +
				     	 		'<div class="number_card">'+card.cardNumber+'</div>' +
				     	 		'<div class="amount_card">'+amountStr+'</div>' +
				     	 	'</div>' +
				     	 '</div>' +
				    '</div>' +
			    '</div>';

	}
	
	
	code += '</div>';
	
	
	code += '<div class="info_wrapper">' +
				'<div class="info_wrapper_title">' +
					strLitPromotion + 
				'</div>' +
				'<div class="info_wrapper_description">' +
					strDescription +					
					'<div class="info_wrapper_description_info_status">' +
						strStatusPoints +
					'</div>' +
					'<div class="info_wrapper_description_info_status">' +
						strStatusAcumPoints +
					'</div>' +
					/*'<div class="info_wrapper_description_info_expire">' +
						strTitleOfValid + 
					'</div>' +*/
				'</div>';
					
	if(card.promotionType == PROMOTION_TYPE_CARD.LOYALTY)
	{
		let cardNumberStr = card.cardNumber.toString();
		code += `<div class="info_wrapper_description_info_status">
					<a class="info_operations_link" onclick="loadCardOperations('${cardNumberStr}', ${card.idCategoriaFidelizacion})">${polyglot.t('loyalty.transactions.Show_transactions')}</a>
				</div>
				<div class="info_operations" style="display: none;">
					<div class="row mb1">
						<div class="large-10 medium-10 small-9 columns">
							<h5>${polyglot.t('loyalty.transactions')}</h5>
						</div>
						<div class="large-2 medium-2 small-3 columns text-right" style="line-height: 2.3rem;">
							<a onclick="closeCardOperations('${cardNumberStr}')">${polyglot.t('Close')}</a>		
						</div>
					</div>
				</div>`;
	}
					
	code += '</div>';
	
	if (typeof in_cards_screen === 'undefined')	
	{
		code += '<div class="info_wrapper_action">' +
					'<div class="info_wrapper_action_notice">' +
						//'<p><i class="palco4icon palco4icon-info"></i> You cannot use this promotion in the current session</p>' +
					'</div>' +
					'<div class="info_wrapper_action_button">';
					
		if(card.promotionType == PROMOTION_TYPE_CARD.GIFT_CARD)
		{
			code += '<p>'+polyglot.t("giftcard.Gift_cards_can_only_be_used_on_payment")+'</p>';
		}
		else
		{
			code += '<button type="button" onclick="applyPromoOfWallet(\''+card.cardNumber+'\');" class="button primary expand tiny radius">'+polyglot.t("Apply")+'</button>';
		}
						
		code += '</div>' +
				'</div>';
	}
				
	code += '</div>';
	
	
	return code;
}

function loadCardOperations(cardNumber, idCategory)
{
	CompraAjax.getCardTransactions(cardNumber, idCategory, cardTransactionsLoaded);
}

function loadCardTransactionIcon(transactionType)
{
	var transactionIconLine = '';
	if(transactionType == TYPE_LOYALTY_OPERATION.ACUMULAR)
	{
		transactionIconLine += '<i class="palco4icon palco4icon-add_balance"></i>';
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.MANUAL_RECHARGE)
	{
		transactionIconLine += '<i class="palco4icon palco4icon-add_balance"></i>';
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.REDIMIR)
	{
		transactionIconLine += '<i class="palco4icon palco4icon-minus_balance"></i>';
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.CADUCAR)
	{
		transactionIconLine += '<i class="palco4icon palco4icon-expired_balance"></i>';
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.CODIGO_DESCUENTO)
	{
		transactionIconLine += '';
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.MANUAL_TAKE_OUT)
	{
		transactionIconLine += '<i class="palco4icon palco4icon-minus_balance"></i>';
	}
	
	return transactionIconLine;
}

function loadCardTransactionTitle(transactionType)
{
	var transactionTitle = '';
	if(transactionType == TYPE_LOYALTY_OPERATION.ACUMULAR)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Accumulation_of_points");
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.MANUAL_RECHARGE)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Manual_recharge");
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.REDIMIR)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Redemption_of_points");
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.CADUCAR)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Points_expired");
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.CODIGO_DESCUENTO)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Points_expired");
	}
	else if(transactionType == TYPE_LOYALTY_OPERATION.MANUAL_TAKE_OUT)
	{
		transactionTitle = polyglot.t("loyalty.transactions.Manual_take_out");
	}
	
	return transactionTitle;
}

function getPointsName(idPromocion)
{
	for(var i = 0; i < loyaltyPoints.length; i++)
	{
		var currentLoyalty = loyaltyPoints[i];
		if(currentLoyalty.id === idPromocion)
		{
			return currentLoyalty.name;
		}
	}
}

function loadCardTransaction(transaction)
{
	document.querySelector(`#voucher_card_${transaction.numTarjeta} .info_operations`).insertAdjacentHTML('beforeend', `
		<div class="card-operation">
			<div class="card-operation-icon">${loadCardTransactionIcon(transaction.tipoOperacion)}</div>
			<div class="card-operation-detail">
				<div class="card-operation-type"><span>${loadCardTransactionTitle(transaction.tipoOperacion)}</span></div>
				<div class="card-operation-date"><small>${formatDateTime(transaction.fechaOperacionStr)} (${polyglot.t('loyalty.Expire_date')} ${formatDateTime(transaction.fechaCaducidadStr)})</small></div>
			</div>
			<div class="card-operation-amount">${transaction.puntos} ${getPointsName(transaction.idPromocion)}</div>
		</div>
	`);
	
	document.querySelector(`#voucher_card_${transaction.numTarjeta} .info_operations`).style.display = 'block';
	document.querySelector(`#voucher_card_${transaction.numTarjeta} .info_operations_link`).style.display = 'none';
}

function cardTransactionsLoaded(transactions)
{
	cardTransactions = transactions;
	for(var i = 0; i < transactions.length; i++)
	{
		var currentCardTransaction = transactions[i];
		loadCardTransaction(currentCardTransaction);
	}
}

function closeCardOperations(cardNumber)
{
	document.querySelector(`#voucher_card_${cardNumber} .info_operations`).innerHTML = `
		<div class="row mb1">
			<div class="large-10 medium-10 small-9 columns">
				<h5>${polyglot.t('loyalty.transactions')}</h5>	
			</div>
			<div class="large-2 medium-2 small-3 columns text-right operations-title-link">
				<a onclick="closeCardOperations('${cardNumber}')">${polyglot.t('Close')}</a>		
			</div>
		</div>
	`;
	document.querySelector(`#voucher_card_${cardNumber} .info_operations`).style.display = 'none';
	document.querySelector(`#voucher_card_${cardNumber} .info_operations_link`).style.display = 'block';
}