Commit dceda6e2 by Torkel Ödegaard

Closes #86, dashboard tags and tag search feature is now done! turned out pretty good!

parent ef264920
...@@ -14,6 +14,7 @@ function (angular, _, config, $) { ...@@ -14,6 +14,7 @@ function (angular, _, config, $) {
$scope.init = function() { $scope.init = function() {
$scope.giveSearchFocus = 0; $scope.giveSearchFocus = 0;
$scope.selectedIndex = -1; $scope.selectedIndex = -1;
$scope.results = {dashboards: [], tags: [], metrics: []};
$scope.query = { query: 'title:' }; $scope.query = { query: 'title:' };
$rootScope.$on('open-search', $scope.openSearch); $rootScope.$on('open-search', $scope.openSearch);
}; };
...@@ -29,7 +30,15 @@ function (angular, _, config, $) { ...@@ -29,7 +30,15 @@ function (angular, _, config, $) {
$scope.selectedIndex--; $scope.selectedIndex--;
} }
if (evt.keyCode === 13) { if (evt.keyCode === 13) {
var selectedDash = $scope.search_results.dashboards[$scope.selectedIndex]; if ($scope.tagsOnly) {
var tag = $scope.results.tags[$scope.selectedIndex];
if (tag) {
$scope.filterByTag(tag.term);
}
return;
}
var selectedDash = $scope.results.dashboards[$scope.selectedIndex];
if (selectedDash) { if (selectedDash) {
$location.path("/dashboard/elasticsearch/" + encodeURIComponent(selectedDash._id)); $location.path("/dashboard/elasticsearch/" + encodeURIComponent(selectedDash._id));
setTimeout(function(){ setTimeout(function(){
...@@ -39,9 +48,14 @@ function (angular, _, config, $) { ...@@ -39,9 +48,14 @@ function (angular, _, config, $) {
} }
}; };
$scope.elasticsearch_dashboards = function(query) { $scope.searchDasboards = function(query) {
var request = $scope.ejs.Request().indices(config.grafana_index).types('dashboard'); var request = $scope.ejs.Request().indices(config.grafana_index).types('dashboard');
var tagsOnly = query.indexOf('tags!:') === 0;
if (tagsOnly) {
var tagsQuery = query.substring(6, query.length);
query = 'tags:' + tagsQuery + '*';
}
else {
if (query.length === 0) { if (query.length === 0) {
query = 'title:'; query = 'title:';
} }
...@@ -49,6 +63,7 @@ function (angular, _, config, $) { ...@@ -49,6 +63,7 @@ function (angular, _, config, $) {
if (query[query.length - 1] !== '*') { if (query[query.length - 1] !== '*') {
query += '*'; query += '*';
} }
}
return request return request
.query($scope.ejs.QueryStringQuery(query)) .query($scope.ejs.QueryStringQuery(query))
...@@ -58,28 +73,31 @@ function (angular, _, config, $) { ...@@ -58,28 +73,31 @@ function (angular, _, config, $) {
.then(function(results) { .then(function(results) {
if(_.isUndefined(results.hits)) { if(_.isUndefined(results.hits)) {
$scope.search_results = { dashboards: [] }; $scope.results.dashboards = [];
$scope.results.tags = [];
return; return;
} }
$scope.search_results = { dashboards: results.hits.hits }; $scope.tagsOnly = tagsOnly;
$scope.tags = results.facets.tags.terms; $scope.results.dashboards = results.hits.hits;
$scope.results.tags = results.facets.tags.terms;
}); });
}; };
$scope.filterByTag = function(tag, evt) { $scope.filterByTag = function(tag, evt) {
$scope.query.query = "tags:" + tag + " AND title:"; $scope.query.query = "tags:" + tag + " AND title:";
$scope.search(); $scope.search();
$scope.tagsOnly = false;
$scope.giveSearchFocus = $scope.giveSearchFocus + 1; $scope.giveSearchFocus = $scope.giveSearchFocus + 1;
if (evt) {
evt.stopPropagation(); evt.stopPropagation();
evt.preventDefault(); evt.preventDefault();
}
}; };
$scope.showTags = function(evt) { $scope.showTags = function(evt) {
evt.stopPropagation(); evt.stopPropagation();
$scope.tagsOnly = !$scope.tagsOnly; $scope.tagsOnly = !$scope.tagsOnly;
$scope.query.query = $scope.tagsOnly ? "tags!" : ""; $scope.query.query = $scope.tagsOnly ? "tags!:" : "";
$scope.giveSearchFocus = $scope.giveSearchFocus + 1; $scope.giveSearchFocus = $scope.giveSearchFocus + 1;
$scope.selectedIndex = -1; $scope.selectedIndex = -1;
}; };
...@@ -92,7 +110,7 @@ function (angular, _, config, $) { ...@@ -92,7 +110,7 @@ function (angular, _, config, $) {
if (queryStr.indexOf('m:') !== 0) { if (queryStr.indexOf('m:') !== 0) {
queryStr = queryStr.replace(' and ', ' AND '); queryStr = queryStr.replace(' and ', ' AND ');
$scope.elasticsearch_dashboards(queryStr); $scope.searchDasboards(queryStr);
return; return;
} }
...@@ -115,10 +133,10 @@ function (angular, _, config, $) { ...@@ -115,10 +133,10 @@ function (angular, _, config, $) {
results.then(function(results) { results.then(function(results) {
if (results && results.hits && results.hits.hits.length > 0) { if (results && results.hits && results.hits.hits.length > 0) {
$scope.search_results = { metrics: results.hits.hits }; $scope.results.metrics = { metrics: results.hits.hits };
} }
else { else {
$scope.search_results = { metric: [] }; $scope.results.metrics = { metric: [] };
} }
}); });
}; };
......
...@@ -41,23 +41,23 @@ ...@@ -41,23 +41,23 @@
</span> </span>
</div> </div>
<h6 ng-hide="search_results.dashboards.length || search_results.metrics.length">No dashboards or metrics matching your query found</h6> <h6 ng-hide="results.dashboards.length || results.metrics.length">No dashboards or metrics matching your query found</h6>
<table class="table table-condensed table-striped" ng-if="tagsOnly"> <table class="table table-condensed table-striped" ng-if="tagsOnly">
<tr ng-repeat="tag in tags" ng-class="{'selected-tag': $index === selectedIndex }"> <tr ng-repeat="tag in results.tags" ng-class="{'selected-tag': $index === selectedIndex }">
<td> <td>
<a ng-click="filterByTag(tag.term, $event)" class="label label-tag"> <a ng-click="filterByTag(tag.term, $event)" class="label label-tag">
{{tag.term}} {{tag.term}} &nbsp;({{tag.count}})
</a> </a>
</td> </td>
<td style="width:100%;"> <td style="width:100%;padding-left: 10px;font-weight: bold;">
{{tag.count}}
</td> </td>
</tr> </tr>
</table> </table>
<table class="table table-condensed table-striped" ng-if="!tagsOnly"> <table class="table table-condensed table-striped" ng-if="!tagsOnly">
<tr bindonce ng-repeat="row in search_results.metrics" <tr bindonce ng-repeat="row in results.metrics"
class="grafana-search-metric-result" class="grafana-search-metric-result"
ng-class="{'selected': $index === selectedIndex }"> ng-class="{'selected': $index === selectedIndex }">
<td><span class="label label-info">metric</span></td> <td><span class="label label-info">metric</span></td>
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
</tr> </tr>
<tr bindonce <tr bindonce
ng-repeat="row in search_results.dashboards" ng-repeat="row in results.dashboards"
ng-class="{'selected': $index === selectedIndex }"> ng-class="{'selected': $index === selectedIndex }">
<td><a confirm-click="elasticsearch_delete(row._id)" confirmation="Are you sure you want to delete the {{row._id}} dashboard"><i class="icon-remove"></i></a></td> <td><a confirm-click="elasticsearch_delete(row._id)" confirmation="Are you sure you want to delete the {{row._id}} dashboard"><i class="icon-remove"></i></a></td>
<td style="width:100%"> <td style="width:100%">
......
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