IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-11-26 19:00:54 -06:00
Code Issues Packages Projects Releases Wiki Activity

feat(annotations): polished up the annotation editor tabs, similar to recent commits for templating editor

Browse Source
This commit is contained in:
Torkel Ödegaard 2015-09-08 16:59:39 +02:00
parent 26d8a041ef
commit 3e9e34afb8
3 changed files with 33 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
public/app/features/annotations/editorCtrl.js
View File

@ -20,15 +20,13 @@ function (angular, _, $) {
};
$scope.init = function() {
$scope.editor = { index: 0 };
$scope.mode = 'list';
$scope.datasources = datasourceSrv.getAnnotationSources();
$scope.annotations = $scope.dashboard.annotations.list;
$scope.reset();
$scope.$watch('editor.index', function(newVal) {
if (newVal !== 2) {
$scope.reset();
}
$scope.$watch('mode', function(newVal) {
if (newVal === 'new') { $scope.reset(); }
});
};
@ -43,8 +41,8 @@ function (angular, _, $) {
$scope.currentAnnotation = annotation;
$scope.currentIsNew = false;
$scope.datasourceChanged();
$scope.mode = 'edit';
$scope.editor.index = 2;
$(".tooltip.in").remove();
};
@ -57,14 +55,14 @@ function (angular, _, $) {
$scope.update = function() {
$scope.reset();
$scope.editor.index = 0;
$scope.mode = 'list';
$scope.broadcastRefresh();
};
$scope.add = function() {
$scope.annotations.push($scope.currentAnnotation);
$scope.reset();
$scope.editor.index = 0;
$scope.mode = 'list';
$scope.updateSubmenuVisibility();
$scope.broadcastRefresh();
};

34
public/app/features/annotations/partials/editor.html
View File

@ -6,9 +6,27 @@
Annotations
</div>
<div ng-model="editor.index" bs-tabs style="text-transform:capitalize;">
<div ng-repeat="tab in ['Overview', 'Add', 'Edit']" data-title="{{tab}}">
</div>
<div class="tabs">
<ul class="nav nav-tabs">
<li ng-class="{active: mode === 'list'}">
<a ng-click="mode = 'list';">
List
</a>
</li>
<li ng-class="{active: mode === 'edit'}" ng-show="mode === 'edit'">
<a>
{{currentAnnotation.name}}
</a>
</li>
<li ng-class="{active: mode === 'new'}">
<a ng-click="mode = 'new';">
<i class="fa fa-plus"></i>
New
</a>
</li>
</ul>
</div>
<button class="gf-box-header-close-btn" ng-click="dismiss();">
@ -17,7 +35,8 @@
</div>
<div class="gf-box-body">
<div class="editor-row row" ng-if="editor.index == 0">
<div class="editor-row row" ng-if="mode === 'list'">
<div class="span6">
<div ng-if="annotations.length === 0">
<em>No annotations defined</em>
@ -47,7 +66,7 @@
</div>
</div>
<div ng-if="editor.index == 1 || (editor.index == 2 && !currentIsNew)">
<div ng-if="mode === 'edit' || mode === 'new'">
<div class="editor-row">
<div class="editor-option">
<label class="small">Name</label>
@ -75,11 +94,10 @@
<datasource-editor-view datasource="currentAnnotation.datasource" name="annotations-query-editor"></datasource-editor-view>
<br>
<button ng-show="editor.index === 1" type="button" class="btn btn-success" ng-click="add()">Add</button>
<button ng-show="editor.index === 2" type="button" class="btn btn-success pull-left" ng-click="update();">Update</button>
<button ng-show="mode === 'new'" type="button" class="btn btn-success" ng-click="add()">Add</button>
<button ng-show="mode === 'edit'" type="button" class="btn btn-success pull-left" ng-click="update();">Update</button>
<br>
<br>
</div>
</div>
</div>

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

@ -58,7 +58,7 @@ function (angular, _) {
if ($scope.target.rawQuery) {
delete $scope.target.rawQuery;
} else {
$scope.target.rawQuery = $scope.rawQueryOld;
$scope.target.rawQuery = angular.toJson($scope.datasource.queryBuilder.build($scope.target), true);
}
};