Mercurial > repos > jankanis > blast2html

comparison visualise.html.jinja @ 12:a459c754cdb5

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
add links, refactor, proper commandline arguments
author Jan Kanis <jan.code@jankanis.nl>
date Mon, 12 May 2014 17:12:24 +0200
parents 7660519f2dc9
children
comparison
equal deleted inserted replaced
11:7660519f2dc9 12:a459c754cdb5
9 body { 9 body {
10 color: #33333; 10 color: #33333;
11 font-family: Arial,Sans-Serif; 11 font-family: Arial,Sans-Serif;
12 } 12 }
13 13
14 :link {
15 color: #336699;
16 }
17
18 .right {
19 float: right;
20 }
21
14 #content { 22 #content {
15 margin: 0 2em; 23 margin: 0 2em;
16 padding: 0.5em; 24 padding: 0.5em;
17 border: 1px solid #888888; 25 border: 1px solid #888888;
18 background-color: #d3dff5; 26 background-color: #d3dff5;
74 82
75 .graphicitem { 83 .graphicitem {
76 float: left; 84 float: left;
77 } 85 }
78 86
87
88
79 .graphic { 89 .graphic {
80 background-color: white; 90 background-color: white;
81 border: 2px solid black; 91 border: 2px solid black;
82 padding: .5em; 92 padding: .5em 1.5em;
83 align: center; 93 align: center;
84 margin: auto; 94 margin: auto;
85 } 95 }
86 96
87 #graphics .grey { 97 #graphics .grey {
126 width: 50%; 136 width: 50%;
127 min-width: 60em; 137 min-width: 60em;
128 } 138 }
129 139
130 /* For small widths we give the graphic 100% */ 140 /* For small widths we give the graphic 100% */
131 @media (max-width: 70em) { 141 @media (max-width: 72.5em) {
132 div.tablewrapper { 142 div.tablewrapper {
133 width: 100%; 143 width: 100%;
134 min-width: 0px; 144 min-width: 0px;
135 } 145 }
136 } 146 }
172 } 182 }
173 div.matchrow, div.matchitem { 183 div.matchrow, div.matchitem {
174 height: 4px; 184 height: 4px;
175 } 185 }
176 186
187
188
177 div#descriptions { 189 div#descriptions {
178 } 190 }
179 191
180 table.descriptiontable { 192 table.descriptiontable {
181 font-size: 85%; 193 font-size: 85%;
210 width: 1em; 222 width: 1em;
211 overflow: visible; 223 overflow: visible;
212 white-space: nowrap; 224 white-space: nowrap;
213 text-align: left; 225 text-align: left;
214 } 226 }
215 table.descriptiontable a:link { 227
216 color: #336699; 228
217 } 229
218
219 #alignments .white { 230 #alignments .white {
220 padding: 1.5em 1em; 231 padding: 1.5em 1em;
221 } 232 }
222 233
223 .alignment { 234 .alignment {
226 padding-right: 1em; 237 padding-right: 1em;
227 } 238 }
228 239
229 div.linkheader { 240 div.linkheader {
230 padding-top: .2em; 241 padding-top: .2em;
231 text-align: right;
232 font-size: 85%; 242 font-size: 85%;
233 color: #14376C; 243 color: #14376C;
234 } 244 }
235 div.linkheader a { 245 div.linkheader a.linkheader {
236 color: #14376C; 246 margin-right: 1em;
247 }
248 div.linkheader .right a {
237 text-decoration: none; 249 text-decoration: none;
238 } 250 }
239 251
240 .title .hittitle { 252 .title .hittitle {
241 color: #22222; 253 color: #22222;
242 margin-bottom: .3em; 254 margin-bottom: .3em;
243 } 255 }
244 .title .titleinfo { 256 .title .titleinfo {
245 font-size: 80%; 257 font-size: 80%;
246 margin-top: 0; 258 margin-top: 0;
259 margin-bottom: .3em;
247 } 260 }
248 .title .titleinfo .b { 261 .title .titleinfo .b {
249 color: #606060; 262 color: #606060;
250 font-weight: bold; 263 font-weight: bold;
251 font-size: 90%; 264 font-size: 90%;
257 .moretitles .titleinfo { 270 .moretitles .titleinfo {
258 margin: 0; 271 margin: 0;
259 padding: 0; 272 padding: 0;
260 } 273 }
261 .moretitles .hittitle { 274 .moretitles .hittitle {
262 margin: .2em 0; 275 margin: .4em 0 .2em 0;
263 padding: 0; 276 padding: 0;
264 } 277 }
265 278
266 a.showmoretitles { 279 a.showmoretitles {
267 font-size: 85%; 280 font-size: 75%;
268 color: #336699; 281 color: #336699;
282 font-weight: bold;
283 margin-top: 0;
269 } 284 }
270 a.showmoretitles:hover { 285 a.showmoretitles:hover {
271 } 286 }
272 287
273 .hotspot { 288 .hotspot {
274 color: #606060; 289 color: #606060;
275 font-family: verdana, arial, sans-serif; 290 font-family: verdana, arial, sans-serif;
276 margin-bottom: 2.5em; 291 margin-bottom: 2.5em;
277 } 292 }
278 293
279 .hotspot .range { 294 .hotspot p.range {
280 font-size: 70%; 295 font-size: 70%;
281 margin-top: 0; 296 margin-top: 0;
282 font-weight: bold;
283 margin-top: 1em; 297 margin-top: 1em;
284 margin-bottom: .2em; 298 margin-bottom: .2em;
299 }
300 .hotspot p.range span.range {
301 font-weight: bold;
302 }
303 .hotspot p.range a.range {
304 margin-left: .5em;
285 } 305 }
286 306
287 table.hotspotstable { 307 table.hotspotstable {
288 border-top: 1px solid; 308 border-top: 1px solid;
289 border-bottom: 1px solid; 309 border-bottom: 1px solid;
328 348
329 <div id=header> 349 <div id=header>
330 350
331 <table class=headerdata> 351 <table class=headerdata>
332 {% for param, value in params %} 352 {% for param, value in params %}
333 <tr><td class=param>{{param}}</td><td>{{value}}</td></tr> 353 <tr><td class=param>{{param}}:</td><td>{{value}}</td></tr>
334 {% endfor %} 354 {% endfor %}
335 </table> 355 </table>
336 356
337 </div> 357 </div>
338 358
339 {% if not (blast.BlastOutput_iterations.find('Iteration') and 359 {% if not (blast.BlastOutput_iterations.findall('Iteration') and
340 blast.BlastOutput_iterations.Iteration.Iteration_hits.find('Hit')) %} 360 blast.BlastOutput_iterations.Iteration.Iteration_hits.findall('Hit')) %}
341 <div id=nodata> 361 <div id=nodata>
342 <h2>No Results</h2> 362 <h2>No Results</h2>
343 <div class=grey> 363 <div class=grey>
344 No Matches 364 No Matches
345 </div> 365 </div>
358 378
359 <div class=graphic> 379 <div class=graphic>
360 <h4 class=darkHeader>Color key for alignment scores</h4> 380 <h4 class=darkHeader>Color key for alignment scores</h4>
361 <div class=legend><div class=graphicrow> 381 <div class=legend><div class=graphicrow>
362 <div class=graphicitem style="background-color: {{colors[0]}}">&lt;40</div> 382 <div class=graphicitem style="background-color: {{colors[0]}}">&lt;40</div>
363 <div class=graphicitem style="background-color: {{colors[1]}}">40&endash;50</div> 383 <div class=graphicitem style="background-color: {{colors[1]}}">40–50</div>
364 <div class=graphicitem style="background-color: {{colors[2]}}">50-80</div> 384 <div class=graphicitem style="background-color: {{colors[2]}}">50–80</div>
365 <div class=graphicitem style="background-color: {{colors[3]}}">80-200</div> 385 <div class=graphicitem style="background-color: {{colors[3]}}">80–200</div>
366 <div class=graphicitem style="background-color: {{colors[4]}}">200≤</div> 386 <div class=graphicitem style="background-color: {{colors[4]}}">200≤</div>
367 </div></div> 387 </div></div>
368 <div style="clear: left"></div> 388 <div style="clear: left"></div>
369 389
370 <div class=tablewrapper> 390 <div class=tablewrapper>
431 <td>{{hit.maxscore}}</td> 451 <td>{{hit.maxscore}}</td>
432 <td>{{hit.totalscore}}</td> 452 <td>{{hit.totalscore}}</td>
433 <td>{{hit.cover}}</td> 453 <td>{{hit.cover}}</td>
434 <td>{{hit.e_value}}</td> 454 <td>{{hit.e_value}}</td>
435 <td>{{hit.ident}}</td> 455 <td>{{hit.ident}}</td>
436 <td><a href="http://www.ncbi.nlm.nih.gov/nucleotide/{{hit.hit|hitid}}?report=genbank&log$=nucltop&blast_rank=1">{{hit.accession}}</a></td> 456 <td><a href="{{genelink(hit.hit|hitid)}}">{{hit.accession}}</a></td>
437 </tr> 457 </tr>
438 {% endfor %} 458 {% endfor %}
439 </table> 459 </table>
440 460
441 </div></div> 461 </div></div>
449 <div class=grey><div class=white> 469 <div class=grey><div class=white>
450 {% for hit in hits %} 470 {% for hit in hits %}
451 <div class=alignment id=hit{{hit.Hit_num}}> 471 <div class=alignment id=hit{{hit.Hit_num}}>
452 472
453 <div class=linkheader> 473 <div class=linkheader>
454 <a href="#description{{hit.Hit_num}}">Descriptions</a> 474 <div class=right><a href="#description{{hit.Hit_num}}">Descriptions</a></div>
475 <a class=linkheader href="{{genelink(hit|hitid)}}">GenBank</a>
476 <a class=linkheader href="{{genelink(hit|hitid, 'graph')}}">Graphics</a>
455 </div> 477 </div>
456 478
457 <div class=title> 479 <div class=title>
458 <p class=hittitle>{{hit|firsttitle}}</p> 480 <p class=hittitle>{{hit|firsttitle}}</p>
459 <p class=titleinfo> 481 <p class=titleinfo>
460 <span class=b>Sequence ID:</span> <a href="http://www.ncbi.nlm.nih.gov/nucleotide/{{hit|hitid}}?report=genbank&log$=nuclalign&blast_rank=1">{{hit|seqid}}</a> 482 <span class=b>Sequence ID:</span> <a href="{{genelink(hit|hitid)}}">{{hit|seqid}}</a>
461 <span class=b>Length:</span> {{hit.Hit_len}} 483 <span class=b>Length:</span> {{hit.Hit_len}}
462 <span class=b>Number of Matches:</span> {{hit.Hit_hsps.Hsp|length}} 484 <span class=b>Number of Matches:</span> {{hit.Hit_hsps.Hsp|length}}
463 </p> 485 </p>
464 </div> 486 </div>
465 487
471 <div class=moretitles id=moretitles{{hit.Hit_num}} style="display: none"> 493 <div class=moretitles id=moretitles{{hit.Hit_num}} style="display: none">
472 {% for title in hit|othertitles %} 494 {% for title in hit|othertitles %}
473 <div class=title> 495 <div class=title>
474 <p class=hittitle>{{title.title}}</p> 496 <p class=hittitle>{{title.title}}</p>
475 <p class=titleinfo> 497 <p class=titleinfo>
476 <span class=b>Sequence ID:</span> {{title.id}} 498 <span class=b>Sequence ID:</span> <a href="{{genelink(title.hitid)}}">{{title.id}}</a>
477 </p> 499 </p>
478 </div> 500 </div>
479 {% endfor %} 501 {% endfor %}
480 </div> 502 </div>
481 {% endif %} 503 {% endif %}
482 504
483 {% for hsp in hit.Hit_hsps.Hsp %} 505 {% for hsp in hit.Hit_hsps.Hsp %}
484 <div class=hotspot> 506 <div class=hotspot>
485 <p class=range>Range {{hsp.Hsp_num}}: {{hsp['Hsp_hit-from']}} to {{hsp['Hsp_hit-to']}} <a href="http://www.ncbi.nlm.nih.gov/nucleotide/{{hit|hitid}}?report=genbank&log$=nuclalign&blast_rank=1&from={{hsp['Hsp_hit-from']}}&to={{hsp['Hsp_hit-to']}}">GenBank</a></p> 507 <p class=range>
508 <span class=range>Range {{hsp.Hsp_num}}: {{hsp['Hsp_hit-from']}} to {{hsp['Hsp_hit-to']}}</span>
509 <a class=range href="{{genelink(hit|hitid, 'genbank', hsp)}}">GenBank</a>
510 <a class=range href="{{genelink(hit|hitid, 'graph', hsp)}}">Graphics</a>
511 </p>
486 512
487 <table class=hotspotstable> 513 <table class=hotspotstable>
488 <tr> 514 <tr>
489 <th>Score</th><th>Expect</th><th>Identities</th><th>Gaps</th><th>Strand</th> 515 <th>Score</th><th>Expect</th><th>Identities</th><th>Gaps</th><th>Strand</th>
490 </tr> 516 </tr>