adding from and to built in variables

public/app/features/dashboard/dashboard_model.ts

@@ -9,6 +9,7 @@ import sortByKeys from 'app/core/utils/sort_by_keys';
 
 import { PanelModel } from './panel_model';
 import { DashboardMigrator } from './dashboard_migration';
+import { TimeRange } from '@grafana/ui/src';
 
 export class DashboardModel {
   id: any;
@@ -200,8 +201,8 @@ export class DashboardModel {
     this.events.emit('view-mode-changed', panel);
   }
 
-  timeRangeUpdated() {
-    this.events.emit('time-range-updated');
+  timeRangeUpdated(timeRange: TimeRange) {
+    this.events.emit('time-range-updated', timeRange);
   }
 
   startRefresh() {

public/app/features/dashboard/time_srv.ts

@@ -147,7 +147,7 @@ export class TimeSrv {
   }
 
   refreshDashboard() {
-    this.dashboard.timeRangeUpdated();
+    this.dashboard.timeRangeUpdated(this.timeRange());
   }
 
   private startNextRefreshTimer(afterMs) {

public/app/features/templating/specs/variable_srv.test.ts

@@ -8,7 +8,9 @@ describe('VariableSrv', function(this: any) {
   const ctx = {
     datasourceSrv: {},
     timeSrv: {
-      timeRange: () => {},
+      timeRange: () => {
+        return { from: '2018-01-29', to: '2019-01-29' };
+      },
     },
     $rootScope: {
       $on: () => {},
@@ -45,7 +47,14 @@ describe('VariableSrv', function(this: any) {
         const ds: any = {};
         ds.metricFindQuery = () => Promise.resolve(scenario.queryResult);
 
-        ctx.variableSrv = new VariableSrv(ctx.$rootScope, $q, ctx.$location, ctx.$injector, ctx.templateSrv);
+        ctx.variableSrv = new VariableSrv(
+          ctx.$rootScope,
+          $q,
+          ctx.$location,
+          ctx.$injector,
+          ctx.templateSrv,
+          ctx.timeSrv
+        );
 
         ctx.variableSrv.timeSrv = ctx.timeSrv;
         ctx.datasourceSrv = {

public/app/features/templating/specs/variable_srv_init.test.ts

@@ -18,6 +18,12 @@ describe('VariableSrv init', function(this: any) {
       }),
   };
 
+  const timeSrv = {
+    timeRange: () => {
+      return { from: '2018-01-29', to: '2019-01-29' };
+    },
+  };
+
   const $injector = {} as any;
   const $rootscope = {
     $on: () => {},
@@ -47,7 +53,7 @@ describe('VariableSrv init', function(this: any) {
           templateSrv,
         };
 
-        ctx.variableSrv = new VariableSrv($rootscope, $q, {}, $injector, templateSrv);
+        ctx.variableSrv = new VariableSrv($rootscope, $q, {}, $injector, templateSrv, timeSrv);
 
         $injector.instantiate = (variable, model) => {
           return getVarMockConstructor(variable, model, ctx);

public/app/features/templating/template_srv.ts

 import kbn from 'app/core/utils/kbn';
 import _ from 'lodash';
 import { variableRegex } from 'app/features/templating/variable';
+import { TimeRange } from '@grafana/ui/src';
 
 function luceneEscape(value) {
   return value.replace(/([\!\*\+\-\=<>\s\&\|\(\)\[\]\{\}\^\~\?\:\\/"])/g, '\\$1');
@@ -13,6 +14,7 @@ export class TemplateSrv {
   private index = {};
   private grafanaVariables = {};
   private builtIns = {};
+  private timeRange: TimeRange = null;
 
   constructor() {
     this.builtIns['__interval'] = { text: '1s', value: '1s' };
@@ -20,8 +22,9 @@ export class TemplateSrv {
     this.variables = [];
   }
 
-  init(variables) {
+  init(variables, timeRange?: TimeRange) {
     this.variables = variables;
+    this.timeRange = timeRange;
     this.updateTemplateData();
   }
 
@@ -34,6 +37,26 @@ export class TemplateSrv {
       }
       return acc;
     }, {});
+
+    if (this.timeRange) {
+      const from = this.timeRange.from.valueOf().toString();
+      const to = this.timeRange.to.valueOf().toString();
+
+      this.index = {
+        ...this.index,
+        ['__from']: {
+          current: { value: from, text: from },
+        },
+        ['__to']: {
+          current: { value: to, text: to },
+        },
+      };
+    }
+  }
+
+  updateTimeVariables(timeRange: TimeRange) {
+    this.timeRange = timeRange;
+    this.updateTemplateData();
   }
 
   variableInitialized(variable) {
@@ -81,8 +104,14 @@ export class TemplateSrv {
   // also the sub-delims "!", "'", "(", ")" and "*" are encoded;
   // unicode handling uses UTF-8 as in ECMA-262.
   encodeURIComponentStrict(str) {
-    return encodeURIComponent(str).replace(/[!'()*]/g, (c) => {
-      return '%' + c.charCodeAt(0).toString(16).toUpperCase();
+    return encodeURIComponent(str).replace(/[!'()*]/g, c => {
+      return (
+        '%' +
+        c
+          .charCodeAt(0)
+          .toString(16)
+          .toUpperCase()
+      );
     });
   }
 
@@ -256,7 +285,7 @@ export class TemplateSrv {
 
       const value = this.grafanaVariables[variable.current.value];
 
-      return typeof(value) === 'string' ? value : variable.current.text;
+      return typeof value === 'string' ? value : variable.current.text;
     });
   }
 

public/app/features/templating/variable_srv.ts

@@ -6,13 +6,14 @@ import _ from 'lodash';
 import coreModule from 'app/core/core_module';
 import { variableTypes } from './variable';
 import { Graph } from 'app/core/utils/dag';
+import { TimeRange } from '@grafana/ui/src';
 
 export class VariableSrv {
   dashboard: any;
   variables: any;
 
   /** @ngInject */
-  constructor(private $rootScope, private $q, private $location, private $injector, private templateSrv) {
+  constructor(private $rootScope, private $q, private $location, private $injector, private templateSrv, private timeSrv) {
     $rootScope.$on('template-variable-value-updated', this.updateUrlParamsWithCurrentVariables.bind(this), $rootScope);
   }
 
@@ -22,7 +23,7 @@ export class VariableSrv {
 
     // create working class models representing variables
     this.variables = dashboard.templating.list = dashboard.templating.list.map(this.createVariableFromModel.bind(this));
-    this.templateSrv.init(this.variables);
+    this.templateSrv.init(this.variables, this.timeSrv.timeRange());
 
     // init variables
     for (const variable of this.variables) {
@@ -41,7 +42,8 @@ export class VariableSrv {
       });
   }
 
-  onTimeRangeUpdated() {
+  onTimeRangeUpdated(timeRange: TimeRange) {
+    this.templateSrv.updateTimeVariables(timeRange);
     const promises = this.variables.filter(variable => variable.refresh === 2).map(variable => {
       const previousOptions = variable.options.slice();