{% load i18n %}
<script type="text/javascript">
<!--
$(document).ready(function(){
	basket.panel = $('#basket-panel');
	
	$(document).bind("before_add.basket", function(e){
		// show loading animation
		basket.panel.find('#basket-is-loading').show();
		basket.panel.find('#basket-summary').hide();
		// replace add button with text
		var added = $(".basket-added", $(e.el).parents(".add-to-basket"));
		$(e.el).replaceWith(added);
		added.show();
	});
    
	$(document).bind("add_success.basket", function(e, data){
		$('#basket-summary').html(data);
        basket.panel.find('#basket-is-loading').hide();
        basket.panel.find('#basket-summary').show();
    });
	
   $(document).bind("add_error.basket", function(e, error){
        alert('{% trans "Error occured when addin to basket:\n" %}' + error);
        window.location.reload();
    });
});
//-->
</script>
<div id="basket-panel">
    <div id="basket-is-loading" style="display: none;"><img src="{{ STATIC_URL }}/basket/img/ajax-loader.gif" /></div>
    <div id="basket-summary">{% include 'basket/summary.html' %}</div>
</div>