83dbcadd73270e8b652fb4b5537235ca5727c7fa
hiram
  Mon Dec 8 16:22:38 2025 -0800
fix the toga click code to use a simple local hideToggle class refs #35776

diff --git src/hg/hgc/togaClick.c src/hg/hgc/togaClick.c
index 123f3246292..f446ec6bb5b 100644
--- src/hg/hgc/togaClick.c
+++ src/hg/hgc/togaClick.c
@@ -323,178 +323,170 @@
     char startBuf[16], endBuf[16];
     bigBedIntervalToRow(bb, chrom, startBuf, endBuf, fields, bbi->fieldCount);
     break;
     }
 
 printf("<h3>Projection v2 %s</h3>\n", item);
 struct togaDataBB *info = togaDataBBLoad(&fields[11], bbi->fieldCount);  // Bogdan: why 11? 0-11 are bed-like fields likely
 
 printf("<B>Reference transcript: </B>%s<BR>", info->ref_link);
 printf("<B>Genomic locus in reference: </B>%s<BR>\n", info->ref_region);
 printf("<B>Genomic locus in query: </B>%s<BR>\n", info->query_region);
 
 printf("<B>Projection classification: </B>%s<BR>\n", info->status);
 printf("<B>Probability that query locus is orthologous: </B>%s<BR>\n", info->chain_score);
 // list of chain features (for orthology classification)
-printf("<a data-toggle=\"collapse\" href=\"#collapseChain\">Show features used for ortholog probability</a>\n");
-printf("<div id=\"collapseChain\" class=\"panel-collapse collapse\">\n");
-printf("<ul>\n");
+printf("<span class='hideToggle' data-target='collapseChain' style='cursor: pointer;'>Show features used for ortholog probability:</span>\n");
+printf("<div id='collapseChain' style='display: none;'>\n");
+printf("<p><ul>\n");
 printf("<li>Synteny (log10 value): %s</li>\n", info->chain_synteny);
 printf("<li>Global CDS fraction: %s</li>\n", info->chain_gl_cds_fract);
 printf("<li>Local CDS fraction: %s</li>\n", info->chain_loc_cds_fract);
 printf("<li>Local intron fraction: %s</li>\n", info->chain_intron_cov);
 printf("<li>Local CDS coverage: %s</li>\n", info->chain_exon_cov);
 printf("<li>Flank fraction: %s</li>\n", info->chain_flank);
-printf("</ul>\n");
+printf("</ul></p>\n");
 
-printf("<br>\n<b>Feature description:</b>\n");
+printf("<p>\n<b>Feature description:</b>\n");
 printf("For each projection (one reference transcript and one overlapping chain),\n");
 printf("TOGA computes the following features by intersecting the reference coordinates of aligning\n");
 printf("blocks in the chain with different gene parts (coding exons, UTR (untranslated region) exons, introns)\n");
-printf("and the respective intergenic regions.\n<br>\n");
+printf("and the respective intergenic regions.\n</p>\n");
 
-printf("We define the following variables:\n<ul>\n");
+printf("<p>We define the following variables:\n<ul>\n");
 printf("<li>c: number of reference bases in the intersection between chain blocks and coding exons of the gene under consideration.</li>\n");
 printf("<li>C: number of reference bases in the intersection between chain blocks and coding exons of all genes. </li>\n");
 printf("<li>a: number of reference bases in the intersection between chain blocks and coding exons and introns of the gene under consideration. </li>\n");
 printf("<li>A: number of reference bases in the intersection between chain blocks and coding exons and introns of all genes and the intersection\n");
 printf("between chain blocks and intergenic regions (excludes UTRs). </li>\n");
 printf("<li>f: number of reference bases in chain blocks overlapping the 10 kb flanks of the gene under consideration.\n");
 printf("Alignment blocks overlapping exons of another gene that is located in these 10 kb flanks are ignored. </li>\n");
 printf("<li>i: number of reference bases in the intersection between chain blocks and introns of the gene under consideration. </li>\n");
 printf("<li>CDS (coding sequence): length of the coding region of the gene under consideration. </li>\n");
 printf("<li>I: sum of all intron lengths of the gene under consideration. </li>\n");
-printf("</ul>\n");
-printf("Using these variables, TOGA computes the following features:\n");
+printf("</ul></p>\n");
+printf("<p>Using these variables, TOGA computes the following features:\n");
 printf("<ul>\n");
 printf("<li>&quot;global CDS fraction&quot; as C / A. Chains with a high value have alignments that largely overlap coding exons,");
 printf("which is a hallmark of paralogous or processed pseudogene chains. In contrast, chains with a low value also align many ");
 printf("intronic and intergenic regions, which is a hallmark of orthologous chains. </li>\n");
 printf("<li>&quot;local CDS fraction&quot; as c / a. Orthologous chains tend to have a lower value, as intronic ");
 printf("regions partially align. This feature is not computed for single-exon genes. </li>\n");
 printf("<li>&quot;local intron fraction&quot; as i / I. Orthologous chains tend to have a higher value.");
 printf("This feature is not computed for single-exon genes. </li>\n");
 printf("<li>&quot;flank fraction&quot; as f / 20,000. Orthologous chains tend to have higher values,");
 printf("as flanking intergenic regions partially align. This feature is important to detect orthologous loci of single-exon genes. </li>\n");
 printf("<li>&quot;synteny&quot; as log10 of the number of genes, whose coding exons overlap by at least one base aligning");
 printf("blocks of this chain. Orthologous chains tend to cover several genes located in a conserved order, resulting in higher synteny values. </li>\n");
 printf("<li>&quot;local CDS coverage&quot; as c / CDS, which is only used for single-exon genes. </li>\n");
-printf("</ul>\n");
+printf("</ul></p>\n");
 
 
-printf("</ul>\n</div>\n");
+printf("</div>\n");
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 
 // show inact mut plot
 printf("<h4>Visualization of inactivating mutations on exon-intron structure</h4>\n");
 printf("%s\n", info->svg_line);
 printf("<BR>Exons shown in grey are missing (often overlap assembly gaps).\nExons shown in");
 printf(" red or blue are deleted or do not align at all.\nRed indicates that the exon deletion ");
 printf("shifts the reading frame, while blue indicates that exon deletion(s) are framepreserving.<br>\n");
 
 // GLP features
-printf("<a data-toggle=\"collapse\" href=\"#collapseGLP\">Show features used for transcript classification</a>\n");
-printf("<div id=\"collapseGLP\" class=\"panel-collapse collapse\">\n");
-printf("<ul>\n");
+printf("<span class='hideToggle data-target='collapseGLP' style='cursor: pointer;'>Show features used for transcript classification</span>\n");
+printf("<div id='collapseGLP' style='display: none;'>\n");
+printf("<p><ul>\n");
 printf("<li>Percent intact, ignoring missing sequence: %s</li>\n", info->perc_intact_ign_M);
 printf("<li>Percent intact, treating missing as intact sequence: %s</li>\n", info->perc_intact_int_M);
 printf("<li>Proportion of intact codons: %s</li>\n", info->intact_codon_prop);
 printf("<li>Percent of CDS not covered by this chain (0 unless the chain covers only a part of the gene): %s</li>\n", info->ouf_prop);
 if (sameWord(info->mid_intact, ONE_))
 {
     printf("<li>Middle 80 percent of CDS intact: %s</li>\n", YES_);
 } else {
     printf("<li>Middle 80 percent of CDS intact: %s</li>\n", NO_);
 }
 if (sameWord(info->mid_pres, ONE_))
 {
     printf("<li>Middle 80 percent of CDS present: %s</li>\n", YES_);
 } else {
     printf("<li>Middle 80 percent of CDS present: %s</li>\n", NO_);
 }
 if (info->numExonsMutated != NULL && info->percentExonsMutated != NULL) {
     printf("<li>Number of exons with inactivating mutations: %s (%s%% of the present exons; threshold is 20%%)</li>\n", info->numExonsMutated, info->percentExonsMutated);
 }
-printf("</ul>\n</div>\n");
+printf("</ul></p>\n</div>\n");
 
 
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 printf("<h4>Predicted protein sequence</h4>\n");
 
-printf("<a data-toggle=\"collapse\" href=\"#collapseProt\">Show protein sequence of query</a>\n");
-printf("<div id=\"collapseProt\" class=\"panel-collapse collapse\">\n");
-// printf("<TT>{protein seq of the query without dashes or other things. Should end with *}\n");
-printf("<TT>");
+printf("<span class='hideToggle' data-target='collapseProt' style='cursor: pointer;'>Show protein sequence of query</span>\n");
+printf("<div id='collapseProt' style='display: none;'>\n");
+printf("<p><TT>");
 HLprintQueryProtSeqForAli(info->prot_alignment);
-printf("\n</TT>\n</div><BR>\n");
+printf("\n</TT></p>\n</div><BR>\n");
 
 if (info->protseqFrameCorrected != NULL) {
-  printf("<a data-toggle=\"collapse\" href=\"#collapseProtFrameCorrected\">Show frame-corrected protein sequence of query (potential frameshifts are masked)</a>\n");
-  printf("<div id=\"collapseProtFrameCorrected\" class=\"panel-collapse collapse\">\n");
-  printf("<TT>");
+  printf("<span class='hideToggle' data-target='collapseProtFrameCorrected' style='cursor: pointer;'>Show frame-corrected protein sequence of query (potential frameshifts are masked)</span>\n");
+  printf("<div id='collapseProtFrameCorrected' style='display: none;'>\n");
+  printf("<p><TT>");
   print_with_newlines(info->protseqFrameCorrected);
-  printf("\n</TT>\n</div>\n");
+  printf("\n</TT></p>\n</div>\n");
 }
 
 if (info->CDSseq != NULL) {
   printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
   printf("<h4>Predicted coding (DNA) sequence</h4>\n");
-  printf("<a data-toggle=\"collapse\" href=\"#collapseCDS\">Show coding sequence of query</a>\n");
-  printf("<div id=\"collapseCDS\" class=\"panel-collapse collapse\">\n");
-  printf("<TT>");
+  printf("<span class='hideToggle' data-target='collapseCDS' style='cursor: pointer;'>Show coding sequence of query</span>\n");
+  printf("<div id='collapseCDS' style='display: none;'>\n");
+  printf("<p><TT>");
   print_with_newlines(info->CDSseq);
-  printf("\n</TT>\n</div>\n");
+  printf("\n</TT></p>\n</div>\n");
 }
 
 // and show protein sequence
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 printf("<h4>Protein sequence alignment</h4>\n");
-printf("<a data-toggle=\"collapse\" href=\"#collapseProtAli\">Show alignment between reference and query</a>\n");
-printf("<div id=\"collapseProtAli\" class=\"panel-collapse collapse\">\n");
-printf("<TT>%s</TT>\n", info->prot_alignment);
-printf("</div>\n");
+printf("<span class='hideToggle' data-target='collapseProtAli' style='cursor: pointer;'>Show alignment between reference and query</span>\n");
+printf("<div id='collapseProtAli' style='display: none;'>\n");
+printf("<p><TT>%s</TT>\n", info->prot_alignment);
+printf("</p></div>\n");
 
 // show inactivating mutations if required
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 printf("<h4>List of inactivating mutations</h4>\n");
-printf("<a data-toggle=\"collapse\" href=\"#collapseMuts\">Show inactivating mutations</a>\n");
-printf("<div id=\"collapseMuts\" class=\"panel-collapse collapse\">\n");
-printf("<table border = \"1\" width = \"640\">\n");  // init table
+printf("<span class='hideToggle' data-target='collapseMuts' style='cursor: pointer;'>Show inactivating mutations</span>\n");
+printf("<div id='collapseMuts' style='display: none;'>\n");
+printf("<p><table border = \"1\" width = \"640\">\n");  // init table
 printf("<tr><th>Exon number</th><th>Codon number</th><th>Mutation class</th><th>Mutation</th><th>Treated as inactivating</th><th>Mutation ID</th>\n");
 printf("</tr>\n");
 printf("%s\n", info->inact_mut_html_table);
-printf("</table>\n");
+printf("</table></p>\n");
 printf("</div>\n\n");
 
 // show exons data
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 printf("<h4>Exon alignments</h4>\n");
 
-printf("<a data-toggle=\"collapse\" href=\"#collapseExons\">Show exon sequences and features</a>\n");
-printf("<div id=\"collapseExons\" class=\"panel-collapse collapse\">\n");
-// printf("%s\n", info->exon_ali_string);
-printf("%s\n", info->exon_ali_html);
+printf("<span class='hideToggle' data-target'collapseExons' style='cursor: pointer;'>Show exon sequences and features</span>\n");
+printf("<div id='collapseExons' style='display: none;'>\n");
+printf("<p>%s</p>\n", info->exon_ali_html);
 
 printf("<hr style='margin-bottom:-0.5em;color:black;'>\n");
 printf("</div>\n<BR><BR>\n");
 
-// TODO: check whether I need this
-hPrintf("<link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css\">");
-hPrintf("<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js\"></script>");
-hPrintf("<script src=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js\"></script>");
-
-
 printTrackHtml(tdb);  // and do I need this?
 }
 
 
 void doHillerLabTOGAGene(char *database, struct trackDb *tdb, char *item, char *table_name)
 /* Put up TOGA Gene track info. */
 {
     //int start = cartInt(cart, "o");
     char headerTitle[512];
     char suffix[512];
     strcpy(suffix, table_name);
     extractHLTOGAsuffix(suffix);
     safef(headerTitle, sizeof(headerTitle), "%s", item);
     genericHeader(tdb, headerTitle);
     printf("<h2>TOGA gene annotation</h2>\n");
@@ -531,40 +523,40 @@
 
         sqlSafef(query, sizeof(query), "select * from %s where transcript='%s'", togaDataTableName, item);
         sr = sqlGetResult(conn, query);
 
         if ((row = sqlNextRow(sr)) != NULL) {
             info = togaDataLoad(row);  // parse sql output
             // fill HTML template:
             printf("<B>Reference transcript: </B><A HREF=\"http://www.ensembl.org/Homo_sapiens/transview?transcript=%s\" target=_blank>%s</A><BR>",
                    info->ref_trans_id, info->ref_trans_id);
             printf("<B>Genomic locus in reference: </B>%s<BR>\n", info->ref_region);
             printf("<B>Genomic locus in query: </B>%s<BR>\n", info->query_region);
 
             printf("<B>Projection classification: </B>%s<BR>\n", info->status);
             printf("<B>Probability that query locus is orthologous: </B>%s<BR>\n", info->chain_score);
             // list of chain features (for orthology classification)
-            printf("<a data-toggle=\"collapse\" href=\"#collapseChain\">Show features used for ortholog probability</a>\n");
-            printf("<div id=\"collapseChain\" class=\"panel-collapse collapse\">\n");
-            printf("<ul>\n");
+            printf("<span class='hideToggle' data-target='collapseChain' style='cursor: pointer;'>Show features used for ortholog probability</span>\n");
+            printf("<div id='collapseChain' style='display: none;'");
+            printf("<p><ul>\n");
             printf("<li>Synteny (log10 value): %s</li>\n", info->chain_synteny);
             printf("<li>Global CDS fraction: %s</li>\n", info->chain_gl_cds_fract);
             printf("<li>Local CDS fraction: %s</li>\n", info->chain_loc_cds_fract);
             printf("<li>Local intron fraction: %s</li>\n", info->chain_intron_cov);
             printf("<li>Local CDS coverage: %s</li>\n", info->chain_exon_cov);
             printf("<li>Flank fraction: %s</li>\n", info->chain_flank);
-            printf("</ul>\n");
+            printf("</ul></p>\n");
 
             printf("<br>\n<b>Feature description:</b>\n");
             printf("For each projection (one reference transcript and one overlapping chain),\n");
             printf("TOGA computes the following features by intersecting the reference coordinates of aligning\n");
             printf("blocks in the chain with different gene parts (coding exons, UTR (untranslated region) exons, introns)\n");
             printf("and the respective intergenic regions.\n<br>\n");
 
             printf("We define the following variables:\n<ul>\n");
             printf("<li>c: number of reference bases in the intersection between chain blocks and coding exons of the gene under consideration.</li>\n");
             printf("<li>C: number of reference bases in the intersection between chain blocks and coding exons of all genes. </li>\n");
             printf("<li>a: number of reference bases in the intersection between chain blocks and coding exons and introns of the gene under consideration. </li>\n");
             printf("<li>A: number of reference bases in the intersection between chain blocks and coding exons and introns of all genes and the intersection\n");
             printf("between chain blocks and intergenic regions (excludes UTRs). </li>\n");
             printf("<li>f: number of reference bases in chain blocks overlapping the 10 kb flanks of the gene under consideration.\n");
             printf("Alignment blocks overlapping exons of another gene that is located in these 10 kb flanks are ignored. </li>\n");
@@ -588,70 +580,70 @@
             printf("<li>&quot;local CDS coverage&quot; as c / CDS, which is only used for single-exon genes. </li>\n");
             printf("</ul>\n");
 
 
             printf("</ul>\n</div>\n<BR>\n");
             htmlHorizontalLine();
 
             // show inact mut plot
             printf("<h4>Visualization of inactivating mutations on exon-intron structure</h4>\n");
             printf("%s<BR>\n", info->svg_line);
             printf("<BR>Exons shown in grey are missing (often overlap assembly gaps).\nExons shown in");
             printf(" red or blue are deleted or do not align at all.\nRed indicates that the exon deletion ");
             printf("shifts the reading frame, while blue indicates that exon deletion(s) are framepreserving.<br>\n");
 
             // GLP features
-            printf("<a data-toggle=\"collapse\" href=\"#collapseGLP\">Show features used for transcript classification</a>\n");
-            printf("<div id=\"collapseGLP\" class=\"panel-collapse collapse\">\n");
-            printf("<ul>\n");
+            printf("<span class='hideToggle' data-target='collapseGLP' style='cursor: pointer;'>Show features used for transcript classification</span>\n");
+            printf("<div id='collapseGLP' style='display:none;'>\n");
+            printf("<p><ul>\n");
             printf("<li>Percent intact, ignoring missing sequence: %s</li>\n", info->perc_intact_ign_M);
             printf("<li>Percent intact, treating missing as intact sequence: %s</li>\n", info->perc_intact_int_M);
             printf("<li>Proportion of intact codons: %s</li>\n", info->intact_codon_prop);
             printf("<li>Percent of CDS not covered by this chain (0 unless the chain covers only a part of the gene): %s</li>\n", info->ouf_prop);
             if (sameWord(info->mid_intact, ONE_))
             {
                 printf("<li>Middle 80 percent of CDS intact: %s</li>\n", YES_);
             } else {
                 printf("<li>Middle 80 percent of CDS intact: %s</li>\n", NO_);
             }
             if (sameWord(info->mid_pres, ONE_))
             {
                 printf("<li>Middle 80 percent of CDS present: %s</li>\n", YES_);
             } else {
                 printf("<li>Middle 80 percent of CDS present: %s</li>\n", NO_);
             }
-            printf("</ul>\n</div>\n<BR>\n");
+            printf("</ul></p>\n</div>\n<BR>\n");
             printf("<HR ALIGN=\"CENTER\"><h4>Query protein sequence</h4><BR>");
 
-            printf("<a data-toggle=\"collapse\" href=\"#collapseProt\">Show protein sequence of query</a>\n");
-            printf("<div id=\"collapseProt\" class=\"panel-collapse collapse\">\n");
-            printf("<TT>{protein seq of the query without dashes or other things. Should end with *}\n");
-            printf("<BR>\n</TT>\n</div>\n");
+            printf("<span class='hideToggle' data-target='collapseProt' style='cursor: pointer;'>Show protein sequence of query</span>\n");
+            printf("<div id='collapseProt' style='display:none;'>\n");
+            printf("<p><TT>{protein seq of the query without dashes or other things. Should end with *}\n");
+            printf("<BR>\n</TT></p>\n</div>\n");
 
             // and show protein sequence
             htmlHorizontalLine();
             printf("<h4>Protein sequence alignment</h4><BR>\n");
-            printf("<a data-toggle=\"collapse\" href=\"#collapseProtAli\">Show alignment between reference and query</a>\n");
+            printf("<span class='hideToggle' data-target='collapseProtAli' style='cursor: pointer;'>Show alignment between reference and query</span>\n");
             printf("<div id=\"collapseProtAli\" class=\"panel-collapse collapse\">\n");
-            printf("<TT>%s</TT><BR>\n", info->prot_alignment);
+            printf("<p><TT>%s</TT></p><BR>\n", info->prot_alignment);
             printf("</div>\n<BR><BR>\n");
 
             // do not forget to free toga data struct
             togaDataFree(&info);
         } else {
             // no data found, need to report this
-            printf("Not found data for %s\n", item);
+            printf("<h3>No found data for %s</h3>\n", item);
         }
         sqlFreeResult(&sr);
     }
 
     // show inactivating mutations if required
     printf("<h4>List of inactivating mutations</h4><BR>\n");
 
     if (hTableExists(database, togaInactMutTableName))
     {
         char query[256];
         struct sqlResult *sr = NULL;
         char **row;
         sqlSafef(query, sizeof(query), "select * from %s where transcript='%s'", togaInactMutTableName, item);
         sr = sqlGetResult(conn, query);
         printf("<a data-toggle=\"collapse\" href=\"#collapseMuts\">Show inactivating mutations</a>\n");