Skip to content

Commit 659690b

Browse files
jettrojettro
committed
Added highlighting and did some formatting for the client
1 parent 6cba024 commit 659690b

File tree

6 files changed

+98
-22
lines changed

6 files changed

+98
-22
lines changed

‎js/controllers.js‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,7 @@ function QueryCtrl($scope, $dialog, ejsResource, elastic) {
121121
$scope.chosenTypes = [];
122122
$scope.chosenFields = [];
123123
$scope.changeQuery();
124+
$scope.search.type = "or";
124125
};
125126

126127
$scope.changeQuery = function () {
@@ -132,7 +133,7 @@ function QueryCtrl($scope, $dialog, ejsResource, elastic) {
132133
backdrop: true,
133134
keyboard: true,
134135
backdropClick: true,
135-
templateUrl: 'templates/dialog/facet.html',
136+
templateUrl: 'template/dialog/facet.html',
136137
controller: 'FacetDialogCtrl',
137138
resolve: {fields: angular.copy($scope.fields)}};
138139
var d = $dialog.dialog(opts);
@@ -152,7 +153,13 @@ function QueryCtrl($scope, $dialog, ejsResource, elastic) {
152153
request.fields($scope.chosenFields);
153154
}
154155
if ($scope.search.term.length > 0) {
155-
request.query(ejs.TermQuery("_all", $scope.search.term));
156+
var matchQuery = ejs.MatchQuery("_all", $scope.search.term);
157+
if ($scope.search.type === 'phrase') {
158+
matchQuery.type('phrase');
159+
} else {
160+
matchQuery.operator($scope.search.type);
161+
}
162+
request.query(matchQuery);
156163
} else {
157164
request.query(ejs.MatchAllQuery());
158165
}
@@ -187,6 +194,11 @@ function QueryCtrl($scope, $dialog, ejsResource, elastic) {
187194

188195

189196
request.explain($scope.search.explain);
197+
if ($scope.search.highlight) {
198+
var highlight = ejs.Highlight();
199+
highlight.fields($scope.chosenFields);
200+
request.highlight(highlight);
201+
}
190202
return request;
191203
}
192204

‎js/directives.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ angular.module('myApp.directives', []).
1515
transclude: true,
1616
scope: {heading: '@'},
1717
controller: 'NavbarCtrl',
18-
templateUrl: 'templates/navbar/navbar.html',
18+
templateUrl: 'template/navbar/navbar.html',
1919
replace: true,
2020
link: function ($scope, $element, $attrs, navbarCtrl) {
2121
$scope.$location = $location;

‎partials/query.html‎

Lines changed: 74 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,19 @@
11
<div class="row-fluid">
2-
<div class="span2"><p class="text-info">Available indexes:</p></div>
2+
<div class="span12">
3+
<div class="alert">
4+
<p>This page is about providing a very basic search and check the query that is created. This way you
5+
can learn about creating queries and the result of those query against the data in your ElasticSearch
6+
instance.</p>
7+
</div>
8+
</div>
9+
</div>
10+
11+
<div class="row-fluid">
12+
<div class="span2"><span class="text-info">Available indexes:</span>
13+
<button popover-placement="right"
14+
popover="Here you can select the index that we query over. If you select nothing, we query over all data"
15+
class="btn btn-mini btn-link"><i class="icon-question-sign"></i></button>
16+
</div>
317
<div class="span10">
418
<div id="chooseIndexBtn" class="btn-group" data-toggle="buttons-checkbox">
519
<div class="btn btn-mini" ng-click="chooseIndex(key)" ng-repeat="(key,value) in indices">{{key}}</div>
@@ -8,7 +22,12 @@
822
</div>
923

1024
<div class="row-fluid">
11-
<div class="span2"><p class="text-info">Available types:</p></div>
25+
<div class="span2"><span class="text-info">Available types:</span>
26+
<button popover-placement="right"
27+
popover="Here you can select the type of documents that we query over. If you select nothing, all types are used for the query.
28+
Beware, if you select a type that is not available in the chosen index you see nothing."
29+
class="btn btn-mini btn-link"><i class="icon-question-sign"></i></button>
30+
</div>
1231
<div class="span10">
1332
<div id="chooseTypeBtn" class="btn-group" data-toggle="buttons-checkbox">
1433
<div class="btn btn-mini" ng-click="chooseType(type)" ng-repeat="type in types">{{type}}</div>
@@ -18,7 +37,12 @@
1837

1938
<div class="row-fluid" style="padding-bottom: 5px">
2039
<form class="form-horizontal">
21-
<div class="span2"><p class="text-info">Available Fields:</p></div>
40+
<div class="span2"><span class="text-info">Available Fields:</span>
41+
<button popover-placement="right"
42+
popover="Here you can select the fields that we obtain and that we show on screen. If you select nothing, we also show nothing
43+
on the screen. When the highlight checkbox is checked we use highlighting when showing the fields."
44+
class="btn btn-mini btn-link"><i class="icon-question-sign"></i></button>
45+
</div>
2246
<div class="span10">
2347
<select ng-model="queryFactory.addField">
2448
<option ng-repeat="field in fields">{{field}}</option>
@@ -37,12 +61,16 @@
3761

3862
<div class="row-fluid">
3963
<div class="span2">
40-
<span class="text-info">Facets</span> <span class="btn btn-info btn-mini" ng-click="openDialog()"
41-
title="Add new Facet">
42-
<i class="icon-plus-sign icon-white"></i>
43-
</span>
64+
<span class="text-info">Facets</span>
65+
<button popover-placement="right"
66+
popover="Here you can select the facets to return. A few basic types are available. Use the Facets screen to do more advanced stuff with facets."
67+
class="btn btn-mini btn-link"><i class="icon-question-sign"></i></button>
68+
4469
</div>
4570
<div class="span10">
71+
<span class="btn btn-info btn-mini" ng-click="openDialog()" title="Add new Facet">
72+
<i class="icon-plus-sign icon-white"></i>
73+
</span>
4674
<span ng-repeat="facet in facets">{{facet.field}} ({{facet.facetType}})
4775
<span class="btn btn-mini" ng-click="removeFacetField(facet.field)" title="Remove facet Field">
4876
<i class="icon-remove-sign"></i>
@@ -52,22 +80,43 @@
5280
</div>
5381

5482
<form novalidate class="form-search">
55-
<div class="row-fluid" style="padding-bottom: 5px">
56-
<div class="span2"><p class="text-info">Search for:</p></div>
83+
<div class="row-fluid">
84+
<div class="span2">
85+
<span class="text-info">Query configuration</span>
86+
<button popover-placement="right"
87+
popover="Here you can configure some additional items on the query. You can change the default OR searching to AND searching and even PHRASE
88+
searching. All queries use the Match query type. If you want to do more advanced queries using search by field for instance use another part of this application.
89+
If you select the explain option you'll learn more about the scoring of the returned results. When selecting highlighting we also show the highlighted fields."
90+
class="btn btn-mini btn-link"><i class="icon-question-sign"></i></button>
91+
92+
</div>
5793
<div class="span10">
58-
<input type="text" class="input-medium search-query" ng-model="search.term" ng-change=""/>
59-
<span class="btn btn-primary" ng-click="executeQuery()" title="Execute query">Query <i
60-
class="icon-search icon-white"></i></span>
61-
<span class="btn btn-info" ng-click="changeQuery()" title="Check Query"><i
94+
<span class="btn btn-info btn-mini" ng-click="changeQuery()" title="Check Query"><i
6295
class="icon-check icon-white"></i></span>
63-
<span class="btn btn-info" ng-click="resetQuery()" title="Reset all choices"><i
96+
<span class="btn btn-info btn-mini" ng-click="resetQuery()" title="Reset all choices"><i
6497
class="icon-refresh icon-white"></i></span>
98+
<span class="text-info">Query Type</span>
99+
<label class="radio">
100+
<input type="radio" ng-model="search.type" value="or">OR
101+
</label>
102+
<label class="radio">
103+
<input type="radio" ng-model="search.type" value="and">AND
104+
</label>
105+
<label class="radio">
106+
<input type="radio" ng-model="search.type" value="phrase">PHRASE
107+
</label>
108+
<span class="text-info"> Use explain:</span>
109+
<label class="checkbox"><input type="checkbox" ng-model="search.explain"/></label>
110+
<span class="text-info">, Use highlighting:</span>
111+
<label class="checkbox"><input type="checkbox" ng-model="search.highlight"/></label>
65112
</div>
66113
</div>
67-
<div class="row-fluid">
68-
<div class="span12">
69-
<span class="text-info">Use explain:</span>
70-
<label class="checkbox"><input type="checkbox" ng-model="search.explain"/></label>
114+
<div class="row-fluid" style="padding-bottom: 5px">
115+
<div class="span12 alert alert-info">
116+
<span class="text-info offset1">Search for:</span>
117+
<input type="text" class="input-medium search-query span4" ng-model="search.term" ng-change=""/>
118+
<span class="btn btn-primary" ng-click="executeQuery()" title="Execute query">Query <i
119+
class="icon-search icon-white"></i></span>
71120
</div>
72121
</div>
73122
</form>
@@ -142,12 +191,18 @@ <h3>Results</h3>
142191
</table>
143192
</div>
144193
<div class="span4">
145-
<table class="table table-condensed">
194+
<table class="table table-condensed" ng-hide="search.highlight">
146195
<tr ng-repeat="(key,value) in doc.fields">
147196
<th>{{key}}</th>
148197
<td>{{value}}</td>
149198
</tr>
150199
</table>
200+
<table class="table table-condensed" ng-show="search.highlight">
201+
<tr ng-repeat="(key,value) in doc.highlight">
202+
<th>{{key}}</th>
203+
<td><p ng-repeat="item in value">{{item}}</p></td>
204+
</tr>
205+
</table>
151206
</div>
152207
<div class="span4">
153208
<h3 ng-hide="!search.explain">Explanation</h3>

‎templates/dialog/facet.html‎ renamed to ‎template/dialog/facet.html‎

File renamed without changes.

‎templates/navbar/navbar.html‎ renamed to ‎template/navbar/navbar.html‎

File renamed without changes.

‎template/popover/popover.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<div class="popover {{placement}}" ng-class="{ in: isOpen(), fade: animation() }">
2+
<div class="arrow"></div>
3+
4+
<div class="popover-inner">
5+
<h3 class="popover-title" ng-bind="popoverTitle" ng-show="popoverTitle"></h3>
6+
7+
<div class="popover-content" ng-bind="popoverContent"></div>
8+
</div>
9+
</div>

0 commit comments

Comments
 (0)