Permalink
Browse files

initial commit

  • Loading branch information...
0 parents commit 5a5acedd74e27ee415a9ec309e9c24d9b7da1045 @btford committed Sep 14, 2012
@@ -0,0 +1,23 @@
+'use strict';
+
+shoppingApp.controller('CheckoutCtrl', function($scope, $location) {
+
+ // clear any items from the cart with a non-positive quantity
+ $scope.cart.forEach(function (item) {
+ if (item.quantity < 1) {
+ $scope.removeFromCart(item);
+ }
+ });
+
+ // redirect back home if there are no items in the cart
+ if ($scope.cart.length === 0) {
+ $location.url('/');
+ }
+
+ $scope.shipping = 7.88;
+
+ $scope.getTax = function (price) {
+ return Math.round(price * 5) / 100;
+ };
+
+});
@@ -0,0 +1,58 @@
+'use strict';
+
+shoppingApp.controller('MainCtrl', function($scope) {
+
+ $scope.catalog = [
+ { name: 'shoes', price: 29.99, rating: 2.8 },
+ { name: 'shirt', price: 9.99, rating: 3 },
+ { name: 'pants', price: 19.99, rating: 4.5 }
+ ];
+
+ $scope.cart = [];
+
+ $scope.addToCart = function (item) {
+ var i;
+ for (i = 0; i < $scope.cart.length; i++) {
+ if ($scope.cart[i].product === item) {
+ $scope.cart[i].quantity += 1;
+ return;
+ }
+ }
+ $scope.cart.push({
+ product: item,
+ quantity: 1
+ });
+ };
+
+ $scope.removeFromCart = function (item) {
+ var i;
+ for (i = 0; i < $scope.cart.length; i++) {
+ if ($scope.cart[i] === item) {
+ $scope.cart.splice(i, 1);
+ break;
+ }
+ }
+ };
+
+ $scope.getTotal = function () {
+ var total = 0;
+ $scope.cart.forEach(function (item) {
+ if (item.quantity > 0) {
+ total += item.product.price * item.quantity;
+ }
+ });
+ return total;
+ };
+
+ $scope.getCartCount = function () {
+ var count = 0;
+ $scope.cart.forEach(function (item) {
+ count += item.quantity;
+ });
+ return count;
+ };
+
+ $scope.clearCart = function () {
+ $scope.cart = [];
+ };
+});
@@ -0,0 +1,5 @@
+'use strict';
+
+shoppingApp.controller('OrderCtrl', function($scope) {
+ $scope.clearCart();
+});
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8"/>
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
+ <title>Angular Shopping</title>
+ <meta name="description" content=""/>
+ <meta name="viewport" content="width=device-width"/>
+ <link rel="stylesheet" href="main.css"/>
+ </head>
+ <body ng-app="shoppingApp">
+ <h1>Angular Shopping</h1>
+ <div ng-controller="MainCtrl">
+ <nav>
+ <a href="/#/">Home</a> |
+ {{getCartCount()}} items in your <a href="/#/cart">cart</a> |
+ <a href="/#/checkout">Checkout</a>
+ </nav>
+ <div class="container" ng-view></div>
+ </div>
+
+ <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
+
+ <script src="shopping.js"></script>
+ <script src="controllers/checkout.js"></script>
+ <script src="controllers/main.js"></script>
+ <script src="controllers/order.js"></script>
+ </body>
+</html>
@@ -0,0 +1,28 @@
+/* Will be compiled down to a single stylesheet with your sass files */
+
+
+body {
+ font: 14px Helvetica Neue;
+ text-rendering: optimizeLegibility;
+ margin-top: 1em;
+ overflow-y: scroll;
+ color: #333;
+}
+
+.item {
+ float: left;
+ width: 200px;
+ background: #ddd;
+ border-left: solid 2px #333;
+ margin: 5px;
+ padding: 5px;
+}
+
+a {
+ color: steelblue;
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
@@ -0,0 +1,23 @@
+'use strict';
+
+var shoppingApp = angular.module('shoppingApp', [])
+ .config(['$routeProvider', function($routeProvider) {
+ $routeProvider
+ .when('/', {
+ templateUrl: 'views/catalog.html'
+ })
+ .when('/checkout', {
+ templateUrl: 'views/checkout.html',
+ controller: 'CheckoutCtrl'
+ })
+ .when('/cart', {
+ templateUrl: 'views/cart.html'
+ })
+ .when('/order', {
+ templateUrl: 'views/order.html',
+ controller: 'OrderCtrl'
+ })
+ .otherwise({
+ redirectTo: '/'
+ });
+ }]);
@@ -0,0 +1,27 @@
+<h2>Cart</h2>
+<div ng-switch on="cart.length">
+ <div ng-switch-when="0">
+ Your cart is empty! Go buy something.
+ </div>
+ <div ng-switch-default>
+ <table>
+ <tr>
+ <th>Item</th>
+ <th>Quantity</th>
+ <th>Price</th>
+ <th>Total</th>
+ </tr>
+ <tr ng-repeat="item in cart">
+ <td>{{item.product.name}}</td>
+ <td><input ng-model="item.quantity"></input></td>
+ <td>{{item.product.price | currency}}</td>
+ <td>{{item.product.price * item.quantity | currency}}</td>
+ <td><a href ng-click="removeFromCart(item)">remove</a></td>
+ </tr>
+ </table>
+
+ <p>Total: {{getTotal() | currency}}</p>
+
+ <a href="/#/checkout">Checkout</a>
+ </div>
+</div>
@@ -0,0 +1,19 @@
+<h2>Catalog</h2>
+
+<div>
+ Sort by
+ <select ng-init="predicate='name'" ng-model="predicate">
+ <option value="name">Name</option>
+ <option value="price">Price</option>
+ <option value="rating">Rating</option>
+ </select>
+</div>
+
+<div>
+ <div class="item" ng-repeat="item in catalog | orderBy:predicate">
+ <h3>{{item.name}}</h3>
+ <img ng-src="/images/{{item.name}}.jpg" alt="{{item.name}}">
+ <p>Rating: {{item.rating}}/5</p>
+ <p>Price: {{item.price | currency}} [<a href ng-click="addToCart(item)">buy</a>]</p>
+ </div>
+</div>
@@ -0,0 +1,23 @@
+<h2>Checkout</h2>
+
+<table>
+ <tr>
+ <th>Item</th>
+ <th>Quantity</th>
+ <th>Price</th>
+ <th>Total</th>
+ </tr>
+ <tr ng-repeat="item in cart">
+ <td>{{item.product.name}}</td>
+ <td>{{item.quantity}}</td>
+ <td>{{item.product.price | currency}}</td>
+ <td>{{item.product.price * item.quantity | currency}}</td>
+ </tr>
+</table>
+<p>Total: {{getTotal() | currency}}</p>
+<p>Shipping: {{shipping | currency}}</p>
+<p>Tax: {{getTax(getTotal() + shipping) | currency}}</p>
+<p>Final: {{getTax(getTotal() + shipping) + getTotal() + shipping | currency}}</p>
+
+
+<a href="/#/order">Looks good! Place my order.</a>
@@ -0,0 +1,2 @@
+<p>Thank you for your order!</p>
+<a href="/#/">Back</a>

0 comments on commit 5a5aced

Please sign in to comment.