359effbb6588468172f2aba67c930c6992a4585b hiram Tue May 10 14:59:02 2022 -0700 cleanup old debug code and add wait cursor no redmine diff --git src/hg/js/gar.js src/hg/js/gar.js index 33910c9..6a22f52 100644 --- src/hg/js/gar.js +++ src/hg/js/gar.js @@ -1,63 +1,57 @@ /////////////////////////////////////////////////////////////////////// //// 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"), 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(), columnNames: new Map(), // key is name, value is column number [0..n) checkBoxNames: new Map(), // key is name, value is the checkbox object // going to record the original button labels so they can be augmented // with count information here checkBoxLabels: new Map(), // key is name, value is the original button label measureTiming: false, // will turn on with URL argument measureTiming millis: function() { var d = new Date(); return d.getTime(); }, - 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: function(hideShow) { var thisList = document.getElementsByClassName('gca'); gar.resetListVis(thisList, hideShow); thisList = document.getElementsByClassName('gcf'); @@ -69,36 +63,30 @@ 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; gar.checkBoxLabels.set(cbId, labelText); } -// gar.columnNames.forEach(function(value, key) { -// alert(key + " : " + value); -// }); -// for (var [key, value] of gar.columnNames.entries()) { -// alert(key + " : " + value); -// } gar.measureTiming = gar.urlParams.has('measureTiming'); // 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); } } @@ -107,37 +95,30 @@ } 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> @@ -164,32 +145,32 @@ // given a category and a counts Map, and some flags 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(); + // optionally, show timing given a t0 start time + countVisibleRows: function(t0) { 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(); @@ -232,40 +213,35 @@ } var hiddenCount = 0; if ( categoryHidden.get(name) ) { hiddenCount = categoryHidden.get(name); } if (hiddenCount > 0 && visibleCount > 0) { checkBox.indeterminate = true; } else { checkBox.indeterminate = false; } var labelId = name + "Label"; var labelEl = document.getElementById(labelId); var labelText = gar.checkBoxLabels.get(name); if (labelEl) { labelEl.innerText = labelText + " (" + visibleCount.toLocaleString() + "/" + hiddenCount.toLocaleString() + ")"; -// } else { -// alert("no element for label '" + labelId + "'"); } }); var showAllList = document.getElementsByClassName('showAll'); -// var thisEt = gar.millis() - t0; - var thisEt = et; + var thisEt = gar.millis() - t0; if (visRows > 0) { -// var pageEt = gar.garEndTime.getTime() - window.garStartTime.getTime(); -// perfDisplay.innerHTML = "countRows " + gar.garEndTime.getTime() + " - " + window.garStartTime.getTime() + " = page load time " + pageEt + " millis : DOMContentLoaded: " + gar.onLoadTime.getTime(); if (gar.measureTiming) { counterDisplay.innerHTML = "showing " + visRows.toLocaleString() + " assemblies, " + notVis.toLocaleString() + " hidden : process time: " + thisEt + " millis"; } else { counterDisplay.innerHTML = "showing " + visRows.toLocaleString() + " assemblies, " + notVis.toLocaleString() + " hidden"; } for (i = 0; i < showAllList.length; i++) { if (notVis > 0) { showAllList[i].checked = false; // they are not all on showAllList[i].indeterminate = true; } else { showAllList[i].indeterminate = false; showAllList[i].checked = true; // all rows are on } } showAllLabelList = document.getElementsByClassName('showAllLabel'); @@ -276,111 +252,114 @@ } else { // visRows == 0 if (gar.measureTiming) { counterDisplay.innerHTML = totalRows.toLocaleString() + " total ssemblies : use the selection menus to select subsets : process time: " + thisEt + " millis"; } else { counterDisplay.innerHTML = totalRows.toLocaleString() + " total ssemblies : use the selection menus to select subsets"; } for (i = 0; i < showAllList.length; i++) { showAllList[i].checked = false; showAllList[i].indeterminate = false; } showAllLabelList = document.getElementsByClassName('showAllLabel'); for (i = 0; i < showAllLabelList.length; i++) { showAllLabelList[i].innerHTML = " show all (" + visRows.toLocaleString() + "/" + notVis.toLocaleString() + ")"; } } - }, + }, // countVisibleRows: function(t0) // given a column number n, and true/false in tf // set that column visibility setColumnNvis: function(n, tf) { for (var i = 0; i < gar.cladeTableList.length; i++) { for (var j = 0; j < gar.cladeTableList[i].rows.length; j++) { var c = gar.cladeTableList[i].rows[j].cells[n]; if (c) { gar.setCellVis(c, tf); } } } }, // the 'e' is the event object from the checkbox // the 'e.value' is the column name. // can find the column number from columnNames Map object resetColumnVis: function(e) { var t0 = gar.millis(); + gar.waitCursor(); var n = gar.columnNames.get(e.value); var tf = e.checked; // true - turn column on, false - turn off gar.setColumnNvis(n, tf); - var et = gar.millis() - t0; - gar.countVisibleRows(et); + gar.countVisibleRows(t0); + setTimeout(gar.defaultCursor, 2000); }, hideTable: function(tableName) { tId = document.getElementById(tableName); var buttonName = tableName + "HideShow"; bId = document.getElementById(buttonName); if ( tId.style.display === "none") { tId.style.display = "block"; bId.innerHTML = "[hide]"; } else { tId.style.display = "none"; bId.innerHTML = "[show]"; } }, // foreach table, for each row in the table, show row showAll: function(offOn) { var t0 = gar.millis(); + gar.waitCursor(); for (var 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(); if (tagN === 'thead' || tagN === 'tfoot') { continue; } if (offOn) { // true, turn *on* the row == this is 'showAll' rowId.style.display = "table-row"; } else { // false, turn *off* the row == this is ! 'showAll' rowId.style.display = "none"; } } } /* the countVisibleRows will take care of the status on all 'showAll' * checkboxes - AND the checkBox 'hideShow' check boxes depending upon * the counts for that category. */ - var et = gar.millis() - t0; - gar.countVisibleRows(et); - }, + gar.countVisibleRows(t0); + setTimeout(gar.defaultCursor, 2000); + }, // showAll: function(offOn) // given one of: garList gakList gcaList gcfList, work through // all the elements to change vis // list can be any of the class lists for rows in the tables // offOn - false turn off, true turn on resetListVis: function(list, offOn) { var t0 = gar.millis(); + gar.waitCursor(); for (var i = 0; i < list.length; i++) { var rowId = list[i]; if (offOn) { // true, turn on the row rowId.style.display = "table-row"; } else { // false, turn off the row rowId.style.display = "none"; } } - var et = gar.millis() - t0; - gar.countVisibleRows(et); + gar.countVisibleRows(t0); + setTimeout(gar.defaultCursor, 2000); }, // a check box function is working, do not allow any of // them to be available for a second click while in progress // tf is 'true' or 'false' to disable (true), or reenable (false) disableCheckBoxes: function(tf) { var showAllList = document.getElementsByClassName('showAll'); var i = 0; for (i = 0; i < showAllList.length; i++) { showAllList[i].disabled = tf; } var hideShowList = document.getElementsByClassName('hideShow'); for (i = 0; i < hideShowList.length; i++) { hideShowList[i].disabled = tf; } @@ -428,42 +407,38 @@ 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>"; -// 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) { while (e) { if (e.rowIndex) { return e.rowIndex; } e = e.parentNode; } return undefined; }, // obtain table name from @@ -573,51 +548,47 @@ }, clickHandler: function(e) { if(!e.target) e.target = e.srcElement; if(e.target.tagName === "DIV") { if(e.target.id != "modalWindow") gar.closeModal(e); } }, keyHandler: function(e) { if(e.keyCode === 27) gar.closeModal(e); }, modalInit: function() { gar.onLoadTime = new Date(); -// var pageEt = gar.garEndTime.getTime() - window.garStartTime.getTime(); - var domReady = gar.onLoadTime.getTime() - gar.garEndTime.getTime(); -// perfDisplay.innerHTML = "modalInit " + gar.garEndTime.getTime() + " - " + window.garStartTime.getTime() + " = page load time " + pageEt + " millis : DOMContentLoaded: " + gar.onLoadTime.getTime() + " - " + gar.garEndTime.getTime() + " = " + domReady + " domReady millis"; if(document.addEventListener) { // document.getElementById("modalOpen").addEventListener("click", gar.openModal, false); document.getElementById("modalClose").addEventListener("click", gar.closeModal, false); document.addEventListener("click", gar.clickHandler, false); document.addEventListener("keydown", gar.keyHandler, false); } else { // document.getElementById("modalOpen").attachEvent("onclick", gar.openModal); document.getElementById("modalClose").attachEvent("onclick", gar.closeModal); document.attachEvent("onclick", gar.clickHandler); document.attachEvent("onkeydown", gar.keyHandler); } }, // modalInit: function() // Original JavaScript code by Chirp Internet: chirpinternet.eu // Please acknowledge use of this code by including this header. checkForm: function(e) { - // alert("button.value: '" + gar.submitButton.value + "'"); if (gar.submitButton.value === "request completed") { if (e.preventDefault) { e.preventDefault(); } else { e.returnValue = false; } gar.closeModal(e); return; } var form = (e.target) ? e.target : e.srcElement; if(form.name.value === "") { alert("Please enter your Name"); form.name.focus(); if (e.preventDefault) { e.preventDefault(); @@ -665,38 +636,53 @@ e.preventDefault(); } else { e.returnValue = false; } }, // checkForm: function(e) unhideTables: function() { // foreach table, set display to turn on the table for (var i = 0; i < gar.cladeTableList.length; i++) { gar.cladeTableList[i].style.display = "table"; } document.getElementById('counterDisplay').style.display = "block"; document.getElementById('loadingStripes').style.display = "none"; }, // unhide tables + waitCursor: function() { + document.body.style.cursor = 'wait'; + setTimeout(null,0); + }, + + defaultCursor: function() { + document.body.style.cursor = 'default'; + setTimeout(null,0); + }, + }; // var gar if(document.addEventListener) { var t0 = gar.millis(); + gar.waitCursor(); // allow semi colon separators as well as ampersand var queryString = window.location.search.replaceAll(";", "&"); gar.urlParams = new URLSearchParams(queryString); document.getElementById("modalFeedback").addEventListener("submit", gar.checkForm, false); document.addEventListener("DOMContentLoaded", gar.modalInit, false); gar.discoverColumnsCheckboxes(); gar.unhideTables(); - var et = gar.millis() - t0; - gar.garEndTime = new Date(); - gar.countVisibleRows(et); - } else { + gar.countVisibleRows(t0); + setTimeout(gar.defaultCursor, 2000); + } else { // IE8 support, only has attachEvent(), not addEventListener() var t0 = gar.millis(); + gar.waitCursor(); + // allow semi colon separators as well as ampersand + var queryString = window.location.search.replaceAll(";", "&"); + gar.urlParams = new URLSearchParams(queryString); + document.getElementById("modalFeedback").addEventListener("submit", gar.checkForm, false); document.getElementById("modalFeedback").attachEvent("onsubmit", gar.checkForm); window.attachEvent("onload", gar.modalInit); gar.discoverColumnsCheckboxes(); gar.unhideTables(); - var et = gar.millis() - t0; - gar.countVisibleRows(et); + gar.countVisibleRows(t0); + setTimeout(gar.defaultCursor, 2000); }