Merge pull request #26 from agduncan94/develop

Release 0.1.2
LincolnSteinLab · Nov 1, 2019 · c50d404 · c50d404
2 parents d94e38f + 97accbe
commit c50d404
Show file tree

Hide file tree

Showing 16 changed files with 264 additions and 52 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+.DS_Store
+node_modules/
+docker/data/
diff --git a/README.md b/README.md
@@ -92,11 +92,10 @@ Example Track:
 ```
 [tracks.GDC_Genes]
 storeClass=gdc-viewer/Store/SeqFeature/Genes
-type=JBrowse/View/Track/CanvasVariants
+type=JBrowse/View/Track/GeneTrack
 key=GDC Genes
 metadata.datatype=Gene
 unsafePopup=true
-fmtDetailValue_projects=function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div>";}
 ```
 
 You can apply filters to the track too, in the same format as GDC. The below example only shows Genes whose biotype is not 'protein_coding'.
@@ -115,11 +114,10 @@ Example Track:
 ```
 [tracks.GDC_SSM]
 storeClass=gdc-viewer/Store/SeqFeature/SimpleSomaticMutations
-type=gdc-viewer/View/Track/CanvasVariants
+type=gdc-viewer/View/Track/SSMVariants
 key=GDC SSM
 metadata.datatype=SSM
 unsafePopup=true
-fmtDetailValue_projects=function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div>";}
 ```
 
 You can apply filters to the track too, in the same format as GDC. The below example only shows SSMs whose reference allele is 'G'.

diff --git a/data/tracks.conf b/data/tracks.conf
@@ -1,18 +1,16 @@
 [tracks.GDC_SSM]
 storeClass=gdc-viewer/Store/SeqFeature/SimpleSomaticMutations
-type=gdc-viewer/View/Track/CanvasVariants
+type=gdc-viewer/View/Track/SSMTrack
 key=GDC SSM
 metadata.datatype=SSM
 unsafePopup=true
-fmtDetailValue_projects=function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div>";}
 
 [tracks.GDC_Genes]
 storeClass=gdc-viewer/Store/SeqFeature/Genes
-type=gdc-viewer/View/Track/CanvasVariants
+type=gdc-viewer/View/Track/GeneTrack
 key=GDC Genes
 metadata.datatype=Gene
 unsafePopup=true
-fmtDetailValue_projects=function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div>";}
 
 [tracks.GDC_CNV]
 storeClass=gdc-viewer/Store/SeqFeature/CNVs

diff --git a/docker/Dockerfile b/docker/Dockerfile
@@ -0,0 +1,35 @@
+FROM node:latest
+
+LABEL maintainer="[email protected]"
+
+ENV JBROWSE_VERSION 1.16.6
+
+# Install dependencies
+RUN apt-get -qq update --fix-missing
+RUN apt-get --no-install-recommends -y install git build-essential zlib1g-dev libxml2-dev libexpat-dev postgresql-client libpq-dev ca-certificates curl
+
+# Download JBrowse
+RUN mkdir -p /jbrowse/ && \
+    git clone --recursive https://github.com/gmod/jbrowse /jbrowse/ && \
+    cd /jbrowse/ && \
+    git checkout ${JBROWSE_VERSION}-release
+
+WORKDIR /jbrowse/
+
+# Download GDC Viewer
+RUN git clone https://github.com/agduncan94/gdc-viewer /gdc-viewer/ && \
+    cd /gdc-viewer/ && \
+    git checkout 0.1.1 && \
+    cp -r gdc-viewer /jbrowse/plugins/gdc-viewer && \
+    cat ./data/jbrowse.conf > /jbrowse/jbrowse.conf
+
+# Setup JBrowse
+RUN ./setup.sh && \
+    ./bin/cpanm --force JSON Hash::Merge PerlIO::gzip Devel::Size \
+    Heap::Simple Heap::Simple::XS List::MoreUtils Exception::Class Test::Warn Bio::Perl \
+    Bio::DB::SeqFeature::Store File::Next Bio::DB::Das::Chado && \
+    rm -rf /root/.cpan/
+
+
+# Expose port 3000
+EXPOSE 3000
diff --git a/docker/README.md b/docker/README.md
@@ -0,0 +1,56 @@
+# Running JBrowse with GDC Plugin in Docker
+This will get JBrowse with the GDC Viewer Plugin running with Express on port 3000.
+
+Based on [enuggetry/docker-jbrowse](https://github.com/enuggetry/docker-jbrowse)
+
+## Build and Run from Dockerfile
+### Setup data
+*Important*: Place your track data in `./data`. This maps to `/jbrowse/data` in the container, which is where JBrowse stores reference data and track information.
+
+### Build the docker image
+`docker build . -t jbrowse-with-gdc`
+
+### Run the docker image
+`docker run -p 3000:3000 -v {pwd}/data:/jbrowse/data jbrowse-with-gdc utils/jb_run.js -p 3000`
+
+Note: You can run in the background using the detach mode (-d)
+
+`docker run -d -p 3000:3000 -v {pwd}/data:/jbrowse/data jbrowse-with-gdc utils/jb_run.js -p 3000`
+
+## Build and Run from Docker Compose
+You can also use Docker Compose to build the image. Ensure you are working in the same directory as the `docker-compose.yml`.
+
+### Build docker-compose
+`docker-compose build`
+
+### Run the docker-compose
+`docker-compose up`
+
+Note: You can run in the background using the detach mode (-d)
+
+`docker-compose up -d`
+
+## Load refseq and tracks
+If you already have your `tracks.conf` and `seq/`, etc., you can simply put these files into your `./data` directory.
+
+You will have to put the RefSeq data into the `./data` directory. Download the GRCh38 `.fa` and `.fa.fai` files online (ex. http://bioinfo.hpc.cam.ac.uk/downloads/datasets/fasta/grch38/). Then put the following in `./data/tracks.conf` (note files may be named something else).
+
+```
+refSeqs=GRCh38.genome.fa.fai
+  
+[tracks.refseqs]
+urlTemplate=GRCh38.genome.fa
+```
+
+Now go to `localhost:3000` and you should see JBrowse with your refdata and tracks!
+
+### Enter the Docker Container
+You can enter the container by doing the following:
+
+```
+# Get container ID
+docker ps
+
+# Enter container
+docker exec -it <container-id> /bin/bash
+```
diff --git a/docker/docker-compose.yml b/docker/docker-compose.yml
@@ -0,0 +1,10 @@
+version: '3'
+services:
+  jbrowse:
+    build: .
+    command: utils/jb_run.js -p 3000
+    ports:
+    - "3000:3000"
+    volumes:
+    - ./data:/jbrowse/data
+
diff --git a/gdc-viewer/js/Model/GeneFeature.js b/gdc-viewer/js/Model/GeneFeature.js
@@ -85,9 +85,9 @@ get: function(name) {
         }).then(function(response) {
             return(response.json());
         }).then(function(response) {
-            document.getElementById('projects-gdc-' + geneId).innerHTML = thisB.createProjectTable(response);
+            document.getElementsByClassName('value projects')[0].innerHTML = thisB.createProjectTable(response);
         }).catch(function(err) {
-            document.getElementById('projects-gdc-' + geneId).innerHTML = 'Error creating projects table';
+            document.getElementsByClassName('value projects')[0].innerHTML = 'Error creating projects table';
         });
         return geneId;
     } else {

diff --git a/gdc-viewer/js/Model/SSMFeature.js b/gdc-viewer/js/Model/SSMFeature.js
@@ -79,9 +79,9 @@ get: function(name) {
         }).then(function(response) {
             return(response.json());
         }).then(function(response) {
-            document.getElementById('projects-gdc-' + mutationId).innerHTML = thisB.createProjectTable(response);
+            document.getElementsByClassName('value projects')[0].innerHTML = thisB.createProjectTable(response);
         }).catch(function(err) {
-            document.getElementById('projects-gdc-' + mutationId).innerHTML = 'Error creating projects table';
+            document.getElementsByClassName('value projects')[0].innerHTML = 'Error creating projects table';
         });
         return mutationId;
     } else {

diff --git a/gdc-viewer/js/Store/SeqFeature/CNVs.js b/gdc-viewer/js/Store/SeqFeature/CNVs.js
@@ -78,7 +78,7 @@ function(
             var bodyVal = JSON.stringify(thisB.createQuery(ref, start, end));
 
             // Fetch CNVs and create features
-            fetch(thisB.graphQLUrl, {
+            fetch(thisB.graphQLUrl + '/CNVsTable', {
                 method: 'post',
                 headers: { 'X-Requested-With': null },
                 body: bodyVal

diff --git a/gdc-viewer/js/View/Export/TrackConfig.js b/gdc-viewer/js/View/Export/TrackConfig.js
@@ -16,22 +16,26 @@ return declare( ExportBase,
    },
 
    _printHeader: function() {
-       var storeArray = (this.store.config.storeClass).split('/')
+       var storeArray = (this.store.config.type).split('/')
 
        var trackArray = [
-            '[tracks.' + this.store.config.label + ']',
-            'storeClass=' + this.store.config.storeClass,
+            '[tracks.' + this.track.labelHTML + ']',
+            'storeClass=' + this.store.config.type,
             'type=' + this.track.config.type,
-            'key=' + this.store.config.key,
+            'key=' + this.track.key,
             'metadata.datatype=' + storeArray[storeArray.length - 1],
-            'unsafePopup=true',
+            'unsafePopup=true'
         ]
 
-        if (this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/SimpleSomaticMutations' || this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/Genes') {
-            trackArray.push('fmtDetailValue_projects=function(value) { return "<div id=\'projects-gdc-" + value +  "\'>Loading...</div>";}');
+        if (this.store.case) {
+            trackArray.push('case=' + this.store.case)
         }
 
-        if (this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/CNVs') {
+        if (this.store.size) {
+            trackArray.push('size=' + this.store.size)
+        }
+
+        if (this.store.config.type === 'gdc-viewer/Store/SeqFeature/CNVs') {
             trackArray.push("autoscale=local");
             trackArray.push("bicolor_pivot=0");
         }

diff --git a/gdc-viewer/js/View/Export/TrackConfigJson.js b/gdc-viewer/js/View/Export/TrackConfigJson.js
@@ -16,24 +16,22 @@ return declare( ExportBase,
    },
 
    _printHeader: function() {
-       var storeArray = (this.store.config.storeClass).split('/')
+       var storeArray = (this.store.config.type).split('/')
 
         var trackObject = {
-            'label': this.store.config.label,
-            'storeClass': this.store.config.storeClass,
+            'label': this.track.labelHTML,
+            'storeClass': this.store.config.type,
             'type': this.track.config.type,
-            'key': this.store.config.key,
+            'key': this.track.key,
             'metadata': {
                 'datatype': storeArray[storeArray.length - 1]
             },
-            'unsafePopup': true
+            'unsafePopup': true,
+            'case': this.store.case,
+            'size': this.store.size
         }
 
-        if (this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/SimpleSomaticMutations' || this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/Genes') {
-            trackObject['fmtDetailValue_projects'] = 'function(value) { return "<div id=\'projects-gdc-" + value +  "\'>Loading...</div>";}';
-        }
-
-        if (this.store.config.storeClass === 'gdc-viewer/Store/SeqFeature/CNVs') {
+        if (this.store.config.type === 'gdc-viewer/Store/SeqFeature/CNVs') {
             trackObject['autoscale'] = 'local';
             trackObject['bicolor_pivot'] = 0;
         }

diff --git a/gdc-viewer/js/View/GDCDialog.js b/gdc-viewer/js/View/GDCDialog.js
@@ -234,7 +234,7 @@ function (
             var geneLoading = thisB.createLoadingIcon(thisB.geneFacetTab.containerNode);
 
             // Update the accordions with results from the GDC
-            fetch(thisB.baseGraphQLUrl, {
+            fetch(thisB.baseGraphQLUrl + '/facets', {
                 method: 'post',
                 headers: { 'X-Requested-With': null },
                 body: JSON.stringify(bodyVal)
@@ -1055,7 +1055,7 @@ function (
         },
 
         /**
-         * Creates pagination buttons for search results in the given 'holder' using the 'pagination' object from the ICGC response
+         * Creates pagination buttons for search results in the given 'holder' using the 'pagination' object from the GDC response
          * @param {object} holder DOM location to place pagination buttons
          * @param {number} totalPages the total number of pages for the given query results
          * @param {string} type the type of results to create pagination button for
@@ -1367,7 +1367,6 @@ function (
                 trackConf.autoscale = 'local';
                 trackConf.bicolor_pivot = 0;
             } else if (storeClass === 'Genes') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Gene",
@@ -1381,7 +1380,6 @@ function (
                 );
 
             } else if (storeClass === 'SimpleSomaticMutations') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Simple Somatic Mutation",

diff --git a/gdc-viewer/js/View/GDCPrimarySitesDialog.js b/gdc-viewer/js/View/GDCPrimarySitesDialog.js
@@ -73,7 +73,7 @@ function (
                 variables: {}
             }
 
-            fetch(thisB.baseGraphQLUrl, {
+            fetch(thisB.baseGraphQLUrl + '/primarySites', {
                 method: 'post',
                 headers: { 'X-Requested-With': null },
                 body: JSON.stringify(bodyVal)
@@ -253,7 +253,6 @@ function (
                 trackConf.autoscale = 'local';
                 trackConf.bicolor_pivot = 0;
             } else if (storeClass === 'Genes') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Gene",
@@ -266,7 +265,6 @@ function (
                     }
                 );
             } else if (storeClass === 'SimpleSomaticMutations') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Simple Somatic Mutation",

diff --git a/gdc-viewer/js/View/GDCProjectDialog.js b/gdc-viewer/js/View/GDCProjectDialog.js
@@ -61,7 +61,7 @@ function (
          */
         getProjectInformation: function() {
             var thisB = this;
-            var url = thisB.baseGraphQLUrl;
+            var url = thisB.baseGraphQLUrl + '/projects';
 
             // Clear current results
             dom.empty(thisB.resultsContainer);
@@ -275,7 +275,6 @@ function (
                 trackConf.autoscale = 'local';
                 trackConf.bicolor_pivot = 0;
             } else if (storeClass === 'Genes') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Gene",
@@ -288,7 +287,6 @@ function (
                     }
                 );
             } else if (storeClass === 'SimpleSomaticMutations') {
-                trackConf.fmtDetailValue_projects = function(value) { return "<div id='projects-gdc-" + value +  "'>Loading...</div" };
                 trackConf.menuTemplate.push(
                     {   
                         label : "Highlight this Simple Somatic Mutation",
@@ -310,7 +308,7 @@ function (
         },
 
         /**
-         * Creates pagination buttons for search results in the given 'holder' using the 'pagination' object from the ICGC response
+         * Creates pagination buttons for search results in the given 'holder' using the 'pagination' object from the GDC response
          * @param {number} totalPages total number of pages
          */
         createPaginationButtons: function(totalPages) {