diff --git a/src/app/controllers/all.js b/src/app/controllers/all.js index 3565f9fa844..8d7035bbb65 100644 --- a/src/app/controllers/all.js +++ b/src/app/controllers/all.js @@ -13,5 +13,5 @@ define([ './playlistCtrl', './inspectCtrl', './opentsdbTargetCtrl', - './console-ctrl', + './annotationsEditorCtrl', ], function () {}); diff --git a/src/app/controllers/annotationsEditorCtrl.js b/src/app/controllers/annotationsEditorCtrl.js new file mode 100644 index 00000000000..65561643896 --- /dev/null +++ b/src/app/controllers/annotationsEditorCtrl.js @@ -0,0 +1,64 @@ +define([ + 'angular', + 'app', + 'lodash' +], +function (angular, app, _) { + 'use strict'; + + var module = angular.module('grafana.controllers'); + + module.controller('AnnotationsEditorCtrl', function($scope, datasourceSrv) { + var annotationDefaults = { + name: '', + datasource: null, + showLine: true, + iconColor: '#C0C6BE', + lineColor: 'rgba(255, 96, 96, 0.592157)', + iconSize: 13, + enable: true + }; + + $scope.init = function() { + $scope.currentAnnotation = angular.copy(annotationDefaults); + $scope.currentIsNew = true; + $scope.datasources = datasourceSrv.getAnnotationSources(); + $scope.annotations = $scope.dashboard.annotations.list; + + if ($scope.datasources.length > 0) { + $scope.currentDatasource = $scope.datasources[0]; + } + }; + + $scope.setDatasource = function() { + $scope.currentAnnotation.datasource = $scope.currentDatasource.name; + }; + + $scope.edit = function(annotation) { + $scope.currentAnnotation = annotation; + $scope.currentIsNew = false; + $scope.currentDatasource = _.findWhere($scope.datasources, { name: annotation.datasource }); + + if (!$scope.currentDatasource) { + $scope.currentDatasource = $scope.datasources[0]; + } + }; + + $scope.update = function() { + $scope.currentAnnotation = angular.copy(annotationDefaults); + $scope.currentIsNew = true; + }; + + $scope.add = function() { + $scope.currentAnnotation.datasource = $scope.currentDatasource.name; + $scope.annotations.push($scope.currentAnnotation); + $scope.currentAnnotation = angular.copy(annotationDefaults); + }; + + $scope.removeAnnotation = function(annotation) { + var index = _.indexOf($scope.annotations, annotation); + $scope.annotations.splice(index, 1); + }; + + }); +}); diff --git a/src/app/controllers/dashboardCtrl.js b/src/app/controllers/dashboardCtrl.js index 4b6bdb76382..d881f114765 100644 --- a/src/app/controllers/dashboardCtrl.js +++ b/src/app/controllers/dashboardCtrl.js @@ -48,8 +48,7 @@ function (angular, $, config, _) { $scope.filter = filterSrv; $scope.filter.init($scope.dashboard); - $scope.submenuEnabled = $scope.dashboard.templating.enable || - $scope.dashboard.annotations.enable; + $scope.submenuEnabled = $scope.dashboard.templating.enable || $scope.dashboard.annotations.enable; var panelMove = panelMoveSrv.create($scope.dashboard); diff --git a/src/app/controllers/submenuCtrl.js b/src/app/controllers/submenuCtrl.js index beefcf15ff0..5befa5d3a8c 100644 --- a/src/app/controllers/submenuCtrl.js +++ b/src/app/controllers/submenuCtrl.js @@ -8,7 +8,7 @@ function (angular, app, _) { var module = angular.module('grafana.controllers'); - module.controller('SubmenuCtrl', function($scope) { + module.controller('SubmenuCtrl', function($scope, $q, datasourceSrv) { var _d = { enable: true }; @@ -20,6 +20,63 @@ function (angular, app, _) { $scope.row = $scope.pulldown; }; + $scope.filterOptionSelected = function(templateParameter, option, recursive) { + templateParameter.current = option; + + $scope.filter.updateTemplateData(); + + return $scope.applyFilterToOtherFilters(templateParameter) + .then(function() { + // only refresh in the outermost call + if (!recursive) { + $scope.dashboard.emit_refresh(); + } + }); + }; + + $scope.applyFilterToOtherFilters = function(updatedTemplatedParam) { + var promises = _.map($scope.filter.templateParameters, function(templateParam) { + if (templateParam === updatedTemplatedParam) { + return; + } + if (templateParam.query.indexOf('[[' + updatedTemplatedParam.name + ']]') !== -1) { + return $scope.applyFilter(templateParam); + } + }); + + return $q.all(promises); + }; + + $scope.applyFilter = function(templateParam) { + return datasourceSrv.default.metricFindQuery($scope.filter, templateParam.query) + .then(function (results) { + templateParam.editing = undefined; + templateParam.options = _.map(results, function(node) { + return { text: node.text, value: node.text }; + }); + + if (templateParam.includeAll) { + var allExpr = '{'; + _.each(templateParam.options, function(option) { + allExpr += option.text + ','; + }); + allExpr = allExpr.substring(0, allExpr.length - 1) + '}'; + templateParam.options.unshift({text: 'All', value: allExpr}); + } + + // if parameter has current value + // if it exists in options array keep value + if (templateParam.current) { + var currentExists = _.findWhere(templateParam.options, { value: templateParam.current.value }); + if (currentExists) { + return $scope.filterOptionSelected(templateParam, templateParam.current, true); + } + } + + return $scope.filterOptionSelected(templateParam, templateParam.options[0], true); + }); + }; + $scope.init(); }); diff --git a/src/app/panels/annotations/editor.html b/src/app/partials/annotations_editor.html similarity index 84% rename from src/app/panels/annotations/editor.html rename to src/app/partials/annotations_editor.html index e1184193009..38508216f5f 100644 --- a/src/app/panels/annotations/editor.html +++ b/src/app/partials/annotations_editor.html @@ -10,16 +10,16 @@ - + {{annotation.name}} - - - + + + diff --git a/src/app/partials/submenu.html b/src/app/partials/submenu.html index e1fba4a8bdf..ab432753bc0 100644 --- a/src/app/partials/submenu.html +++ b/src/app/partials/submenu.html @@ -5,29 +5,40 @@ diff --git a/src/css/less/grafana.less b/src/css/less/grafana.less index ca006b2b015..7773d4b31b9 100644 --- a/src/css/less/grafana.less +++ b/src/css/less/grafana.less @@ -284,6 +284,14 @@ &a:hover { background: @grafanaTargetFuncBackground; } + + &.template-param-name { + border-right: none; + padding-right: 3px; + } + &.annotation-segment { + padding: 8px 15px; + } } .grafana-target-function { @@ -405,7 +413,6 @@ select.grafana-target-segment-input { } } - .scrollable { max-height: 300px; overflow: auto;