diff test-data/out.html @ 0:09114b034834 draft default tip

"planemo upload for repository https://github.com/ImmPortDB/immport-galaxy-tools/tree/master/flowtools/cs_overview commit d572546e2a1a28b33df2f908652e85dd86f5916f"
author azomics
date Wed, 20 May 2020 15:37:35 -0400
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/test-data/out.html	Wed May 20 15:37:35 2020 -0400
@@ -0,0 +1,282 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+<title>CrossSample Overview</title>
+<meta charset="UTF-8">
+<meta HTTP-EQUIV="Pragma" CONTENT="no-cache">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"/>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css"/>
+<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/pdfmake-0.1.18/dt-1.10.12/b-1.2.1/b-colvis-1.2.1/b-html5-1.2.1/cr-1.3.2/fc-3.2.2/fh-3.1.2/r-2.1.0/rr-1.1.2/sc-1.4.2/se-1.2.0/datatables.min.css"/>
+<link rel="stylesheet" href="/static/flowtools/css/parallelCoordinates.css"/>
+
+<script type="text/javascript" src="https://cdn.datatables.net/v/dt/pdfmake-0.1.18/dt-1.10.12/b-1.2.1/b-colvis-1.2.1/b-html5-1.2.1/cr-1.3.2/fc-3.2.2/fh-3.1.2/r-2.1.0/rr-1.1.2/sc-1.4.2/se-1.2.0/datatables.min.js"></script>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" type="text/javascript"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.full.min.js" type="text/javascript"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" type="text/javascript"></script>
+<script src="https://cdn.plot.ly/plotly-1.0.0.min.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/csOverview.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/crossSamplePlots.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/pCoordMFIstats.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/pCoordCSstats.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/color_palette.js" type="text/javascript"></script>
+<script src="/static/flowtools/js/boxplots.js" type="text/javascript"></script>
+
+<style>
+#input{font-family:Calibri,Arial}
+table.dataTable tbody td.dt-body-right {
+    text-align: right;
+}
+#div{padding:5px;width:150px;height:100px;text-align:center}
+table{width:100%;border:0px solid;border-collapse:collapse;text-align:center;}
+th{background-color:#3e6db0;color:#fff;padding:5px}
+</style>
+</head>
+
+<body>
+<div class="container-fluid">
+    <div class="row" style="padding-bottom:10px;min-height:500px;">
+        <div  class="col-md-12">
+            <ul class="nav nav-tabs tabs-main">
+                <li class="homeTab active" data-value="prop"><a href="#prop" data-toggle="tab">Population Distribution</a></li>
+                <li class="homeTab" data-value="stackedA"><a href="#stackedA" data-toggle="tab">Stacked Plot</a></li>
+                <li class="homeTab" data-value="pcoord"><a href="#pcoord" data-toggle="tab">Parallel Coordinates Population Summary</a></li>
+                <li class="homeTab" data-value="pcoordMFI"><a href="#pcoordMFI" data-toggle="tab">Parallel Coordinates MFI Summary</a></li>
+                <li class="homeTab" data-value="csstats"><a href="#boxplot" data-toggle="tab">Summary Statistics Boxplots</a></li>
+            </ul>
+
+            <div class="tab-content">
+                <div class="tab-pane active" id="prop" style="min-height:500px;">
+                    <div class="row">
+                        <div id="propDiv">Population Distribution</div>
+                    </div>
+                    <div class="row">
+                    &nbsp;&nbsp;&nbsp;&nbsp;Edit population names below:
+                    <div id="popnamesDiv"></div>
+                    </div>
+                </div>
+
+                <div class="tab-pane" id="stackedA" style="min-height:500px;">
+                    <div class="col-md-12 chartDiv">
+                        <div id="plotDivA" class="col-md-10" style="height:100%;"></div>
+
+                        <div id="popDivA" class="col-md-2" style="height:100%;">
+                          <div class="row">
+                              <div class="col-sm-6 optionButtons">
+                                <button id="updateDisplayA" class="igbtn">Reset Display</button>
+                              </div>
+                              <div class="col-sm-6 optionButtons">
+                                <button id="togglePlot" class="igbtn"><img id="toggleButtonImg" src="/static/images/flowtools/barssm.png"></button>
+                              </div>
+                            </div>
+                            <table id="popTableA" class="table table-condensed table-bordered igtable">
+                                <thead>
+                                    <tr>
+                                        <th><input type="checkbox" checked id="popSelectAllA"/></th>
+                                        <th>Pop. Names</th>
+                                        <th>Color</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="tab-pane" id="pcoord" style="min-height:500px;">
+                    <div id="chartDivPC" class="col-md-12 chartDiv">
+                        <div class="row">
+                            <div class="col-md-10" style="height:100%;">
+                                <div id="plotDivPC" style="height:50%;"></div>
+                                <div id="tableDivPC" style="height:50%;"></div>
+                            </div>
+                            <div id="popDivPC" class="col-md-2" style="height:100%;">
+                                <div class="widget">
+	                                  <input type="range" min="0" max="1" value="0.8" step="0.01" id="PCline_opacity" >
+	                                  </input>
+                                      Opacity: <span id="pc_opacity">80%</span>
+	                            </div>
+                                <button id="resetPCDisplay" class="igbtn">Reset Display</button>
+                                <table id="popTablePC" class="table table-condensed table-bordered igtable">
+                                    <thead>
+                                        <tr>
+                                          <th><input type="checkbox" checked id="popSelectAllPC"/></th>
+                                          <th>Sample Name</th>
+                                          <th>Color</th>
+                                       </tr>
+                                    </thead>
+                                    <tbody>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="tab-pane" id="pcoordMFI" style="min-height:500px;">
+                    <div id="chartDivPCm" class="col-md-12 chartDiv">
+                        <div class="row">
+                            <div id="smpDivPCm" class="col-md-1" style="height:100%;min-width:5%;">
+                                 <table id="smpTablePCm" class="table table-condensed table-bordered igtable">
+                                    <thead>
+                                        <tr>
+                                          <th>Sample Name</th>
+                                          <th><input type="checkbox" checked id="smpSelectAllPCm"/></th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                    </tbody>
+                                </table>
+                            </div>
+                            <div class="col-md-9" style="height:100%">
+                                <div id="plotDivPCm" style="height:50%"></div>
+                                <div id="tableDivPCm" style="height:50%"></div>
+                            </div>
+
+                            <div id="popDivPCm" class="col-md-2" style="margin-top:5px;">
+                                <div class="widget">
+	                                  <input type="range" min="0" max="1" value="0.8" step="0.01" id="PCmline_opacity" >
+	                                  </input>
+                                      Opacity: <span id="pcm_opacity">80%</span>
+	                            </div>
+                                <button id="resetDisplayMFIpop" class="igbtn">Reset Display</button>
+                                <table id="popTablePCm" class="table table-condensed table-bordered igtable">
+                                    <thead>
+                                        <tr>
+                                          <th><input type="checkbox" checked id="popSelectAllPCm"/></th>
+                                          <th>Population</th>
+                                          <th>Color</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="tab-pane" id="boxplot" style="min-height:500px;">
+                    <div class="col-md-12 chartDiv">
+                        <div id="mrkrDivC" class="col-md-2" style="height:100%;min-width:5%;">
+                          <table id="mrkrTableC" class="table table-condensed table-bordered igtable">
+                            <thead>
+                              <tr>
+                                <th>Shade</th>
+                                <th>Marker Names</th>
+                                <th><input type="checkbox" checked id="mrkrSelectAllC"/></th>
+                              </tr>
+                            </thead>
+                            <tbody>
+                            </tbody>
+                          </table>
+                          <input type="checkbox" unchecked id="displayLabelsC"/>&nbsp;Display values<br>
+                          <input type="checkbox" unchecked id="displayMFIC"/>&nbsp;Display MFI<br><br>
+                          <button id="changeDisplayC" class="igbtn">View per marker</button><br><br>
+                          <div id="markerWarning" style="display:none;">
+                            <div class="alert alert-info alert-dismissible fade in" role="alert">
+                              <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+                                <span aria-hidden="true">&times;</span></button>
+                                  Only 5 markers can be displayed at most.
+                            </div>
+                          </div>
+                          <div id="outlierWarning">
+                            <div class="alert alert-info alert-dismissible fade in" role="alert">
+                              <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+                                <span aria-hidden="true">&times;</span></button>
+                                  The number of outliers is too large to display. Representation shows randomly downsampled outliers.
+                            </div>
+                          </div>
+                        </div>
+
+                        <div id="plotDivC" class="col-md-8" style="height:100%;"></div>
+
+                        <div id="popDivC" class="col-md-2" style="height:100%;">
+                            <button id="updateDisplayC" class="igbtn">Reset Display</button>
+                            <table id="popTableC" class="table table-condensed table-bordered igtable">
+                                <thead>
+                                    <tr>
+                                        <th><input type="checkbox" checked id="popSelectAllC"/></th>
+                                        <th>Pop. Names</th>
+                                        <th>Color</th>
+                                     </tr>
+                                </thead>
+                                <tbody>
+                                </tbody>
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+</div>
+</div>
+<script>
+var poppropLoaded = false;
+var stackedALoaded = false;
+var pCoordLoaded = false;
+var pCoordMFILoaded = false;
+var boxplotLoaded = false;
+
+$().ready(function() {
+    $(document).on('shown.bs.tab','a[data-toggle="tab"]', function(e) {
+      var tab = e.target.getAttribute("href");
+      if (tab == '#prop') {
+        if (poppropLoaded) {
+            return true;
+        }
+        poppropLoaded = true;
+        displayProp();
+      }
+      if (tab == '#stackedA') {
+        if (stackedALoaded) {
+            displayPopulationLegend(configAreaplot);
+            updatePlot(configAreaplot);
+            return true;
+        }
+        stackedALoaded = true;
+        displayStackedAreaPlot();
+      }
+      if (tab == '#pcoord') {
+        if (pCoordLoaded) {
+            displaySmpTable();
+            displayTableGrid();
+            return true;
+        }
+        pCoordLoaded = true;
+        displayParallelCoordinates();
+      }
+      if (tab == '#pcoordMFI') {
+        if (pCoordMFILoaded) {
+            displayPopTablem();
+            displaySmpTablem();
+            displayTableGridm();
+            return true;
+        }
+        pCoordMFILoaded = true;
+        displayParallelCoordinatesMFI();
+      }
+      if (tab == '#boxplot') {
+        if (boxplotLoaded) {
+            displayPopulationLegend(configBoxplot);
+            displayMarkerTable(configBoxplot);
+            updateBoxplot(configBoxplot);
+            return true;
+        }
+        boxplotLoaded = true;
+        displayBoxplot();
+      }
+    });
+
+    poppropLoaded = true;
+    displayProp();
+});
+</script>
+</body>
+</html>