Merge pull request #369 from CodeNow/Instance-list-fetch-speed-improvements

Improving the instance list fetching and so much more!

Author: SomeKittens

client/config/routes.js

@@ -12,7 +12,13 @@ module.exports = [
       },
     }
   },
-
+  {
+    state: 'base',
+    abstract: true,
+    url: '^/:userName',
+    templateUrl: 'viewInstanceLayout',
+    controller: 'ControllerApp'
+  },
   {
     state: 'instance',
     abstract: true,

client/controllers/abstractLayouts/controllerInstanceLayout.js

@@ -5,13 +5,70 @@ require('app')
  */
 function ControllerInstanceLayout(
   configLogoutURL,
+  fetchUser,
+  fetchOrgs,
+  $stateParams,
+  QueryAssist,
+  $state,
+  $rootScope,
+  keypather,
+  async,
   $scope
 ) {
+  var thisUser;
+  fetchUser(function(err, user) {
+    thisUser = user;
+  });
 
+  function fetchInstances(account) {
+    async.series([
+      function (cb) {
+        $scope.dataInstanceLayout.state.loadingInstances = true;
+        $rootScope.safeApply(cb);
+      },
+      function (cb) {
+        new QueryAssist(thisUser, cb)
+          .wrapFunc('fetchInstances', cb)
+          .query({
+            githubUsername: account
+          })
+          .cacheFetch(function (instances, cached, cb) {
+            if (account === keypather.get($rootScope, 'dataApp.data.activeAccount.oauthName()')) {
+              if ($rootScope.dataApp.data.instances !== instances) {
+                $rootScope.dataApp.data.instances = instances;
+              }
+              $scope.dataInstanceLayout.state.loadingInstances = false;
+              $rootScope.safeApply(cb);
+            } else {
+              cb();
+            }
+          })
+          .resolve(function (err, projects, cb) {
+            cb(err);
+          })
+          .go();
+      }
+    ], function (err) {
+      if (err) { throw err; }
+    });
+  }
   var dataInstanceLayout = $scope.dataInstanceLayout = {
     data: {},
+    state: {},
     actions: {}
   };
   dataInstanceLayout.data.logoutURL = configLogoutURL();
 
+  var instanceListUnwatcher = $scope.$on('INSTANCE_LIST_FETCH', function(event, username) {
+    fetchInstances(username);
+  });
+
+  $scope.$on('$destroy', function () {
+    instanceListUnwatcher();
+  });
+
+  if (keypather.get($rootScope, 'dataApp.data.activeAccount.oauthName()')) {
+    fetchInstances(keypather.get($rootScope, 'dataApp.data.activeAccount.oauthName()'));
+  }
+
 }

client/controllers/controllerApp.js

@@ -7,26 +7,23 @@ require('app')
  * @ngInject
  */
 function ControllerApp(
-  $log,
   $scope,
-  $state,
   $rootScope,
   $window,
-  async,
   configAPIHost,
   configEnvironment,
   configLoginURL,
   configLogoutURL,
   errs,
   fetchUser,
-  keypather,
-  QueryAssist,
-  user
+  fetchOrgs,
+  keypather
 ) {
 
   var dataApp = $rootScope.dataApp = $scope.dataApp = {
     data: {},
-    actions: {}
+    actions: {},
+    state: {}
   };
 
   // used in dev-info box
@@ -41,13 +38,35 @@ function ControllerApp(
     data: {},
     actions: {}
   };
-
+  function setActiveAccount(accountName) {
+    $scope.$watch('dataApp.data.orgs', function(n) {
+      if (n) {
+        dataApp.data.instances = null;
+        var accounts = [thisUser].concat(n.models);
+        dataApp.data.activeAccount = accounts.find(function (org) {
+          return (keypather.get(org, 'oauthName().toLowerCase()') === accountName.toLowerCase());
+        });
+        if (!dataApp.data.activeAccount) {
+          dataApp.data.activeAccount = thisUser;
+        }
+        $rootScope.$broadcast('INSTANCE_LIST_FETCH', dataApp.data.activeAccount.oauthName());
+        $rootScope.safeApply();
+      }
+    });
+  }
   // shows spinner overlay
   dataApp.data.loading = false;
-  $scope.$on('$stateChangeStart', function () {
+  $scope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, error) {
+    if (!keypather.get(dataApp, 'data.activeAccount.oauthName()') ||
+        toParams.userName !== dataApp.data.activeAccount.oauthName()) {
+      setActiveAccount(toParams.userName);
+    }
     dataApp.data.loading = false;
   });
 
+  var thisUser;
+
+
   $scope.$watch(function () {
     return errs.errors.length;
   }, function(n) {
@@ -66,28 +85,22 @@ function ControllerApp(
     $scope.$broadcast('app-document-click');
   };
 
-  var thisUser,
-      thisUserOrgs;
 
-  function fetchOrgs(user, cb) {
-    thisUser = user;
-    thisUserOrgs = thisUser.fetchGithubOrgs(function (err) {
-      cb(err, thisUserOrgs);
-    });
-  }
-
-  async.waterfall([
-    fetchUser,
-    fetchOrgs
-  ], function(err, results) {
+  fetchUser(function(err, results) {
+    thisUser = results;
+    dataApp.data.user = results;
+  });
+  fetchOrgs(function(err, results) {
+    dataApp.data.orgs = results;
+    $rootScope.safeApply();
     if (err) {
       return errs.handler(err);
     }
     if ($window.heap) {
       $window.heap.identify({
         name:  thisUser.oauthName(),
         email: thisUser.attrs.email,
-        orgs:  $window.JSON.stringify(thisUserOrgs)
+        orgs:  $window.JSON.stringify(results)
       });
     }
     if ($window.initIntercom) {

client/controllers/instance/controllerInstance.js

@@ -5,18 +5,16 @@ require('app')
  */
 function ControllerInstance(
   async,
-  determineActiveAccount,
+  $filter,
   errs,
   keypather,
   OpenItems,
   QueryAssist,
-  fetchUser,
+  $rootScope,
   $scope,
   $state,
-  $log,
   $stateParams,
-  exists,
-  user
+  fetchUser
 ) {
   var dataInstance = $scope.dataInstance = {
     data: {},
@@ -38,7 +36,37 @@ function ControllerInstance(
     // in shows/hides file-menu
     in: false
   };
-
+  if (!$stateParams.instanceName) {
+    var unwatch = $rootScope.$watch('dataApp.data.instances', function (n, p) {
+      if (n !== p && n) {
+        unwatch();
+        if (n.models.length) {
+          var models = $filter('orderBy')(n.models, 'attrs.name');
+          $state.go('instance.instance', {
+            instanceName: models[0].attrs.name,
+            userName: $stateParams.userName
+          }, {location: 'replace'});
+        } else {
+          $state.go('instance.new', {
+            userName: $stateParams.userName
+          }, {location: 'replace'});
+        }
+      }
+    });
+  } else if ($stateParams.instanceName && $stateParams.userName) {
+    async.waterfall([
+      fetchUser,
+      fetchInstance
+    ], function (err) {
+      if (err) {
+        $state.go('instance.instance', {
+          instanceName: '',
+          userName: $stateParams.userName
+        }, {reload: true});
+      }
+      errs.handler(err);
+    });
+  }
   // watch showExplorer (toggle when user clicks file menu)
   // if no running container, return early (user shouldn't be able to even click
   // button in this situation)
@@ -88,68 +116,29 @@ function ControllerInstance(
     }
   }
 
-  async.waterfall([
-    determineActiveAccount,
-    function(activeAccount, cb) {
-      data.activeAccount = activeAccount;
-      $scope.safeApply();
-      cb();
-    },
-    function (cb) {
-      fetchUser(function(err, user) {
-        if (err) { return cb(err); }
-        data.user = user;
-        $scope.safeApply();
-        cb();
-      });
-    },
-    fetchInstance,
-    fetchInstances
-  ], errs.handler);
-
-  // This is to fetch the list of instances.  This is separate so the page can load quickly
-  // since it will have its instance.  Only the modals use this list
-  function fetchInstances(cb) {
-    new QueryAssist(data.user, cb)
-      .wrapFunc('fetchInstances', cb)
-      .query({
-        githubUsername: $stateParams.userName
-      })
-      .cacheFetch(function (instances, cached, cb) {
-        if (!cached && instances.models.length === 0) {
-          return cb(new Error('instance not found'));
-        }
-        data.instances = instances;
-        $scope.safeApply();
-        cb();
-      })
-      .resolve(function (err) {
-        cb(err);
-      })
-      .go();
-  }
-
-  function fetchInstance(cb) {
-    new QueryAssist(data.user, cb)
-      .wrapFunc('fetchInstances')
-      .query({
-        githubUsername: $stateParams.userName,
-        name: $stateParams.instanceName
-      })
-      .cacheFetch(function (instances, cached, cb) {
-        if (!cached && instances.models.length === 0) {
-          return cb(new Error('Instance not found'));
-        }
-        var instance = instances.models[0];
-        data.instance = instance;
-        data.instance.state = {};
-        $scope.safeApply();
-        cb();
-      })
-      .resolve(function (err) {
-        cb(err);
-      })
-      .go();
+  function fetchInstance(user, cb) {
+    if ($stateParams.instanceName && $stateParams.userName) {
+      new QueryAssist(user, cb)
+        .wrapFunc('fetchInstances')
+        .query({
+          githubUsername: $stateParams.userName,
+          name: $stateParams.instanceName
+        })
+        .cacheFetch(function (instances, cached, cb) {
+          data.instance = keypather.get(instances, 'models[0]');
+          if (!data.instance) {
+            cb(new Error('Could not find instance on server'));
+          } else {
+            data.instance.state = {};
+            $scope.safeApply();
+            cb();
+          }
+        })
+        .resolve(function (err) {
+          cb(err);
+        })
+        .go();
+    }
   }
 
   function watchForContainerBeforeDisplayTabs (container) {

client/controllers/setup/controllerNew.js

@@ -6,13 +6,11 @@ require('app')
 function ControllerNew(
   async,
   hasKeypaths,
-  QueryAssist,
   errs,
   fetchUser,
   $scope,
   $state,
-  uuid,
-  user
+  uuid
 ) {
 
   var thisUser;