Your RemoteDataStore module is complete. It is time to replace your DataStore instance with a RemoteDataStore instance.

Open main.js. Begin by importing RemoteDataStore from the App namespace.

(function (window) {
  'use strict';
  var FORM_SELECTOR = '[data-coffee-order="form"]';
  var CHECKLIST_SELECTOR = '[data-coffee-order="checklist"]';
  var App = window.App;
  var Truck = App.Truck;
  var DataStore = App.DataStore;
  var RemoteDataStore = App.RemoteDataStore;
  var FormHandler = App.FormHandler;
...

Also, add a new variable called SERVER_URL and assign it a string with the URL of the CoffeeRun test server.

(function (window) {
  'use strict';
  var FORM_SELECTOR = '[data-coffee-order="form"]';
  var CHECKLIST_SELECTOR = '[data-coffee-order="checklist"]';
  var SERVER_URL = 'http://coffeerun-v2-rest-api.herokuapp.com/api/coffeeorders';
  var App = window.App;
  var Truck = App.Truck;
  var DataStore = App.DataStore;
  var RemoteDataStore = App.RemoteDataStore;
...

Next, create a new instance of RemoteDataStore, passing it SERVER_URL.

...
  var RemoteDataStore = App.RemoteDataStore;
  var FormHandler = App.FormHandler;
  var Validation = App.Validation;
  var CheckList = App.CheckList;
  var remoteDS = new RemoteDataStore(SERVER_URL);
  var webshim = window.webshim;
  var myTruck = new Truck('ncc-1701', new DataStore());
  window.myTruck = myTruck;
...

Finally, instead of passing the Truck constructor a new instance of DataStore, pass it remoteDS. Because DataStore and RemoteDataStore have methods with the same names and take (mostly) the same arguments, this change will work seamlessly.

...
  var RemoteDataStore = App.RemoteDataStore;
  var FormHandler = App.FormHandler;
  var Validation = App.Validation;
  var CheckList = App.CheckList;
  var remoteDS = new RemoteDataStore(SERVER_URL);
  var webshim = window.webshim;
  var myTruck = new Truck('ncc-1701', new DataStore()); remoteDS);
  window.myTruck = myTruck;
...

Save your changes and go back to the browser. Enter some coffee order information and submit the form. Keep the network panel open while you do so. You should see network transactions for every coffee order you add through the form or deliver via the checklist (Figure 13.12).

Figure 13.12  Saving coffee orders to the remote server

Congratulations! CoffeeRun is fully functional and is integrated with a remote web service.

The next chapter is the final one for CoffeeRun. It does not add any new features. Instead, it focuses on refactoring your existing code so you can learn a new pattern for working with asynchronous code.