Add sequence blur on density track

elsiklab · Aug 3, 2017 · 030180e · 030180e
1 parent 531ce03
commit 030180e
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 6 deletions.
diff --git a/ChangeLog.md b/ChangeLog.md
@@ -1,3 +1,7 @@
+# Version 0.3.0
+
+- Add sequence blur when zoomed too far out on density track (xy track already had this)
+
 # Version 0.2.0
 
 - Fix off-by-one error on windowsize/windowdelta 1. Thanks to @childers for the report

diff --git a/js/View/Track/GCContent.js b/js/View/Track/GCContent.js
@@ -30,6 +30,7 @@ function (
             return Util.deepUpdate(lang.clone(this.inherited(arguments)), {
                 min_score: 0,
                 max_score: 1,
+                maxZoom: 0.001,
                 windowSize: 100,
                 windowDelta: 10,
                 gcMode: 'content',
@@ -65,6 +66,26 @@ function (
                 }
             });
             return options;
+        },
+
+        fillBlock: function (args) {
+            var block = args.block;
+            var blockIndex = args.blockIndex;
+            var scale = args.scale;
+            var blur = dojo.create('div', {
+                className: 'sequence_blur',
+                innerHTML: '<span class="loading">Loading</span>'
+            }, block.domNode);
+
+            this.heightUpdate(blur.offsetHeight + 2 * blur.offsetTop, blockIndex);
+
+            // If we are zoomed in far enough to draw bases, then draw them
+            if (scale >= this.config.maxZoom) {
+                this.inherited(arguments);
+            } else {
+                blur.innerHTML = '<span class="zoom">Zoom in to see GC content</span>';
+                args.finishCallback();
+            }
         }
     });
 });
diff --git a/js/View/Track/GCContentXY.js b/js/View/Track/GCContentXY.js
@@ -73,15 +73,14 @@ function (
             var block = args.block;
             var blockIndex = args.blockIndex;
             var scale = args.scale;
-            var blur = dojo.create(
-'div',
-                { className: 'sequence_blur',
-                    innerHTML: '<span class="loading">Loading</span>'
-                }, block.domNode);
+            var blur = dojo.create('div', {
+                className: 'sequence_blur',
+                innerHTML: '<span class="loading">Loading</span>'
+            }, block.domNode);
 
             this.heightUpdate(blur.offsetHeight + 2 * blur.offsetTop, blockIndex);
 
-// If we are zoomed in far enough to draw bases, then draw them
+            // If we are zoomed in far enough to draw bases, then draw them
             if (scale >= this.config.maxZoom) {
                 this.inherited(arguments);
             } else {