Merge branch 'interactive_table' of github.com:paulzierep/galaxy_tool…

…_extractor into interactive_table_modif
galaxyproject · Nov 2, 2023 · 08175b6 · 08175b6
2 parents 2d9059f + f0eae20
commit 08175b6
Show file tree

Hide file tree

Showing 2 changed files with 63 additions and 1 deletion.
diff --git a/bin/create_interactive_table.py b/bin/create_interactive_table.py
@@ -39,7 +39,11 @@ def generate_table(
     df = (df[df["To keep"]]
         .loc[:, COLUMNS]
         .reindex(columns=COLUMNS))
-    table = df.to_html(border=0, table_id="dataframe", classes=["display", "nowrap"], index=False)
+    table = df.to_html(
+        border=0,
+        table_id="dataframe",
+        classes=["display", "nowrap"],
+        index=False)
 
     with open(template_path) as template_file:
         template = template_file.read()

diff --git a/data/datatable_template.html b/data/datatable_template.html
@@ -0,0 +1,58 @@
+<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
+<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
+<script src="https://cdn.datatables.net/searchbuilder/1.6.0/js/dataTables.searchBuilder.min.js"></script>
+<script src="https://cdn.datatables.net/datetime/1.5.1/js/dataTables.dateTime.min.js"></script>
+
+<script src="https://cdn.datatables.net/responsive/2.5.0/js/dataTables.responsive.min.js"></script>
+
+<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/responsive/2.2.3/css/responsive.dataTables.min.css">
+
+<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
+<link rel="stylesheet" href="https://cdn.datatables.net/searchbuilder/1.6.0/css/searchBuilder.dataTables.min.css">
+<link rel="stylesheet" href="https://cdn.datatables.net/datetime/1.5.1/css/dataTables.dateTime.min.css">
+
+<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
+<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
+
+<style type="text/css">
+  .tooltip {
+    font-family: Georgia;
+    font-size: 18px;
+  }
+  .tooltip .tooltip-inner {
+    background-color: #00FFFF;
+    color: #000000;
+    min-width: 400px;
+  }   
+  </style>
+
+<script>
+    $(document).ready(function() {
+    $('#dataframe').DataTable( {
+        "sScrollX": "100%",
+        "dom": "Qlfrtip",
+
+        responsive: {
+            details: {
+                type: 'column'
+            }
+        },
+        "bAutoWidth": false,
+        columnDefs: [ {
+            className: 'control',
+            orderable: false,
+            targets:   [ 0 ],
+            width: 100,
+        },
+        { type: 'natural', targets: 1 } // allow normal sorting
+        ],
+
+    });
+});
+</script>
+
+<div class="display nowrap" style="width:80%" width="100%">
+
+COMMUNITY_TABLE
+
+</div>