
<div class="information">
	<table cellpadding="0" cellspacing="0" border="0">
	<tr>
		<td><img src="image/cielo/logo-<?php echo $cartao; ?>.png"></td>
		<td width="15">&nbsp;</td>
		<td>
			<div style="font-size:14px;"><?php echo $cartao_opcao; ?></div>
		</td>
	</tr>
	</table>
</div>

<div class="information">
	<?php echo $text_information; ?>
</div>

<div class="buttons">
	<div class="right">
		<img id="cielo-loading" src="image/cielo/loading.gif">
		<a id="button-confirm-cielo" class="button"><span><?php echo $button_confirm; ?></span></a>
	</div>
</div>

<style>
#confirm .payment #cielo-loading { display:none; margin:0 5px 0 0; vertical-align:middle; }
</style>

<script>
var cieloConfirmed = false;

$('#button-confirm-cielo').click(function(){

	if(cieloConfirmed){ return false; }

	//cieloConfirmed = true;
	$('#confirm .payment #cielo-loading').show();

	$.ajax({
		url: 'index.php?route=payment/cielo/confirm',
		type: 'GET',
		cache: false,
		dataType: 'json',
		success: function(json){
			if(json['error']){
				alert(json['error']);
			}
			location = json['redirect'];
		}
	});

});
</script>
