e1682f6a0c29bb52840fb969f636e62ef255120f hiram Wed Mar 23 15:24:04 2022 -0700 better clearing of the fields in the modal request form refs #28930 diff --git src/hg/js/gar.js src/hg/js/gar.js index 0adcffa..6aafaa6 100644 --- src/hg/js/gar.js +++ src/hg/js/gar.js @@ -2,31 +2,31 @@ /////////////////////////////////////////////////////////////////////// //// gar - genArkRequest 2022-02 /// //// this 'var gar' is the 'namespace' for these functions /// //// everything can be referenced via gar.name for functions or /// //// variables /// /////////////////////////////////////////////////////////////////////// var gar = { modalWrapper: document.getElementById("modalWrapper"), modalWindow: document.getElementById("modalWindow"), modalForm: document.getElementById("modalFeedback"), queryString: '', // and a query object with keys arg name and value the paired tag urlParams: null, submitButton: document.getElementById("submitButton"), - garStatus: document.getElementById("garStatus"), +// garStatus: document.getElementById("garStatus"), asmIdText: document.getElementById("formAsmId"), commonName: document.getElementById("commonName"), betterCommonName: document.getElementById("betterCommonName"), comment: document.getElementById("comment"), sciName: document.getElementById("formSciName"), onLoadTime: new Date(), garEndTime: new Date(), // recent improvement has reduced this to a single table, no longer // split up by clades cladeTableList: document.getElementsByClassName("cladeTable"), columnCheckBoxItems: document.getElementById('columnCheckBoxItems'), // text box that says: visible rows: 123,456 counterDisplay: document.getElementById("counterDisplay"), // perfDisplay: document.getElementById("perfDisplay"), completedAsmId: new Map(), @@ -44,30 +44,38 @@ tableLegend: function(e) { alert(e.innerText); }, // Given a table cell c, set it to visible/hidden based on 'tf' // where tf is 'true' == turn on, or 'false' == turn off setCellVis: function(c,tf) { if (tf) { c.style.display = "table-cell"; } else { c.style.display = "none"; } }, + // given a 'false' or 'true' then 'hide' or 'show' all rows in the table + hideShowAllRows(hideShow) { + var thisList = document.getElementsByClassName('gca'); + gar.resetListVis(thisList, hideShow); + thisList = document.getElementsByClassName('gcf'); + gar.resetListVis(thisList, hideShow); + }, + // find out the names of the columns, and get all the checkBox // hideShow button names so they can be managed later discoverColumnsCheckboxes: function() { var colGroup = document.getElementById('colDefinitions'); var i = 0; for (i = 0; i < colGroup.children.length; i++) { gar.columnNames.set(colGroup.children[i].id, i); } var hideShowList = document.getElementsByClassName('hideShow'); for (i = 0; i < hideShowList.length; i++) { var checkBoxId = hideShowList[i].id; var cbId = checkBoxId.replace("CheckBox", ""); gar.checkBoxNames.set(cbId, hideShowList[i]); var labelId = cbId + "Label"; var labelText = document.getElementById(labelId).innerText; @@ -83,54 +91,60 @@ // If there are any URL arguments to the page see if any of them // are column names var hasAll = gar.urlParams.has('all'); if (hasAll) { var columnList = document.getElementsByClassName('columnCheckBox'); for ( i = 0; i < columnList.length; i++) { var id = columnList[i].value + "CheckBox"; var checkBox = document.getElementById(id); if (checkBox) { checkBox.checked = true; var n = gar.columnNames.get(columnList[i].value); gar.setColumnNvis(n, true); } } // and unhide all rows, class gca and gcf covers all rows - var thisList = document.getElementsByClassName('gca'); - gar.resetListVis(thisList, true); - thisList = document.getElementsByClassName('gcf'); - gar.resetListVis(thisList, true); + gar.hideShowAllRows(true); } else { + var colsOn = 0; + var iucnRequested = false; gar.urlParams.forEach(function(val, arg) { // beware, get('comName') returns zero, fails this if() statement if (gar.columnNames.has(arg)) { var checkBoxId = arg + "CheckBox"; var checkBox = document.getElementById(checkBoxId); if (checkBox) { checkBox.checked = true; var n = gar.columnNames.get(arg); gar.setColumnNvis(n, true); + ++colsOn; + if ("IUCN" === arg) { iucnRequested = true; } } /* could look at val here when present to turn on/off if (val) { alert(checkBoxId + " yes val col: '" + arg + "' val: '" + val + "' n: '" + n + "'"); } else { alert(checkBoxId + " no val col: '" + arg + "' val: '" + val + "' n: '" + n + "'"); } */ } }); +if ( (colsOn === 1) && iucnRequested ) { + gar.hideShowAllRows(false); + var thisList = document.getElementsByClassName("hasIucn"); + gar.resetListVis(thisList, true); +} } }, // discoverColumnsCheckboxes: function() /* column names: <col id='comName' span='1' class=colGComName> <col id='sciName' span='1' class=colGSciName> <col id='asmId' span='1' class=colGAsmId> <col id='asmSize' span='1' class=colGAsmSize> <col id='seqCount' span='1' class=colGAsmSeqCount> <col id='scafN50' span='1' class=colGScafN50> <col id='ctgN50' span='1' class=colGContigN50> <col id='IUCN' span='1' class=colGIUCN> <col id='taxId' span='1' class=colGTaxId> <col id='asmDate' span='1' class=colGAsmDate> <col id='bioSample' span='1' class=colGBioSample> @@ -152,56 +166,56 @@ countVisHidden: function(category, counts, gca, gcf, canBeReq, ucscDb, hasIucn) { gar.incrementCount(category, counts); if (gca) { gar.incrementCount('gca', counts); } if (gcf) { gar.incrementCount('gcf', counts); } if (hasIucn) { gar.incrementCount('iucn', counts); } if (canBeReq) { gar.incrementCount('gar', counts); } else { gar.incrementCount('gak', counts); } }, // foreach table, for each row in the table, count visible rows countVisibleRows: function(et) { // var t0 = gar.millis(); - var viewReqRow = gar.columnNames.get('viewReq'); - var asmIdRow = gar.columnNames.get('asmId'); - var iucnRow = gar.columnNames.get('IUCN'); - var cladeRow = gar.columnNames.get('clade'); + var viewReqCol = gar.columnNames.get('viewReq'); + var asmIdCol = gar.columnNames.get('asmId'); + var iucnCol = gar.columnNames.get('IUCN'); + var cladeCol = gar.columnNames.get('clade'); var visRows = 0; var totalRows = 0; // key is category name, value is count visible var categoryVisible = new Map(); // key is category name, value is count hidden var categoryHidden = new Map(); var i = 0; for (i = 0; i < gar.cladeTableList.length; i++) { for (var j = 0; j < gar.cladeTableList[i].rows.length; j++) { var rowId = gar.cladeTableList[i].rows[j]; var tagN = rowId.parentNode.tagName.toLowerCase(); // ignore thead and tfoot rows if (tagN === "thead" || tagN === "tfoot") { continue; } ++totalRows; - var thisClade = rowId.cells[cladeRow].innerHTML; - var asmId = rowId.cells[asmIdRow].innerHTML; + var thisClade = rowId.cells[cladeCol].innerHTML; + var asmId = rowId.cells[asmIdCol].innerHTML; var isGCA = asmId.includes("GCA"); var isGCF = asmId.includes("GCF"); - var viewReq = rowId.cells[viewReqRow].innerHTML; + var viewReq = rowId.cells[viewReqCol].innerHTML; var canBeRequested = viewReq.includes("button"); var ucscDb = viewReq.includes("cgi-bin/hgTracks"); - var iucnStatus = rowId.cells[iucnRow].innerHTML; + var iucnStatus = rowId.cells[iucnCol].innerHTML; var hasIucn = false; if (iucnStatus) { hasIucn = ! iucnStatus.includes(" "); } if ( rowId.style.display !== "none") { gar.countVisHidden(thisClade, categoryVisible, isGCA, isGCF, canBeRequested, ucscDb, hasIucn); ++visRows; } else { gar.countVisHidden(thisClade, categoryHidden, isGCA, isGCF, canBeRequested, ucscDb, hasIucn); } } } var notVis = totalRows - visRows; /* fixup the showAll checkbox status, fully on == checked box * partially on == indeterminate/minus sign in box, fully off == empty box @@ -395,51 +409,51 @@ gar.columnCheckBoxItems.classList.remove('visible'); gar.columnCheckBoxItems.style.display = "none"; } else { gar.columnCheckBoxItems.classList.add('visible'); gar.columnCheckBoxItems.style.display = "block"; } }, columnPullDownOnblur: function(e) { gar.columnCheckBoxItems.classList.remove('visible'); }, failedRequest: function(url) { gar.submitButton.value = "request failed"; gar.submitButton.disabled = true; - garStatus.innerHTML = "FAILED: '" + url + "'"; +// garStatus.innerHTML = "FAILED: '" + url + "'"; }, sendRequest: function(name, email, asmId, betterName, comment) { var urlComponents = encodeURIComponent(name) + "&email=" + encodeURIComponent(email) + "&asmId=" + encodeURIComponent(asmId) + "&betterName=" + encodeURIComponent(betterName) + "&comment=" + encodeURIComponent(comment); var url = "/cgi-bin/gar?name=" + urlComponents; // information about escaping characters: // https://stackoverflow.com/questions/10772066/escaping-special-character-in-a-url/10772079 // encodeURI() will not encode: ~!@#$&*()=:/,;?+' // encodeURIComponent() will not encode: ~!*()' // var encoded = encodeURIComponent(url); // encoded = encoded.replace("'","’"); // var encoded = encodeURI(cleaner); var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (4 === this.readyState && 200 === this.status) { gar.submitButton.value = "request completed"; // gar.submitButton.disabled = true; - garStatus.innerHTML = "OK: <a href='" + url + "' target=_blank>" + url + "</a>"; +// garStatus.innerHTML = "OK: <a href='" + url + "' target=_blank>" + url + "</a>"; // alert("SUCCESS: '" + url + "'"); } else { if (4 === this.readyState && 404 === this.status) { gar.failedRequest(url); } } }; xmlhttp.open("GET", url, true); xmlhttp.send(); // alert("SENT: '" + url + "'"); }, // sendRequest: function(name, email. asmId) // work up the chain to find the row this element is in whichRow: function (e) { @@ -491,53 +505,58 @@ } $('#col1ToolTip').css('top',tipTop + "px"); $('#col1ToolTip').css('left',tipLeft + "px"); $('#col1ToolTip').css('display','block'); } }, // Original JavaScript code by Chirp Internet: chirpinternet.eu // Please acknowledge use of this code by including this header. // const form = document.getElementById("modalFeedback"); openModal: function(e) { if (e.name && e.name !== "specific") { var pTable = gar.parentTable(e); var thisRow = gar.whichRow(e); + var comNameCol = gar.columnNames.get('comName'); + var sciNameCol = gar.columnNames.get('sciName'); // var thisCell = pTable.closest('td').cellIndex; - var comName = pTable.rows[thisRow].cells[0].innerText; - var sciName = pTable.rows[thisRow].cells[1].innerText; + var comName = pTable.rows[thisRow].cells[comNameCol].innerText; + var sciName = pTable.rows[thisRow].cells[sciNameCol].innerText; gar.commonName.textContent = comName; gar.betterCommonName.value = comName; gar.sciName.textContent = sciName; gar.asmIdText.textContent = e.name; + gar.comment.value = ""; // gar.modalForm.name.value = "some name"; // gar.modalForm.email.value = "some@email.com"; - garStatus.innerHTML = " "; +// garStatus.innerHTML = " "; // check if this asmId already submitted if (gar.completedAsmId.get(e.name)) { gar.submitButton.value = "request completed"; gar.submitButton.disabled = false; gar.modalWrapper.className = "overlay"; return; } gar.completedAsmId.set(e.name, true); } else { gar.betterCommonName.value = ""; + gar.betterCommonName.innerHtml = ""; gar.commonName.textContent = "enter information about desired assembly in the 'Other comments' field"; gar.sciName.textContent = "include the scientific name"; gar.asmIdText.textContent = "include the GenBank or RefSeq accession identifier"; + gar.comment.value = ""; } gar.submitButton.value = "Submit request"; gar.submitButton.disabled = false; gar.modalWrapper.className = "overlay"; var overflow = gar.modalWindow.offsetHeight - document.documentElement.clientHeight; if(overflow > 0) { gar.modalWindow.style.maxHeight = (parseInt(window.getComputedStyle(gar.modalWindow).height) - overflow) + "px"; } gar.modalWindow.style.marginTop = (-gar.modalWindow.offsetHeight)/2 + "px"; gar.modalWindow.style.marginLeft = (-gar.modalWindow.offsetWidth)/2 + "px"; if (e.preventDefault) { e.preventDefault(); } else { e.returnValue = false; }