Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve search engine #16

Merged
merged 4 commits into from
Aug 2, 2017
Merged

Improve search engine #16

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
2f82bb7
Fix design search form
cryptobioz Aug 1, 2017
623d714
Add permalink creation, use url params
cryptobioz Aug 1, 2017
1900451
Remove absolute urls, fix attrVal bug
cryptobioz Aug 1, 2017
85f2e57
Fix attrVal bug
cryptobioz Aug 2, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
117 changes: 64 additions & 53 deletions static/search.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,63 +1,74 @@
<form class="form-inline">
<div class="form-group">
<div class="row">
<div class="col-sm-2">
<label for="resource_type">Resource Type</label>
<ui-select id="resource_type"
ng-model="$parent.resType"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Resource Type">
<ui-select-match placeholder="Resource Type">{{$parent.resType}}</ui-select-match>
<ui-select-choices repeat="k in resource_keys | filter: $select.search | orderBy">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class="form-group">
<div class="col-sm-2">
<label for="resource_id">Resource ID</label>
<ui-select id="resource_id"
ng-model="$parent.resID"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Resource ID">
<ui-select-match placeholder="Resource ID">{{$parent.resID}}</ui-select-match>
<ui-select-choices repeat="k in resource_names | filter: $parent.resType | filter: $select.search | orderBy">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class="form-group">
<div class="col-sm-2">
<label for="attribute_key">Attribute Key</label>
<ui-select id="attribute_key"
ng-model="$parent.attrKey"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Attribute Key">
<ui-select-match placeholder="Attribute Key">{{$parent.attrKey}}</ui-select-match>
<ui-select-choices
repeat="k in attribute_keys | filter: $select.search | orderBy"
refresh="refreshAttrKeys()"
refresh-delay="0">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class=form-group>
<label for="attribute_value">Attribute Value</label><br />
<input id="attribute_value" ng-model="$parent.attrVal" ng-change="doSearch()">
<div class="col-sm-2">
<label for="attribute_value">Attribute Value</label>
</div>
<div class=form-group>
<button class="clear" ng-click="clearForm()">Reset</button>
</div>
</form>
</div>
<div class="row">
<form class="form-inline" role="form">
<div class="form-group col-sm-2">
<ui-select id="resource_type"
ng-model="$parent.resType"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Resource Type">
<ui-select-match placeholder="Resource Type">{{$parent.resType}}</ui-select-match>
<ui-select-choices repeat="k in resource_keys | filter: $select.search | orderBy">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class="form-group col-sm-2">
<ui-select id="resource_id"
ng-model="$parent.resID"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Resource ID">
<ui-select-match placeholder="Resource ID">{{$parent.resID}}</ui-select-match>
<ui-select-choices repeat="k in resource_names | filter: $parent.resType | filter: $select.search | orderBy">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class="form-group col-sm-2">
<ui-select id="attribute_key"
ng-model="$parent.attrKey"
theme="bootstrap"
ng-disabled="disabled"
ng-change="doSearch()"
style="min-width: 200px;"
reset-search-input="false"
title="Attribute Key">
<ui-select-match placeholder="Attribute Key">{{$parent.attrKey}}</ui-select-match>
<ui-select-choices
repeat="k in attribute_keys | filter: $select.search | orderBy"
refresh="refreshAttrKeys()"
refresh-delay="0">
{{k}}
</ui-select-choices>
</ui-select>
</div>
<div class="form-group col-sm-2">
<input id="attribute_value" type="text" class="form-control" placeholder="Attribute Value" ng-model="$parent.attrVal" ng-change="doSearch()" />
</div>
<button class="btn btn-primary" type="submit" ng-click="createPermalink()">Permalink</button>
<button class="clear btn btn-warning" ng-click="clearForm()">Reset</button>
</form>
</div>
<hr />

<label id="navigate" ng-show="results">
Expand Down
16 changes: 16 additions & 0 deletions static/terraboard.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -193,3 +193,19 @@ pre.sh_sourceCode .sh_oldfile {
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.form-inline .ui-select-container .ui-select-toggle,
.form-inline .ui-select-container .ui-select-search {
width: 100%;
}
.ui-select-match-text{
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
padding-right: 40px;
}
.ui-select-toggle > .btn.btn-link {
margin-right: 10px;
top: 6px;
position: absolute;
right: 10px;
}
37 changes: 35 additions & 2 deletions static/terraboard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,7 +255,7 @@ app.controller("tbStateCtrl", ['$scope', '$http', '$location', function($scope,
});
}]);

app.controller("tbSearchCtrl", ['$scope', '$http', '$location', '$routeParams', function($scope, $http) {
app.controller("tbSearchCtrl", ['$scope', '$http', '$location', '$routeParams', function($scope, $http, $location) {
$http.get('api/resource/types').then(function(response){
$scope.resource_keys = response.data;
});
Expand Down Expand Up @@ -304,6 +304,18 @@ app.controller("tbSearchCtrl", ['$scope', '$http', '$location', '$routeParams',
}

// On page load
if ($location.search().type != "") {
$scope.resType = $location.search().type;
}
if ($location.search().name != "") {
$scope.resID = $location.search().name;
}
if ($location.search().key != "") {
$scope.attrKey = $location.search().key;
}
if ($location.search().val != "") {
$scope.attrVal = $location.search().value;
}
$scope.doSearch(1);

$scope.clearForm = function() {
Expand All @@ -312,6 +324,27 @@ app.controller("tbSearchCtrl", ['$scope', '$http', '$location', '$routeParams',
$scope.attrKey = undefined;
$scope.attrVal = undefined;
$scope.results = undefined;
$scope.doSearch(1);
$location.url('/search');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Two comments here:

  • absolute URLs break with the base href, only use relative URLs;
  • why not use $location.search() instead?

}

$scope.createPermalink = function(page) {
var params = {};
if ($scope.resType != "") {
params.type = $scope.resType;
}
if ($scope.resID != "") {
params.name = $scope.resID;
}
if ($scope.attrKey != "") {
params.key = $scope.attrKey;
}
if ($scope.attrVal != "") {
params.value = $scope.attrVal;
}
if (page != undefined) {
params.page = page;
}
var query = $.param(params);
$location.url('/search?'+query);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Again, do not use absolute URLs here.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On my screen, the fields are a bit on top of each other for some reason

screenshot from 2017-08-01 20-10-54

}
}]);