fix #2226 (#2330)

* fix #2226

* addressing @ElDeveloper comment

Author: antgonza

qiita_pet/templates/study_ajax/sample_summary.html

@@ -66,6 +66,14 @@
       })
   }
 
+  function update_sample_prep(){
+    show_loading('sample-prep-information');
+    $.get('{% raw qiita_config.portal_dir %}/study/description/sample_summary/', { study_id: {{study_id}} })
+      .done(function(data) {
+        $("#sample-prep-information").html(data);
+      });
+  }
+
   $(document).ready(function() {
     $('#file-btn').prop('disabled', true);
     $("#file-selector").change(function (event){
@@ -155,44 +163,58 @@ <h4>
   </div>
 {% end %}
 
+
 {% if stats %}
-  <div class="panel panel-default" id="summary">
-    <div class="panel-heading">
-      Sample information summary
+
+<div class="container">
+  <ul class="nav nav-pills">
+    <li class="active">
+      <a href="#sample-information" data-toggle="tab">Sample information</a>
+    </li>
+    <li class="nav-item">
+      <a href="#sample-prep-information" data-toggle="tab" onclick="update_sample_prep();">Sample and preparation summary</a>
+    </li>
+  </ul>
+
+  <div class="tab-content clearfix">
+    <div class="tab-pane" id="sample-prep-information">
     </div>
 
-    <table class="table">
-      {% for i, (category, summary) in enumerate(viewitems(stats), -1) %}
-        <tr id="row_{{i}}">
-          <td>
-            {% if editable %}
-              <a class="btn btn-danger" onclick="delete_column('{{category}}', {{i}});"><span class="glyphicon glyphicon-trash"></span></a>
-            {% else %}
-              &nbsp;
-            {% end %}
-          </td>
-          <td colspan="2">
-            {% if len(summary) == 1 %}
-                <b>{{category}}</b>: <tt>{{summary[0][0]}}</tt> is repeated in all rows.
+    <div class="tab-pane active" id="sample-information">
+      <table class="table">
+        {% for i, (category, summary) in enumerate(viewitems(stats), -1) %}
+          <tr id="row_{{i}}">
+            <td>
+              {% if editable %}
+                <a class="btn btn-danger" onclick="delete_column('{{category}}', {{i}});"><span class="glyphicon glyphicon-trash"></span></a>
+              {% else %}
+                &nbsp;
+              {% end %}
             </td>
-            {% elif len(summary) == num_samples %}
-                <b>{{category}}</b>: All the values in this category are different.
+            <td colspan="2">
+              {% if len(summary) == 1 %}
+                  <b>{{category}}</b>: <tt>{{summary[0][0]}}</tt> is repeated in all rows.
               </td>
-            {% else %}
-                <b>{{category}}<b>
-                &nbsp;&nbsp;&nbsp;&nbsp;
-                <button type="button" class="btn" data-toggle="collapse" data-target=".{{i}}collapsed">values</button>
-              </td>
-              {% for row in summary %}
-              </tr>
-              <tr class="collapse {{i}}collapsed">
-                <td>&nbsp;</td>
-                <td>{{row[0]}}</td>
-                <td>{{row[1]}}</td>
-              {% end %}
-          {% end %}
-        </tr>
-      {% end %}
-    </table>
+              {% elif len(summary) == num_samples %}
+                  <b>{{category}}</b>: All the values in this category are different.
+                </td>
+              {% else %}
+                  <b>{{category}}<b>
+                  &nbsp;&nbsp;&nbsp;&nbsp;
+                  <button type="button" class="btn" data-toggle="collapse" data-target=".{{i}}collapsed">values</button>
+                </td>
+                {% for row in summary %}
+                </tr>
+                <tr class="collapse {{i}}collapsed">
+                  <td>&nbsp;</td>
+                  <td>{{row[0]}}</td>
+                  <td>{{row[1]}}</td>
+                {% end %}
+            {% end %}
+          </tr>
+        {% end %}
+      </table>
+    </div>
   </div>
+</div>
 {% end %}

qiita_pet/templates/study_base.html

@@ -225,7 +225,6 @@
     <div class="col-md-3">
       <button class="btn btn-default btn-block" onclick="populate_main_div('{% raw qiita_config.portal_dir %}/study/description/baseinfo/', { study_id: {{study_info['study_id']}} })"><span class="glyphicon glyphicon-info-sign"></span> Study Information</button>
       <button class="btn btn-default btn-block" onclick="populate_main_div('{% raw qiita_config.portal_dir %}/study/description/sample_template/', { study_id: {{study_info['study_id']}} })"><span class="glyphicon glyphicon-info-sign"></span> Sample Information</button>
-      <button class="btn btn-default btn-block" onclick="populate_main_div('{% raw qiita_config.portal_dir %}/study/description/sample_summary/', { study_id: {{study_info['study_id']}} })" id="sample-summary-btn"><span class="glyphicon glyphicon-th-list"></span> Sample Summary</button>
       {% if editable %}
         <a class="btn btn-default btn-block" href="{% raw qiita_config.portal_dir %}/study/upload/{{study_info['study_id']}}"><span class="glyphicon glyphicon-upload"></span> Upload Files</a>
         <button class="btn btn-default btn-block" onclick="populate_main_div('{% raw qiita_config.portal_dir %}/study/new_prep_template/', { study_id: {{study_info['study_id']}} })" id="add-new-preparation-btn"><span class="glyphicon glyphicon-plus-sign"></span> Add New Preparation</button>