723c7a46c87ed42f8510ed1bf35a3a8890f93609 max Fri Oct 11 03:08:30 2024 -0700 adapting the text a little of the tutorial box, and removing the close button, feedback from Ana und a few users, refs #34604 diff --git src/hg/js/utils.js src/hg/js/utils.js index e470da9..1b57db8 100644 --- src/hg/js/utils.js +++ src/hg/js/utils.js @@ -812,59 +812,67 @@ if (localStorage.getItem(lsKey)) return; var notifEl = document.getElementById(lsKey + "notifBox"); if (!notifEl) { // missing call to setup function (ie generated server side like a udcTimeout message) notifBoxSetup(cgiName, keyName); } // TODO: make a generic element for positioning this var parentEl = document.getElementById('TrackHeaderForm'); if (parentEl) { parentEl.appendChild(notifEl); notifEl.style.display = 'block'; } } -function notifBoxSetup(cgiName, keyName, msg) { +function notifBoxSetup(cgiName, keyName, msg, skipCloseButton) { /* Create a notification box if one hasn't been created, and * add msg to the list of shown notifications. * cgiName.keyName will be saved to localStorage in order to show * or hide this notification. * Must call notifBoxShow() in order to display the notification */ lsKey = cgiName + "_" + keyName; if (localStorage.getItem(lsKey)) return; let alreadyPresent = false; let notifBox = document.getElementById(lsKey+"notifBox"); if (notifBox) { alreadyPreset = true; if (msg) { notifBox.innerHTML += "<br>" + msg; } } else { notifBox = document.createElement("div"); notifBox.className = "notifBox"; notifBox.style.display = "none"; notifBox.style.width = "90%"; notifBox.style.marginLeft = "100px"; notifBox.id = lsKey+"notifBox"; if (msg) { notifBox.innerHTML = msg; } } - notifBox.innerHTML += "<div style='text-align:center'>"+ - "<button id='" + lsKey + "notifyHide'>Close</button> "+ + var closeHtml = "<button id='" + lsKey + "notifyHide'>Close</button> "; + var buttonStyles = "text-align: center"; + // XX code review: The close button does not sense at all, why not just always remove it? + if (skipCloseButton===true) { + closeHtml = ""; + buttonStyles += "; display: inline; margin-left: 20px"; + } + + notifBox.innerHTML += "<div style='"+buttonStyles+"'>"+ + closeHtml + "<button id='" + lsKey + "notifyHideForever'>Don't show again</button>"+ "</div>"; if (!alreadyPresent) { document.body.appendChild(notifBox); } $("#"+lsKey+"notifyHide").click({"id":lsKey}, function() { let key = arguments[0].data.id; $("#"+key+"notifBox").remove(); }); $("#"+lsKey+"notifyHideForever").click({"id": lsKey}, function() { let key = arguments[0].data.id; $("#"+key+"notifBox").remove(); localStorage.setItem(key, "1"); }); }