From 9dec50832db8cb4740d4547371ffb0527a197bea Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Mon, 14 Sep 2015 22:54:00 +0200 Subject: [PATCH] refactor: refactoring app boot up and core structure --- public/app/app.js | 30 +++---- public/app/controllers/all.js | 2 - public/app/controllers/errorCtrl.js | 1 - public/app/controllers/pulldown.js | 42 --------- public/app/core/core.ts | 2 + public/app/core/core_module.ts | 5 ++ public/app/core/directives/array_join.ts | 3 +- public/app/core/directives/giveFocus.ts | 28 ++++++ public/app/core/filters/filters.ts | 16 ++-- public/app/directives/all.js | 1 - public/app/directives/dropdown.typeahead.js | 3 +- public/app/directives/giveFocus.js | 29 ------ public/app/directives/metric.segment.js | 3 +- public/app/directives/valueSelectDropdown.js | 3 +- .../dashboard/partials/snapshotTopNav.html | 5 +- .../features/profile/partials/profile.html | 90 +++++++++---------- public/app/panels/graph/legend.js | 3 +- public/app/panels/graph/module.js | 3 +- .../datasource/graphite/addGraphiteFunc.js | 3 +- tasks/options/tslint.js | 2 +- 20 files changed, 106 insertions(+), 168 deletions(-) delete mode 100644 public/app/controllers/pulldown.js create mode 100644 public/app/core/core_module.ts create mode 100644 public/app/core/directives/giveFocus.ts delete mode 100644 public/app/directives/giveFocus.js diff --git a/public/app/app.js b/public/app/app.js index e543b34a611..5d4e38bab91 100644 --- a/public/app/app.js +++ b/public/app/app.js @@ -1,6 +1,3 @@ -/** - * main app level module - */ define([ 'angular', 'jquery', @@ -15,25 +12,18 @@ define([ 'angular-ui', 'extend-jquery', 'bindonce', + './core/core', ], function (angular, $, _, appLevelRequire) { - "use strict"; - var app = angular.module('grafana', []), - // we will keep a reference to each module defined before boot, so that we can - // go back and allow it to define new features later. Once we boot, this will be false - pre_boot_modules = [], - // these are the functions that we need to call to register different - // features if we define them after boot time - register_fns = {}; + var app = angular.module('grafana', []); + var register_fns = {}; + var preBootModules = []; // This stores the grafana version number app.constant('grafanaVersion',"@grafanaVersion@"); - // Use this for cache busting partials - app.constant('cacheBust',"cache-bust="+Date.now()); - /** * Tells the application to watch the module, once bootstraping has completed * the modules controller, service, etc. functions will be overwritten to register directly @@ -42,8 +32,8 @@ function (angular, $, _, appLevelRequire) { * @return {[type]} [description] */ app.useModule = function (module) { - if (pre_boot_modules) { - pre_boot_modules.push(module); + if (preBootModules) { + preBootModules.push(module); } else { _.extend(module, register_fns); } @@ -51,7 +41,6 @@ function (angular, $, _, appLevelRequire) { }; app.config(function($locationProvider, $controllerProvider, $compileProvider, $filterProvider, $provide) { - // this is how the internet told me to dynamically add modules :/ register_fns.controller = $controllerProvider.register; register_fns.directive = $compileProvider.directive; register_fns.factory = $provide.factory; @@ -60,6 +49,7 @@ function (angular, $, _, appLevelRequire) { }); var apps_deps = [ + 'grafana.core', 'ngRoute', 'ngSanitize', '$strap.directives', @@ -80,7 +70,6 @@ function (angular, $, _, appLevelRequire) { }); var preBootRequires = [ - 'core/core', 'services/all', 'features/all', 'controllers/all', @@ -101,11 +90,12 @@ function (angular, $, _, appLevelRequire) { .ready(function() { angular.bootstrap(document, apps_deps) .invoke(['$rootScope', function ($rootScope) { - _.each(pre_boot_modules, function (module) { + _.each(preBootModules, function (module) { _.extend(module, register_fns); }); - pre_boot_modules = false; + preBootModules = null; + $rootScope.requireContext = appLevelRequire; $rootScope.require = function (deps, fn) { var $scope = this; diff --git a/public/app/controllers/all.js b/public/app/controllers/all.js index 3fdaf6ef3e9..1a313e6b019 100644 --- a/public/app/controllers/all.js +++ b/public/app/controllers/all.js @@ -1,8 +1,6 @@ define([ './grafanaCtrl', - './pulldown', './search', - './metricKeys', './inspectCtrl', './jsonEditorCtrl', './loginCtrl', diff --git a/public/app/controllers/errorCtrl.js b/public/app/controllers/errorCtrl.js index 9e70efb3ee4..13b64584226 100644 --- a/public/app/controllers/errorCtrl.js +++ b/public/app/controllers/errorCtrl.js @@ -1,6 +1,5 @@ define([ 'angular', - 'app', 'lodash' ], function (angular) { diff --git a/public/app/controllers/pulldown.js b/public/app/controllers/pulldown.js deleted file mode 100644 index 898d80c0479..00000000000 --- a/public/app/controllers/pulldown.js +++ /dev/null @@ -1,42 +0,0 @@ -define([ - 'angular', - 'app', - 'lodash' -], -function (angular, app, _) { - 'use strict'; - - var module = angular.module('grafana.controllers'); - - module.controller('PulldownCtrl', function($scope, $rootScope, $timeout) { - var _d = { - collapse: false, - notice: false, - enable: true - }; - - _.defaults($scope.pulldown,_d); - - $scope.init = function() { - // Provide a combined skeleton for panels that must interact with panel and row. - // This might create name spacing issues. - $scope.panel = $scope.pulldown; - $scope.row = $scope.pulldown; - }; - - $scope.toggle_pulldown = function(pulldown) { - pulldown.collapse = pulldown.collapse ? false : true; - if (!pulldown.collapse) { - $timeout(function() { - $scope.$broadcast('render'); - }); - } else { - $scope.row.notice = false; - } - }; - - $scope.init(); - - }); - -}); \ No newline at end of file diff --git a/public/app/core/core.ts b/public/app/core/core.ts index a8c74c756a8..4883464a428 100644 --- a/public/app/core/core.ts +++ b/public/app/core/core.ts @@ -1,5 +1,7 @@ export * from './directives/array_join' +export * from './directives/giveFocus' + export * from './routes/module_loader' export * from './filters/filters' diff --git a/public/app/core/core_module.ts b/public/app/core/core_module.ts new file mode 100644 index 00000000000..5de6eb1221f --- /dev/null +++ b/public/app/core/core_module.ts @@ -0,0 +1,5 @@ +/// + +import angular = require('angular'); + +export default angular.module('grafana.core', []); diff --git a/public/app/core/directives/array_join.ts b/public/app/core/directives/array_join.ts index fd88b5cfb8c..ff27a0e9e25 100644 --- a/public/app/core/directives/array_join.ts +++ b/public/app/core/directives/array_join.ts @@ -2,6 +2,7 @@ import angular = require('angular'); import _ = require('lodash'); +import coreModule from '../core_module'; export function arrayJoin() { 'use strict'; @@ -29,5 +30,5 @@ export function arrayJoin() { }; } -angular.module('grafana.directives').directive('arrayJoin', arrayJoin); +coreModule.directive('arrayJoin', arrayJoin); diff --git a/public/app/core/directives/giveFocus.ts b/public/app/core/directives/giveFocus.ts new file mode 100644 index 00000000000..12f2d57d6e7 --- /dev/null +++ b/public/app/core/directives/giveFocus.ts @@ -0,0 +1,28 @@ +/// + +import angular = require('angular'); +import coreModule from '../core_module'; + +coreModule.directive('giveFocus', function() { + return function(scope, element, attrs) { + element.click(function(e) { + e.stopPropagation(); + }); + + scope.$watch(attrs.giveFocus, function (newValue) { + if (!newValue) { + return; + } + setTimeout(function() { + element.focus(); + var domEl = element[0]; + if (domEl.setSelectionRange) { + var pos = element.val().length * 2; + domEl.setSelectionRange(pos, pos); + } + }, 200); + }, true); + }; +}); + +export default {}; diff --git a/public/app/core/filters/filters.ts b/public/app/core/filters/filters.ts index d6f32bdf272..333ecd545f6 100644 --- a/public/app/core/filters/filters.ts +++ b/public/app/core/filters/filters.ts @@ -1,20 +1,18 @@ /// -'use strict'; import angular = require('angular'); import jquery = require('jquery'); import moment = require('moment'); import _ = require('lodash'); +import coreModule from '../core_module'; -var module = angular.module('grafana.filters'); - -module.filter('stringSort', function() { +coreModule.filter('stringSort', function() { return function(input) { return input.sort(); }; }); -module.filter('slice', function() { +coreModule.filter('slice', function() { return function(arr, start, end) { if (!_.isUndefined(arr)) { return arr.slice(start, end); @@ -22,7 +20,7 @@ module.filter('slice', function() { }; }); -module.filter('stringify', function() { +coreModule.filter('stringify', function() { return function(arr) { if (_.isObject(arr) && !_.isArray(arr)) { return angular.toJson(arr); @@ -32,7 +30,7 @@ module.filter('stringify', function() { }; }); -module.filter('moment', function() { +coreModule.filter('moment', function() { return function(date, mode) { switch (mode) { case 'ago': @@ -42,7 +40,7 @@ module.filter('moment', function() { }; }); -module.filter('noXml', function() { +coreModule.filter('noXml', function() { var noXml = function(text) { return _.isString(text) ? text @@ -60,7 +58,7 @@ module.filter('noXml', function() { }; }); -module.filter('interpolateTemplateVars', function (templateSrv) { +coreModule.filter('interpolateTemplateVars', function (templateSrv) { var filterFunc : any = function (text, scope) { if (scope.panel) { return templateSrv.replaceWithText(text, scope.panel.scopedVars); diff --git a/public/app/directives/all.js b/public/app/directives/all.js index d9fd1b748cb..b724c6d2bc4 100644 --- a/public/app/directives/all.js +++ b/public/app/directives/all.js @@ -13,7 +13,6 @@ define([ './grafanaVersionCheck', './dropdown.typeahead', './topnav', - './giveFocus', './annotationTooltip', './passwordStrenght', ], function () {}); diff --git a/public/app/directives/dropdown.typeahead.js b/public/app/directives/dropdown.typeahead.js index 0ab2d0045fb..59b59ccea3a 100644 --- a/public/app/directives/dropdown.typeahead.js +++ b/public/app/directives/dropdown.typeahead.js @@ -1,10 +1,9 @@ define([ 'angular', - 'app', 'lodash', 'jquery', ], -function (angular, app, _, $) { +function (angular, _, $) { 'use strict'; angular diff --git a/public/app/directives/giveFocus.js b/public/app/directives/giveFocus.js deleted file mode 100644 index 6493676e0f9..00000000000 --- a/public/app/directives/giveFocus.js +++ /dev/null @@ -1,29 +0,0 @@ -define([ - 'angular' -], -function (angular) { - 'use strict'; - - angular.module('grafana.directives').directive('giveFocus', function() { - return function(scope, element, attrs) { - element.click(function(e) { - e.stopPropagation(); - }); - - scope.$watch(attrs.giveFocus,function (newValue) { - if (!newValue) { - return; - } - setTimeout(function() { - element.focus(); - var domEl = element[0]; - if (domEl.setSelectionRange) { - var pos = element.val().length * 2; - domEl.setSelectionRange(pos, pos); - } - }, 200); - },true); - }; - }); - -}); diff --git a/public/app/directives/metric.segment.js b/public/app/directives/metric.segment.js index 7f4144e4530..b9f80b919f7 100644 --- a/public/app/directives/metric.segment.js +++ b/public/app/directives/metric.segment.js @@ -1,10 +1,9 @@ define([ 'angular', - 'app', 'lodash', 'jquery', ], -function (angular, app, _, $) { +function (angular, _, $) { 'use strict'; angular diff --git a/public/app/directives/valueSelectDropdown.js b/public/app/directives/valueSelectDropdown.js index 4c0a25ad693..f54381b442b 100644 --- a/public/app/directives/valueSelectDropdown.js +++ b/public/app/directives/valueSelectDropdown.js @@ -1,10 +1,9 @@ define([ 'angular', - 'app', 'lodash', 'jquery', ], -function (angular, app, _) { +function (angular, _) { 'use strict'; angular diff --git a/public/app/features/dashboard/partials/snapshotTopNav.html b/public/app/features/dashboard/partials/snapshotTopNav.html index 68e8b9532d6..9b2af897cfb 100644 --- a/public/app/features/dashboard/partials/snapshotTopNav.html +++ b/public/app/features/dashboard/partials/snapshotTopNav.html @@ -26,9 +26,8 @@
    -
  • - - +
  • +
diff --git a/public/app/features/profile/partials/profile.html b/public/app/features/profile/partials/profile.html index fde49edcc72..d246b4d3914 100644 --- a/public/app/features/profile/partials/profile.html +++ b/public/app/features/profile/partials/profile.html @@ -11,55 +11,51 @@

Profile

-
-
-
    -
  • - Name -
    • -
  • - -
    • -
-
-
-
-
    -
  • - Email -
    • -
  • - -
    • -
-
-
-
-
    -
  • - Username -
    • -
  • - -
    • -
-
-
- -
-
    -
  • - UI Theme -
    • -
  • - -
    • -
-
-
- +
+
    +
  • + Name +
    • +
  • + +
    • +
+
+
+
+
    +
  • + Email +
    • +
  • + +
    • +
+
+
+
+
    +
  • + Username +
    • +
  • + +
    • +
+
+
+
    +
  • + UI Theme +
    • +
  • + +
    • +
+
+

diff --git a/public/app/panels/graph/legend.js b/public/app/panels/graph/legend.js index beea27ec8b7..8f64f6b4395 100644 --- a/public/app/panels/graph/legend.js +++ b/public/app/panels/graph/legend.js @@ -1,13 +1,12 @@ define([ 'angular', - 'app', 'lodash', 'kbn', 'jquery', 'jquery.flot', 'jquery.flot.time', ], -function (angular, app, _, kbn, $) { +function (angular, _, kbn, $) { 'use strict'; var module = angular.module('grafana.panels.graph'); diff --git a/public/app/panels/graph/module.js b/public/app/panels/graph/module.js index ea0a1e958ad..3fd53cedfd9 100644 --- a/public/app/panels/graph/module.js +++ b/public/app/panels/graph/module.js @@ -1,6 +1,5 @@ define([ 'angular', - 'app', 'jquery', 'lodash', 'kbn', @@ -11,7 +10,7 @@ define([ './graph', './legend', ], -function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) { +function (angular, $, _, kbn, moment, TimeSeries, PanelMeta) { 'use strict'; var module = angular.module('grafana.panels.graph'); diff --git a/public/app/plugins/datasource/graphite/addGraphiteFunc.js b/public/app/plugins/datasource/graphite/addGraphiteFunc.js index 89ce9e79ca4..76b31898842 100644 --- a/public/app/plugins/datasource/graphite/addGraphiteFunc.js +++ b/public/app/plugins/datasource/graphite/addGraphiteFunc.js @@ -1,11 +1,10 @@ define([ 'angular', - 'app', 'lodash', 'jquery', './gfunc', ], -function (angular, app, _, $, gfunc) { +function (angular, _, $, gfunc) { 'use strict'; angular diff --git a/tasks/options/tslint.js b/tasks/options/tslint.js index 6d095752c45..0b76e623e95 100644 --- a/tasks/options/tslint.js +++ b/tasks/options/tslint.js @@ -9,7 +9,7 @@ module.exports = function(config) { configuration: { rules: { curly: true, - align: [true, "parameters", "arguments", "statements"], + align: [true, "parameters", "statements"], indent: [true, "spaces"], "class-name": true, "interface-name": true,