better rpc tracking and add user

mgasner · Nov 10, 2017 · 3d9f620 · 3d9f620
1 parent 64f2ff2
commit 3d9f620
Show file tree

Hide file tree

Showing 11 changed files with 221 additions and 23 deletions.
diff --git a/www/js/app.js b/www/js/app.js
@@ -11,7 +11,8 @@ angular.module(
  'ngResource',
  'treephone.controllers',
  'treephone.services',
- 'LocalStorageModule'])
+ 'LocalStorageModule',
+ 'angularSpinner'])
 
 .run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
@@ -29,12 +30,29 @@ angular.module(
 
 .constant('_', window._)
 
+.factory('httpServiceUnavailableInterceptor', function($q, $injector) {
+ return {
+ 'responseError': function (response) {
+ if (response.status === 503) {
+ return $timeout(function () {
+ var $http = $injector.get('$http');
+ return $http(response.config);
+ }, 750)
+ }
+ return $q.reject(response);
+ }
+ }
+})
 // config parameters
 
 .constant(
  'api_root',
  'https://dandelion-phonetree.herokuapp.com')
 
+.config(function($httpProvider) {
+ $httpProvider.interceptors.push('httpServiceUnavailableInterceptor');
+})
+
 .config(function($stateProvider, $urlRouterProvider) {
 
  // Ionic uses AngularUI Router which uses the concept of states
@@ -75,10 +93,30 @@ angular.module(
  })
 
  .state('tab.add', {
- url: '/add',
+ url: '/add/1',
+ views: {
+ 'tab-add': {
+ templateUrl: 'templates/tab-add-1.html',
+ controller: 'AddCtrl'
+ }
+ }
+ })
+
+ .state('tab.add-2', {
+ url: '/add/2',
+ views: {
+ 'tab-add': {
+ templateUrl: 'templates/tab-add-2.html',
+ controller: 'AddCtrl'
+ }
+ }
+ })
+
+ .state('tab.add-3', {
+ url: '/add/3',
  views: {
  'tab-add': {
- templateUrl: 'templates/tab-add.html',
+ templateUrl: 'templates/tab-add-3.html',
  controller: 'AddCtrl'
  }
  }

diff --git a/www/js/controllers.js b/www/js/controllers.js
@@ -2,7 +2,8 @@ angular.module('treephone.controllers', [])
 
 .controller(
  'LoginCtrl',
- function($scope, $location, $http, Auth, api_root) {
+ function($scope, $location, $http, Rpc, Auth, api_root) {
+ $scope.rpc = Rpc;
  $scope.submitLogin = function(login) {
  Auth.setPhoneNumber(login.tel);
  $http.post(
@@ -21,7 +22,8 @@ angular.module('treephone.controllers', [])
 
 .controller(
  'TfaCtrl',
- function($scope, $location, $http, Auth, Friends, api_root) {
+ function($scope, $location, $http, Rpc, Auth, Friends, api_root) {
+ $scope.rpc = Rpc;
  $scope.submitTfa = function (tfa) {
  $http.post(
  api_root + '/sessions',
@@ -45,24 +47,53 @@ angular.module('treephone.controllers', [])
 })
 
 .controller('AddCtrl', function($scope, $location, Friends, Auth, $anchorScroll) {
+ var next, back;
+ if ($location.url() == '/tab/add/1') {
+ next = '/tab/add/2';
+ back = '/tab/friends';
+ } else if ($location.url() == '/tab/add/2') {
+ next = '/tab/add/3';
+ back = '/tab/add/1';
+ } else {
+ next = '/tab/friends';
+ back = '/tab/add/2'
+ }
+
+ console.log(Friends.editing);
+
+
  $scope.addContact = function (contact) {
+ console.log(next);
  Friends.add(contact, Auth.getUserId()).then(
- function () { $location.path('/tab/friends'); },
- function () { $location.path('/tab/friends'); }
+ function (contact) {
+ Friends.editing = contact.uid;
+ console.log(next);
+ $location.path(next); },
+ // TODO should pop a modal
+ function () { return; }
+ )
+ };
+
+ $scope.editContact = function (contact) {
+ console.log('editing...');
+ contact.uid = Friends.editing;
+ console.log(contact)
+ Friends.edit(contact).then(
+ function () { $location.path(next); },
+ // TODO should pop a modal
+ function () { return; }
  )
  };
- $scope.scrollTo = function (hash) {
- return;
- // $location.hash(hash);
- // $anchorScroll();
- }
 })
 
-.controller('DashCtrl', function($scope, $location, Auth, Friends) {
+.controller('DashCtrl', function($scope, $location, Rpc, Auth, Friends) {
  $scope.go = function ( path ) {
  console.log(path);
  $location.path( path );
  };
+
+ $scope.rpc = Rpc;
+
  console.log('getting user...');
  Friends.get(Auth.getUserId()).then(
  function (user) {

diff --git a/www/js/services.js b/www/js/services.js
@@ -1,5 +1,19 @@
 angular.module('treephone.services', [])
 
+.factory('Rpc', function () {
+
+ return {
+ pending: false,
+ error: false,
+ setPending: function (status) {
+ this.pending = status;
+ },
+ setError: function (status) {
+ this.error = status;
+ } 
+ }
+})
+
 .factory('Auth', function($resource, localStorageService) {
  var _phoneNumber;
  var _sessionId;
@@ -15,6 +29,8 @@ angular.module('treephone.services', [])
  };
 
  return {
+ editing: undefined,
+
  setPhoneNumber: function (phoneNumber) {
  _phoneNumber = phoneNumber;
  localStorageService.set('_phoneNumber', phoneNumber);
@@ -51,7 +67,7 @@ angular.module('treephone.services', [])
  }
 })
 
-.factory('Friends', function($resource, $http, Auth, api_root, _) {
+.factory('Friends', function($resource, $http, Rpc, Auth, api_root, _) {
 
  return {
  get: function(friendId) {
@@ -60,14 +76,19 @@ angular.module('treephone.services', [])
  url: api_root + '/users/' + friendId,
  headers: Auth.getHeaders()
  };
+ Rpc.setPending(true);
+ console.log(Rpc);
  var promise = $http(req)
  .then(
  function (result) {
  friend = result.data;
+ Rpc.setPending(false);
  return friend;
  },
  function (result) {
  console.log(result)
+ Rpc.setPending(false);
+ Rpc.setError(true);
  return {};});
  return promise;
  },
@@ -77,14 +98,18 @@ angular.module('treephone.services', [])
  url: api_root + '/users/' + parentId + '/children',
  headers: Auth.getHeaders()
  }
+ Rpc.setPending(true);
  var promise = $http(req)
  .then(
  function (result) {
  friends = result.data;
+ Rpc.setPending(false);
  return friends;
  },
  function (result) {
  console.log(result);
+ Rpc.setPending(false);
+ Rpc.setError(true);
  return [];});
  return promise;
  },
@@ -96,12 +121,16 @@ angular.module('treephone.services', [])
  headers: Auth.getHeaders(),
  data: friend
  }
+ Rpc.setPending(true);
  var promise = $http(req)
  .then(
  function (result) {
+ Rpc.setPending(false);
  return result.data;
  },
  function (result) {
+ Rpc.setPending(false);
+ Rpc.setError(true);
  return {};
  }
  );
@@ -115,12 +144,16 @@ angular.module('treephone.services', [])
  headers: Auth.getHeaders(),
  data: friend
  }
+ Rpc.setPending(true);
  var promise = $http(req)
  .then(
  function (result) {
+ Rpc.setPending(false);
  return result.data;
  },
  function (result) {
+ Rpc.setPending(false);
+ Rpc.setError(true);
  return {};
  }
  );
@@ -133,10 +166,14 @@ angular.module('treephone.services', [])
  url: api_root + '/users/' + friendId + '/csv',
  headers: Auth.getHeaders()
  };
+ Rpc.setPending(true);
  var promise = $http(req)
  .then(
- function () { return {};},
- function () { return {};}
+ function () { Rpc.setPending(false);},
+ function () { 
+ Rpc.setPending(false);
+ Rpc.setError(true);
+ }
  );
  return promise;
  },
@@ -147,10 +184,14 @@ angular.module('treephone.services', [])
  url: api_root + '/users/' + friendId + '/invite',
  headers: Auth.getHeaders()
  };
+ Rpc.setPending(true);
  var promise = $http(req)
  .then(
- function () { return {};},
- function () { return {};}
+ function () { Rpc.setPending(false);},
+ function () { 
+ Rpc.setPending(false);
+ Rpc.setError(true);
+ }
  );
  return promise;
  },

diff --git a/www/templates/friend-detail.html b/www/templates/friend-detail.html
@@ -9,12 +9,20 @@
  <small><strong>Mobile Phone</strong></small><br />
  <i class="icon icon ion-call" style="color:green"></i><a href="{{telephoneLink}}">{{formattedPhone}}</a>
  </ion-item>
+ <ion-item>
+ <small><strong>Email Address</strong></small><br />
+ {{friend.email_address}}
+ </ion-item>
  <ion-item>
  <small><strong>Address</strong></small><br />
  {{friend.address_1}}<br />
  {{friend.address_2 || ""}}<br />
  {{friend.city}}, {{friend.state}} {{friend.zip_code}}
  </ion-item>
+ <ion-item>
+ <small><strong>Notes</strong></small><br />
+ {{friend.freeform_notes}}
+ </ion-item>
  </ion-list>
  <h4>{{friend.first_name}} has {{friend.outdegree}} direct contacts
  and {{friend.network_size}} people in their network.</h4>

diff --git a/www/templates/login.html b/www/templates/login.html
@@ -6,7 +6,7 @@ <h3>Please enter your phone number</h3>
  <label class="item item-input">
  <input type="tel" placeholder="XXX-XXX-XXXX" ng-model="login.tel">
  </label><br/>
- <button ion-button round>Get Code</button>
+ <button ion-button round>{{rpc.pending ? '...' : 'Get Code'}}</button>
  </form>
  </ion-content>
 </ion-view>
diff --git a/www/templates/tab-add-1.html b/www/templates/tab-add-1.html
@@ -0,0 +1,30 @@
+<ion-view title="Add Contact" cache-view="false">
+ <ion-content class="padding">
+ <form ng-submit="addContact(contact)">
+ <small><strong>Name</strong></small>
+ <label class="item item-input">
+ <input type="text" placeholder="First"
+ ng-model="contact.first_name"
+ id="first_name">
+ </label>
+ <label class="item item-input">
+ <input type="text" placeholder="Last"
+ ng-model="contact.last_name"
+ id="last_name">
+ </label><br/>
+ <small><strong>Mobile Phone</strong></small>
+ <label class="item item-input">
+ <input type="tel" placeholder="XXX-XXX-XXXX"
+ ng-model="contact.phone_number"
+ id="phone_number">
+ </label><br />
+ <small><strong>Email Address</strong></small>
+ <label class="item item-input">
+ <input type="text" placeholder="[email protected]"
+ ng-model="contact.email_address"
+ id="phone_number">
+ </label><br />
+ <button ion-button round>{{ rpc.pending ? '...' : 'Next' }}</button>
+ </form>
+ </ion-content>
+</ion-view>
diff --git a/www/templates/tab-add-2.html b/www/templates/tab-add-2.html
@@ -0,0 +1,34 @@
+<ion-view title="Add Contact" cache-view="false">
+ <ion-content class="padding">
+ <form ng-submit="editContact(contact)">
+ <small><strong>Address</strong></small>
+ <label class="item item-input">
+ <input type="text" placeholder="Address Line 1"
+ ng-model="contact.address_1"
+ id="address_1">
+ </label><br />
+ <label class="item item-input">
+ <input type="text" placeholder="Address Line 2"
+ ng-model="contact.address_2"
+ id="address_2">
+ </label><br />
+ <label class="item item-input">
+ <input type="text"
+ placeholder="City"
+ ng-model="contact.city"
+ id="city">
+ <input type="text"
+ placeholder="State"
+ ng-model="contact.state"
+ id="state">
+ <input type="tel"
+ placeholder="Zip"
+ ng-model="contact.zip_code"
+ id="zip_code"
+ ng-maxlength="5"
+ size="5">
+ </label><br/>
+ <button ion-button round>{{ rpc.pending ? '...' : 'Next' }}</button>
+ </form>
+ </ion-content>
+</ion-view>