extensions/net.sf.basedb.varsearch/trunk/resources/hit-details.js

Code
Comments
Other
Rev Date Author Line
6170 17 Mar 21 nicklas 1 var HitDetails = function()
6170 17 Mar 21 nicklas 2 {
6170 17 Mar 21 nicklas 3   var details = {};
6170 17 Mar 21 nicklas 4   
6170 17 Mar 21 nicklas 5   // Page initialization
6170 17 Mar 21 nicklas 6   details.initPage = function()
6170 17 Mar 21 nicklas 7   {
6170 17 Mar 21 nicklas 8     Buttons.addClickHandler('close', App.closeWindow);
6170 17 Mar 21 nicklas 9     var url = 'Hit.servlet?ID='+App.getSessionId();
6170 17 Mar 21 nicklas 10     url += '&cmd=GetDetails';
6170 17 Mar 21 nicklas 11     url += '&rbaId='+Data.int('page-data', 'rba');
6170 17 Mar 21 nicklas 12     url += '&fileId='+Data.int('page-data', 'file');
6170 17 Mar 21 nicklas 13     url += '&lineNo='+Data.int('page-data', 'line');
6551 26 Jan 22 nicklas 14     url += '&snpId='+encodeURIComponent(Data.get('page-data', 'snp'));
6173 18 Mar 21 nicklas 15     url += '&idx='+encodeURIComponent(Data.get('page-data', 'idx'));
6253 25 May 21 nicklas 16     Wizard.showLoadingAnimation('Loading variant data...');
6170 17 Mar 21 nicklas 17     Wizard.asyncJsonRequest(url, details.detailsLoaded);
6170 17 Mar 21 nicklas 18   }
6170 17 Mar 21 nicklas 19   
6170 17 Mar 21 nicklas 20   details.detailsLoaded = function(response)
6170 17 Mar 21 nicklas 21   {
6170 17 Mar 21 nicklas 22     Doc.show('variant');
6253 25 May 21 nicklas 23     Doc.removeClass('content', 'bottomborder');
6170 17 Mar 21 nicklas 24     var rba = response.rba;
6170 17 Mar 21 nicklas 25     var file = response.file;
6551 26 Jan 22 nicklas 26     var file2 = response.file2;
6170 17 Mar 21 nicklas 27     var hit = response.hit;
6395 16 Sep 21 nicklas 28     var hasData = hit.GT != './.';
6395 16 Sep 21 nicklas 29     var isVariant = hasData && hit.GT != '0/0';
6379 14 Sep 21 nicklas 30     var idx = Data.get('page-data', 'idx');
6551 26 Jan 22 nicklas 31     var isOncoArray = idx == 'oncoarray-500K';
6551 26 Jan 22 nicklas 32     var isTargeted = idx == 'targeted';
6170 17 Mar 21 nicklas 33     
6170 17 Mar 21 nicklas 34     document.title += ' - ' + hit['#CHROM']+':'+hit.POS;
6170 17 Mar 21 nicklas 35     Doc.element('doc-title').innerHTML = Strings.encodeTags(rba.name + ' - ' + hit['#CHROM']+':'+hit.POS);
6170 17 Mar 21 nicklas 36     
6170 17 Mar 21 nicklas 37     var html = '';
6554 27 Jan 22 nicklas 38     html += '<tr><th>'+Strings.encodeTags(rba.type)+'</th><td>'+Strings.encodeTags(rba.name)+'</td></tr>';
6551 26 Jan 22 nicklas 39     html += '<tr><th>File</th><td>';
6551 26 Jan 22 nicklas 40     if (file2) html += Strings.encodeTags(file2.name)+' and ';
6551 26 Jan 22 nicklas 41     html += Strings.encodeTags(file.name)+'</td></tr>';
6170 17 Mar 21 nicklas 42     
6395 16 Sep 21 nicklas 43     // Genotype, depth, etc. and other sample-specific values
6173 18 Mar 21 nicklas 44     html += '<tr><th>Genotype</th><td style="border-top-width: 1px; border-top-style: dotted;">'+Strings.encodeTags(hit.GT);
6551 26 Jan 22 nicklas 45     if (isOncoArray)
6551 26 Jan 22 nicklas 46     {
6551 26 Jan 22 nicklas 47       html += ' <b title="B Allele Frequency">BAF</b> '+Strings.encodeTags(hit.BAF);
6551 26 Jan 22 nicklas 48       html += ' <b title="GenCall Score">GQ</b> '+Strings.encodeTags(hit.GQ);
6551 26 Jan 22 nicklas 49       html += ' <b title="LogRRatio">LRR</b> '+Strings.encodeTags(hit.LRR);
6551 26 Jan 22 nicklas 50     }
6551 26 Jan 22 nicklas 51     else
6551 26 Jan 22 nicklas 52     {
6551 26 Jan 22 nicklas 53       html += ' <b title="Depth">DP</b> '+Strings.encodeTags(hit.DP);
6551 26 Jan 22 nicklas 54       html += ' <b title="Variant depth">VD</b> '+Strings.encodeTags(hit.VD);
6551 26 Jan 22 nicklas 55       html += ' <b title="Allelic depths for the ref and alt alleles">AD</b> '+Strings.encodeTags(hit.AD);
6551 26 Jan 22 nicklas 56       html += ' <b title="Allele Frequency">AF</b> '+Strings.encodeTags(hit.AF);
6551 26 Jan 22 nicklas 57     }
6170 17 Mar 21 nicklas 58     html += '</td></tr>';
6170 17 Mar 21 nicklas 59     
6170 17 Mar 21 nicklas 60     // Location and change at genomic and protein level and other effects
6170 17 Mar 21 nicklas 61     html += '<tr><th>Gene</th><td style="border-top-width: 1px; border-top-style: dotted;">'+Strings.encodeTags(hit.genes)+'</td></tr>';
6170 17 Mar 21 nicklas 62     var chr = hit['#CHROM'];
6170 17 Mar 21 nicklas 63     var pos = hit.POS;
6170 17 Mar 21 nicklas 64     var lpos = parseInt(pos);
6170 17 Mar 21 nicklas 65     html += '<tr><th>Location</th><td>';
6170 17 Mar 21 nicklas 66     html += '<a target="_blank" title="View in Genome Browser (new window)"';
6170 17 Mar 21 nicklas 67     html += ' href="http://genome.ucsc.edu/cgi-bin/hgTracks?db=hg38';
6170 17 Mar 21 nicklas 68     html += '&position='+encodeURIComponent(chr+':'+(lpos-30)+'-'+(lpos+30));
6170 17 Mar 21 nicklas 69     html += '&highlight='+encodeURIComponent(chr+':'+pos+'-'+pos)+'">';
6170 17 Mar 21 nicklas 70     html += Strings.encodeTags(chr+':'+pos)+'</a></td></tr>';
6170 17 Mar 21 nicklas 71     html += '<tr><th>Type</th><td>'+Strings.encodeTags(hit.TYPE)+'</td></tr>';
6173 18 Mar 21 nicklas 72     html += '<tr><th>Effect</th><td>'+Strings.encodeTags(hit.effect)+'</td></tr>';
6170 17 Mar 21 nicklas 73     html += '<tr><th>Ref › Alt</th><td>'+details.refAlt(hit.REF, hit.ALT)+'</td></tr>';
6170 17 Mar 21 nicklas 74     html += '<tr><th>HGVS.c</th><td>'+Strings.encodeTags(hit.hgvsc)+'</td></tr>';
6170 17 Mar 21 nicklas 75     html += '<tr><th>HGVS.p</th><td>'+Strings.encodeTags(hit.hgvsp)+'</td></tr>';
6170 17 Mar 21 nicklas 76     
6170 17 Mar 21 nicklas 77     // dbSNP
6170 17 Mar 21 nicklas 78     html += '<tr><th>dbSNP</th><td style="border-top-width: 1px; border-top-style: dotted;">';
6170 17 Mar 21 nicklas 79     if (hit.dbsnp_ID)
6170 17 Mar 21 nicklas 80     {
6170 17 Mar 21 nicklas 81       html += '<a target="_blank" title="View in dbSNP (new window)"';
6170 17 Mar 21 nicklas 82       html += ' href="https://www.ncbi.nlm.nih.gov/snp/'+encodeURIComponent(hit.dbsnp_ID)+'">';
6170 17 Mar 21 nicklas 83       html += Strings.encodeTags(hit.dbsnp_ID)+"</a>";
6170 17 Mar 21 nicklas 84     }
6170 17 Mar 21 nicklas 85     html += '</td></tr>';
6170 17 Mar 21 nicklas 86     
6170 17 Mar 21 nicklas 87     // COSMIC
6170 17 Mar 21 nicklas 88     html += '<tr><th>COSMIC</th><td>';
6170 17 Mar 21 nicklas 89     if (hit.cosmic_ID)
6170 17 Mar 21 nicklas 90     {
6170 17 Mar 21 nicklas 91       html += '<a target="_blank" title="View in COSMIC (new window)"';
6170 17 Mar 21 nicklas 92       html += ' href="https://cancer.sanger.ac.uk/cosmic/search?q='+encodeURIComponent(hit.cosmic_ID)+'">';
6170 17 Mar 21 nicklas 93       html += Strings.encodeTags(hit.cosmic_ID)+'</a>';
6170 17 Mar 21 nicklas 94     }
6170 17 Mar 21 nicklas 95     if (hit.cosmic_WES_BRCA_MF)
6170 17 Mar 21 nicklas 96     {
6170 17 Mar 21 nicklas 97       html += ' <b title="Mutant Frequency in WGS/WES breast cancer samples">MF</b> ' + Strings.encodeTags(hit.cosmic_WES_BRCA_MF);
6170 17 Mar 21 nicklas 98     }
6170 17 Mar 21 nicklas 99     html += '</td></tr>';
6170 17 Mar 21 nicklas 100     
6170 17 Mar 21 nicklas 101     // SCAN-B
6551 26 Jan 22 nicklas 102     if (!isTargeted && !isOncoArray)
6170 17 Mar 21 nicklas 103     {
6379 14 Sep 21 nicklas 104       html += '<tr><th title="Mutant Frequency (and count) among reference of 6653 SCAN-B non-replicate samples">SCAN-B MF</th><td>'+Strings.encodeTags(hit.scanb_MF_NR);
6379 14 Sep 21 nicklas 105       if (hit.scanb_CNT_NR) 
6379 14 Sep 21 nicklas 106       {
6379 14 Sep 21 nicklas 107         html += ' (' + Strings.encodeTags(hit.scanb_CNT_NR)+'/6653)';
6379 14 Sep 21 nicklas 108       }
6379 14 Sep 21 nicklas 109       html += '</td></tr>';
6170 17 Mar 21 nicklas 110     }
6170 17 Mar 21 nicklas 111     
6173 18 Mar 21 nicklas 112     html += '<tr class="dynamic"><th></th><td style="border-top-width: 1px; border-top-style: dotted;">';
6560 01 Feb 22 nicklas 113     if (hit.numOther >= 0 && isVariant)
6173 18 Mar 21 nicklas 114     {
6554 27 Jan 22 nicklas 115       var callType = isTargeted || isOncoArray ? 'genotype' : 'variant';
6173 18 Mar 21 nicklas 116       html += '<div class="messagecontainer note" style="margin-top: 1em;">';
6379 14 Sep 21 nicklas 117       if (hit.numOther == 0)
6173 18 Mar 21 nicklas 118       {
6560 01 Feb 22 nicklas 119         html += 'This is the only '+callType+' call with this variant.';
6173 18 Mar 21 nicklas 120       }
6379 14 Sep 21 nicklas 121       else if (hit.numOther == 1)
6173 18 Mar 21 nicklas 122       {
6554 27 Jan 22 nicklas 123         html += 'There is 1 other '+callType+' call with this variant.';
6173 18 Mar 21 nicklas 124       }
6379 14 Sep 21 nicklas 125       else if (hit.numOther > 1)
6173 18 Mar 21 nicklas 126       {
6554 27 Jan 22 nicklas 127         html += 'There are '+hit.numOther+' other '+callType+' calls with this variant.';
6173 18 Mar 21 nicklas 128       }
6173 18 Mar 21 nicklas 129       html += '</div>';
6173 18 Mar 21 nicklas 130     }
6173 18 Mar 21 nicklas 131     html += '</td></tr>';
6170 17 Mar 21 nicklas 132     
6170 17 Mar 21 nicklas 133     Doc.element('hit-summary').innerHTML = html;
6170 17 Mar 21 nicklas 134     Doc.show('hit-summary', 'table');
6170 17 Mar 21 nicklas 135   
6170 17 Mar 21 nicklas 136     // RAW DATA (minimally formatted in separate tab)
6170 17 Mar 21 nicklas 137     var raw = response.raw;
6551 26 Jan 22 nicklas 138     var raw2 = response.raw2;
6170 17 Mar 21 nicklas 139     
6170 17 Mar 21 nicklas 140     // Main column
6170 17 Mar 21 nicklas 141     var fixed = ['CHROM', 'POS', 'ID', 'REF', 'ALT', 'QUAL', 'FILTER'];
6170 17 Mar 21 nicklas 142     var cols = raw.split('\t');
6170 17 Mar 21 nicklas 143     var html = '<tbody>';
6170 17 Mar 21 nicklas 144     for (var i = 0; i < Math.min(fixed.length, cols.length); i++)
6170 17 Mar 21 nicklas 145     {
6170 17 Mar 21 nicklas 146       html += '<tr><th>'+fixed[i]+'</th><td>'+Strings.encodeTags(cols[i])+'</td></tr>';
6170 17 Mar 21 nicklas 147     }
6170 17 Mar 21 nicklas 148     html += '</tbody>';
6170 17 Mar 21 nicklas 149     
6170 17 Mar 21 nicklas 150     // FORMAT columns
6551 26 Jan 22 nicklas 151     if (cols.length >= 10) html += details.formatCols(cols[8], cols[9]);
6551 26 Jan 22 nicklas 152     if (raw2)
6170 17 Mar 21 nicklas 153     {
6551 26 Jan 22 nicklas 154       var cols2 = raw2.split('\t');
6551 26 Jan 22 nicklas 155       if (cols2.length >= 10) html += details.formatCols(cols2[8], cols2[9]);
6170 17 Mar 21 nicklas 156     }
6170 17 Mar 21 nicklas 157     
6170 17 Mar 21 nicklas 158     // INFO columns
6170 17 Mar 21 nicklas 159     if (cols.length >= 8)
6170 17 Mar 21 nicklas 160     {
6170 17 Mar 21 nicklas 161       var info = cols[7].split('\;');
6170 17 Mar 21 nicklas 162       html += '<tbody style="border-top-width: 1px; border-top-style: solid;">';
6170 17 Mar 21 nicklas 163       for (var i = 0; i < info.length; i++)
6170 17 Mar 21 nicklas 164       {
6170 17 Mar 21 nicklas 165         var keyval = info[i].split('=');
6170 17 Mar 21 nicklas 166         var key = Strings.encodeTags(keyval[0]);
6170 17 Mar 21 nicklas 167         var val = Strings.encodeTags(keyval[keyval.length-1]);
6170 17 Mar 21 nicklas 168         
6170 17 Mar 21 nicklas 169         // ANN is multi-value separated by ','
6170 17 Mar 21 nicklas 170         if (key=='ANN' && val.indexOf(',')>0)
6170 17 Mar 21 nicklas 171         {
6170 17 Mar 21 nicklas 172           var ann = val.split(',');
6170 17 Mar 21 nicklas 173           for (var a=0; a<ann.length; a++)
6170 17 Mar 21 nicklas 174           {
6170 17 Mar 21 nicklas 175             html += '<tr><th>ANN['+a+']</th><td>'+ann[a]+'</td></tr>';
6170 17 Mar 21 nicklas 176           }
6170 17 Mar 21 nicklas 177         }
6170 17 Mar 21 nicklas 178         else
6170 17 Mar 21 nicklas 179         {
6170 17 Mar 21 nicklas 180           val = val.replace(/,/g, ', ');
6170 17 Mar 21 nicklas 181           html += '<tr><th title="'+key+'">'+key+'</th><td>'+val+'</td></tr>';
6170 17 Mar 21 nicklas 182         }
6170 17 Mar 21 nicklas 183       }
6170 17 Mar 21 nicklas 184       html += '</tbody>';
6170 17 Mar 21 nicklas 185     }
6170 17 Mar 21 nicklas 186         
6170 17 Mar 21 nicklas 187     Doc.element('hit-all').innerHTML = html;
6551 26 Jan 22 nicklas 188   }
6170 17 Mar 21 nicklas 189   
6551 26 Jan 22 nicklas 190   details.formatCols = function(format, gt)
6551 26 Jan 22 nicklas 191   {
6551 26 Jan 22 nicklas 192     var format = format.split('\:');
6551 26 Jan 22 nicklas 193     var gt = gt.split('\:');
6551 26 Jan 22 nicklas 194     html = '<tbody style="border-top-width: 1px; border-top-style: solid;">';
6551 26 Jan 22 nicklas 195     for (var i = 0; i < Math.min(format.length, gt.length); i++)
6551 26 Jan 22 nicklas 196     {
6551 26 Jan 22 nicklas 197       html += '<tr><th>'+Strings.encodeTags(format[i])+'</th><td>'+Strings.encodeTags(gt[i])+'</td></tr>';
6551 26 Jan 22 nicklas 198     }
6551 26 Jan 22 nicklas 199     html += '</tbody>';
6551 26 Jan 22 nicklas 200     return html;
6170 17 Mar 21 nicklas 201   }
6170 17 Mar 21 nicklas 202   
6170 17 Mar 21 nicklas 203   details.refAlt = function(ref, alt, maxLength)
6170 17 Mar 21 nicklas 204   {
6170 17 Mar 21 nicklas 205     if (!maxLength) maxLength = 15;
6170 17 Mar 21 nicklas 206     if (ref.length > maxLength) 
6170 17 Mar 21 nicklas 207     {
6170 17 Mar 21 nicklas 208       ref = "<span title=\""+ref+"\">"+ref.substring(0, maxLength)+"...</span>";
6170 17 Mar 21 nicklas 209     }
6170 17 Mar 21 nicklas 210     if (alt.length > maxLength) 
6170 17 Mar 21 nicklas 211     {
6170 17 Mar 21 nicklas 212       alt = "<span title=\""+alt+"\">"+alt.substring(0, maxLength)+"...</span>";
6170 17 Mar 21 nicklas 213     }
6170 17 Mar 21 nicklas 214     return ref + "&#8239;›&#8239;" + alt; // &#8239; is a narrow non-breaking space
6170 17 Mar 21 nicklas 215   }
6170 17 Mar 21 nicklas 216
6170 17 Mar 21 nicklas 217   
6170 17 Mar 21 nicklas 218   return details;
6170 17 Mar 21 nicklas 219 }();
6170 17 Mar 21 nicklas 220
6170 17 Mar 21 nicklas 221 Doc.onLoad(HitDetails.initPage);
6170 17 Mar 21 nicklas 222