Merge pull request #657 from erasche/extra-starts

Allow overriding start/stop characters for highlighting in refseq track
GMOD · Dec 8, 2015 · bec318c · bec318c
2 parents 380dd78 + 22838cb
commit bec318c
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 4 deletions.
diff --git a/css/sequence.css b/css/sequence.css
@@ -81,11 +81,11 @@ table.sequence.big .base {
     border-right-color: #5f5f5f;
 }
 
-.translatedSequence td.aminoAcid_\* {
+.translatedSequence td.aminoAcid_stop {
     background-color: #FF0000;
 }
 
-.translatedSequence td.aminoAcid_m {
+.translatedSequence td.aminoAcid_start {
     background-color: #00FF00;
 }
 

diff --git a/src/JBrowse/CodonTable.js b/src/JBrowse/CodonTable.js
@@ -3,6 +3,16 @@ define( ['dojo/_base/declare'],
 
 return declare(null, {
 
+defaultStarts: [
+    'ATG',
+    'CTG',
+    'GTG',
+],
+defaultStops: [
+    'TAA',
+    'TAG',
+    'TGA',
+],
 defaultCodonTable: {
 
     "TCA" : "S",
@@ -75,7 +85,7 @@ generateCodonTable:function(table) {
     /**
     *  take CodonTable above and generate larger codon table that includes
     *  all permutations of upper and lower case nucleotides
-    */  
+    */
     var tempCodonTable = { };
     for (var codon in table) {
         // looping through codon table, make sure not hitting generic properties...

diff --git a/src/JBrowse/View/Track/Sequence.js b/src/JBrowse/View/Track/Sequence.js
@@ -38,6 +38,8 @@ return declare( [BlockBased, ExportMixin, CodonTable],
     constructor: function( args ) {
         this._charMeasurements = {};
         this._codonTable = this.generateCodonTable(lang.mixin(this.defaultCodonTable,this.config.codonTable));
+        this._codonStarts = this.config.codonStarts || this.defaultStarts
+        this._codonStops = this.config.codonStops || this.defaultStops
     },
 
     _defaultConfig: function() {
@@ -198,10 +200,11 @@ return declare( [BlockBased, ExportMixin, CodonTable],
         for( var i = 0; i < seqSliced.length; i += 3 ) {
             var nextCodon = seqSliced.slice(i, i + 3);
             var aminoAcid = this._codonTable[nextCodon] || this.nbsp;
-            translated = translated + aminoAcid;
+            translated += aminoAcid;
         }
 
         translated = reverse ? translated.split("").reverse().join("") : translated; // Flip the translated seq for left-to-right rendering
+        orientedSeqSliced = reverse ? seqSliced.split("").reverse().join("") : seqSliced
 
         var charSize = this.getCharacterMeasurements("aminoAcid");
         var bigTiles = scale > charSize.w + 4; // whether to add .big styles to the base tiles
@@ -232,7 +235,18 @@ return declare( [BlockBased, ExportMixin, CodonTable],
 
         for( var i=0; i<translated.length; i++ ) {
             var aminoAcidSpan = document.createElement('td');
+            var originalCodon = orientedSeqSliced.slice(3 * i, 3 * i + 3)
+            originalCodon = reverse ? originalCodon.split("").reverse().join("") : originalCodon;
             aminoAcidSpan.className = 'aminoAcid aminoAcid_'+translated.charAt(i).toLowerCase();
+
+            // However, if it's known to be a start/stop, apply those CSS classes instead.
+            if (this._codonStarts.indexOf(originalCodon.toUpperCase()) != -1) {
+                aminoAcidSpan.className = 'aminoAcid aminoAcid_start'
+            }
+            if (this._codonStops.indexOf(originalCodon.toUpperCase()) != -1) {
+                aminoAcidSpan.className = 'aminoAcid aminoAcid_stop'
+            }
+
             aminoAcidSpan.style.width = charWidth;
             if( drawChars ) {
                 aminoAcidSpan.innerHTML = translated.charAt( i );