Skip to content

N
nexpie-grafana-theme
Commit 647feb7b by Torkel Ödegaard
Options

Progress on new filter/templating editor

parent 625781c7
Showing with 139 additions and 15 deletions
package.json
......@@ -4,7 +4,7 @@
"company": "Coding Instinct AB"
},
"name": "grafana",
"version": "1.7.0",
"version": "1.8.0",
"repository": {
"type": "git",
"url": "http://github.com/torkelo/grafana.git"
......
src/app/controllers/all.js
......@@ -14,4 +14,5 @@ define([
'./inspectCtrl',
'./opentsdbTargetCtrl',
'./annotationsEditorCtrl',
'./templateEditorCtrl',
], function () {});
src/app/controllers/annotationsEditorCtrl.js
define([
'angular',
'app',
'lodash',
'jquery'
],
function (angular, app, _, $) {
function (angular, _, $) {
'use strict';
var module = angular.module('grafana.controllers');
......@@ -63,7 +62,8 @@ function (angular, app, _, $) {
$scope.add = function() {
$scope.currentAnnotation.datasource = $scope.currentDatasource.name;
$scope.annotations.push($scope.currentAnnotation);
$scope.currentAnnotation = angular.copy(annotationDefaults);
$scope.reset();
$scope.editor.index = 0;
};
$scope.removeAnnotation = function(annotation) {
......
src/app/controllers/templateEditorCtrl.js 0 → 100644
define([
'angular',
'lodash',
],
function (angular, _) {
'use strict';
var module = angular.module('grafana.controllers');
module.controller('TemplateEditorCtrl', function($scope, datasourceSrv) {
var replacementDefaults = {
type: 'metric query',
datasource: null,
refresh_on_load: false,
name: '',
options: [],
};
$scope.init = function() {
$scope.editor = { index: 0 };
$scope.datasources = datasourceSrv.getMetricSources();
$scope.currentDatasource = _.findWhere($scope.datasources, { default: true });
$scope.templateParameters = $scope.filter.templateParameters;
$scope.reset();
};
$scope.add = function() {
$scope.current.datasource = $scope.currentDatasource.name;
$scope.templateParameters.push($scope.current);
$scope.reset();
};
$scope.reset = function() {
$scope.currentIsNew = true;
$scope.current = angular.copy(replacementDefaults);
$scope.editor.index = 0;
};
$scope.removeTemplateParam = function(templateParam) {
var index = _.indexOf($scope.templateParameters, templateParam);
$scope.templateParameters.splice(index, 1);
};
$scope.setDatasource = function() {
};
});
});
src/app/panels/graph/styleEditor.html
......@@ -68,7 +68,6 @@
<h5>Series specific overrides <tip>Regex match example: /server[0-3]/i </tip></h5>
<div>
<div class="grafana-target" ng-repeat="override in panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
<div class="grafana-target-inner-wrapper">
<div class="grafana-target-inner">
<ul class="grafana-target-controls-left">
......@@ -103,7 +102,6 @@
</div>
</div>
</div>
</div>
<button class="btn btn-success" style="margin-top: 20px" ng-click="addSeriesOverride()">Add series override rule</button>
</div>
......
src/app/partials/playlist.html
......@@ -38,8 +38,8 @@
<div class="editor-option">
<div class="span4">
<span><i class="icon-question-sign"></i>
Dashboards available in the playlist are only the once marked as favorites (stored in local browser storage).
To mark a dashboard as favorite, use save icon in the menu and in the dropdown select Mark as favorite
dashboards available in the playlist are only the once marked as favorites (stored in local browser storage).
to mark a dashboard as favorite, use save icon in the menu and in the dropdown select mark as favorite
<br/><br/>
</span>
</div>
......
src/app/partials/templating_editor.html
<div class="dashboard-editor-header">
<div ng-controller="TemplateEditorCtrl" ng-init="init()"> <div class="dashboard-editor-header">
<div class="dashboard-editor-title">
<i class="icon icon-code"></i>
Templating
......@@ -9,15 +9,78 @@
</div>
</div>
</div>
</div>
<div class="dashboard-editor-body">
<div class="dashboard-editor-body">
<div ng-if="editor.index == 0">
<div class="editor-row">
<div class="span4">
<div ng-if="templateParameters.length === 0">
<em>No replacements defined</em>
</div>
<table class="table table-striped">
<tr ng-repeat="templateParam in templateParameters">
<td>{{templateParam.name}}</td>
<td>{{templateParam.query}}</td>
<td>
<a ng-click="asd">
Edit
</a>
</td>
<td>
<a ng-click="removeTemplateParam(templateParam)">
Remove
</a>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
<div class="dashboard-editor-footer">
<div ng-if="editor.index == 1">
<div class="editor-row">
<div class="editor-option">
<label class="small">Replacement name</label>
<input type="text" class="input-medium" ng-model='current.name' placeholder="name"></input>
</div>
<div class="editor-option">
<label class="small">Type</label>
<select class="input-medium" ng-model="current.type" ng-options="f for f in ['metric query', 'custom']"></select>
</div>
<div class="editor-option">
<label class="small">Datasource</label>
<select ng-model="currentDatasource" ng-options="f.name for f in datasources" ng-change="setDatasource()"></select>
</div>
</div>
<div class="editor-row">
<div class="editor-option">
<label class="small">Metric query</label>
<input type="text" class="input-xxlarge" ng-model='current.query' placeholder="query"></input>
</div>
</div>
<button ng-show="currentIsNew" type="button" class="btn btn-success" ng-click="add()">Add template replacement</button>
</div>
</div>
<div class="dashboard-editor-footer">
<button type="button" class="btn btn-success pull-right" ng-click="editor.index=0;dismiss();">Close</button>
</div>
</div>
<!-- <div class="span4"> -->
<!-- <tip class="info&#45;box"> -->
<!-- <i class="icon&#45;question&#45;sign"></i> -->
<!-- The templating feature in Grafana lets easily create and manage templated queries. Templated queries use [[replacement]] syntax -->
<!-- to replace a part of your metric key or query. By using this feature you can make your dashboards more generic. You can for example create -->
<!-- a query replacement for your cluster name or server name. Then use that replacement in your metric queries and change -->
<!-- it globably for all graphs on the dashboard. -->
<!-- <br/><br/> -->
<!-- </tip> -->
<!-- </div> -->
src/app/services/datasourceSrv.js
......@@ -20,10 +20,12 @@ function (angular, _, config) {
this.init = function() {
_.each(config.datasources, function(value, key) {
datasources[key] = this.datasourceFactory(value);
var ds = this.datasourceFactory(value);
if (value.default) {
this.default = datasources[key];
this.default = ds;
ds.default = true;
}
datasources[key] = ds;
}, this);
if (!this.default) {
......@@ -37,6 +39,7 @@ function (angular, _, config) {
metricSources.push({
name: value.name,
value: value.default ? null : key,
default: value.default,
});
}
if (value.supportAnnotations) {
......
src/css/less/grafana.less
......@@ -572,6 +572,15 @@ select.grafana-target-segment-input {
}
}
// .panel-fullscreen {
// .dashboard-editor-header {
// margin-left: -20px;
// margin-right: -20px;
// background: @grayDark;
// padding-left: 20px;
// }
// }
.dashboard-editor-title {
border-bottom: 1px solid @grayDark;
padding-right: 20px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment