From bb37251f9a0fa6026906709382f78dacbdbca4f3 Mon Sep 17 00:00:00 2001 From: Steven Cassidy Date: Sat, 9 Jan 2016 12:25:48 -0500 Subject: [PATCH 1/2] Convert the cat model to use $resource and promises. --- index.html | 2 +- js/controllers.js | 5 ++-- js/factories/cat.js | 68 ++++++++++++++++++++++++++++----------------- 3 files changed, 46 insertions(+), 29 deletions(-) diff --git a/index.html b/index.html index 680646f..472be89 100644 --- a/index.html +++ b/index.html @@ -45,7 +45,7 @@

My kittens

Name:{{cat.name}}
Breed: {{cat.breed_name}}
-
Born on: {{cat.bornOn | date : 'dd-MMM-yyyy'}}
+
Born on: {{cat.getBornOn() | date : 'dd-MMM-yyyy'}}
Age: {{cat.getAge()}}
diff --git a/js/controllers.js b/js/controllers.js index 551761f..d960971 100644 --- a/js/controllers.js +++ b/js/controllers.js @@ -3,8 +3,9 @@ angular.module('steven').controller('MainController', $scope.breeds = Breed.all(); console.log('Breed 1', Breed.find(1)); + console.log('Cat 1', Cat.find(1)); - Cat.getCats() + Cat.all() // we've made Cat.all return a promise using ngResource.$promise() .then(function(cats){ $scope.allCats = cats; $scope.showMatches(); @@ -17,7 +18,7 @@ angular.module('steven').controller('MainController', }; $scope.addNewCat = function() { - Cat.create($scope.newCat).then(function(savedCat){ + new Cat($scope.newCat).save().then(function(savedCat){ $scope.allCats.unshift(savedCat); $scope.showMatches(); }); diff --git a/js/factories/cat.js b/js/factories/cat.js index dd0960b..b079319 100644 --- a/js/factories/cat.js +++ b/js/factories/cat.js @@ -1,41 +1,57 @@ -angular.module('steven').factory('Cat', function($http) { +angular.module('steven').factory('Cat', function($resource) { - var apiUrl = 'https://stark-harbor-5038.herokuapp.com/cats'; + var apiUrl = 'https://stark-harbor-5038.herokuapp.com/cats/:id'; + var Cat = $resource(apiUrl, { id: '@id' }, { + create: { + method: 'POST' + }, + update: { + method: 'PATCH' // this method issues a PATCH request + } + }); - var Cat = function(json) { - angular.extend(this, json); - this.bornOn = new Date(json.born_on); - this.createdAt = new Date(json.created_at); - this.updatedAt = new Date(json.updted_at); - }; + Cat.prototype.getBornOn = function() { + /* + The API returns e.g. 2010-04-05 + new Date(2010-04-05) will be treated as a UTC date in ES5 + and a local date in ES6. We want to force treatment as local + and ignore the TZ issue altogether. "new Date(y, m, d)" + will give us a local date. In that syntax month is zero-based + so we need to subtract 1 from the month in the string. + */ + var parts = this.born_on.split('-'); + return new Date(parts[0], parts[1] - 1, parts[2]); + } Cat.prototype.getAge = function() { + var bornOn = this.getBornOn(); var today = new Date(); - var age = today.getFullYear() - this.bornOn.getFullYear(); - var m = today.getMonth() - this.bornOn.getMonth(); - if (m < 0 || (m === 0 && today.getDate() < this.bornOn.getDate())) { + var age = today.getFullYear() - bornOn.getFullYear(); + var m = today.getMonth() - bornOn.getMonth(); + if (m < 0 || (m === 0 && today.getDate() < bornOn.getDate())) { age--; } return age; }; - Cat.getCats = function() { - return $http.get('https://stark-harbor-5038.herokuapp.com/cats') - .then(function(response){ - var result = []; - angular.forEach(response.data, function(json){ - result.push(new Cat(json)); - }); - return result; - }); + Cat.all = function() { + return Cat.query().$promise; }; - Cat.create = function(catProps) { - return $http.post('https://stark-harbor-5038.herokuapp.com/cats', catProps) - .then(function(response){ - return new Cat(response.data); - }); - }; + Cat.find = function(id) { + return Cat.get({id: id}).$promise; + } + + Cat.prototype.save = function() { + if (this.id) { + console.log('updating'); + return this.$update(); + } else { + console.log('creating'); + return this.$save(); + } + } + return Cat; }); From afd629bf1fbcd3a8e4a51f5428e976a6f1aed0b5 Mon Sep 17 00:00:00 2001 From: Steven Cassidy Date: Thu, 28 Jan 2016 21:11:45 -0500 Subject: [PATCH 2/2] Fix comment --- js/factories/breed.js | 4 ++-- js/factories/cat.js | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/js/factories/breed.js b/js/factories/breed.js index 27d5f68..309544c 100644 --- a/js/factories/breed.js +++ b/js/factories/breed.js @@ -2,13 +2,13 @@ angular.module('steven').factory('Breed', function($resource) { var Breed = $resource('https://stark-harbor-5038.herokuapp.com/breeds/:id', { id: '@id' }, { // Add the PATCH method for update. ng-resource by default - // supplies only a save() which maps to a POST. We use that for + // supplies only a save() which maps to a POST. We use that for // create and use this update() for updates. create: { method: 'POST' }, update: { - method: 'PATCH' // this method issues a PATCH request + method: 'PATCH' } }); diff --git a/js/factories/cat.js b/js/factories/cat.js index b079319..2384d04 100644 --- a/js/factories/cat.js +++ b/js/factories/cat.js @@ -6,7 +6,7 @@ angular.module('steven').factory('Cat', function($resource) { method: 'POST' }, update: { - method: 'PATCH' // this method issues a PATCH request + method: 'PATCH' } });