fcb6dc8dfa166136193177c895ca181200850e4d max Mon Jan 19 06:02:31 2026 -0800 changing superTrack TrackUi quite a bit. Removing dropdowns and replacing them with buttons. Also adding buttons for setting all tracks or all visible tracks to a visibility. While at it, making a change to the js-query-library function (inversed the order of arguments) which was requested months ago by Brian, but I forgot to make the change after code review. Also shortening the "source data version" label to just "version". refs #36917. I changed the library function hTvDropDownClassVisOnlyAndExtra() rather than copying the code. This was because I was hesitant to copy/paste all this code into a second function, which would have been the only alternative, as the function cannot be reused as-is. So I modified the function to return the list of visibilities. It's never clear whether it's better to modify functions or copy/paste code. here, not breaking the function into smaller parts, so copy/pasting it, would risk requiring more future copy/pasted code. But the risk is to break existing tracks. diff --git src/hg/hgTrackUi/hgTrackUi.c src/hg/hgTrackUi/hgTrackUi.c index 620d8a43375..a3c4af87669 100644 --- src/hg/hgTrackUi/hgTrackUi.c +++ src/hg/hgTrackUi/hgTrackUi.c @@ -2727,91 +2727,145 @@ static boolean isInTrackList(struct trackDb *tdbList, struct trackDb *target) /* Return TRUE if target is in tdbList. */ { struct trackDb *tdb; for (tdb = tdbList; tdb != NULL; tdb = tdb->next) if (tdb == target) return TRUE; return FALSE; } #endif /* UNUSED */ void superTrackUi(struct trackDb *superTdb, struct trackDb *tdbList) /* List tracks in this collection, with visibility controls and UI links */ { jsIncludeFile("hui.js",NULL); -printf("\n<P><TABLE CELLPADDING=2>"); +printf("<p style='margin-top:3px; margin-bottom:3px'>") +printf("Tracks that are part of this container are listed below. Use the buttons below to set their visibilities.</p>"); +printf("\n<TABLE id='superTrackTable' CELLPADDING=2>"); tdbRefSortPrioritiesFromCart(cart, &superTdb->children); struct slRef *childRef; char javascript[1024]; for (childRef = superTdb->children; childRef != NULL; childRef = childRef->next) { struct trackDb *tdb = childRef->val; if (childRef == superTdb->children) // first time through { - printf("\n<TR><TD NOWRAP colspan=2>"); - printf("<IMG height=18 width=18 id='btn_plus_all' src='../images/add_sm.gif'>"); - jsOnEventById("click", "btn_plus_all", "superT.plusMinus(true);"); - printf("<IMG height=18 width=18 id='btn_minus_all' src='../images/remove_sm.gif'>"); - jsOnEventById("click", "btn_minus_all", "superT.plusMinus(false);"); - printf(" <B>All</B><BR>"); + printf("<TR style='border-bottom: none'><TD style='margin-bottom:10px' NOWRAP colspan=2>\n"); + + printf("<b>Apply visibility: </b>\n"); + printf("<select id='superSubViz' class='normalText'>\n"); + printf("<option value='hide'>Hide</option>"); + printf("<option value='dense'>Dense</option>"); + printf("<option value='squish'>Squish</option>"); + printf("<option value='pack' selected='selected'>Pack</option>"); + printf("<option value='full'>Full</option>\n"); + printf("</select>\n"); + + printInfoIcon("The 'Apply to all' button sets all tracks below to the visibility selected on this dropdown. The 'Apply to all visible' button sets this visibility on all tracks below that are not hidden."); + + printf("<button type='button' style='margin-left: 10px' id='superVizApplyAllButton'>Apply to all</button> \n"); + // set all selectors to the current value of the top select + jsOnEventById("click", "superVizApplyAllButton", "let newVal = $('#superSubViz').val(); $('#superTrackTable select').val(newVal).trigger('change').removeClass('hiddenText').addClass('normalText');"); + + // set all selectors that are not on 'hide' to the current value of the top select + printf("<button type='button' id='superVizApplyButton'>Apply to all visible tracks</button>\n"); + jsOnEventById("click", "superVizApplyButton", "let newVal = $('#superSubViz').val(); $('#superTrackTable select').filter(function() { return $(this).val() !== 'hide'; }).val(newVal).trigger('change').removeClass('hiddenText').addClass('normalText'); "); printf("</TD></TR>\n"); } printf("<TR><TD NOWRAP>"); if (!tdbIsDownloadsOnly(tdb)) { char id[256]; enum trackVisibility tv = hTvFromString(cartUsualString(cart, tdb->track,hStringFromTv(tdb->visibility))); - // Don't use cheapCgi code... no name and no boolshad... just js safef(id, sizeof id, "%s_check", tdb->track); - printf("<INPUT TYPE=CHECKBOX id='%s'%s>", + printf("<INPUT style='display:none' class='subtrackCheckbox' TYPE=CHECKBOX id='%s'%s>", id, (tv != tvHide?" CHECKED":"")); - jsOnEventById("change", id, "superT.childChecked(this);"); - safef(javascript, sizeof(javascript), "superT.selChanged(this)"); struct slPair *event = slPairNew("change", cloneString(javascript)); + + char *onlyVis = trackDbSetting(tdb, "onlyVisibility"); hTvDropDownClassVisOnlyAndExtra(tdb->track, tv, tdb->canPack, (tv == tvHide ? "hiddenText":"normalText"), - trackDbSetting(tdb, "onlyVisibility"), + onlyVis, event); + // print a group of buttons that act like radiobuttons (see javascript lines below) + printf("<div data-trackname='%s' class='seg-btn-group' style='margin-right:12px'>", tdb->track); + char *trackVizStr = hStringFromTv(tv); + + // vizList is e.g. {"Hide", "Dense", "Squish", "Pack", "Full"}, but can be shorter, e.g. when canPack=false + char **vizList = hTvGetVizArr(tv, tdb->canPack, onlyVis); + int vizListLen = arrNullLen(vizList); + for (int i = 0; i < vizListLen; i++) { + char *buttonViz = vizList[i]; + // the currently active viz mode is an 'active' button = pressed + if (strcasecmp(buttonViz, trackVizStr) == 0) + printf("<button class='seg-active'>"); + else + printf("<button>"); + printf("%s</button>",buttonViz); + } + puts("</div"); + printf("</TD>\n<TD>"); hPrintPennantIcon(tdb); safef(id, sizeof id, "%s_link", tdb->track); + // the <select> tag is only needed to send arguments to the hgTracks CGI. It will be hidden, see below. printf("<A HREF='%s?%s=%s&c=%s&g=%s' id='%s'>%s</A> ", tdbIsDownloadsOnly(tdb) ? hgFileUiName(): hTrackUiForTrack(tdb->track), cartSessionVarName(), cartSessionId(cart), chromosome, cgiEncode(tdb->track), id, tdb->shortLabel); jsOnEventById("click", id, "superT.submitAndLink(this);"); } else { printf("<A HREF='%s?%s=%s&g=%s'>Downloads</A>", hgFileUiName(),cartSessionVarName(), cartSessionId(cart), cgiEncode(tdb->track)); printf("</TD>\n<TD>"); printf("%s ",tdb->shortLabel); } printf("</TD>\n"); printf("<TD>%s", tdb->longLabel); printf(" "); printDataVersion(database, tdb); //printf(" <EM style='color:#666666; font-size:smaller;'>%s</EM>", dataVersion); printf("</TD></TR>"); } printf("</TABLE>"); + +// Now configure the elements above with Javascript: + +// * Clicking a button sets the dropdown to the button's text +jsOnEventBySelector("click", ".seg-btn-group > button", "let dropdown = $('#' + $(this).parent().data('trackname')); let buttonText=$(this).text().toLowerCase(); dropdown.val(buttonText).removeClass('hiddenText').addClass('normalText');"); +// * Clicking buttons does not submit the form (default action of <button> is to submit, unless type=button) +jsInline("$('.seg-btn-group button').attr('type', 'button');"); +// * Clicking buttons makes them pressed +jsInline("$('.seg-btn-group').on('click', 'button', function() {" + "$(this).addClass('seg-active').siblings().removeClass('seg-active');" + "});"); +// * Changing the dropdown updates the buttons +jsInline("$('.vizSelect').on('change', function() {" + "$(this).next().children().removeClass('seg-active');" + "let labelToFind = capitalizeFirstLetter($(this).val());" + "$(this).next().find('button').filter(function() { return $(this).text().trim() === labelToFind; }).addClass('seg-active');" + "});"); +// * Hide all subtrack dropdowns from the user. They are used so the CGI arguments +// are sent to hgTracks, but are not necessary as UI elements anymore +jsInline("$('#superTrackTable .vizSelect').hide();"); } #ifdef USE_HAL static void cfgHalSnake(struct trackDb *tdb, char *name) { boolean parentLevel = isNameAtParentLevel(tdb, name); if (parentLevel) return; char *fileName = trackDbSetting(tdb, "bigDataUrl"); if (fileName == NULL) return; char *errString; int handle = halOpenLOD(fileName, &errString); if (handle < 0) errAbort("can't open HAL file: %s", fileName); @@ -3534,32 +3588,35 @@ else if (sameString(tdb->type, "halSnake")) tdb->canPack = TRUE; else if (!startsWith("bigWig", tdb->type) && startsWith("big", tdb->type)) tdb->canPack = TRUE; else if (sameString(tdb->type, "bigNarrowPeak")) tdb->canPack = TRUE; else if (sameString(tdb->type, "hic")) tdb->canPack = TRUE; // Don't bother with vis controls for downloadsOnly if (!tdbIsDownloadsOnly(tdb)) { /* Display visibility menu */ if (tdbIsComposite(tdb) && multViewCount(tdb) > 0) printf("<B>Maximum display mode: </B>"); + else if (tdbIsSuper(tdb)) + printf("<B>Show or hide this container and all tracks: </B>"); else printf("<B>Display mode: </B>"); + if (tdbIsSuper(tdb)) { superTrackDropDown(cart, tdb, 1); } else { /* normal visibility control dropdown */ enum trackVisibility vis = tdb->visibility; boolean canPack = rTdbTreeCanPack(tdb); if (ajax) { // ajax popups should show currently inherited visability vis = tdbVisLimitedByAncestry(cart, tdb, TRUE); // composite children may inherit squish/pack vis so allow it. if (canPack == FALSE && tdbIsCompositeChild(tdb))