-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
162 lines (139 loc) · 5.66 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
<html>
<head>
<title>Choose the network reconstruction method that's best for you</title>
<link href='http://fonts.googleapis.com/css?family=Oswald:300|Roboto+Slab:300' rel='stylesheet' type='text/css'>
<meta charset="utf-8" />
<link rel="stylesheet" href="choice_tree.css" type="text/css" />
</head>
<body>
<div id="container">
<a href="https://github.com/olavolav/ChooseReconstruction" target="_blank">
<img id="github_fork_ribbon" src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png" alt="Fork me on GitHub">
</a>
<header>
<h1>Dear neuroscientist</h1>
<h2>choose your reconstruction method</h2>
<p>Finding the right statistical tool to analyze structural connectivity can be<br/>
tough, since there are so many out there. We can help, though!</p>
</header>
<div id='criteria'>
<h2>Adjust the criteria to restrict your search</h2>
<div class='spacer'> </div>
<div id='criteria-data-types'>
<h3>Please select what data you want the method to be able to work with:</h3>
<ul><!-- list is generated dynamically --></ul>
</div>
<div id='criteria-features'>
<h3>Please select what other properties the method should have:</h3>
<ul><!-- list is generated dynamically --></ul>
</div>
<div id='filterstats'>
Please specify your criteria.
</div>
</div>
<ul id='choice_tree'>
<!-- list is generated dynamically -->
</ul>
<footer>
Note that the information of methods marked with the star symbol ☆ has been verified by the authors of the paper shown as reference.<br/>
<span class="method_count">There are currently 0 methods listed. (Please enable JavaScript to use this app.)</span>
<!-- number is updated dynamically -->
Want to add your own? Please do <a href="mailto:[email protected]">contact us</a>.
<p>Last update: September 2015</p>
<p id="impressum_trigger">Click <a onClick="$('#impressum').show();$('#impressum_trigger').hide();">here to display legal notice (Impressum)</a>.</p>
<p id="impressum" style="display:none">
<strong>Impressum:</strong> (§5 Telemediengesetz)<br/>
Dr. Olav Stetter<br/>
Max Planck Institute for Dynamics and Self-Organization<br/>
Am Fassberg 17, 37077 Göttingen, Germany<br/>
E-mail: <a href="mailto:[email protected]">[email protected]</a><br/>
</p>
<p>Design by <a href="http://www.subvergedesign.com/">Ben Hartley</a>.</p>
</footer>
</div>
<div id='modal'>
<!-- modal is generated dynamically -->
</div>
<script type="text/template" id="category-template">
<ul class="filter-btn-group">
<% var c_name = ''; %>
<% c_name = "filter-btn-yes-inactive"; %>
<% if(value===1) { c_name = "filter-btn-yes-active"; } %>
<li class="filter-btn <%= c_name %>" data-id='1'>✓</li>
<% if(!data_type_filter){ %>
<% c_name = "filter-btn-no-inactive"; %>
<% if(value===-1) { c_name = "filter-btn-no-active"; } %>
<li class="filter-btn <%= c_name %>" data-id='-1'>✗</li>
<% } %>
</ul>
<span class='name'><%= name %> <span class='filter_tooltip_icon badge'>i</span></span>
<div class='filter_help_text'><%= help_text %></div>
</script>
<script type="text/template" id="method-template">
<h2><%= name %>
<% if(verified_by_author) { %>
<span class="verified_symbol">☆</span>
<% } %>
</h2>
<% var prop = properties; %>
<ul class="properties">
<% _(prop).each(function(value, name) { %>
<li>
<span class="properties-value">
<% if(value===true) { %>
<span class="yes">✓</span>
<% } else { %>
<span class="no">✗</span>
<% } %>
</span>
<span class="properties-name"><%= name %></span>
</li>
<% }); %>
</ul>
<p class="more_info">
More Info >
</div>
</script>
<script type="text/template" id="filterstats-template">
There
<% if(nr == 1) { %>
is <span class='badge'>1</span> method that matches
<% } else { %>
are <span class='badge'><%= nr %></span> methods that match
<% } %>
your criteria.
</script>
<script type="text/template" id="stats-template">
There are currently <%= nr %> methods listed.
</script>
<script type="text/template" id="modal-template">
<div class="modal_header">
<h2>More info: <%= name %></h2>
</div>
<div class="modal_content">
<p><%= description %></p>
<h3>References:</h3>
<ul class="modal_references">
<% _(references).each(function(url, ref) { %>
<li><a href="<%= url %>"><%= ref %></a></li>
<% }); %>
</ul>
<% if(code_repositories) { %>
<h3>Available open source code:</h3>
<ul class="modal_references">
<% _(code_repositories).each(function(url, language) { %>
<li><a href="<%= url %>"><%= language %></a></li>
<% }); %>
</ul>
<% } %>
<% if(verified_by_author) { %>
<div class="modal_verified_line">
(Information verified by <%= verified_by_author %>.)
</div>
<% } %>
</div>
<div class="modal_footer">OK</div>
</script>
<script type="text/javascript" src="choice_tree.min.js"></script>
</body>
</html>