fix(timepicker): fixed recent breaking of datetime picker when swithing from requirejs to systemjs

public/app/features/dashboard/timepicker/input_date.js → public/app/features/dashboard/timepicker/input_date.ts

-define([
-  "angular",
-  "lodash",
-  "moment",
-],function (angular, _, moment) {
-  'use strict';
+///<reference path="../../../headers/common.d.ts" />
 
-  angular.
-    module("grafana.directives").
-    directive('inputDatetime', function () {
-    return {
-      restrict: 'A',
-      require: 'ngModel',
-      link: function ($scope, $elem, attrs, ngModel) {
-        var format = 'YYYY-MM-DD HH:mm:ss';
+import _ from 'lodash';
+import angular from 'angular';
+import moment from 'moment';
 
-        var fromUser = function (text) {
-          if (text.indexOf('now') !== -1) {
-            return text;
-          }
-          var parsed;
-          if ($scope.ctrl.isUtc) {
-            parsed = moment.utc(text, format);
-          } else {
-            parsed = moment(text, format);
-          }
+export function inputDateDirective() {
+  return {
+    restrict: 'A',
+    require: 'ngModel',
+    link: function ($scope, $elem, attrs, ngModel) {
+      var format = 'YYYY-MM-DD HH:mm:ss';
 
-          return parsed.isValid() ? parsed : undefined;
-        };
+      var fromUser = function (text) {
+        if (text.indexOf('now') !== -1) {
+          return text;
+        }
+        var parsed;
+        if ($scope.ctrl.isUtc) {
+          parsed = moment.utc(text, format);
+        } else {
+          parsed = moment(text, format);
+        }
 
-        var toUser = function (currentValue) {
-          if (moment.isMoment(currentValue)) {
-            return currentValue.format(format);
-          } else {
-            return currentValue;
-          }
-        };
+        return parsed.isValid() ? parsed : undefined;
+      };
+
+      var toUser = function (currentValue) {
+        if (moment.isMoment(currentValue)) {
+          return currentValue.format(format);
+        } else {
+          return currentValue;
+        }
+      };
+
+      ngModel.$parsers.push(fromUser);
+      ngModel.$formatters.push(toUser);
+    }
+  };
+}
 
-        ngModel.$parsers.push(fromUser);
-        ngModel.$formatters.push(toUser);
-      }
-    };
-  });
-});

public/app/features/dashboard/timepicker/timepicker.ts

 ///<reference path="../../../headers/common.d.ts" />
-///<amd-dependency path="./input_date" name="inputDate" />
 
 import _ from 'lodash';
 import kbn  from 'app/core/utils/kbn';
@@ -9,8 +8,6 @@ import moment from 'moment';
 import * as dateMath from 'app/core/utils/datemath';
 import * as rangeUtil from 'app/core/utils/rangeutil';
 
-declare var inputDate: any;
-
 export class TimePickerCtrl {
 
   static tooltipFormat = 'MMM D, YYYY HH:mm:ss';
@@ -179,3 +176,6 @@ export function timePickerDirective() {
 
 angular.module('grafana.directives').directive('gfTimePickerSettings', settingsDirective);
 angular.module('grafana.directives').directive('gfTimePicker', timePickerDirective);
+
+import {inputDateDirective} from './input_date';
+angular.module("grafana.directives").directive('inputDatetime', inputDateDirective);

public/app/grafana.ts

@@ -56,7 +56,7 @@ export class GrafanaApp {
       'ang-drag-drop',
       'grafana',
       'pasvaz.bindonce',
-      'ui.bootstrap.tabs',
+      'ui.bootstrap',
       'ui.bootstrap.tpls',
     ];