extends layout

block variables
	- var active = 'cart'

block title 
	|  - Shopping Cart

block content

	include _header

	.container
		.row.spacious
			div.col-sm-12
				h1 Shopping Cart
		.row.ks-beforeload.spacious
			.col-sm-12
				p Loading...
		.row.ks-afterload.spacious(ng-controller='ProductsCtrl')
			div.col-sm-3
				p.lead Thank you for your business
				p
					a(href="") Help
				p.alert.alert-warning(ng-show="lastRemoved")
					| {{lastRemoved.product.name}} Removed. 
					a(href='#', ng-show='lastRemoved', ng-click="restorePurchase(lastRemoved)") Undo.

			div.col-sm-6
				article.panel.panel-default
					.panel-heading Items in cart
					ul.list-group
						li.list-group-item(ng-repeat='purchase in purchases')
							.media
								img.media-object.img-rounded.pull-left(
									ng-src="http://images.weserv.nl/?url=s3.amazonaws.com/getkickstrap.com/2.0-static/img/{{purchase.product.img}}&h=128&w=128&t=square"
									style="width: 64px;"
								)
								.media-body
									.row
										.col-sm-6
											h4.media-heading {{purchase.product.name}}
											p.text-muted {{purchase.product.price | currency:'$'}}
											// p.text-muted(style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;") {{ (purchase.product.price * purchase.quantity) | currency:"$"}}
										.col-sm-6
											form.form-inline(role="form")
												.form-group
													label Quantity
													input.form-control(type="number", ng-model="purchase.quantity")
									hr
									p.pull-right
										a(href="#", ng-click="deletePurchase(purchase.id)") Remove
												
						li.list-group-item(ng-show='purchases.length < 1')
							em There are currently no items in your cart.
							p
								a(href="products.html") Go shopping
			div.col-sm-3
				h2 Checkout
				p.lead Total: 
					strong {{ total() | currency:'$' }}
				img.img-responsive(src="img/creditcards.gif")
				a.btn.btn-success Purchase
block foot
	include _example-growl