ENH: display # of NaN-balance samples in a <div>

Progress towards #92. I guess this is ~ 1/4 of the work there.
biocore · Jun 2, 2019 · ba6291a · ba6291a
1 parent f349613
commit ba6291a
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 6 deletions.
diff --git a/qurro/support_files/js/display.js b/qurro/support_files/js/display.js
@@ -377,12 +377,28 @@ define(["./feature_computation", "./dom_utils", "vega", "vega-embed"], function(
                     )
                 )
                 .run();
-            console.log(
-                String(numSamplesWithNaNBalance) +
-                    " / " +
-                    String(this.sampleCount) +
-                    " sample(s) dropped due to NaN balance."
-            );
+            if (numSamplesWithNaNBalance > 0) {
+                var sampleNoun = "samples";
+                if (numSamplesWithNaNBalance === 1) {
+                    sampleNoun = "sample";
+                }
+                dom_utils.setDivText(
+                    "balanceSamplesDroppedDiv",
+                    String(numSamplesWithNaNBalance) +
+                        " / " +
+                        String(this.sampleCount) +
+                        " " +
+                        sampleNoun +
+                        " can't be shown due to having an undefined log ratio."
+                );
+                document
+                    .getElementById("balanceSamplesDroppedDiv")
+                    .classList.remove("invisible");
+            } else {
+                document
+                    .getElementById("balanceSamplesDroppedDiv")
+                    .classList.add("invisible");
+            }
             // Update rank plot based on the new log ratio
             // Storing this within changeSamplePlot() is a (weak) safeguard that
             // changes to the state of the sample plot (at least enacted using the UI

diff --git a/qurro/support_files/js/dom_utils.js b/qurro/support_files/js/dom_utils.js
@@ -75,6 +75,13 @@ define(function() {
         }
     }
 
+    /* Just reassigns the innerHTML attribute of a <div> (or really any HTML
+     * element, I guess).
+     */
+    function setDivText(divID, text) {
+        document.getElementById(divID).innerHTML = text;
+    }
+
     /* Downloads a string (either plain text or already a data URI) defining
      * the contents of a file.
      *
@@ -101,6 +108,7 @@ define(function() {
         populateSelect: populateSelect,
         changeElementsEnabled: changeElementsEnabled,
         clearDiv: clearDiv,
+        setDivText: setDivText,
         downloadDataURI: downloadDataURI
     };
 });