arrange report

lib/imp.html

@@ -68,7 +68,7 @@
         <div class="tab-content">
 
 
-
+            <!-- RAW STATISTICS -->
             <div role="tabpanel" class="tab-pane fade" id="raw">
               <section id="raw-section" class="row">
                 <h2><small>Raw data statistics</small></h2>
@@ -89,12 +89,11 @@
                 <div class="row">
                     <iframe id="ifr-raw-stat" src="Analysis/stats/MG/MG.R1.fq_fastqc.html" style="position: absolute; width: 100%;height: 100%; border: none"></iframe>
                 </div>
-
               </section>
             </div>
 
 
-          <!-- STATISTICS -->
+          <!-- PREPROCESS STATISTICS -->
           <div role="tabpanel" class="tab-pane fade active" id="preprocess">
             <section id="preprocess-section" class="row">
                 <h2><small>Preprocessed data statistics</small></h2>
@@ -121,8 +120,9 @@
                 <div class="row">
                     <iframe id="ifr-preprocess-stat" src="Analysis/stats/MG/MG.R1_preprocessed_fastqc.html" style="position: absolute; width: 100%;height: 100%; border: none"></iframe>
                 </div>
-
             </section>
+
+
             <!-- FILTERING -->
             <section id="filtering-section" class="row">
               <div class="row">
@@ -132,8 +132,26 @@
             </section>
           </div>
           <!--  ASSEMBLY -->
+
           <div role="tabpanel" class="tab-pane fade" id="assembly">
             <section id="assembly-section" class="row">
+                <div id="but-assembly" class="row btn-group" data-toggle="buttons" name="assembly-data">
+                    <label class="btn btn-primary active">
+                        <input id="but-assembly1" type="radio" value="Analysis/stats/MT/MT.SE_preprocessed_fastqc.html" class="btn btn-default" name="assembly-data" checked>Quast
+                    </label>
+                    <label class="btn btn-primary">
+                        <input id="but-assembly2" type="radio" value="Analysis/results/IMP-vizbin_length.png" class="btn btn-default" name="assembly-data">Vizbin length
+                    </label>
+                        <label class="btn btn-primary">
+                            <input id="but-assembly3" type="radio" value="Analysis/results/IMP-vizbin_length_GC.png" class="btn btn-default" name="assembly-data">Vizbin GC
+                        </label>
+                </div>
+                <div class="row">
+                    <div class="row" id="assembly-wrapper"></div>
+                </div>
+
+
+          <!-- <div role="tabpanel" class="tab-pane fade" id="assembly">
               <h2><small>Assembly </small></h2>
               <div class="row">
                 <div class="col-sm-3 col-md-3"></div>
@@ -143,7 +161,7 @@
 
               <div class="row">
                   <div id="carousel-assembly-wrapper"></div>
-              </div>
+              </div> -->
             </section>
           </div>
 
@@ -219,12 +237,6 @@
           <section class="row">
             <section id="impstatistics-section">
               <h2><small>Statistics </small></h2>
-              <div id="imp-stats-alert" class="row" style="display: none;">
-                <div class="alert alert-warning alert-dismissible" role="alert">
-                  <button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
-                  <strong>Warning!</strong> You don't have any statistics about the run. Next time don't forget to use Snakemake with the <kbd>--stats stats.json</kbd> option.
-                </div>
-              </div>
               <div id="imp-stats" class="row">
                 <div id="basic-info"></div>
                 <div id="time-charts-mean"></div>

lib/imp.js

@@ -269,10 +269,19 @@ $('#but-annot').on('change', function(){
 });
 
 
-renderSimpleCarousel('carousel-assembly', 'Analysis/results', [
-    'IMP-vizbin_length.png',
-    'IMP-vizbin_length_GC.png'
-]);
+$('#but-assembly').on('change', function(){
+    var val = $('input[name="assembly-data"]:checked').val();
+    if(val.endsWith('png')){
+        $("#assembly-wrapper").replaceWith("<div id='assembly-wrapper' class='row'><img class='img-responsive' src='" + val + "'/></div>");
+    } else {
+        $("#assembly-wrapper").replaceWith("<div id='assembly-wrapper' class='row'><iframe style='position: absolute; width: 100%;height: 100%; border: none' src='" + val + "'></iframe></div>");
+    }
+});
+
+// renderSimpleCarousel('carousel-assembly', 'Analysis/results', [
+//     'IMP-vizbin_length.png',
+//     'IMP-vizbin_length_GC.png'
+// ]);
 
 renderSimpleCarousel('carousel-mapping', 'Analysis/results', [
     'IMP-reads_density.png',