adapt application to deal with persisted data

assets/js/apps/contacts/list/list_controller.js

@@ -12,7 +12,7 @@ ContactManager.module("ContactsApp.List", function(List, ContactManager, Backbon
       });
 
       contactsListView.on("itemview:contact:delete", function(childView, model){
-        contacts.remove(model);
+        model.destroy();
       });
 
       ContactManager.mainRegion.show(contactsListView);

assets/js/apps/contacts/show/show_controller.js

@@ -1,12 +1,11 @@
 ContactManager.module("ContactsApp.Show", function(Show, ContactManager, Backbone, Marionette, $, _){
   Show.Controller = {
     showContact: function(id){
-      var contacts = ContactManager.request("contact:entities");
-      var model = contacts.get(id);
+      var contact = ContactManager.request("contact:entity", id);
       var contactView;
-      if(model !== undefined){
+      if(contact !== undefined){
         contactView = new Show.Contact({
-          model: model
+          model: contact
         });
       }
       else{

assets/js/entities/contact.js

@@ -1,31 +1,53 @@
 ContactManager.module("Entities", function(Entities, ContactManager, Backbone, Marionette, $, _){
-  Entities.Contact = Backbone.Model.extend({});
+  Entities.Contact = Backbone.Model.extend({
+    urlRoot: "contacts"
+  });
+
+  Entities.configureStorage(Entities.Contact);
 
   Entities.ContactCollection = Backbone.Collection.extend({
+    url: "contacts",
     model: Entities.Contact,
     comparator: "firstName"
   });
 
-  var contacts;
+  Entities.configureStorage(Entities.ContactCollection);
 
   var initializeContacts = function(){
     contacts = new Entities.ContactCollection([
       { id: 1, firstName: "Alice", lastName: "Arten", phoneNumber: "555-0184" },
       { id: 2, firstName: "Bob", lastName: "Brigham", phoneNumber: "555-0163" },
       { id: 3, firstName: "Charlie", lastName: "Campbell", phoneNumber: "555-0129" }
     ]);
+    contacts.forEach(function(contact){
+      contact.save();
+    });
+    return contacts;
   };
 
   var API = {
     getContactEntities: function(){
-      if(contacts === undefined){
-        initializeContacts();
+      var contacts = new Entities.ContactCollection();
+      contacts.fetch();
+      if(contacts.length === 0){
+        // if we don't have any contacts yet, create some for convenience
+        return initializeContacts();
       }
       return contacts;
+    },
+
+    getContactEntity: function(contactId){
+      var contact = new Entities.Contact({id: contactId});
+      contact.fetch();
+      return contact;
     }
   };
 
   ContactManager.reqres.setHandler("contact:entities", function(){
     return API.getContactEntities();
   });
+
+  ContactManager.reqres.setHandler("contact:entity", function(id){
+    return API.getContactEntity(id);
+  });
 });