[Documentation] Search bar for tables within docs (#646)

* input and output tables search bar js

* Remove site folder from tracking and update .gitignore

* new js function for search box and md file div updated

* remove site folder

* update search box and move js file

* minor style changes and rounded box edge

* remove extra javascripts

* update border color box

.gitignore

@@ -1,3 +1,4 @@
 cromwell*
 _LAST
-2024*
+2024*site/
+site/

docs/javascripts/table-search.js

@@ -0,0 +1,64 @@
+function addTableSearch() {
+    // Select all containers with the class 'searchable-table'
+    const containers = document.querySelectorAll('.searchable-table');
+
+    containers.forEach((container) => {
+        // Find the table within this container
+        const table = container.querySelector('table');
+
+        if (table) {
+            // Ensure we don't add multiple search boxes
+            if (!container.querySelector('input[type="search"]')) {
+                // Create the search input element
+                const searchInput = document.createElement("input");
+                searchInput.setAttribute("type", "search");
+                searchInput.setAttribute("placeholder", "Search table...");
+                searchInput.classList.add('table-search-input');
+                searchInput.style.marginBottom = "10px";
+                searchInput.style.display = "block";
+
+                // Insert the search input before the table
+                container.insertBefore(searchInput, container.firstChild);
+
+                // Add event listener for table search
+                searchInput.addEventListener("input", function () {
+                    const filter = searchInput.value.toUpperCase();
+                    const rows = table.getElementsByTagName("tr");
+
+                    for (let i = 1; i < rows.length; i++) { // Skip header row
+                        const cells = rows[i].getElementsByTagName("td");
+                        let match = false;
+
+                        for (let j = 0; j < cells.length; j++) {
+                            if (cells[j].innerText.toUpperCase().includes(filter)) {
+                                match = true;
+                                break;
+                            }
+                        }
+
+                        rows[i].style.display = match ? "" : "none";
+                    }
+                });
+            }
+        } else {
+            console.log('Table not found within container.');
+        }
+    });
+}
+
+// Run on page load
+addTableSearch();
+
+// Reapply search bar on page change
+function observeDOMChanges() {
+    const targetNode = document.querySelector('body');
+    const config = { childList: true, subtree: true };
+
+    const observer = new MutationObserver(() => {
+        addTableSearch();
+    });
+
+    observer.observe(targetNode, config);
+}
+
+observeDOMChanges();

docs/stylesheets/extra.css

@@ -184,5 +184,36 @@ th {
 td {
   word-break: break-all;
 }
+/* Base styles for the search box */
+div.searchable-table input.table-search-input {
+  width: 25%;
+  padding: 10px;
+  margin-bottom: 12px;
+  font-size: 12px;
+  box-sizing: border-box;
+  border-radius: 2px; 
+}
+
+/* Light mode styles */
+[data-md-color-scheme="light"] div.searchable-table input.table-search-input {
+  background-color: #fff;
+  color: #000;
+  border: 1px solid #E0E1E1;
+}
 
+[data-md-color-scheme="light"] div.searchable-table input.table-search-input::placeholder {
+  color: #888;
+  font-style: italic;
+}
 
+/* Dark mode styles */
+[data-md-color-scheme="slate"] div.searchable-table input.table-search-input {
+  background-color: #1d2125;
+  color: #fff;
+  border: 1px solid #373B40;
+}
+
+[data-md-color-scheme="slate"] div.searchable-table input.table-search-input::placeholder {
+  color: #bbb;
+  font-style: italic;
+}

docs/workflows/data_export/concatenate_column_content.md

@@ -16,6 +16,8 @@ This set-level workflow will create a file containing all of the items from a gi
 
 This workflow runs on the set level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | concatenate_column_content | **concatenated_file_name** | String | The name of the output file. ***Include the extension***, such as ".fasta" or ".txt". |  | Required |
@@ -28,6 +30,8 @@ This workflow runs on the set level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Outputs
 
 !!! info

docs/workflows/data_export/transfer_column_content.md

@@ -25,6 +25,8 @@ This set-level workflow will transfer all of the items from a given column in a
 
 This workflow runs on the set level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task name** | **input_variable** | **Type** | **Description** | **Default attribute** | **Status** |
 |---|---|---|---|---|---|
 | transfer_column_content | **files_to_transfer** | Array[File] | The column that has the files you want to concatenate. | | Required |
@@ -36,6 +38,8 @@ This workflow runs on the set level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Outputs
 
 !!! info

docs/workflows/data_export/zip_column_content.md

@@ -16,6 +16,8 @@ This workflow will create a zip file that contains all of the items in a column
 
 This workflow runs on the set level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | zip_column_content | **files_to_zip** | Array[File] | The column that has the files you want to zip. |  | Required |
@@ -27,6 +29,8 @@ This workflow runs on the set level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Outputs
 
 !!! info

docs/workflows/data_import/assembly_fetch.md

@@ -23,6 +23,8 @@ Assembly_Fetch requires the input samplename, and either the accession for a ref
 
 This workflow runs on the sample level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | reference_fetch | **samplename** | String | Your sample's name |  | Required |
@@ -44,6 +46,8 @@ This workflow runs on the sample level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Analysis Tasks
 
 ??? task "ReferenceSeeker (optional) Details"
@@ -90,6 +94,8 @@ This workflow runs on the sample level.
 
 ### Outputs
 
+<div class="searchable-table" markdown="1">
+
 | **Variable** | **Type** | **Description** |
 |---|---|---|
 | assembly_fetch_analysis_date | String | Date of assembly download |
@@ -101,11 +107,13 @@ This workflow runs on the sample level.
 | assembly_fetch_ncbi_datasets_version | String | NCBI datasets version used |
 | assembly_fetch_referenceseeker_database | String | ReferenceSeeker database used |
 | assembly_fetch_referenceseeker_docker | String | Docker file used for ReferenceSeeker |
-| assembly_fetch_referenceseeker_top_hit_ncbi_accession | String | NCBI Accession for the top it identified by Assembly_Fetch |
+| assembly_fetch_referenceseeker_top_hit_ncbi_accession | String | NCBI Accession for the top hit identified by Assembly_Fetch |
 | assembly_fetch_referenceseeker_tsv | File | TSV file of the top hits between the query genome and the Reference Seeker database |
 | assembly_fetch_referenceseeker_version | String | ReferenceSeeker version used |
 | assembly_fetch_version | String | The version of the repository the Assembly Fetch workflow is in |
 
+</div>
+
 ## References
 
 > **ReferenceSeeker:** Schwengers O, Hain T, Chakraborty T, Goesmann A. ReferenceSeeker: rapid determination of appropriate reference genomes. J Open Source Softw. 2020 Feb 4;5(46):1994.

docs/workflows/data_import/basespace_fetch.md

@@ -153,6 +153,8 @@ This process must be performed on a command-line (ideally on a Linux or MacOS co
 
 This workflow runs on the sample level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | basespace_fetch | **access_token** | String | The access token is used in place of a username and password to allow the workflow to access the user account in BaseSpace from which the data is to be transferred. It is an alphanumeric string that is 32 characters in length. Example: 9e08a96471df44579b72abf277e113b7 | | Required |
@@ -168,6 +170,8 @@ This workflow runs on the sample level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### **Outputs**
 
 The outputs of this workflow will be the fastq files imported from BaseSpace into the data table where the sample ID information had originally been uploaded.

docs/workflows/data_import/create_terra_table.md

@@ -19,6 +19,8 @@ The manual creation of Terra tables can be tedious and error-prone. This workflo
 
     **_This can be changed_** by providing information in the `file_ending` optional input parameter. See below for more information.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | create_terra_table | **assembly_data** | Boolean | Set to true if your data is in FASTA format; set to false if your data is FASTQ format | | Required |
@@ -33,6 +35,8 @@ The manual creation of Terra tables can be tedious and error-prone. This workflo
 | make_table | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/terra-tools:2023-06-21" | Optional |
 | make_table | **memory** | Int | Amount of memory/RAM (in GB) to allocate to the task | 4 | Optional |
 
+</div>
+
 ### Finding the `data_location_path`
 
 #### Using the Terra data uploader

docs/workflows/data_import/sra_fetch.md

@@ -16,6 +16,8 @@ Read files associated with the SRA run accession provided as input are copied to
 
 This workflow runs on the sample level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | fetch_sra_to_fastq | **sra_accession** | String | SRA, ENA, or DRA accession number | | Required |
@@ -25,6 +27,8 @@ This workflow runs on the sample level.
 | fetch_sra_to_fastq | **fastq_dl_options** | String | Additional parameters to pass to fastq_dl from [here](https://github.com/rpetit3/fastq-dl?tab=readme-ov-file#usage) | "--provider sra" | Optional |
 | fetch_sra_to_fastq | **memory** | Int | Amount of memory/RAM (in GB) to allocate to the task | 8 | Optional |
 
+</div>
+
 The only required input for the SRA_Fetch workflow is an SRA run accession beginning "SRR", an ENA run accession beginning "ERR", or a DRA run accession which beginning "DRR".
 
 Please see the [NCBI Metadata and Submission Overview](https://www.ncbi.nlm.nih.gov/sra/docs/submitmeta/) for assistance with identifying accessions. Briefly, NCBI-accessioned objects have the following naming scheme:
@@ -41,6 +45,8 @@ Read data are available either with full base quality scores (**SRA Normalized F
 
 Given the lack of usefulness of SRA Lite formatted FASTQ files, we try to avoid these by selecting as provided SRA directly (SRA-Lite is more probably to be the file synced to other repositories), but some times downloading these files is unavoidable. To make the user aware of this, a warning column is present that is populated when an SRA-Lite file is detected.
 
+<div class="searchable-table" markdown="1">
+
 | **Variable** | **Type** | **Description** | **Production Status** |
 |---|---|---|---|
 | read1 | File | File containing the forward reads | Always produced |
@@ -51,6 +57,8 @@ Given the lack of usefulness of SRA Lite formatted FASTQ files, we try to avoid
 | fastq_dl_version | String | Fastq_dl version used | Always produced |
 | fastq_dl_warning | String |  This warning field is populated if SRA-Lite files are detected. These files contain all quality encoding as Phred-30 or Phred-3. | Depends on internal workflow logic |
 
+</div>
+
 ## References
 
 > This workflow relies on [fastq-dl](https://github.com/rpetit3/fastq-dl), a very handy bioinformatics tool by Robert A. Petit III

docs/workflows/genomic_characterization/freyja.md

@@ -56,6 +56,8 @@ This workflow will copy the Freyja reference files (`usher_barcodes.feather` and
 
 We recommend running this workflow with **"Run inputs defined by file paths"** selected since no information from a Terra data table is actually being used. We also recommend turning off call caching so new information is retrieved every time.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | freyja_update | **gcp_uri** | String | The path where you want the Freyja reference files to be stored. Include gs:// at the beginning of the string. Full example with a Terra workspace bucket: "gs://fc-87ddd67a-c674-45a8-9651-f91e3d2f6bb7" | | Required |
@@ -68,6 +70,8 @@ We recommend running this workflow with **"Run inputs defined by file paths"** s
 | transfer_files | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/utility:1.1" | Optional |
 | transfer_files | **memory** | Int | Amount of memory/RAM (in GB) to allocate to the task | 4 | Optional |
 
+</div>
+
 ### Outputs
 
 This workflow does not produce any outputs that appear in a Terra data table. The reference files will appear at the location specified with the `gcp_uri` input variable.
@@ -90,6 +94,8 @@ The Freyja_FASTQ_PHB workflow is compatible with the multiple input data types:
 
 This workflow runs on the sample level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | freyja_fastq | **primer_bed** | File | The bed file containing the primers used when sequencing was performed |  | Required |
@@ -190,6 +196,8 @@ This workflow runs on the sample level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Freyja_FASTQ Analysis Tasks
 
 ??? task "`read_QC_trim_pe` Details"
@@ -308,6 +316,8 @@ The main output file used in subsequent Freyja workflows is found under the `fre
 !!! tip "Click "Ignore empty outputs""
     When running the Freyja_FASTQ_PHB workflow, it is recommended to select the "Ignore empty outputs" option in the Terra UI. This will hide the output columns that will not be generated for your input data type.
 
+<div class="searchable-table" markdown="1">
+
 | **Variable** | **Type** | **Description** | **Input Data Type** |
 |---|---|---|---|
 | aligned_bai | File | Index companion file to the bam file generated during the consensus assembly process | ONT, PE, SE |
@@ -394,6 +404,8 @@ The main output file used in subsequent Freyja workflows is found under the `fre
 | trimmomatic_docker | String | Docker container for Trimmomatic | PE, SE |
 | trimmomatic_version | String | The version of Trimmomatic used | PE, SE |
 
+</div>
+
 ## Freyja_Plot_PHB {#freyja_plot}
 
 This workflow visualizes aggregated freyja_demixed output files produced by Freyja_FASTQ in a single plot (pdf format) which provides fractional abundance estimates for all aggregated samples.
@@ -404,6 +416,8 @@ Options exist to provide lineage-specific breakdowns and/or sample collection ti
 
 This workflow runs on the set level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | freyja_plot | **freyja_demixed** | Array[File] | An array containing the output files (freyja_demixed) made by Freyja_FASTQ |  | Required |
@@ -422,6 +436,8 @@ This workflow runs on the set level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Analysis Tasks
 
 ??? task "`freyja_plot_task` Details"
@@ -459,6 +475,8 @@ This dashboard is not "live" — that is, you must rerun the workflow every time
 
 This workflow runs on the set level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | freyja_dashboard | **collection_date** | Array[String] | An array containing the collection dates for the sample (YYYY-MM-DD format) |  | Required |
@@ -478,6 +496,8 @@ This workflow runs on the set level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Freyja_Dashboard Tasks
 
 ??? task "`freyja_dashboard_task` Details"

docs/workflows/genomic_characterization/pangolin_update.md

@@ -14,6 +14,8 @@ The Pangolin_Update workflow re-runs Pangolin updating prior lineage calls from
 
 This workflow runs on the sample level.
 
+<div class="searchable-table" markdown="1">
+
 | **Terra Task Name** | **Variable** | **Type** | **Description** | **Default Value** | **Terra Status** |
 |---|---|---|---|---|---|
 | pangolin_update | **assembly_fasta** | File | SARS-CoV-2 assembly file in FASTA format |  | Required |
@@ -42,8 +44,12 @@ This workflow runs on the sample level.
 | version_capture | **docker** | String | The Docker container to use for the task | "us-docker.pkg.dev/general-theiagen/theiagen/alpine-plus-bash:3.20.0" | Optional |
 | version_capture | **timezone** | String | Set the time zone to get an accurate date of analysis (uses UTC by default) |  | Optional |
 
+</div>
+
 ### Outputs
 
+<div class="searchable-table" markdown="1">
+
 | **Variable** | **Type** | **Description** |
 |---|---|---|
 | **pango_lineage** | String | Pango lineage as determined by Pangolin |
@@ -58,3 +64,5 @@ This workflow runs on the sample level.
 | **pangolin_update_version** | String | Version of the Public Health Bioinformatics (PHB) repository used |
 | **pangolin_updates** | String | Result of Pangolin Update (lineage changed versus unchanged) with lineage assignment and date of analysis |
 | **pangolin_versions** | String | All Pangolin software and database versions |
+
+</div>