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

{% block stylesheets %}
	<link href={{ asset('css/base.css') }} rel="stylesheet">
	<link href={{ asset('css/get.css') }} rel="stylesheet">
{% endblock %}

{% block content %}
	<div class="product-page">
		<div class="product">
			{% if product.img %}
				<img class="img" src="{{ product.img }}" alt="None">
			{% endif %}

			<h2>{{product.name}}</h2>
			{{product.description}}
			<div style="width:100%;">

				<h1>${{product.price}}</h1>

			</div>
			<div id="btn-add-cart" class="buy">
					<h1>Ielikt grozā</h1>
			</div>
		</div>
	<script>	
		var btnAddCart = document.getElementById('btn-add-cart');
		btnAddCart.addEventListener('click', function() {
			fetch('/addProductToCart', {
					method: 'POST',
					headers: {
						'Accept': 'application/json',
						'Content-Type': 'application/json'
					},
					body: JSON.stringify({
						'cart_id': parseInt(getCookie('cart_id'), 10),
						'product_id': {{product.id}}
					})
			}).then(response => {
				alert("Produkts pievienots grozam");
			})
		});

	</script>
{% endblock %}
