[tor-commits] [atlas/master] Adds an initial advanced search form (See: #23782)
irl at torproject.org
irl at torproject.org
Mon Nov 27 12:17:46 UTC 2017
commit 4e86a0d1dc697325ddfe200cbc503617d98d3648
Author: Iain R. Learmonth <irl at fsfe.org>
Date: Mon Nov 27 12:16:18 2017 +0000
Adds an initial advanced search form (See: #23782)
---
css/atlas.css | 10 ++----
js/router.js | 6 ++++
js/views/search/main.js | 46 ++++++++++++++++++++++--
templates/search/main.html | 88 ++++++++++++++++++++++++++++++++++++++++++++++
4 files changed, 141 insertions(+), 9 deletions(-)
diff --git a/css/atlas.css b/css/atlas.css
index b027534..ac1c410 100644
--- a/css/atlas.css
+++ b/css/atlas.css
@@ -52,22 +52,18 @@ span.flags {
background: #ff1515;
}
-#home-search, #home-aggregate-search {
+#home-search, #home-aggregate-search, #home-advanced-search {
padding: 0;
margin: 0 0 10px 0;
width: 100%;
}
-.search-query {
- max-width: none;
-}
-
td, th {
padding: 2px!important;
}
-table input {
- width: 100%;
+.form-control {
+ max-width: none !important;
}
.flags-cell {
diff --git a/js/router.js b/js/router.js
index 8052f82..6b029bd 100644
--- a/js/router.js
+++ b/js/router.js
@@ -207,6 +207,12 @@ define([
$('#aggregated-search-tab-content').fadeIn();
$('.search-tabs').removeClass('active');
$('#aggregated-search-tab').addClass('active');
+ } else if (actions == "advanced") {
+ $('.search').hide();
+ $('#advanced-search-tab-content').fadeIn();
+ $('.search-tabs').removeClass('active');
+ $('#advanced-search-tab').addClass('active');
+ $('.well').hide();
} else {
$('.search').hide();
$('#main-search-tab-content').fadeIn();
diff --git a/js/views/search/main.js b/js/views/search/main.js
index 6eedbe2..92ae96f 100644
--- a/js/views/search/main.js
+++ b/js/views/search/main.js
@@ -4,15 +4,16 @@ define([
'underscore',
'backbone',
'text!templates/search/main.html',
+ 'helpers',
], function($, _, Backbone, mainSearchTemplate){
var mainSearchView = Backbone.View.extend({
el: "#content",
render: function(query){
document.title = "Relay Search";
- var data = {};
+ var data = {countries: CountryCodes};
var compiledTemplate = _.template(mainSearchTemplate);
- this.$el.html(compiledTemplate, data);
+ this.$el.html(compiledTemplate(data));
$("#do-top-relays").bind('click', function(){
document.location = "#toprelays";
@@ -43,6 +44,47 @@ define([
document.location = "#aggregate/all/"+encodeURI($('#aggregated-query').val());
return false;
});
+
+ var buildAdvancedQuery = function(){
+ var query = "";
+ if($('#advanced-search-nickname').val().trim() != "") query += $('#advanced-search-nickname').val().trim() + " ";
+ if($('#advanced-search-family')[0].checked) {
+ if($('#advanced-search-fingerprint').val().trim() != "") query += "family:" + $('#advanced-search-fingerprint').val().trim().split(" ")[0] + " ";
+ } else {
+ if($('#advanced-search-fingerprint').val().trim() != "") query += "fingerprint:" + $('#advanced-search-fingerprint').val().trim().split(" ")[0] + " ";
+ }
+ if($('#advanced-search-flag').val() !== "") query += "flag:" + $('#advanced-search-flag').val() + " ";
+ if($('#advanced-search-country').val() !== "") query += "country:" + $('#advanced-search-country').val() + " ";
+ if($('#advanced-search-as').val().trim() !== "") query += "as:" + $('#advanced-search-as').val().trim() + " ";
+ if($('#advanced-search-contact').val().trim() != "") query += "contact:" + $('#advanced-search-contact').val().trim().split(" ")[0] + " ";
+ if($('#advanced-search-hostname').val().trim() != "") query += "host_name:" + $('#advanced-search-hostname').val().trim().split(" ")[0] + " ";
+ if($('#advanced-search-type').val() !== "") query += "type:" + $('#advanced-search-type').val() + " ";
+ if($('#advanced-search-running').val() !== "") query += "running:" + $('#advanced-search-running').val() + " ";
+ return query;
+ }
+
+ $("#do-advanced").bind('click', function(){
+ var query = buildAdvancedQuery();
+ document.location = "#search/"+encodeURI(query);
+ });
+
+ $("#do-advanced-aggregation").bind('click', function(){
+ var query = buildAdvancedQuery();
+ document.location = "#aggregate/all/"+encodeURI(query);
+ });
+
+ $("#do-advanced-aggregation-cc").bind('click', function(){
+ var query = buildAdvancedQuery();
+ document.location = "#aggregate/cc/"+encodeURI(query);
+ });
+
+ $("#do-advanced-aggregation-as").bind('click', function(){
+ var query = buildAdvancedQuery();
+ document.location = "#aggregate/as/"+encodeURI(query);
+ });
+
+ $(".tip").tooltip();
+
}
});
return new mainSearchView;
diff --git a/templates/search/main.html b/templates/search/main.html
index 9c62548..6dc522b 100644
--- a/templates/search/main.html
+++ b/templates/search/main.html
@@ -1,6 +1,7 @@
<ul class="nav nav-tabs">
<li id="main-search-tab" class="search-tabs active"><a href="#simple">Simple Search</a></li>
<li id="aggregated-search-tab" class="search-tabs"><a href="#aggregate">Aggregated Search</a></li>
+ <li id="advanced-search-tab" class="search-tabs"><a href="#advanced">Advanced Search</a></li>
</ul>
<div class="tab-content" id="search-tab-content">
@@ -33,6 +34,93 @@ do not include bridge data.</p>
</div>
</div>
+<div id="advanced-search-tab-content" class="search tab-pane">
+
+ <p>The advanced search tool allows you to build advanced queries to search
+for data about single relays and bridges in the Tor network or aggregated data about currently running relays. For single relays, it provides useful
+information on how relays are configured along with graphs about their
+past. Aggregated data provides insight into diversity in the network and the
+probabilities of using relays in a particular country or AS as a guard, middle
+or exit relay filtered by the search parameters.</p>
+<div class="panel panel-default"><div class="panel-body">
+ <form id="home-advanced-search">
+ <div class="form-group">
+ <label for="advanced-search-nickname">Nickname:</label>
+ <input type="text" class="form-control search-query" autocorrect="off" autocapitalize="off" id="advanced-search-nickname">
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-fingerprint">Fingerprint:</label>
+ <div class="input-group">
+ <input type="text" class="form-control" autocorrect="off" autocapitalize="off" id="advanced-search-fingerprint">
+ <span class="input-group-addon"><input type="checkbox" id="advanced-search-family"> Include Family</span>
+ </div>
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-nickname">Contact:</label>
+ <input type="text" class="form-control search-query" autocorrect="off" autocapitalize="off" id="advanced-search-contact">
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-flag">Flag:</label>
+ <select class="form-control" id="advanced-search-flag">
+ <option value="">Any</option>
+ <option value="stable">Stable</option>
+ <option value="running">Running</option>
+ <option value="fast">Fast</option>
+ <option value="guard">Guard</option>
+ <option value="exit">Exit</option>
+ <option value="authority">Authority</option>
+ <option value="noedconsensus">NoEdConsensus</option>
+ </select>
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-country">Country:</label>
+ <select class="form-control" id="advanced-search-country">
+ <option value="">Any</option>
+ <% var knownCountries = Object.keys(countries); knownCountries.sort(); %>
+ <% _.each(knownCountries, function(country){ %>
+ <option value="<%= country %>"><%= country %> - <%= countries[country] %></option>
+ <% }); %>
+ </select>
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-as">Autonomous System:</label>
+ <div class="input-group">
+ <span class="input-group-addon">AS</span>
+ <input type="text" id="advanced-search-as" class="search-query form-control">
+ </div>
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-nickname">Hostname:</label>
+ <input type="text" class="form-control search-query" autocorrect="off" autocapitalize="off" id="advanced-search-hostname">
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-flag">Type<sup>†</sup>:</label>
+ <select class="form-control" id="advanced-search-type">
+ <option value="">Any</option>
+ <option value="relay">Only Relays</option>
+ <option value="bridge">Only Bridges</option>
+ </select>
+ </div>
+ <div class="form-group">
+ <label for="advanced-search-flag">Running<sup>†</sup>:</label>
+ <select class="form-control" id="advanced-search-running">
+ <option value="">Any</option>
+ <option value="true">Only Running Relays</option>
+ <option value="false">Only Offline Relays</option>
+ </select>
+ </div>
+ <p><button id="do-advanced" class="btn btn-primary" type="button">Advanced Search</button></p>
+ <p>
+ <button id="do-advanced-aggregation" class="btn btn-primary" type="button">Advanced Aggregation</button>
+ <button id="do-advanced-aggregation-cc" class="btn btn-secondary tip" type="button" title="Aggregate by Country">by CC</button>
+ <button id="do-advanced-aggregation-as" class="btn btn-secondary tip" type="button" title="Aggregate by Autonomous System">by AS</button>
+ </p>
+ </form>
+ <p><sup>†</sup> These options are ignored when performing an aggregation as the aggregated searches are restricted to only currently running relays.</p>
+</div></div><!-- /panel -->
+ </div>
+</div>
+
<div class="well">
<p>You can search for Tor relays and bridges by using keywords. In
particular, this tool enables you to search for (partial) nicknames (e.g.,
More information about the tor-commits
mailing list