Add curated gis support

brinkmanlab · Sep 20, 2022 · 87d4ba2 · 87d4ba2
1 parent bd7d5e3
commit 87d4ba2
Show file tree

Hide file tree

Showing 5 changed files with 38 additions and 8 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/css/linearplot.css b/src/css/linearplot.css
@@ -164,15 +164,19 @@ g.root.node circle{
 }
 
 .islandpath, #islandpathLegend{
-    fill: red !important;
+    fill: #BB410A !important;
 }
 
 .sigi, #sigiLegend{
-    fill: blue !important;
+    fill: #0720C7 !important;
 }
 
 .blast, #blastLegend{
-    fill: #508714 !important;
+    fill: #3AD849 !important;
+}
+
+.curated, #curatedLegend{
+    fill: #BD5DEF !important;
 }
 
 .GIColourBody label{

diff --git a/src/index.html b/src/index.html
@@ -61,6 +61,11 @@
                                     <input type="checkbox" name="blast" value="blast" id="blast-box" checked disabled>BLAST
                                 </label>
                             </span>
+                            <span id="curatedToggle">
+                                <label>
+                                    <input type="checkbox" name="curated" value="curated" id="curated-box" checked disabled>Curated
+                                </label>
+                            </span>
                         </div>
                     </div>
                 </div>
@@ -127,6 +132,12 @@
                             </svg>
                             BLAST Genomic Island
                         </span>
+                        <span id="curatedLegend" class="legendText">
+                            <svg height="10" width="10">
+                                <rect x="1" y="1" width="8" height="8" stroke-width="1"></rect>
+                            </svg>
+                            Curated Genomic Island
+                        </span>
 
                     </div>
                     <div id="clusterLegend" class="clearfix" hidden>

diff --git a/src/js/genomecomparevis.js b/src/js/genomecomparevis.js
@@ -422,7 +422,10 @@ export default function MultiVis(targetNode){
                         }
                     })
                     .append("title").text(function(gi) {
-                        if(gi.cluster != null) { return "Click to open GI cluster " + gi.cluster + " view"; }
+                        let title = "";
+                        if (gi.query) { title += gi.query + "\n"; }
+                        if(gi.cluster != null) { title += "Click to open GI cluster " + gi.cluster + " view"; }
+                        return title;
                     });
             });
         });
@@ -624,6 +627,11 @@ export default function MultiVis(targetNode){
         } else {
             $(".blast").hide();
         }
+        if ($(".GIColourBody :checkbox[name=curated]").is(":checked")) {
+            $(".curated").show();
+        } else {
+            $(".curated").hide();
+        }
     };
 
     this.GIColourToggle = function() {
@@ -718,9 +726,9 @@ export default function MultiVis(targetNode){
     this.highlightCluster = function(clusterClass) {
         $(clusterClass).attr("filter", "url(#shadow)");
         //$(".sigi, .islandpath").hide();
-        var otherIslands = $("svg .genomicIslands polygon").not(clusterClass);
-        otherIslands.attr("fill-opacity", "0.4");
-        otherIslands.attr("stroke-opacity", "0");
+        //var otherIslands = $("svg .genomicIslands polygon").not(clusterClass);
+        //otherIslands.attr("fill-opacity", "0.4");
+        //otherIslands.attr("stroke-opacity", "0");
         var genes = $(".CDS, .tRNA, .rRNA, .gene");
         genes.attr("fill-opacity", "0.4");
         genes.attr("stroke-opacity", "0");

diff --git a/src/js/main.js b/src/js/main.js
@@ -103,6 +103,9 @@ function loadVis(src) {
                         case 'blast':
                             program = 'blast';
                             break;
+                        case 'curated':
+                            program = 'curated';
+                            break;
                         default:
                             program = 'merged';
                             break;
@@ -113,6 +116,8 @@ function loadVis(src) {
                     color = color ? color[1] : null;
                     let parent = /Parent=([^;\n]+)/.exec(row[8]);
                     parent = parent ? parent[1] : null;
+                    let query = /Query=([^|;\n]+)/.exec(row[8]);
+                    query = query ? query[1] : null;
                     sequence = container.backbone.getSequences().find(function (seq) {
                         return seq.sequenceId === row[0];
                     });
@@ -122,7 +127,8 @@ function loadVis(src) {
                         end: row[4],
                         cluster: cluster,
                         color: color,
-                        parent: parent
+                        parent: parent,
+                        query: query,
                     });
                     break;
                 case 'match':