Merge pull request #985 from GMOD/fix_neatcf

Fix NeatCanvasFeatures - restore gradients, fixes #982

plugins/CategoryUrl/README.md

@@ -1,29 +1,35 @@
-CategoryURL - JBrowse plugin
+# CategoryURL - JBrowse plugin
 
 Add URL parameter "cat" to specify a category of tracks to display.
 All tracks with the given category will be displayed.
 If any "tracks" are specified in the URL, "cat" tracks will be appended to list.
 
-Usage: Add &cat=myCategory
+Usage: Add `&cat=myCategory` to the URL
 Result: all tracts with category "myCategory" will be displayed.
-Sub-categories are supported as well (i.e. "&cat=myCategory/mySubCategory"
+Sub-categories are supported as well (i.e. `&cat=myCategory/mySubCategory`)
 
 The cat= URL parameter allows the display of tracks with the given category 
 defined in the track metadata that are used to group tracks in the hierarchical 
 track selector.  For example:
 
-"category" : "Miscellaneous",
+    "category" : "Miscellaneous",
 
 Example:
-http://<jbrowse>/?data=sample_data/json/volvox&cat=Miscellaneous
-http://<jbrowse>/?data=sample_data/json/volvox&cat=Quantitative/Density
 
-Install / Activate:
+    http://<jbrowse>/?data=sample_data/json/volvox&cat=Miscellaneous
+
+    http://<jbrowse>/?data=sample_data/json/volvox&cat=Quantitative/Density
+
+
+### Install / Activate:
+
+For JBrowse 1.11.6+, copy the `CategoryUrl` directory to the `JBrowse` plugins directory.
+Add this to appropriate `trackList.json` under the plugins section (create section, if it doesn't exist):
+
+    "plugins": [ 
+         'CategoryUrl'
+     ],
+
 
-For JBrowse 1.11.6+, copy the CategoryUrl directory to the JBrowse 'plugins' directory.
-Add this to appropriate trackList.json under the plugins section (create section, if it doesn't exist):
 
-   "plugins": [ 
-        'CategoryUrl'
-    ],
 

plugins/NeatCanvasFeatures/README.md

@@ -1,24 +1,25 @@
-NeatCanvasFeatures is a JBrowse plugin.
+# NeatCanvasFeatures - a JBrowse plugin.
 
 It applies intron hats and a gradient 'tubular' look to features and subfeatures of CanvasFeatures tracks.
 
-What it does:
+![](img/example.png?raw=true)
+
+### What it does:
 - draws intron hats and inverted hats for reverse direction features.
 - it applies a gradient 'tubular' look to features and subfeatures, inheriting the feature colors and properties.
 - modifies UTR to be a outlined box, inheriting the original color.
 - generally functional in stand-alone JBrowse.
 
-Install / Activate:
-
-For JBrowse 1.11.6+, copy the NeatCanvasFeatures directory to the 'plugins' directory.
-Add this to appropriate trackList.json under the plugins section (create one if it doesn't exist):
+### Install / Activate:
+For JBrowse 1.11.6+, copy the `NeatCanvasFeatures` directory to the `plugins` directory.
+Add this to appropriate **trackList.json** under the plugins section (create one if it doesn't exist):
 
-   "plugins": [ 
-        'NeatCanvasFeatures'
-    ],
+    "plugins": [ 
+         'NeatCanvasFeatures'
+     ],
 
-For Apollo 2.x, copy the NeatCanvasFeatures directory to the web-apps/jbrowse/plugins directory.
-Add this to web-apps/jbrowse/plugins/WebApollo/json/annot.json:
+For Apollo 2.x, copy the NeatCanvasFeatures directory to the `web-apps/jbrowse/plugins` directory.
+Add this to `web-apps/jbrowse/plugins/WebApollo/json/annot.json`:
 
     "plugins" : [
         {
@@ -29,22 +30,22 @@ Add this to web-apps/jbrowse/plugins/WebApollo/json/annot.json:
                "location" : "./plugins/NeatCanvasFeatures",
                "name" : "NeatCanvasFeatures"
         }
-   ],
-
+    ],
 
-Config Options:
+### Config Options:
 Gradient Features are on for all HTML feature tracks by default.
 
-They can be turned off globally in the config file by setting gradientFeatures = 0 in the plugin definition, for example:
+They can be turned off globally in the config file by setting `gradientFeatures = 0` in the plugin definition, for example:
 
-   "plugins": [
-        {
-            "name": "NeatHTMLFeatures",
-            "gradientFeatures": 0
-        }
-   ],
+    "plugins": [
+         {
+             "name": "NeatHTMLFeatures",
+             "gradientFeatures": 0
+         }
+    ],
+
+When `gradientFeatures = 0` (globally off) in the plugins definition, gradient features can be enabled on per track basis with `gradientFeatures = 1` in the track configuration, for example:
 
-When gradientFeatures = 0 (globally off) in the plugins definition, gradient features can be enabled on per track basis with gradientFeatures = 1 in the track configuration, for example:
     "tracks": [
         {
             ...

plugins/NeatCanvasFeatures/js/main.js

@@ -33,7 +33,7 @@ return declare( JBrowsePlugin,
         var browser = this.browser;
 
         this.gradient = 1;
-        if(typeof args.gradientFeatures != 'undefined' && args.gradientFeatures == 0) {
+        if(typeof args.gradientFeatures !== 'undefined' && args.gradientFeatures === 0) {
             this.gradient = 0;
         }
 
@@ -71,7 +71,7 @@ return declare( JBrowsePlugin,
     segments_renderFeature: function( context, fRect ) {
         //console.log("SegmentsEx.renderFeature fRect ");
 
-        if( this.track.displayMode != 'collapsed' )
+        if( this.track.displayMode !== 'collapsed' )
             context.clearRect( Math.floor(fRect.l), fRect.t, Math.ceil(fRect.w), fRect.h );
 
         //this.renderConnector( context,  fRect );
@@ -123,7 +123,7 @@ return declare( JBrowsePlugin,
                 var _height = this._getFeatureHeight( viewInfo, subparts[i] );
                 if( ! _height )
                     return;
-                if( _height != overallHeight )
+                if( _height !== overallHeight )
                     top += Math.round( (overallHeight - _height)/2 );
 
                 var height = _height / 2;
@@ -160,7 +160,7 @@ return declare( JBrowsePlugin,
         var height = this._getFeatureHeight( viewInfo, feature );
         if( ! height )
             return;
-        if( height != overallHeight )
+        if( height !== overallHeight )
             top += Math.round( (overallHeight - height)/2 );
 
         // background
@@ -178,15 +178,15 @@ return declare( JBrowsePlugin,
 
             // Create gradient
 
-//            var grd = context.createLinearGradient(left, top, left, top+height);
+            var grd = context.createLinearGradient(left, top, left, top+height);
 
-//            // Add colors
-//            grd.addColorStop(0.000, bgcolor);
-//            grd.addColorStop(0.500,this.colorShift(bgcolor,2.5));
-//            grd.addColorStop(0.999, bgcolor);
+            // Add colors
+            grd.addColorStop(0.000, bgcolor);
+            grd.addColorStop(0.500,this.colorShift(bgcolor,2.5));
+            grd.addColorStop(0.999, bgcolor);
 
-//            // Fill with linear 
-            context.fillStyle = bgcolor;
+            // Fill with linear 
+            context.fillStyle = grd;
 
         }
 
@@ -235,7 +235,7 @@ return declare( JBrowsePlugin,
     /**
      * Given color string in #rrggbb format, shift the color by shift %  ( i.e. .20 is 20% brighter, -.30 is 30% darker.
      * The new string is returned.
-     * If color is not in #rrggbb format, just return the original value. 
+     * If color is not in #rrggbb format, just return the original value.
      */
     box_colorShift: function(color,shift) {
 
@@ -345,7 +345,7 @@ function colourNameToHex(colour)  {
     "wheat":"#f5deb3","white":"#ffffff","whitesmoke":"#f5f5f5",
     "yellow":"#ffff00","yellowgreen":"#9acd32"};
 
-    if (typeof colours[colour.toLowerCase()] != 'undefined')
+    if (typeof colours[colour.toLowerCase()] !== 'undefined')
         return colours[colour.toLowerCase()];
 
     return "#000000";

plugins/NeatHTMLFeatures/README.md

@@ -1,66 +1,68 @@
-#NeatHTMLFeatures - a JBrowse plugin.
-
-It applies intron hats and a gradient 'tubular' look to features and subfeatures of HTMLFeatures tracks.
-This is refactored from HTMLFeaturesEx.js implementation and the insertion/modification to DOM elements are done out-of-band,
-due to difference between HTMLFeatures and DragableHTMLFeatures feature DOMs.
-
-What it does:
-- draws intron hats and inverted hats for reverse direction features.
-- it applies a gradient 'tubular' look to features and subfeatures, inheriting the feature colors and properties.
-- modifies UTR to be a outlined box, inheriting the original color.
-- generally functional in stand-alone JBrowse.
-- special considerations have been made for the unique way Web Apollo renders it's nested subfeatures.
-
-
-##Install / Activate:
-
-For JBrowse 1.11.6+, copy the NeatHTMLFeatures directory to the 'plugins' directory.
-Add this to appropriate trackList.json under the plugins section (create one if it doesn't exist):
-
-    "plugins": [ 
-        'NeatHTMLFeatures'
-    ],
-
-For Apollo 2.x, copy the NeatHTMLFeatures directory to the web-apps/jbrowse/plugins directory.
-Add this to web-apps/jbrowse/plugins/WebApollo/json/annot.json:
-
-    "plugins" : [
-      {
-         "location" : "./plugins/WebApollo",
-         "name" : "WebApollo"
-      },
-	  {
-		 "location" : "./plugins/NeatHTMLFeatures",
-		 "name" : "NeatHTMLFeatures"
-	  }
-    ],
-
-
-#Config Options:
-Introns remain ON for all feature tracks.
-Neat Features are ON by default, but can be disabled.
-Linear Gradients are ON by default (and visible as part of neat features), but can be disabled on all tracks.
-
-Neat features can be turned off globally in the config file by setting neatFeatures = 0 in the plugin definition, for example:
-
-    "plugins": [
-        {
-            "name": "NeatHTMLFeatures",
-            "neatFeatures": 0
-        }
-    ],
-
-When neatFeatures = 0 (globally off) in the plugins definition, gradient features can be enabled on per track basis with neatFeatures = 1 in the track configuration, for example:
-
-    "tracks": [
-        {
-            ...
-            "type" : "FeatureTrack",
-            "label" : "ReadingFrame",
-            "neatFeatures" : 1,
-            "linearGradient": 0,
-            ...
-        }
-    ]
-
-(note: the track-level neatFeatures option only applies when the plugin-level neatFeatures=0)
+# NeatHTMLFeatures - a JBrowse plugin.
+
+It applies intron hats and a gradient 'tubular' look to features and subfeatures of HTMLFeatures tracks.
+This is refactored from HTMLFeaturesEx.js implementation and the insertion/modification to DOM elements are done out-of-band,
+due to difference between HTMLFeatures and DragableHTMLFeatures feature DOMs.
+
+![](img/example.png?raw=true)
+
+### What it does:
+- draws intron hats and inverted hats for reverse direction features.
+- it applies a gradient 'tubular' look to features and subfeatures, inheriting the feature colors and properties.
+- modifies UTR to be a outlined box, inheriting the original color.
+- generally functional in stand-alone JBrowse.
+- special considerations have been made for the unique way Web Apollo renders it's nested subfeatures.
+
+
+### Install / Activate:
+
+For JBrowse 1.11.6+, copy the NeatHTMLFeatures directory to the 'plugins' directory.
+Add this to appropriate trackList.json under the plugins section (create one if it doesn't exist):
+
+    "plugins": [ 
+        'NeatHTMLFeatures'
+    ],
+
+For Apollo 2.x, copy the NeatHTMLFeatures directory to the `web-apps/jbrowse/plugins` directory.
+Add this to `web-apps/jbrowse/plugins/WebApollo/json/annot.json`:
+
+    "plugins" : [
+      {
+         "location" : "./plugins/WebApollo",
+         "name" : "WebApollo"
+      },
+	  {
+		 "location" : "./plugins/NeatHTMLFeatures",
+		 "name" : "NeatHTMLFeatures"
+	  }
+    ],
+
+
+### Config Options:
+Introns remain ON for all feature tracks.
+Neat Features are ON by default, but can be disabled.
+Linear Gradients are ON by default (and visible as part of neat features), but can be disabled on all tracks.
+
+NeatFeatures can be turned off globally in the config file by setting `neatFeatures = 0` in the plugin definition, for example:
+
+    "plugins": [
+        {
+            "name": "NeatHTMLFeatures",
+            "neatFeatures": 0
+        }
+    ],
+
+When `neatFeatures = 0` (globally off) in the plugins definition, gradient features can be enabled on per track basis with `neatFeatures = 1` in the track configuration, for example:
+
+    "tracks": [
+        {
+            ...
+            "type" : "FeatureTrack",
+            "label" : "ReadingFrame",
+            "neatFeatures" : 1,
+            "linearGradient": 0,
+            ...
+        }
+    ]
+
+*note: the track-level `neatFeatures` option only applies when the plugin-level `neatFeatures=0`*