Mercurial > repos > jankanis > blast2html

changeset 7:9e7927673089

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
intermediate commit before converting some tables to divs
author Jan Kanis <jan.code@jankanis.nl>
date Thu, 08 May 2014 16:51:52 +0200
parents d20ce91e1297
children beb83da5a6b7
files visualise.html.jinja visualise.py
diffstat 2 files changed, 230 insertions(+), 62 deletions(-) [+]
line wrap: on
line diff
--- a/visualise.html.jinja	Wed May 07 19:02:20 2014 +0200
+++ b/visualise.html.jinja	Thu May 08 16:51:52 2014 +0200
@@ -11,7 +11,6 @@
       font-family: Verdana,Arial,Sans-Serif;
       }
 
-      
       #content {
       margin: 0 2em;
       padding: 0.5em;
@@ -37,7 +36,7 @@
       font-weight: bold;
       }
 
-      h4.graphicHeader {
+      h4.blackHeader {
       color: black;
       letter-spacing: 0;
       font-style: bold;
@@ -52,11 +51,16 @@
       padding: 0 1em;
       }
 
-      .graphicInfo {
+      .grey {
       background-color: #eeeeee;
       border: 1px solid #cccccc;
       padding: 1em;
-      text-align: center;
+      }
+
+      .white {
+      background-color: white;
+      border: 1px solid #cccccc;
+      padding: 1em;
       }
 
       .graphic {
@@ -67,18 +71,36 @@
       margin: auto;
       }
 
-      .centered {
+      #graphics .grey {
+      text-align: center;
+      }
+
+      .centered, #defline, div.legendwrapper, table.legend, div.tablewrapper {
       align: center;
       margin-left: auto;
       margin-right: auto;
       }
 
+      #defline {
+      background-color: white;
+      border: 1px solid black;
+      margin: .5em auto;
+      padding-left: .2em;
+      padding-right: .2em;
+      max-width: 50em;
+      text-align: left;
+      height: 4em;
+      overflow-y: hidden;
+      }
+
+      div.legendwrapper {
+      max-width: 40em;
+      }
+      
       table.legend {
       color: white;
       font-weight: bold;
-      align: center;
-      margin: 0 auto;
-      width: 40em;
+      width: 100%;
       border-spacing: 0;
       }
       table.legend td {
@@ -88,70 +110,173 @@
       border: none;
       }
 
-      table.matchresult {
-      height: 5px;
-      width: 40em;
-      align: center;
-      margin: 4px auto 0 auto;
+      div.tablewrapper {
+      width: 50%;
+      min-width: 60em;
+      }
+
+      /* For small widths we give the graphic 100% */
+      @media (max-width: 70em) {
+      div.tablewrapper {
+      width: 100%;
+      min-width: 0px;
+      }
+      }
+
+      .scale {
+      width: 100%;
+      margin: .5em 0;
+      font-weight: bold;
+      }
+      .scale div {
+      color: red;
+      text-align: left;
       }
-      table.matchresult tr {
-      height: 5px;
+      .scale table {
+      width: 100%;
+      height: 1.3em;
+      margin-top: 0;
+      color: white;
+      table-layout: fixed;
+      border-collapse: collapse;
+      }
+      .scale td {
+      margin 0;
+      padding 0;
       }
-      table.matchresult td {
-      height: 5px;
+      .scale td div {
+      margin: 1px 0;
+      text-align: right;
+      background-color: red;
+      color: white;
+      }
+      
+      table.matchresult {
+      width: 100%;
+      margin-top: 3px;
+      margin-bottom: 0;
+      border-collapse: collapse;
+      }
+      table.matchresult, table.matchresult tr, table.matchresult td, a.matchlink {
+      height: 3px;
+      margin-left: 0;
+      margin-right: 0;
+      padding-left: 0;
+      padding-right: 0;
       }
       a.matchlink {
       display: block;
-      heigth: 5px;
+      }
+
+      table.descriptiontable {
+      width: 100%;
       }
+      table.descriptiontable td {
+      overflow: hidden;
+      white-space: nowrap;
+      }
+      table.descriptiontable td div {
+      display: inline-block;
+      overflow: hidden;
+      max-height: 1.4em;
+      white-space: nowrap;
+      }
+
     </style>
 
+    
   </head>
 
   <body>
     <div id=content>
-      <h1>Nucleotide Sequence ({{blast["BlastOutput_query-len"]}} letters)</h1>
+      <h1>Nucleotide Sequence ({{length}} letters)</h1>
 
       <div id=header>
 
-	<table class=headerdata>
-	  {% for param, value in params %}
-   	    <tr><td class=param>{{param}}</td><td>{{value}}</td></tr>
-	  {% endfor %}
-	</table>
-	  
+        <table class=headerdata>
+          {% for param, value in params %}
+            <tr><td class=param>{{param}}</td><td>{{value}}</td></tr>
+          {% endfor %}
+        </table>
+          
       </div>
 
       <div id=graphics>
-	<h2>Graphic Summary</h2>
+        <h2>Graphic Summary</h2>
+
+        <div class=grey>
+          <h3 class=centered>Distribution of {{hits|length}} Blast Hits on the Query Sequence</h3>
+          
+          <div id=defline>Mouse-over to show defline and scores, click to show alignments</div>
 
-	<div class=graphicInfo>
-	  <h3 class=centered>Distribution of {{hits|length}} Blast Hits on the Query Sequence</h3>
-	  <div class=graphic>
-	    <h4 class=graphicHeader>Color key for alignment scores</h4>
-	    <table class=legend><tr>
-		<td style="background-color: {{colors[0]}}">&lt;40</td>
-		<td style="background-color: {{colors[1]}}">40-50</td>
-		<td style="background-color: {{colors[2]}}">50-80</td>
-		<td style="background-color: {{colors[3]}}">80-200</td>
-		<td style="background-color: {{colors[4]}}">&gt;=200</td>
-	    </tr></table>
+          <div class=graphic>
+            <h4 class=blackHeader>Color key for alignment scores</h4>
+            <div class=legendwrapper><table class=legend><tr>
+                  <td style="background-color: {{colors[0]}}">&lt;40</td>
+                  <td style="background-color: {{colors[1]}}">40-50</td>
+                  <td style="background-color: {{colors[2]}}">50-80</td>
+                  <td style="background-color: {{colors[3]}}">80-200</td>
+                  <td style="background-color: {{colors[4]}}">200&le;</td>
+            </tr></table></div>
+
+            <div class=tablewrapper>
 
-	    {% for line in match_colors %}
-	    <a href={{line.link}}>
-	      <table class=matchresult><tr>
-		  {% for match in line.colors %}
-		  <td style="background-color: {{match[1]}}; width: {{match[0]}}px" />
-		  {% endfor %}
-	      </tr></table>
-	    </a>
-	    {% endfor %}
-	    
-	    <p>hoi</p>
+              <div class=scale>
+                <div>query:</div>
+                <table><tr>
+                    {% for s in queryscale %}
+                    <td width={{s.width|safe}}%><div>{{s.label|safe}}</div></td>
+                    {% endfor %}
+                </tr></table>
+              </div>
+              
+              {% for line in match_colors %}
+              <a href="{{line.link}}"
+                 onmouseover='document.getElementById("defline").innerHTML="{{line.defline}}"'
+                 onmouseout='document.getElementById("defline").innerHTML="Mouse-over to show defline and scores, click to show alignments"'
+                 title="{{line.defline}}">
+                <table class=matchresult><tr>
+                    {% for match in line.colors %}
+                    <td width={{match[0]}}% style="background-color: {{match[1]}}" />
+                    {% endfor %}
+                </tr></table>
+              </a>
+              
+              {% endfor %}
+            </div>
+          </div>
+        </div>
+      </div>
 
-	  </div>
-	</div>
+      <div id=descriptions>
+        <h2>Descriptions</h2>
 
+        <div class=grey><div class=white>
+            <h4 class=blackHeader>Sequences producing significant alignments:</h4>
+            <table class=descriptiontable>
+              <tr>
+                <th>Description</th>
+                <th>Max score</th>
+                <th>Total score</th>
+                <th>Query cover</th>
+                <th>E value</th>
+                <th>Ident</th>
+                <th>Accession</th>
+              </tr>
+              {% for hit in hit_info %}
+              <tr>
+                <td><div>{{hit.description}}</div></td>
+                <td>{{hit.maxscore}}</td>
+                <td>{{hit.totalscore}}</td>
+                <td>{{hit.cover}}</td>
+                <td>{{hit.e_value}}</td>
+                <td>{{hit.ident}}</td>
+                <td>{{hit.accession}}</td>
+              </tr>
+              {% endfor %}
+            </table>
+            
+        </div></div>
 
       </div>
 
--- a/visualise.py	Wed May 07 19:02:20 2014 +0200
+++ b/visualise.py	Thu May 08 16:51:52 2014 +0200
@@ -4,6 +4,7 @@
 # License: GPL version 3 or higher
 
 import sys
+import math
 import warnings
 from itertools import repeat
 from lxml import objectify
@@ -26,19 +27,24 @@
 
 blast = objectify.parse('blast xml example1.xml').getroot()
 loader = jinja2.FileSystemLoader(searchpath='.')
-environment = jinja2.Environment(loader=loader)
+environment = jinja2.Environment(loader=loader, lstrip_blocks=True, trim_blocks=True, autoescape=True)
 environment.filters['color'] = lambda length: match_colors[color_idx(length)]
 
+query_length = int(blast["BlastOutput_query-len"])
+
+hits = blast.BlastOutput_iterations.Iteration.Iteration_hits.Hit
+# sort hits by longest hotspot first
+ordered_hits = sorted(hits,
+                      key=lambda h: max(hsp['Hsp_align-len'] for hsp in h.Hit_hsps.Hsp),
+                      reverse=True)
+
 def match_colors():
     """
     An iterator that yields lists of length-color pairs. 
     """
+
+    percent_multiplier = 100 / query_length
     
-    hits = blast.BlastOutput_iterations.Iteration.Iteration_hits.Hit
-    query_length = blast["BlastOutput_query-len"]
-    # sort hits by longest hotspot first
-    hits = sorted(hits, key=lambda h: max(hsp['Hsp_align-len'] for hsp in h.Hit_hsps.Hsp), reverse=True)
-
     for hit in hits:
         # sort hotspots from short to long, so we can overwrite index colors of
         # short matches with those of long ones.
@@ -46,24 +52,58 @@
         table = bytearray([255]) * query_length
         for hsp in hotspots:
             frm = hsp['Hsp_query-from'] - 1
-            to = hsp['Hsp_query-to'] - 1
+            to = int(hsp['Hsp_query-to'])
             table[frm:to] = repeat(color_idx(hsp['Hsp_align-len']), to - frm)
 
         matches = []
         last = table[0]
         count = 0
-        for i in range(int(query_length)):
+        for i in range(query_length):
             if table[i] == last:
                 count += 1
                 continue
-            matches.append((count, colors[last] if last != 255 else 'none'))
+            matches.append((count * percent_multiplier, colors[last] if last != 255 else 'none'))
             last = table[i]
             count = 1
-        matches.append((count, colors[last] if last != 255 else 'none'))
+        matches.append((count * percent_multiplier, colors[last] if last != 255 else 'none'))
+
+        yield dict(colors=matches, link="#hit"+hit.Hit_num.text, defline=hit.Hit_def)
+
 
-        yield dict(colors=matches, link="#hit"+hit.Hit_num.text)
+def queryscale():
+    max_labels = 10
+    skip = math.ceil(query_length / max_labels)
+    percent_multiplier = 100 / query_length
+    for i in range(1, query_length+1):
+        if i % skip == 0:
+            yield dict(label = i, width = skip * percent_multiplier)
+    if query_length % skip != 0:
+        yield dict(label = query_length, width = (query_length % skip) * percent_multiplier)
 
 
+def hit_info():
+
+    for hit in ordered_hits:
+        hsps = hit.Hit_hsps.Hsp
+
+        cover = [False] * query_length
+        for hsp in hsps:
+            cover[hsp['Hsp_query-from']-1 : int(hsp['Hsp_query-to'])] = repeat(True, int(hsp['Hsp_align-len']))
+        cover_count = cover.count(True)
+        
+        def hsp_val(path):
+            return (hsp[path] for hsp in hsps)
+        
+        yield dict(description = hit.Hit_def,
+                   maxscore = max(hsp_val('Hsp_bit-score')),
+                   totalscore = sum(hsp_val('Hsp_bit-score')),
+                   cover = "{:.0%}".format(cover_count / query_length),
+                   e_value = min(hsp_val('Hsp_evalue')),
+                   # FIXME: is this the correct formula vv?
+                   ident = "{:.0%}".format(min(hsp.Hsp_identity / hsp['Hsp_align-len'] for hsp in hsps)),
+                   accession = hit.Hit_accession)
+                   
+        
 def main():
     template = environment.get_template('visualise.html.jinja')
 
@@ -78,9 +118,12 @@
         warnings.warn("Multiple 'Iteration' elements found, showing only the first")
 
     sys.stdout.write(template.render(blast=blast,
-                                     hits=blast.BlastOutput_iterations.Iteration.Iteration_hits.Hit,
+                                     length=query_length,
+                                     #hits=blast.BlastOutput_iterations.Iteration.Iteration_hits.Hit,
                                      colors=colors,
                                      match_colors=match_colors(),
+                                     queryscale=queryscale(),
+                                     hit_info=hit_info(),
                                      params=params))
 
 main()