{% extends "base.html.twig" %}

{% block content %}
	<div class="cart_page">
		<div class="cart_items">
			{% for product in products %}
				<div class="cart_item">
					{% if product.img %}
						<img class="img" src="{{ product.img }}" alt="{{ product.img }}">
					{% endif %}

					<h2>{{product.name}}</h2>
					<div style="width:100%;">
						<div class="vars">
							<div>
								<h3>${{product.price}}</h3>
							</div>
							<div>
								<h3>{{product.weight}} г.</h3>
							</div>
						</div>

					</div>
				</div>
			{% endfor %}
		</div>
		<div class="checkout">
			<p>Сумма:{{price_sum}}</p>
			<div id="paypal-button-container"></div>
		</div>
	</div>
<script src="https://www.paypal.com/sdk/js?client-id=AXnkrMXEIWVuJR_iDOH2Dq3chOz1CvjEPV3gpmTb4ZuOZ1558BuKmFVdNwzUQSd15NhLCbxwK3bKIWnl&locale=en_US"></script>	
<script type="text/javascript">
				paypal.Buttons({
					// All your options here !
					createOrder: (data, actions) => {
							return actions.order.create({
									intent: 'capture',  // capture or authorize
									purchase_units: [{
													amount: {
															value: 50.25
													},
													description: 'Magical unicorn',
													invoice_id: '1234567890',
													soft_descriptor: 'unicorn-2345678'
									}],
									application_context: {
													brand_name: 'My amazing brand',
													shipping_preference: 'NO_SHIPPING' // if you handle shipping
									}
							});
					},
					// Finalizes the transaction after payer approval
					onApprove: (data) => {
									console.log('Unicorn bought, yay !')
					},
					// The user closed the window
					onCancel: () => {
									console.log('The user canceled the payment');
					},
					onError: (err) => {
									console.log('Something went wrong', err);
					}
				}).render('#paypal-button-container');
			</script>
	{% endblock %}