<!doctype html>
<html lang='en' ng-app='ShoppingModule'>
  <head>
    <title>Twój koszyk na zakupy</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script>
    <link href="bootstrap.css" rel="stylesheet">
  </head>

  <body ng-controller="ShoppingController">
    <h1>Zakupy!</h1>
    <table>
      <tr ng-repeat="item in items">
        <td>{{item.title}}</td>
        <td>{{item.description}}</td>
        <td>{{item.price | currency}}</td>
      </tr>
    </table>
    <script>
      function ShoppingController($scope, Items) {
        $scope.items = Items.query();
      }

      var shoppingModule = angular.module('ShoppingModule', []);

      // Konfiguracja funkcji factory() odpowiedzialnej za utworzenie interfejsu Items
      // do obsługi bazy danych znajdującej się po stronie serwera.
      shoppingModule.factory('Items', function() {
        var items = {};
        items.query = function() {
          // W rzeczywistej aplikacji dane powinny być pobierane z serwera...
          return [
            {title: 'Farby', description: 'Pudełka pełne farb', price: 3.95},
            {title: 'Sukienka w kropki', description: 'Kropki na sukience', price: 2.95},
            {title: 'Kryształ górski', description: 'Niewielkie kryształki z gór', price: 6.95}
          ];
        };
        return items;
      });
    </script>
  </body>
</html>
