refactor: moving routes into core, improved bundle loader

public/app/app.js

@@ -74,7 +74,6 @@ function (angular, $, _, appLevelRequire) {
     'features/all',
     'features/all',
     'controllers/all',
     'controllers/all',
     'components/partials',
     'components/partials',
-    'routes/all',
   ];
   ];
 
 
   app.boot = function() {
   app.boot = function() {

public/app/core/core.ts

@@ -14,11 +14,12 @@
 ///<amd-dependency path="./directives/tags" />
 ///<amd-dependency path="./directives/tags" />
 ///<amd-dependency path="./directives/topnav" />
 ///<amd-dependency path="./directives/topnav" />
 ///<amd-dependency path="./directives/value_select_dropdown" />
 ///<amd-dependency path="./directives/value_select_dropdown" />
+///<amd-dependency path="./routes/all" />
 
 
 export * from './directives/array_join'
 export * from './directives/array_join'
 export * from './directives/give_focus'
 export * from './directives/give_focus'
 
 
-export * from './routes/module_loader'
+export * from './routes/bundle_loader'
 export * from './filters/filters'
 export * from './filters/filters'
 
 
 
 

public/app/core/core_module.ts

@@ -2,4 +2,4 @@
 
 
 import angular = require('angular');
 import angular = require('angular');
 
 
-export = angular.module('grafana.core', []);
+export = angular.module('grafana.core', ['ngRoute']);

public/app/routes/all.js → public/app/core/routes/all.js

 define([
 define([
   'angular',
   'angular',
-  '../core/core',
-  './dashLoadControllers',
-], function(angular, core) {
+  '../core_module',
+  './bundle_loader',
+  './dashboard_loaders',
+], function(angular, coreModule, BundleLoader) {
   "use strict";
   "use strict";
 
 
-  var module = angular.module('grafana.routes');
-
-  module.config(function($routeProvider, $locationProvider) {
+  coreModule.config(function($routeProvider, $locationProvider) {
     $locationProvider.html5Mode(true);
     $locationProvider.html5Mode(true);
 
 
+    var loadOrgBundle = new BundleLoader.BundleLoader('features/org/all');
+
     $routeProvider
     $routeProvider
       .when('/', {
       .when('/', {
         templateUrl: 'app/partials/dashboard.html',
         templateUrl: 'app/partials/dashboard.html',
@@ -42,37 +43,37 @@ define([
       .when('/datasources', {
       .when('/datasources', {
         templateUrl: 'app/features/org/partials/datasources.html',
         templateUrl: 'app/features/org/partials/datasources.html',
         controller : 'DataSourcesCtrl',
         controller : 'DataSourcesCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/datasources/edit/:id', {
       .when('/datasources/edit/:id', {
         templateUrl: 'app/features/org/partials/datasourceEdit.html',
         templateUrl: 'app/features/org/partials/datasourceEdit.html',
         controller : 'DataSourceEditCtrl',
         controller : 'DataSourceEditCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/datasources/new', {
       .when('/datasources/new', {
         templateUrl: 'app/features/org/partials/datasourceEdit.html',
         templateUrl: 'app/features/org/partials/datasourceEdit.html',
         controller : 'DataSourceEditCtrl',
         controller : 'DataSourceEditCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/org', {
       .when('/org', {
         templateUrl: 'app/features/org/partials/orgDetails.html',
         templateUrl: 'app/features/org/partials/orgDetails.html',
         controller : 'OrgDetailsCtrl',
         controller : 'OrgDetailsCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/org/new', {
       .when('/org/new', {
         templateUrl: 'app/features/org/partials/newOrg.html',
         templateUrl: 'app/features/org/partials/newOrg.html',
         controller : 'NewOrgCtrl',
         controller : 'NewOrgCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/org/users', {
       .when('/org/users', {
         templateUrl: 'app/features/org/partials/orgUsers.html',
         templateUrl: 'app/features/org/partials/orgUsers.html',
         controller : 'OrgUsersCtrl',
         controller : 'OrgUsersCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/org/apikeys', {
       .when('/org/apikeys', {
         templateUrl: 'app/features/org/partials/orgApiKeys.html',
         templateUrl: 'app/features/org/partials/orgApiKeys.html',
         controller : 'OrgApiKeysCtrl',
         controller : 'OrgApiKeysCtrl',
-        resolve: new core.ModuleLoader("features/org/all"),
+        resolve: loadOrgBundle,
       })
       })
       .when('/profile', {
       .when('/profile', {
         templateUrl: 'app/features/profile/partials/profile.html',
         templateUrl: 'app/features/profile/partials/profile.html',

public/app/core/routes/bundle_loader.ts

+///<reference path="../../headers/require/require.d.ts" />
+
+export class BundleLoader {
+  lazy: any;
+  loadingDefer: any;
+
+  constructor(bundleName) {
+    this.lazy = ["$q", "$route", "$rootScope", ($q, $route, $rootScope) => {
+      if (this.loadingDefer) {
+        return this.loadingDefer.promise;
+      }
+
+      this.loadingDefer = $q.defer();
+
+      require([bundleName], () => {
+        this.loadingDefer.resolve();
+      });
+
+      return this.loadingDefer.promise;
+    }];
+
+  }
+}

public/app/routes/dashLoadControllers.js → public/app/core/routes/dashboard_loaders.js

 define([
 define([
-  'angular',
-  'lodash',
-  'kbn',
-  'moment',
-  'jquery',
+  '../core_module',
 ],
 ],
-function (angular) {
+function (coreModule) {
   "use strict";
   "use strict";
 
 
-  var module = angular.module('grafana.routes');
-
-  module.controller('LoadDashboardCtrl', function($scope, $routeParams, dashboardLoaderSrv, backendSrv) {
+  coreModule.controller('LoadDashboardCtrl', function($scope, $routeParams, dashboardLoaderSrv, backendSrv) {
 
 
     if (!$routeParams.slug) {
     if (!$routeParams.slug) {
       backendSrv.get('/api/dashboards/home').then(function(result) {
       backendSrv.get('/api/dashboards/home').then(function(result) {
@@ -27,7 +21,7 @@ function (angular) {
 
 
   });
   });
 
 
-  module.controller('DashFromImportCtrl', function($scope, $location, alertSrv) {
+  coreModule.controller('DashFromImportCtrl', function($scope, $location, alertSrv) {
     if (!window.grafanaImportDashboard) {
     if (!window.grafanaImportDashboard) {
       alertSrv.set('Not found', 'Cannot reload page with unsaved imported dashboard', 'warning', 7000);
       alertSrv.set('Not found', 'Cannot reload page with unsaved imported dashboard', 'warning', 7000);
       $location.path('');
       $location.path('');
@@ -39,7 +33,7 @@ function (angular) {
     }, $scope);
     }, $scope);
   });
   });
 
 
-  module.controller('NewDashboardCtrl', function($scope) {
+  coreModule.controller('NewDashboardCtrl', function($scope) {
     $scope.initDashboard({
     $scope.initDashboard({
       meta: { canStar: false, canShare: false },
       meta: { canStar: false, canShare: false },
       dashboard: {
       dashboard: {

public/app/core/routes/module_loader.ts

-///<reference path="../../headers/require/require.d.ts" />
-
-export class ModuleLoader {
-  lazy: any;
-
-  constructor(moduleName) {
-
-    this.lazy = ["$q", "$route", "$rootScope", function($q, $route, $rootScope) {
-      var defered = $q.defer();
-
-      require([moduleName], function () {
-        defered.resolve();
-      });
-
-      return defered.promise;
-    }];
-
-  }
-}

tasks/options/requirejs.js

@@ -58,7 +58,6 @@ module.exports = function(config,grunt) {
           'services/all',
           'services/all',
           'features/all',
           'features/all',
           'controllers/all',
           'controllers/all',
-          'routes/all',
           'components/partials',
           'components/partials',
           // bundle the datasources
           // bundle the datasources
           'plugins/datasource/grafana/datasource',
           'plugins/datasource/grafana/datasource',