25f258c7fdfbdf417a917fcd00fff78d698def9b chmalee Fri Aug 30 12:01:24 2024 -0700 Big run through of changes to accomodate jquery 3.7.1 upgrade. Most of the changes are replacing the event methods with a change to .on(event, function(..)). A couple more changes are removing calls to jquery.type(). Also fixes various plugins and styles diff --git src/hg/js/hgGateway.js src/hg/js/hgGateway.js index b39f386..5e358d7 100644 --- src/hg/js/hgGateway.js +++ src/hg/js/hgGateway.js @@ -715,31 +715,31 @@ // This keeps track of which gene the user has selected most recently from autocomplete. var selectedGene = null; function setupFavIcons() { // Set up onclick handlers for shortcut buttons and labels var haveIcon = false; var i, name, taxId, onClick; for (i = 0; i < favIconTaxId.length; i++) { name = favIconTaxId[i][0]; taxId = favIconTaxId[i][1]; if (activeTaxIds[taxId]) { // When user clicks on icon, set the taxId (default database); // scroll the image to that species and clear the species autocomplete input. onClick = setTaxId.bind(null, taxId, null, null, true, true); // Onclick for both the icon and its sibling label: - $('.jwIconSprite' + name).parent().children().click(onClick); + $('.jwIconSprite' + name).parent().children().on("click", onClick); haveIcon = true; } else { // Inactive on this site -- hide it $('.jwIconSprite' + name).parent().hide(); } } if (! haveIcon) { $('#popSpeciesTitle').text('Species Search'); } } function addCategory(cat, item) { // Clone item, add category: cat to it and return it (helper function, see below). var clone = {}; _.assign(clone, item, { category: cat }); @@ -799,31 +799,31 @@ if (searchObj[sciName]) { label = sciName + ' (' + commonName + ')'; addMyLabel = addCategory.bind(null, label); searchObj[commonName] = _.map(searchObj[sciName], addMyLabel); } }); } function makeStripe(id, color, stripeHeight, scrollTop, onClickStripe) { // Return an empty div with specified background color and height var $stripe = $('<div class="jwRainbowStripe">'); $stripe.attr('id', 'rainbowStripe' + id); $stripe.attr('title', 'Click to scroll the tree display'); $stripe.css('background-color', color); $stripe.height(stripeHeight); - $stripe.click(onClickStripe.bind(null, scrollTop)); + $stripe.on("click", onClickStripe.bind(null, scrollTop)); return $stripe; } function makeRainbowSliderStripes($slider, onClickStripe, svgHeight, stripeColors, stripeTops) { // Set up the rainbow slider bar for the speciesPicker. // The stripeColors array determines the number of stripes and their colors. // stripeTops contains the pixel y coordinates of the top of each stripe; // we convert these to pixel heights of HTML div stripes. // onClickStripe is bound to the normalized top coord of each stripe // (the ratio of stripe's top coord to slider bar height, in the range // 0.0 to (1.0 - 1/stripeColors.length)). var i, $stripe, scrollTop, stripeHeight, svgStripeHeight; var sliderHeight = $('#speciesPicker').outerHeight(); $slider.empty(); if (stripeTops[0] > 0) { @@ -920,31 +920,31 @@ normalizedTop = imageTop / svgHeight; moveSlider(normalizedTop); }; // This might be called before the species image has been created; if so, do nothing. if (! $speciesTree || speciesTree.length === 0) { return; } makeRainbowSliderStripes($sliderBar, onClickStripe, svgHeight, stripeColors, stripeTops); resizeSliderIcon($sliderIcon, svgHeight, sliderBarHeight); $sliderIcon.draggable({ axis: 'y', containment: '#speciesGraphic', drag: onDragSlider }); - $speciesPicker.scroll(onScrollImage); + $speciesPicker.on("scroll", onScrollImage); } function findScrollbarWidth() { var widthPlain = $("#sbTestContainerDPlain").width(); var widthInsideScroll = $("#sbTestContainerDInsideScroll").width(); $('#sbTestContainer').hide(); return widthPlain - widthInsideScroll; } function updateGoButtonPosition() { // If there's enough room for the Go button to be to the right of the inputs, // set its height to the midpoint of theirs. var $goButton = $('.jwGoButtonContainer'); var goOffset = $goButton.offset(); var menuOffset = $('#selectAssembly').offset(); @@ -1269,31 +1269,31 @@ } setAssemblyOptions(uiState); if (uiState.position) { $('#positionDisplay').text(addCommasToPosition(uiState.position)); } autocompleteCat.init($('#positionInput'), { baseUrl: suggestUrl, watermark: positionWatermark, onServerReply: processHgSuggestResults, onSelect: onSelect, enterSelectsIdentical: true, onEnterTerm: goToHgTracks }); selectedGene = null; setAssemblyDescriptionTitle(uiState.db, uiState.genome); updateDescription(uiState.description); - $('#positionInput').focus(function() {$(this).autocompleteCat("search", "");}); + $('#positionInput').on("focus", function() {$(this).autocompleteCat("search", "");}); if (uiState.db && $('#findPositionContents').css('display') === 'none') { initFindPositionContents(); } } function removeDups(inList, isDup) { // Return a list with only unique items from inList, using isDup(a, b) -> true if a =~ b var inLength = inList.length; // inListDups is an array of boolean flags for marking duplicates, parallel to inList. var inListDups = []; var outList = []; var i, j; for (i = 0; i < inLength; i++) { // If something has already been marked as a duplicate, skip it. if (! inListDups[i]) { @@ -1521,85 +1521,85 @@ setAssemblyDescriptionTitle(db, uiState.genome); cmd = { setDb: { db: db, position: "lastDbPos" } }; if (uiState.hubUrl) { cmd.setDb.hubUrl = uiState.hubUrl; } cart.send(cmd, handleSetDb); cart.flush(); uiState.db = db; clearPositionInput(); } } function onClickCopyPosition() { // Copy the displayed position into the position input: var posDisplay = $('#positionDisplay').text(); - $('#positionInput').val(posDisplay).focus(); + $('#positionInput').val(posDisplay).trigger("focus"); } function goToHgTracks() { // Create and submit a form for hgTracks with hidden inputs for org, db and position. var goDirectlyToHgTracks = false; var position = $('#positionInput').val(); var searchTerm = encodeURIComponent(position.replace(/^[\s]*/,'').replace(/[\s]*$/,'')); var posDisplay = $('#positionDisplay').text(); var pix = uiState.pix || calculateHgTracksWidth(); var oldCgi = cart.cgi(); cart.setCgi('hgSearch'); if (! position || position === '' || position === positionWatermark || position === selectedGene) { position = posDisplay; goDirectlyToHgTracks = true; } else { position = position.replace(/\u2013|\u2014/g, "-"); // replace en-dash and em-dash with hyphen } var $form; $form = $('<form action="hgTracks" method=GET id="mainForm">' + '<input type=hidden name="hgsid" value="' + window.hgsid + '">' + '<input type=hidden name="org" value="' + uiState.genome + '">' + '<input type=hidden name="db" value="' + uiState.db + '">' + '<input type=hidden name="position" value="' + position + '">' + '<input type=hidden name="pix" value="' + pix + '">' + '</form>'); // helper functions for checking whether a plain chrom name was searched for function onSuccess(jqXHR, textStatus) { if (jqXHR.chromName !== null) { $('body').append($form); - $form.submit(); + $form.trigger("submit"); } else { window.location.assign("../cgi-bin/hgSearch?search=" + searchTerm + "&hgsid="+ window.hgsid ); } } function onFail(jqXHR, textStatus) { window.location.assign("../cgi-bin/hgSearch?search=" + searchTerm + "&hgsid="+ window.hgsid ); } var canonMatch = position.match(canonicalRangeExp); var gbrowserMatch = position.match(gbrowserRangeExp); var lengthMatch = position.match(lengthRangeExp); var bedMatch = position.match(bedRangeExp); var sqlMatch = position.match(sqlRangeExp); var singleMatch = position.match(singleBaseExp); var positionMatch = canonMatch || gbrowserMatch || lengthMatch || bedMatch || sqlMatch || singleMatch; if (positionMatch !== null || goDirectlyToHgTracks) { // We already have a position from either selecting a suggestion or the user just typed a regular // old position, so go to hgTracks at that location // Show a spinner -- sometimes it takes a while for hgTracks to start displaying. $('.jwGoIcon').removeClass('fa-play').addClass('fa-spinner fa-spin'); // Make a form and submit it. In order for this to work in IE, the form // must be appended to the body. $('body').append($form); - $form.submit(); + $form.trigger("submit"); } else { // User has entered a search term with no suggestion, go to the disambiguation // page so the user can choose a position // redirect to hgBlat if the input looks like a DNA sequence // minimum length=19 so we do not accidentally redirect to hgBlat for a gene identifier // like ATG5 var dnaRe = new RegExp("^(>[^\n\r ]+[\n\r ]+)?(\\s*[actgnACTGN \n\r]{19,}\\s*)$"); if (dnaRe.test(searchTerm)) { var blatUrl = "hgBlat?type=BLAT%27s+guess&userSeq="+searchTerm; window.location.href = blatUrl; return false; } // also check if just a plain chromosome name was entered: $('.jwGoIcon').removeClass('fa-play').addClass('fa-spinner fa-spin'); @@ -1656,35 +1656,35 @@ prunedDbDbTree = null; } } // When page has loaded, do layout adjustments and initialize event handlers. $(function() { scrollbarWidth = findScrollbarWidth(); setRightColumnWidth(); setupFavIcons(); autocompleteCat.init($('#speciesSearch'), { baseUrl: 'hgGateway?hggw_term=', watermark: speciesWatermark, onSelect: setDbFromAutocomplete, onServerReply: processSpeciesResults, enterSelectsIdentical: false }); - $('#selectAssembly').change(onChangeDbMenu); - $('#positionDisplay').click(onClickCopyPosition); - $('#copyPosition').click(onClickCopyPosition); - $('.jwGoButtonContainer').click(goToHgTracks); - $(window).resize(setRightColumnWidth.bind(null, scrollbarWidth)); + $('#selectAssembly').on("change", onChangeDbMenu); + $('#positionDisplay').on("click", onClickCopyPosition); + $('#copyPosition').on("click", onClickCopyPosition); + $('.jwGoButtonContainer').on("click", goToHgTracks); + $(window).on("resize", setRightColumnWidth.bind(null, scrollbarWidth)); displaySurvey(); replaceHgsidInLinks(); // Fill in searchObj here once everything is displayed. autocompleteFromTree(prunedDbDbTree, searchObj); }); } return { init: init, // For use by speciesTree.draw SVG (text-only onclick): onClickSpeciesLabel: onClickSpeciesLabel, onClickHubName: onClickHubName }; }()); // hgGateway