<?php
	$globalpagetitle = "Payment Successful!";
	
	global $website_options;
	global $jcart;
	include('views/_header.tpl.php');
	
	if (isset($_GET['rec'])) {
		$receiptID = filter_var($_GET['rec'], FILTER_SANITIZE_STRING);
		$receipt_info=htmlentities($receiptID, ENT_QUOTES, 'UTF-8');
	}
	if (isset($_GET['oid'])) {
		$orderID = filter_var($_GET['oid'], FILTER_SANITIZE_STRING);
		$order_id=htmlentities($orderID, ENT_QUOTES, 'UTF-8');
	}
?>

<!-- AGENT UPGRADE PURCHASE -->

<link rel="stylesheet" type="text/css" href="/static/css/loader.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">

<!-- CART /  CHECKOUT INCLUDES -->
<link rel="stylesheet" type="text/css" media="screen, projection" href="3rdparty/jcart-1.3/jcart/css/jcart.css" /><!-- ?v=60 -->
<script type="text/javascript" src="3rdparty/jcart-1.3/jcart/js/jcart.js"> </script>
<!-- CART /  CHECKOUT INCLUDES END -->	

<script type="text/javascript">
$(document).ready(function() {
//	$({ Counter: 0 }).animate({
//		Counter: $('.mybalance').val()
//	}, {
//		duration: 1000,
//		easing: 'swing',
//		step: function() {
//			$('.animatedbalance').text(Math.ceil(this.Counter).toLocaleString('en'));
//		}
//	});
	var totalLoaded = $('.mybalance').val();
	$({ Counter: 0 }).animate({
		Counter: totalLoaded
	}, {
		duration: 1000,
		easing: 'swing',
		step: function() {
			//$('.animatedcoins').text(Math.ceil(this.Counter).toFixed(2).toLocaleString('en'));
			$('.animatedbalance').text(Math.ceil(this.Counter*100)/100).toLocaleString('en');
		},
		complete : function() {
			$('.animatedbalance').text(parseFloat(totalLoaded, 10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1,").toString());
		}
	});	
	
	var totalTickets = $('.myloyaltytix').val();
	$({ Counter: 0 }).animate({
		Counter: totalTickets
	}, {
		duration: 1000,
		easing: 'swing',
		step: function() {
			//$('.animatedcoins').text(Math.ceil(this.Counter).toFixed(2).toLocaleString('en'));
			//$('.animatedloyaltytix').text(Math.ceil(this.Counter*100)/100).toLocaleString('en');
			$('.animatedloyaltytix').text(Math.ceil(this.Counter).toLocaleString('en'));
		},
		complete : function() {
			$('.animatedloyaltytix').text(Math.ceil(this.Counter).toLocaleString('en'));
			//$('.animatedloyaltytix').text(parseFloat(totalTickets, 10).toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1,").toString());
		}
	});	

//	$('#add-to-cart').submit(function() {
//		//alert('Yes');
//		$.ajax({
//			type: 'POST',
//			url: $(this).attr('action'),
//			dataType: 'json',
//			success: function(json) {
//				alert('Redirect');
//				window.location.href = "https://joincrossfireiq.com/checkout";
//			}
//		})
//		return false;
//	});
});	
</script>

<!-- MAY WANT TO REMOVE THE OVERFLOW HIDDEN STYLES, SO THE PAGE IS SCROLLABLE -->
<style type="text/css">
	html {
		/*overflow:hidden !important;*/
		font-family:Poppins,Montserrat,Raleway,Helvetica, sans-serif;
	}
	body {
		min-height: 100%; /*overflow:hidden;*/
		font-family: Poppins,Montserrat,Raleway,Helvetica, sans-serif;
	}
	.spacer { padding-top: 0px; 
	}
	#mmen {
		display: none; 
	}
	/* //////////////////////////// */
	/* ////   SQUARE BUTTONS   //// */
	/* //////////////////////////// */ 

	input.squaretopaz {
		background: #0297CF;
		color: #fff;
		border: 1px solid #0088bb;
		padding: 15px 40px;
		font-size: 16px;
		display: inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
		margin-bottom:20px;
	}
	input.squaretopaz:hover {
		background: #00a2df;
		color: #fff;
		border: 1px solid #0088bb;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}	
	
	input.squareblue {
		background: #28397E;
		color: #fff;
		border: 1px solid #28397E;
		padding: 15px 40px;
		font-size: 16px;
		display: inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
		margin-bottom:20px;
	}
	input.squareblue:hover {
		background: #2b4090;
		color: #fff;
		border: 1px solid #2e459c;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}	
	
	/* //////////////////////////// */
	/* ////   ROUNDED BUTTONS  //// */
	/* //////////////////////////// */
	
	input.roundedwhite {
		background:#fff;
		color:#283A7E;	
		border: 1px solid #3650b7;
		border-radius: 30px ;
		-moz-border-radius: 30px;
		-webkit-border-radius: 30px;
		padding: 15px 70px;
		font-size: 16px;
		display: inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);		
	}
	input.roundedwhite:hover {
		background:#3752bc;
		color:#fff;	
		border: 1px solid #003e6c;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}
	input.roundedblue {
		background: #28397E;
		color: #fff;
		border: 1px solid #3650b7;
		border-radius: 30px ;
		-moz-border-radius: 30px;
		-webkit-border-radius: 30px;
		padding: 15px 70px;
		font-size: 16px;
		display: inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
	}
	input.roundedblue:hover {
		background: #fff;
		color: #28397E;
		border: 1px solid #eee;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}	
	.rounded2 a, input.rounded2 {
		background: #00AF14;
		color: #fff;
		border: 1px solid #059813;
		border-radius: 30px ;
		-moz-border-radius: 30px;
		-webkit-border-radius: 30px;
		padding: 15px 70px;
		font-size: 16px;
		display: inline-block;
		box-shadow: 0 3px 10px rgb(0 0 0 / 30%);
	}
	.rounded2 a:hover, input.rounded2:hover {
		color: #fff;
		background: #004172; /* 00355B */
		border: 1px solid #003e6c;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}
	.rounded a {
		background: #eee;
		border-radius: 25px ;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
		padding: 15px 20px;
		font-size: 15px;
		display: inline-block;
	}
	.rounded a:hover {
		color: #fff;
		background: #00355B;
		text-shadow: 0px 0px 0px rgba(0,0,0,.4);
	}
	
	h1.introh1 {
		margin-top: 60px;
	}
	
	.pricingcard { float: left; width:475px; }
	.balancediv {  width:50%; }
	.loadlinks { padding-top:30px; }
	.successmsg { margin-bottom:40px; }
	.loadlinks a { color:#4db9e1; }
	.loadlinks a:hover { color:#57d4ff; }
	
/* ######################################################### */
/*                       MOBILE STYLES                       */
/* ######################################################### */

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	
}

/* Landscape phones and down */
@media (max-width: 586px) {
	.spacer {
		padding-top: 0px !important;
	}
	.grid_12 {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		padding: 0 20px;
	}	
	h1.introh1 {
		margin-top:35px;
		width:90%;
	}
	#leftbalancediv { margin-bottom:40px; }
	.balancediv { width:100%; display:block; }
	
	.loadlinks { padding-top:10px; text-align:center; }
	.successmsg { margin-bottom:40px; }
	.loadlinks a { font-size:15px; }
	.loadlinks a:hover { color:#00A1FE; }
	
	.pricingcard { float: none; display:block; width:100%; 
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; }
	#firstpricingcard { margin-bottom:35px; }
}

/* Landscape phones and down */
@media (max-width: 480px) {

}	

/* Older phones with super small screens */
@media (max-width: 320px) {

}	
</style>

<div class="home-feature-category" style="background: url('/static/images/pagebg.jpg') no-repeat;
	background-size:cover; background-position:center center; border:none; min-height:700px; padding-top:30px; 
	margin-top:0px !important;">
    <div class="container_12 clearfix" style="min-height:100px;">
		<div class="grid_12" style="font-size:17px; color:#fff; 
		font-family:Poppins,Montserrat,Raleway,Helvetica, sans-serif; line-height:27px;">
        
			<h1 class="introh1" style="font-family:Poppins,Montserrat,Raleway,Helvetica, sans-serif; 
			font-weight:600; font-size:38px; line-height:48px; color:#fff; 
			text-shadow:0px 1px 1px rgba(0,0,0,.7);">	
				Thank you for your payment.
			</h1>
			
			<div style="font-size:19px; line-height:29px; text-shadow:0px 1px 1px rgba(0,0,0,.5); 
			max-width:700px;">
				
				<div class="successmsg">
					<span style="font-weight:600;">Your payment was successful.</span> You should 
					be receiving a receipt to your email shortly.
					<br /><br />
					If you purchased a Lifetime VIP Membership, your <a 
					href="<?= get('siteroot') ?>membership" title="View Membership" 
					style="font-weight:500;">Member Status</a> should be 
					updated and you&rsquo;re now eligible for the 1 for 10
					promotion - trackable from the <a href="<?= get('siteroot') ?>leaderboard" 
					title="View Leaderboard" style="font-weight:500;">Leaderboard</a>.
					
				</div>
				<div class="clear"></div>
				<div id="leftbalancediv" class="balancediv" style="font-size:38px; text-align:left; 
				float:left;">
					<div style="font-size:12px; line-height:17px; text-align:left; letter-spacing: 2px; 
					margin-bottom:10px;">
						YOUR CURRENT BALANCE
					</div>
					$<span class="animatedbalance"><?= $balance_formatted ?></span>
					<input class="mybalance" type="hidden"
					value="<?= number_format(($balance/100),2,".","") ?>">
				</div>
				
				<div class="balancediv" style="font-size:38px; text-align:left; float:left">
					<div style="font-size:12px; line-height:17px; text-align:left; letter-spacing: 2px; 
					margin-bottom:10px;">
						YOUR LOYALTY POINTS/STARS
					</div>
					<a href="#loyalty" class="loginpop"><img src="/static/client/info_icon_gold.png"
					alt="[i]" style="margin-top:-5px; height:25px;" align="absmiddle" /></a>
					
					<span class="animatedloyaltytix"><?= $tickets_formatted ?></span>
					<input class="myloyaltytix" type="hidden" 
					value="<?= number_format($tickets,0,".","") ?>"> <img
					src="/static/client/goldstar_sparkly.png" alt="*"
					style="margin-top:-10px; height:40px;" />
				</div>
				<div class="clear"></div>
				
				<br />
				
				<div class="loadlinks">
					<a href="<?= get('siteroot') ?>load" title="Load Funds"
					style="font-weight:500;">Load Funds</a>
					|
					<a href="<?= get('siteroot') ?>plans" title="View Membership Upgrade Plans"
					style="font-weight:500;">View Plans</a>
					|
					<a href="<?= get('siteroot') ?>profile/edit" title="Login now"
					style="font-weight:500;">Edit Profile</a>
					|
					<a href="<?= get('siteroot') ?>membership" title="Login now"
					style="font-weight:500;">Member Area
						<i
					class="fa fa-angle-right" aria-hidden="true"></i></a>
				</div>
				<div class="clear"></div>
			</div>
			
			<!--<div id="jcart"><?php $jcart->display_cart(); ?></div>-->
			
			<br />
			<div class="clear"></div>
			<!--<a href="/auth/checkaccount" 
			title="Click here to check for an existing account"
			style="font-weight:600; color:#57d4ff;">Check to see</a> if you already have an 
			existing Agent/Affiliate Account.-->
			
			<div style="width:100%; height:170px; background:none; text-align:center; padding:15px 25px;
			font-family: Montserrat,Arial, sans-serif; box-sizing:border-box; -moz-box-sizing:border-box;
			-webkit-box-sizing:border-box; color:#fff; font-size:11px; font-weight:400;">
				powered by<br />
				<a href="https://fantasytrivia.com"><img src="/static/client/crest.png" alt="FT"
				style="height:100px; margin:5px 0 -15px;" align="absmiddle" /></a>
			</div>
			<div class="clear"></div>
			<center>
				<a href="javascript:top.frames.location.reload();"
					class="refresh" style="color:#000; font-weight:800; font-size:17px;">
					<i class="fa fa-refresh"></i></a></center>

			<br /><br /><br /><br /><br /><br /><br /><br />
		
		</div><!-- GRID 12 DIV ENDS HERE -->
	</div><!-- CONTAINER 12 DIV END HERE -->
</div><!-- HOME FEATURE CATEGORY DIV ENDS HERE -->

<!-- //////////////////////////////////////////////////////////////////////////////////////// -->
<!-- ////////////////////               NOTHING BELOW HERE               //////////////////// -->
<!-- //////////////////////////////////////////////////////////////////////////////////////// -->

<!-- LOYALTY INFO -->
<div style="display:none;">
	<div id="loyalty" style="max-width:560px;">
		<div class="overlay-bl-bg"></div>
		<div class="container_6 pop-contentXXXX" style="background:none !important;">
			<div class="" style="background:none !important;">
				<div class="formXXX login-formXXX">
					<!-- CONTENT CONTAINER STARTS HERE -->
					<div class="box-white" style="border:0px; min-width:250px; max-height:300px;
					height:auto; padding:0px; background:none !important; margin-top:-30px !important;">

						<div style="background:#fff; float:left; padding:25px; color:#444; font-size:16px;
						font-weight:300; text-align:left; font-family: Montserrat,'Open Sans',sans-serif;
						font-weight:normal; line-height:24px;">

							<h2 style="text-align:center; margin:0 auto 10px; line-height:25px; font-size:17px;
							font-family: Montserrat,'Open Sans',sans-serif; font-weight:700; max-width:400px;">
								<!--If you aren&rsquo;t part of the 1%, then FlipMob was made for YOU-->
								VOICE TRIVIA LOYALTY
							</h2>

							Note: We&rsquo;re still working on our Loyalty Program.
							<br /><br />
							In general Voice Trivia wants to reward various activities and purchases
							with Loyalty Points/Stars, which can be redeemed for various perks, rewards
							as well as increases members&rsquo; chances of winning Consolation Prizes
							for the Challenges they enter/join.
							<br /><br />

							<!--&rsquo; &ldquo;withdraw&rdquo;-->

						</div>
					</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
	</div>
</div>

<?php
	include('views/_footer.tpl.php');
?>