diff --git a/public/app/features/panel/panelDirective.js b/public/app/features/panel/panelDirective.js
index 7330bb627de..041980f9d44 100644
--- a/public/app/features/panel/panelDirective.js
+++ b/public/app/features/panel/panelDirective.js
@@ -6,35 +6,51 @@ define([
function (angular, $, config) {
'use strict';
- angular
- .module('grafana.directives')
- .directive('panelLoader', function($compile, $parse) {
- return {
- restrict: 'E',
- link: function(scope, elem, attr) {
- var getter = $parse(attr.type), panelType = getter(scope);
- var panelPath = config.panels[panelType].path;
+ var module = angular.module('grafana.directives');
- scope.require([panelPath + "/module"], function () {
- var panelEl = angular.element(document.createElement('grafana-panel-' + panelType));
- elem.append(panelEl);
- $compile(panelEl)(scope);
- });
- }
- };
- }).directive('grafanaPanel', function() {
- return {
- restrict: 'E',
- templateUrl: 'app/features/panel/partials/panel.html',
- transclude: true,
- link: function(scope, elem) {
- var panelContainer = elem.find('.panel-container');
+ module.directive('panelLoader', function($compile, $parse) {
+ return {
+ restrict: 'E',
+ link: function(scope, elem, attr) {
+ var getter = $parse(attr.type), panelType = getter(scope);
+ var panelPath = config.panels[panelType].path;
+
+ scope.require([panelPath + "/module"], function () {
+ var panelEl = angular.element(document.createElement('grafana-panel-' + panelType));
+ elem.append(panelEl);
+ $compile(panelEl)(scope);
+ });
+ }
+ };
+ });
+
+ module.directive('grafanaPanel', function() {
+ return {
+ restrict: 'E',
+ templateUrl: 'app/features/panel/partials/panel.html',
+ transclude: true,
+ link: function(scope, elem) {
+ var panelContainer = elem.find('.panel-container');
+
+ scope.$watchGroup(['fullscreen', 'height', 'panel.height', 'row.height'], function() {
+ panelContainer.css({ minHeight: scope.height || scope.panel.height || scope.row.height, display: 'block' });
+ elem.toggleClass('panel-fullscreen', scope.fullscreen ? true : false);
+ });
+ }
+ };
+ });
+
+ module.directive('queryEditorLoader', function($compile, $parse, datasourceSrv) {
+ return {
+ restrict: 'E',
+ link: function(scope, elem) {
+ datasourceSrv.get(scope.panel.datasource).then(function(ds) {
+ var panelEl = angular.element(document.createElement('metric-query-editor-' + ds.meta.type));
+ elem.append(panelEl);
+ $compile(panelEl)(scope);
+ });
+ }
+ };
+ });
- scope.$watchGroup(['fullscreen', 'height', 'panel.height', 'row.height'], function() {
- panelContainer.css({ minHeight: scope.height || scope.panel.height || scope.row.height, display: 'block' });
- elem.toggleClass('panel-fullscreen', scope.fullscreen ? true : false);
- });
- }
- };
- });
});
diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html
index db304d1c232..56571bfa203 100644
--- a/public/app/partials/metrics.html
+++ b/public/app/partials/metrics.html
@@ -1,5 +1,12 @@
-
+
+
+
+
+
+
+
+