83b751ac37696b83777d2fe6939e4571e7da0bd4
max
  Mon Jun 12 06:28:58 2023 -0700
adding little trash icons next to custom tracks for quicker disposal, refs #31504

diff --git src/hg/js/hgTracks.js src/hg/js/hgTracks.js
index eb29ae1..917d2aa 100644
--- src/hg/js/hgTracks.js
+++ src/hg/js/hgTracks.js
@@ -3477,30 +3477,44 @@
 // A function for the keyboard shortcuts "highlight add/clear/new"
 function highlightCurrentPosition(mode) {
     var pos = genomePos.get();
     if (mode=="new")
         dragSelect.highlightThisRegion(pos, false);
     else if (mode=="add")
         dragSelect.highlightThisRegion(pos, true);
     else {
         hgTracks.highlight = "";
         var cartSettings = {'highlight': ""};
         cart.setVarsObj(cartSettings);
         imageV2.drawHighlights();
     }
 }
 
+function onTrackDelIconClick (ev) {
+    /* delete custom track if user clicks its trash icon */
+    // https://genome.ucsc.edu/cgi-bin/hgCustom?hgsid=1645697744_i0Yp2Di71NytSDdb6r0vUbupIvKO&hgct_do_delete=delete&hgct_del_ct_UserTrack_3545=on
+    var divEl = ev.target.closest("div"); // must use .closest(), as user can click on either the SVG or the DIV space.
+    var trackName = divEl.getAttribute("data-track");
+    var hgsid = getHgsid();
+    var url = 'hgCustom?hgsid='+hgsid+'&hgct_do_delete=delete&hgct_del_'+trackName+'=on';
+    xhttp = new XMLHttpRequest();
+    xhttp.open("GET", url);
+    xhttp.send();
+    divEl.closest("td").remove();
+}
+
+
   //////////////////////////////////
  //// popup (aka modal dialog) ////
 //////////////////////////////////
 var popUp = {
 
     trackName:            "",
     trackDescriptionOnly: false,
     saveAllVars:          null,
 
     cleanup: function ()
     {  // Clean out the popup box on close
         if ($('#hgTrackUiDialog').html().length > 0 ) {
             // clear out html after close to prevent problems caused by duplicate html elements
             $('#hgTrackUiDialog').html("");
             popUp.trackName = ""; //set to defaults
@@ -5303,41 +5317,43 @@
         downloadDialog.innerHTML = htmlStr;
         $("#checkAllDownloadTracks").click( function() {
             $(".downloadTrackName").each(function(i, elem) {
                 elem.checked = true;
             });
         });
         $("#uncheckAllDownloadTracks").click( function() {
             $(".downloadTrackName").each(function(i, elem) {
                 elem.checked = false;
             });
         });
         $(downloadDialog).dialog('open');
     }
 };
 
-
   ///////////////
  //// READY ////
 ///////////////
 $(document).ready(function()
 {
     imageV2.moveTiming();
 
     // hg.conf will turn this on 2020-10 - Hiram
     if (window.mouseOverEnabled) { mouseOver.addListener(); }
 
+    // custom tracks get little trash icons
+    $("div.trackDeleteIcon").click( onTrackDelIconClick );
+
     // on Safari the back button doesn't call the ready function.  Reload the page if
     // the back button was pressed.
     $(window).bind("pageshow", function(event) {
         if (event.originalEvent.persisted) {
                 window.location.reload() ;
         }
     });
 
     // The page may be reached via browser history (back button)
     // If so, then this code should detect if the image has been changed via js/ajax
     // and will reload the image if necessary.
     // NOTE: this is needed for IE but other browsers can detect the dirty page much earlier
     if (!imageV2.backSupport) {
         if (imageV2.isDirtyPage()) {
             // mark as non dirty to avoid infinite loop in chrome.