Permalink
Browse files

The Backend

  • Loading branch information...
mraible committed Jan 29, 2015
1 parent 9792a0f commit e9c277a50606d7ebaf9bcefa46f5942e2edf7ecf
Showing with 119 additions and 5 deletions.
  1. +1 −1 app/app.js
  2. +3 −0 app/index.html
  3. +20 −1 app/search/index.html
  4. +77 −0 app/search/mock-api.js
  5. +16 −2 app/search/search.js
  6. +2 −1 bower.json
View
@@ -1,7 +1,7 @@
'use strict';
// Declare app level module which depends on views, and components
-angular.module('myApp', [
+angular.module('myApp', ['ngMockE2E',
'ngRoute',
'myApp.view1',
'myApp.view2',
View
@@ -34,10 +34,13 @@
-->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
+ <script src="bower_components/angular-mocks/angular-mocks.js"></script>
+ <script src="bower_components/jquery/jquery.js"></script>
<script src="app.js"></script>
<script src="view1/view1.js"></script>
<script src="view2/view2.js"></script>
<script src="search/search.js"></script>
+ <script src="search/mock-api.js"></script>
<script src="components/version/version.js"></script>
<script src="components/version/version-directive.js"></script>
<script src="components/version/interpolate-filter.js"></script>
View
@@ -1,4 +1,23 @@
<form ng-submit="search()">
<input type="search" name="search" ng-model="term">
<button>Search</button>
-</form>
+</form>
+
+<table ng-show="searchResults.length" style="width: 100%">
+ <thead>
+ <tr>
+ <th>Name</th>
+ <th>Phone</th>
+ <th>Address</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr ng-repeat="person in searchResults">
+ <td>{{person.name}}</td>
+ <td>{{person.phone}}</td>
+ <td>{{person.address.street}}<br/>
+ {{person.address.city}}, {{person.address.state}} {{person.address.zip}}
+ </td>
+ </tr>
+ </tbody>
+</table>
View
@@ -0,0 +1,77 @@
+// We will be using backend-less development
+// $http uses $httpBackend to make its calls to the server
+// $resource uses $http, so it uses $httpBackend too
+// We will mock $httpBackend, capturing routes and returning data
+angular.module('myApp')
+ .service('ServerDataModel', function ServerDataModel() {
+ this.data = [
+ {
+ id: 1,
+ name: "Peyton Manning",
+ phone: "(303) 567-8910",
+ address: {
+ street: "1234 Main Street",
+ city: "Greenwood Village",
+ state: "CO",
+ zip: "80111"
+ }
+ },
+ {
+ id: 2,
+ name: "Demaryius Thomas",
+ phone: "(720) 213-9876",
+ address: {
+ street: "5555 Marion Street",
+ city: "Denver",
+ state: "CO",
+ zip: "80202"
+ }
+ },
+ {
+ id: 3,
+ name: "Von Miller",
+ phone: "(917) 323-2333",
+ address: {
+ street: "14 Mountain Way",
+ city: "Vail",
+ state: "CO",
+ zip: "81657"
+ }
+ }
+ ];
+
+ this.getData = function () {
+ return this.data;
+ };
+
+ this.search = function (term) {
+ if (term == "" || term == "*") {
+ return this.getData();
+ }
+ // find the name that matches the term
+ var list = $.grep(this.getData(), function (element, index) {
+ term = term.toLowerCase();
+ return (element.name.toLowerCase().match(term));
+ });
+
+ if (list.length === 0) {
+ return [];
+ } else {
+ return list;
+ }
+ };
+ })
+ .run(function ($httpBackend, ServerDataModel) {
+
+ $httpBackend.whenGET(/\/search\/\w+/).respond(function (method, url, data) {
+ // parse the matching URL to pull out the term (/search/:term)
+ var term = url.split('/')[2];
+
+ var results = ServerDataModel.search(term);
+
+ return [200, results, {Location: '/search/' + term}];
+ });
+
+ $httpBackend.whenGET(/search\/index.html/).passThrough();
+ $httpBackend.whenGET(/view/).passThrough();
+ });
View
@@ -8,6 +8,20 @@ angular.module('myApp.search', ['ngRoute'])
})
}])
- .controller('SearchController', function () {
- console.log("In Search Controller...");
+ .controller('SearchController', function ($scope, SearchService) {
+ $scope.search = function () {
+ console.log("Search term is: " + $scope.term);
+ SearchService.query($scope.term).then(function (response) {
+ $scope.searchResults = response.data;
+ });
+ };
+ })
+
+ .factory('SearchService', function ($http) {
+ var service = {
+ query: function (term) {
+ return $http.get('/search/' + term);
+ }
+ };
+ return service;
});
View
@@ -10,6 +10,7 @@
"angular-route": "1.2.x",
"angular-loader": "1.2.x",
"angular-mocks": "~1.2.x",
- "html5-boilerplate": "~4.3.0"
+ "html5-boilerplate": "~4.3.0",
+ "jquery": "~1.10.x"
}
}

0 comments on commit e9c277a

Please sign in to comment.