IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1882 from masaori335/kairosdb-appearance

Browse Source 
Fix query editor appearance of KairosDB Plugin
This commit is contained in:
Torkel Ödegaard 2015-04-26 15:15:05 +02:00
commit 03e4afa736
2 changed files with 52 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
public/app/plugins/datasource/kairosdb/partials/query.editor.html
View File

@ -7,40 +7,21 @@
<div class="tight-form"> <div class="tight-form">
<ul class="tight-form-list pull-right"> <ul class="tight-form-list pull-right">
<li> <li class="tight-form-item">
<a bs-tooltip="'Group by\'s are always executed before aggregations!'" <div class="dropdown">
ng-click="alert('Group by\'s are always executed before aggregations!')"> <a class="pointer dropdown-toggle"
<i class="fa fa-info-circle"></i> data-toggle="dropdown"
</a> tabindex="1">
<i class="fa fa-bars"></i>
</a>
<ul class="dropdown-menu pull-right" role="menu">
<li role="menuitem"><a tabindex="1" ng-click="duplicate()">Duplicate</a></li>
<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index-1)">Move up</a></li>
<li role="menuitem"><a tabindex="1" ng-click="moveMetricQuery($index, $index+1)">Move down</a></li>
</ul>
</div>
</li> </li>
<li class="dropdown"> <li class="tight-form-item last">
<a class="pointer dropdown-toggle"
data-toggle="dropdown"
tabindex="1">
<i class="fa fa-cog"></i>
</a>
<ul class="dropdown-menu pull-right" role="menu">
<li role="menuitem">
<a tabindex="1"
ng-click="duplicate()">
Duplicate
</a>
</li>
<li role="menuitem">
<a tabindex="1"
ng-click="moveMetricQuery($index, $index-1)">
Move up
</a>
</li>
<li role="menuitem">
<a tabindex="1"
ng-click="moveMetricQuery($index, $index+1)">
Move down
</a>
</li>
</ul>
</li>
<li>
<a class="pointer" tabindex="1" ng-click="removeDataQuery(target)"> <a class="pointer" tabindex="1" ng-click="removeDataQuery(target)">
<i class="fa fa-remove"></i> <i class="fa fa-remove"></i>
</a> </a>
@ -48,17 +29,13 @@
</ul> </ul>
<ul class="tight-form-list"> <ul class="tight-form-list">
<li class="tight-form-item" style="min-width: 15px; text-align: center">
{{targetLetters[$index]}}
</li>
<li> <li>
<a class="tight-form-item" ng-click="target.hide = !target.hide; targetBlur();" role="menuitem"> <a class="tight-form-item" ng-click="target.hide = !target.hide; targetBlur();" role="menuitem">
<i class="fa fa-fw fa-eye"></i> <i class="fa fa-eye"></i>
</a> </a>
</li> </li>
<li> <li class="tight-form-item">
<input type="text" class="input-medium tight-form-input" ng-model="target.alias" Metric
spellcheck='false' placeholder="alias" ng-blur="targetBlur()">
</li> </li>
<li> <li>
<select style="width: 20em" <select style="width: 20em"
@ -75,7 +52,13 @@
<i class="fa fa-warning"></i> <i class="fa fa-warning"></i>
</a> </a>
</li> </li>
<li class="tight-form-item">
Alias
</li>
<li>
<input type="text" class="input-medium tight-form-input" ng-model="target.alias"
spellcheck='false' placeholder="alias" ng-blur="targetBlur()">
</li>
<li class="tight-form-item"> <li class="tight-form-item">
&nbsp;Peak filter &nbsp;Peak filter
<input class="input-medium" type="checkbox" ng-model="target.exOuter" ng-change="targetBlur()"> <input class="input-medium" type="checkbox" ng-model="target.exOuter" ng-change="targetBlur()">
@ -85,15 +68,14 @@
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
<!-- TAGS -->
<div class="tight-form"> <div class="tight-form">
<ul class="tight-form-list" role="menu"> <ul class="tight-form-list" role="menu">
<li class="tight-form-item" style="min-width: 15px; text-align: center"> <li class="tight-form-item">
</li> <i class="fa fa-eye invisible"></i>
<li>
<i class="fa fa-fw fa-eye invisible"></i>
</li> </li>
<li class="tight-form-item"> <li class="tight-form-item">
Filter by Tag: Tags
</li> </li>
<li ng-repeat="(key, value) in target.tags track by $index" class="tight-form-item"> <li ng-repeat="(key, value) in target.tags track by $index" class="tight-form-item">
{{key}}&nbsp;=&nbsp;{{value}} {{key}}&nbsp;=&nbsp;{{value}}
@ -135,14 +117,23 @@
<li class="tight-form-item" ng-show="addFilterTagMode"> <li class="tight-form-item" ng-show="addFilterTagMode">
<a ng-click="addFilterTag()"> <a ng-click="addFilterTag()">
<i ng-show="target.errors.tags" class="fa fa-remove"></i> <i ng-show="target.errors.tags" class="fa fa-remove"></i>
<i ng-hide="target.errors.tags" class="fa fa-plus"></i> <i ng-hide="target.errors.tags" class="fa fa-plus-circle"></i>
</a> </a>
</li> </li>
</li> </li>
</ul>
<div class="clearfix"></div>
</div>
<!-- TAGS GROUP BYS --> <!-- GROUP BY -->
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item"> <li class="tight-form-item">
Group by <i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item">
Group By
</li> </li>
<li class="tight-form-item" ng-show="target.groupByTags"> <li class="tight-form-item" ng-show="target.groupByTags">
@ -239,13 +230,21 @@
<li class="tight-form-item" ng-show="addGroupByMode"> <li class="tight-form-item" ng-show="addGroupByMode">
<a ng-click="addGroupBy()"> <a ng-click="addGroupBy()">
<i ng-hide="isGroupByValid" class="fa fa-remove"></i> <i ng-hide="isGroupByValid" class="fa fa-remove"></i>
<i ng-show="isGroupByValid" class="fa fa-plus"></i> <i ng-show="isGroupByValid" class="fa fa-plus-circle"></i>
</a> </a>
</li> </li>
<div class="clearfix"></div>
</div>
<!-- HORIZONTAL AGGREGATION --> <!-- HORIZONTAL AGGREGATION -->
<div class="tight-form">
<ul class="tight-form-list" role="menu">
<li class="tight-form-item"> <li class="tight-form-item">
Aggregation: <i class="fa fa-eye invisible"></i>
</li>
<li class="tight-form-item">
Aggregators
</li> </li>
<li ng-repeat="aggregatorObject in target.horizontalAggregators track by $index" class="tight-form-item"> <li ng-repeat="aggregatorObject in target.horizontalAggregators track by $index" class="tight-form-item">
{{aggregatorObject.name}}&#40; {{aggregatorObject.name}}&#40;
@ -336,7 +335,7 @@
<li class="tight-form-item" ng-show="addHorizontalAggregatorMode"> <li class="tight-form-item" ng-show="addHorizontalAggregatorMode">
<a ng-click="addHorizontalAggregator()"> <a ng-click="addHorizontalAggregator()">
<i ng-hide="isAggregatorValid" class="fa fa-remove"></i> <i ng-hide="isAggregatorValid" class="fa fa-remove"></i>
<i ng-show="isAggregatorValid" class="fa fa-plus"></i> <i ng-show="isAggregatorValid" class="fa fa-plus-circle"></i>
</a> </a>
</li> </li>
</ul> </ul>

2
public/app/plugins/datasource/kairosdb/queryCtrl.js
View File

@ -7,7 +7,6 @@ function (angular, _) {
var module = angular.module('grafana.controllers'); var module = angular.module('grafana.controllers');
var metricList = null; var metricList = null;
var targetLetters = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O'];
module.controller('KairosDBQueryCtrl', function($scope) { module.controller('KairosDBQueryCtrl', function($scope) {
@ -24,7 +23,6 @@ function (angular, _) {
$scope.target.downsampling = $scope.panel.downsampling; $scope.target.downsampling = $scope.panel.downsampling;
$scope.target.sampling = $scope.panel.sampling; $scope.target.sampling = $scope.panel.sampling;
} }
$scope.targetLetters = targetLetters;
$scope.updateMetricList(); $scope.updateMetricList();
$scope.target.errors = validateTarget($scope.target); $scope.target.errors = validateTarget($scope.target);
}; };