tech(systemjs): more stuff is starting to work

public/app/core/controllers/grafana_ctrl.ts

 ///<reference path="../../headers/common.d.ts" />
 
-import angular = require('angular');
-import $ = require('jquery');
 import config = require('app/core/config');
 import store = require('app/core/store');
+
+import angular from 'angular';
+import $ from 'jquery';
 import coreModule from '../core_module';
 
 coreModule.controller('GrafanaCtrl', function($scope, alertSrv, utilSrv, $rootScope, $controller, contextSrv) {

public/app/core/core.ts

 ///<reference path="../headers/common.d.ts" />
 ///<reference path="./mod_defs.d.ts" />
 
-///<amd-dependency path="./directives/annotation_tooltip" />
-///<amd-dependency path="./directives/body_class" />
-///<amd-dependency path="./directives/config_modal" />
-///<amd-dependency path="./directives/confirm_click" />
-///<amd-dependency path="./directives/dash_edit_link" />
-///<amd-dependency path="./directives/dash_upload" />
-///<amd-dependency path="./directives/dropdown_typeahead" />
-///<amd-dependency path="./directives/grafana_version_check" />
-///<amd-dependency path="./directives/metric_segment" />
-///<amd-dependency path="./directives/misc" />
-///<amd-dependency path="./directives/ng_model_on_blur" />
-///<amd-dependency path="./directives/password_strenght" />
-///<amd-dependency path="./directives/spectrum_picker" />
-///<amd-dependency path="./directives/tags" />
-///<amd-dependency path="./directives/topnav" />
-///<amd-dependency path="./directives/value_select_dropdown" />
-///<amd-dependency path="./jquery_extended" />
-///<amd-dependency path="./partials" />
+import "./directives/annotation_tooltip";
+import "./directives/body_class";
+import "./directives/config_modal";
+import "./directives/confirm_click";
+import "./directives/dash_edit_link";
+import "./directives/dash_upload";
+import "./directives/dropdown_typeahead";
+import "./directives/grafana_version_check";
+import "./directives/metric_segment";
+import "./directives/misc";
+import "./directives/ng_model_on_blur";
+import "./directives/password_strenght";
+import "./directives/spectrum_picker";
+import "./directives/tags";
+import "./directives/topnav";
+import "./directives/value_select_dropdown";
+import './jquery_extended';
+import './partials';
 
 import {arrayJoin} from './directives/array_join';
 import * as controllers from 'app/core/controllers/all';
 import * as services from 'app/core/services/all';
 import * as routes from 'app/core/routes/all';
+import './filters/filters';
 
 // export * from './directives/give_focus'
-// export * from './filters/filters'
 
 export {arrayJoin, controllers, services, routes};

public/app/core/core_module.ts

 ///<reference path="../headers/common.d.ts" />
 
-import angular = require('angular');
-
+import angular from 'angular';
 export default angular.module('grafana.core', ['ngRoute']);

public/app/core/directives/annotation_tooltip.js

@@ -6,7 +6,7 @@ define([
 function ($, _, coreModule) {
   'use strict';
 
-  coreModule.directive('annotationTooltip', function($sanitize, dashboardSrv, $compile) {
+  coreModule.default.directive('annotationTooltip', function($sanitize, dashboardSrv, $compile) {
 
     function sanitizeString(str) {
       try {

public/app/core/directives/array_join.ts

 ///<reference path="../../headers/common.d.ts" />
 
-import angular = require('angular');
 import _ = require('lodash');
+
+import angular from 'angular';
 import coreModule from '../core_module';
 
 export function arrayJoin() {

public/app/core/directives/body_class.js

@@ -6,7 +6,7 @@ define([
 function (_, $, coreModule) {
   'use strict';
 
-  coreModule.directive('bodyClass', function() {
+  coreModule.default.directive('bodyClass', function() {
     return {
       link: function($scope, elem) {
 

public/app/core/directives/config_modal.js

@@ -6,7 +6,7 @@ define([
 function (_, $, coreModule) {
   'use strict';
 
-  coreModule.directive('configModal', function($modal, $q, $timeout) {
+  coreModule.default.directive('configModal', function($modal, $q, $timeout) {
     return {
       restrict: 'A',
       link: function(scope, elem, attrs) {

public/app/core/directives/confirm_click.js

@@ -4,7 +4,7 @@ define([
 function (coreModule) {
   'use strict';
 
-  coreModule.directive('confirmClick', function() {
+  coreModule.default.directive('confirmClick', function() {
     return {
       restrict: 'A',
       link: function(scope, elem, attrs) {

public/app/core/directives/dash_edit_link.js

@@ -11,7 +11,7 @@ function ($, coreModule) {
     'templating':  { src: 'app/features/templating/partials/editor.html', title: "Templating" }
   };
 
-  coreModule.directive('dashEditorLink', function($timeout) {
+  coreModule.default.directive('dashEditorLink', function($timeout) {
     return {
       restrict: 'A',
       link: function(scope, elem, attrs) {
@@ -27,7 +27,7 @@ function ($, coreModule) {
     };
   });
 
-  coreModule.directive('dashEditorView', function($compile, $location) {
+  coreModule.default.directive('dashEditorView', function($compile, $location) {
     return {
       restrict: 'A',
       link: function(scope, elem) {

public/app/core/directives/dash_upload.js

@@ -5,7 +5,7 @@ define([
 function (coreModule, kbn) {
   'use strict';
 
-  coreModule.directive('dashUpload', function(timer, alertSrv, $location) {
+  coreModule.default.directive('dashUpload', function(timer, alertSrv, $location) {
     return {
       restrict: 'A',
       link: function(scope) {

public/app/core/directives/dropdown_typeahead.js

@@ -6,7 +6,7 @@ define([
 function (_, $, coreModule) {
   'use strict';
 
-  coreModule.directive('dropdownTypeahead', function($compile) {
+  coreModule.default.directive('dropdownTypeahead', function($compile) {
 
     var inputTemplate = '<input type="text"'+
       ' class="tight-form-input input-medium tight-form-input"' +

public/app/core/directives/give_focus.ts

@@ -3,7 +3,7 @@
 import angular = require('angular');
 import coreModule from '../core_module';
 
-coreModule.directive('giveFocus', function() {
+coreModule.default.directive('giveFocus', function() {
   return function(scope, element, attrs) {
     element.click(function(e) {
       e.stopPropagation();

public/app/core/directives/grafana_version_check.js

@@ -4,7 +4,7 @@ define([
 function (coreModule) {
   'use strict';
 
-  coreModule.directive('grafanaVersionCheck', function($http, contextSrv) {
+  coreModule.default.directive('grafanaVersionCheck', function($http, contextSrv) {
     return {
       restrict: 'A',
       link: function(scope, elem) {

public/app/core/directives/metric_segment.js

@@ -6,7 +6,7 @@ define([
 function (_, $, coreModule) {
   'use strict';
 
-  coreModule.directive('metricSegment', function($compile, $sce) {
+  coreModule.default.directive('metricSegment', function($compile, $sce) {
     var inputTemplate = '<input type="text" data-provide="typeahead" ' +
       ' class="tight-form-clear-input input-medium"' +
       ' spellcheck="false" style="display:none"></input>';
@@ -157,7 +157,7 @@ function (_, $, coreModule) {
     };
   });
 
-  coreModule.directive('metricSegmentModel', function(uiSegmentSrv, $q) {
+  coreModule.default.directive('metricSegmentModel', function(uiSegmentSrv, $q) {
     return {
       template: '<metric-segment segment="segment" get-options="getOptionsInternal()" on-change="onSegmentChange()"></metric-segment>',
       restrict: 'E',

public/app/core/directives/misc.js

@@ -6,7 +6,7 @@ define([
 function (angular, coreModule, kbn) {
   'use strict';
 
-  coreModule.directive('tip', function($compile) {
+  coreModule.default.directive('tip', function($compile) {
     return {
       restrict: 'E',
       link: function(scope, elem, attrs) {
@@ -18,7 +18,7 @@ function (angular, coreModule, kbn) {
     };
   });
 
-  coreModule.directive('watchChange', function() {
+  coreModule.default.directive('watchChange', function() {
     return {
       scope: { onchange: '&watchChange' },
       link: function(scope, element) {
@@ -31,7 +31,7 @@ function (angular, coreModule, kbn) {
     };
   });
 
-  coreModule.directive('editorOptBool', function($compile) {
+  coreModule.default.directive('editorOptBool', function($compile) {
     return {
       restrict: 'E',
       link: function(scope, elem, attrs) {
@@ -51,7 +51,7 @@ function (angular, coreModule, kbn) {
     };
   });
 
-  coreModule.directive('editorCheckbox', function($compile, $interpolate) {
+  coreModule.default.directive('editorCheckbox', function($compile, $interpolate) {
     return {
       restrict: 'E',
       link: function(scope, elem, attrs) {
@@ -73,7 +73,7 @@ function (angular, coreModule, kbn) {
     };
   });
 
-  coreModule.directive('gfDropdown', function ($parse, $compile, $timeout) {
+  coreModule.default.directive('gfDropdown', function ($parse, $compile, $timeout) {
     function buildTemplate(items, placement) {
       var upclass = placement === 'top' ? 'dropup' : '';
       var ul = [

public/app/core/directives/ng_model_on_blur.js

@@ -6,7 +6,7 @@ define([
 function (coreModule, kbn, rangeUtil) {
   'use strict';
 
-  coreModule.directive('ngModelOnblur', function() {
+  coreModule.default.directive('ngModelOnblur', function() {
     return {
       restrict: 'A',
       priority: 1,
@@ -26,7 +26,7 @@ function (coreModule, kbn, rangeUtil) {
     };
   });
 
-  coreModule.directive('emptyToNull', function () {
+  coreModule.default.directive('emptyToNull', function () {
     return {
       restrict: 'A',
       require: 'ngModel',
@@ -39,7 +39,7 @@ function (coreModule, kbn, rangeUtil) {
     };
   });
 
-  coreModule.directive('validTimeSpan', function() {
+  coreModule.default.directive('validTimeSpan', function() {
     return {
       require: 'ngModel',
       link: function(scope, elm, attrs, ctrl) {

public/app/core/directives/password_strenght.js

@@ -4,7 +4,7 @@ define([
 function (coreModule) {
   'use strict';
 
-  coreModule.directive('passwordStrength', function() {
+  coreModule.default.directive('passwordStrength', function() {
     var template = '<div class="password-strength small" ng-if="!loginMode" ng-class="strengthClass">' +
       '<em>{{strengthText}}</em>' +
       '</div>';

public/app/core/directives/spectrum_picker.js

@@ -6,7 +6,7 @@ define([
 function (angular, coreModule) {
   'use strict';
 
-  coreModule.directive('spectrumPicker', function() {
+  coreModule.default.directive('spectrumPicker', function() {
     return {
       restrict: 'E',
       require: 'ngModel',

public/app/core/directives/tags.js

@@ -39,7 +39,7 @@ function (angular, $, coreModule) {
     element.css("border-color", borderColor);
   }
 
-  coreModule.directive('tagColorFromName', function() {
+  coreModule.default.directive('tagColorFromName', function() {
     return {
       scope: { tagColorFromName: "=" },
       link: function (scope, element) {
@@ -48,7 +48,7 @@ function (angular, $, coreModule) {
     };
   });
 
-  coreModule.directive('bootstrapTagsinput', function() {
+  coreModule.default.directive('bootstrapTagsinput', function() {
 
     function getItemProperty(scope, property) {
       if (!property) {

public/app/core/directives/topnav.js

@@ -4,7 +4,7 @@ define([
 function (coreModule) {
   'use strict';
 
-  coreModule.directive('topnav', function($rootScope, contextSrv) {
+  coreModule.default.directive('topnav', function($rootScope, contextSrv) {
     return {
       restrict: 'E',
       transclude: true,

public/app/core/directives/value_select_dropdown.js

@@ -6,7 +6,7 @@ define([
 function (angular, _, coreModule) {
   'use strict';
 
-  coreModule.controller('ValueSelectDropdownCtrl', function($q) {
+  coreModule.default.controller('ValueSelectDropdownCtrl', function($q) {
     var vm = this;
 
     vm.show = function() {
@@ -224,7 +224,7 @@ function (angular, _, coreModule) {
 
   });
 
-  coreModule.directive('valueSelectDropdown', function($compile, $window, $timeout, $rootScope) {
+  coreModule.default.directive('valueSelectDropdown', function($compile, $window, $timeout, $rootScope) {
     return {
       scope: { variable: "=", onUpdated: "&", getValuesForTag: "&" },
       templateUrl: 'app/partials/valueSelectDropdown.html',

public/app/core/filters/filters.ts

 ///<reference path="../../headers/common.d.ts" />
 
-import angular = require('angular');
 import jquery = require('jquery');
-import moment = require('moment');
 import _ = require('lodash');
+
+import angular from 'angular';
+import moment from 'moment';
 import coreModule from '../core_module';
 
 coreModule.filter('stringSort', function() {

public/app/core/utils/datemath.ts

 ///<reference path="../../headers/common.d.ts" />
 
 import _ = require('lodash');
-import moment = require('moment');
+import moment from 'moment';
 
 var units = ['y', 'M', 'w', 'd', 'h', 'm', 's'];
 var unitsAsc = _.sortBy(units, function (unit) {

public/app/grafana_app.ts

@@ -10,11 +10,11 @@ import 'angular-bindonce';
 import 'angular-ui';
 import 'app/core/core';
 
+import $ from 'jquery';
+import angular from 'angular';
 import _ = require('lodash');
-import $ = require('jquery');
 import bootstrap = require('bootstrap');
 import kbn = require('app/core/utils/kbn');
-import angular = require('angular');
 import config = require('app/core/config');
 
 export class GrafanaApp {
@@ -66,8 +66,7 @@ export class GrafanaApp {
       this.useModule(angular.module(moduleName, []));
     });
 
-    //var preBootRequires = [System.import('app/features/all')];
-    var preBootRequires = [];
+    var preBootRequires = [System.import('app/features/all')];
     var pluginModules = config.bootData.pluginModules || [];
 
     // add plugin modules

public/app/headers/common.d.ts

 ///<reference path="lodash/lodash.d.ts" />
-///<reference path="moment/moment.d.ts" />
 ///<reference path="../../vendor/npm/angular2/typings/tsd.d.ts" />
 ///<reference path="../../vendor/npm/angular2/manual_typings/globals.d.ts" />
 
@@ -11,18 +10,23 @@ declare module 'app/core/config' {
 
 declare var System: any;
 
+declare module 'moment' {
+  var moment : any;
+  export default moment;
+}
+
 declare module 'angular' {
-  var angular : any;
-  export = angular;
+  var angular: any;
+  export default angular;
 }
 
 declare module 'jquery' {
-  var jquery : any;
-  export = jquery;
+  var jquery: any;
+  export default jquery;
 }
 
 declare module 'app/core/utils/kbn' {
-  var kbn : any;
+  var kbn: any;
   export = kbn;
 }
 

public/app/systemjs.conf.js

 System.config({
   defaultJSExtenions: true,
   paths: {
-    moment:   'public/vendor/moment.js',
+    'moment': 'public/vendor/moment.js',
     "jquery": "public/vendor/jquery/dist/jquery.js",
     'lodash-src': 'public/vendor/lodash.js',
     "lodash": 'public/app/core/lodash_extended.js',
@@ -14,7 +14,6 @@ System.config({
     "angular-dragdrop":       "public/vendor/angular-native-dragdrop/draganddrop.js",
     "angular-bindonce":       "public/vendor/angular-bindonce/bindonce.js",
     "spectrum": "public/vendor/spectrum.js",
-    "filesaver": "public/vendor/filesaver.js",
     "bootstrap-tagsinput": "public/vendor/tagsinput/bootstrap-tagsinput.js",
     "jquery.flot": "vendor/flot/jquery.flot",
     "jquery.flot.pie": "vendor/flot/jquery.flot.pie",
@@ -31,6 +30,9 @@ System.config({
     app: {
       defaultExtension: 'js',
     },
+    vendor: {
+      defaultExtension: 'js',
+    },
   },
 
   map: {
@@ -44,8 +46,7 @@ System.config({
       format: 'amd',
       deps: ['jquery'],
       exports: 'angular',
-    }
-
+    },
   }
 
 });

public/vendor/moment.js

@@ -2788,6 +2788,7 @@
             globalScope.moment = moment;
         }
     }
+    debugger;
 
     // CommonJS module is defined
     if (hasModule) {