From 134ff5fe73ca45d2e85c5e6df4a318889e1847ef Mon Sep 17 00:00:00 2001 From: Vagisha Sharma Date: Tue, 26 Mar 2024 18:49:22 -0700 Subject: [PATCH 1/4] Migrate inline JS event handlers in the panoramapublic module. --- .../query/ExperimentAnnotationsTableInfo.java | 20 +++++++++----- .../view/expannotations/experimentDetails.jsp | 4 ++- .../view/publish/pxValidationStatus.jsp | 27 +++++++++++++++---- .../view/search/panoramaWebSearch.jsp | 10 +++---- .../panoramapublic/view/viewSlideshow.jsp | 2 +- .../webapp/PanoramaPublic/js/slideshow.js | 24 +++++++++++++++-- 6 files changed, 66 insertions(+), 21 deletions(-) diff --git a/panoramapublic/src/org/labkey/panoramapublic/query/ExperimentAnnotationsTableInfo.java b/panoramapublic/src/org/labkey/panoramapublic/query/ExperimentAnnotationsTableInfo.java index 14f8d0f4..101d6e17 100644 --- a/panoramapublic/src/org/labkey/panoramapublic/query/ExperimentAnnotationsTableInfo.java +++ b/panoramapublic/src/org/labkey/panoramapublic/query/ExperimentAnnotationsTableInfo.java @@ -57,6 +57,7 @@ import org.labkey.api.settings.AppProps; import org.labkey.api.util.DOM; import org.labkey.api.util.HtmlString; +import org.labkey.api.util.Link; import org.labkey.api.util.PageFlowUtil; import org.labkey.api.util.SimpleNamedObject; import org.labkey.api.util.StringExpressionFactory; @@ -64,6 +65,7 @@ import org.labkey.api.view.ActionURL; import org.labkey.api.view.HttpView; import org.labkey.api.view.template.ClientDependency; +import org.labkey.api.view.template.PageConfig; import org.labkey.panoramapublic.PanoramaPublicController; import org.labkey.panoramapublic.PanoramaPublicManager; import org.labkey.panoramapublic.PanoramaPublicSchema; @@ -81,10 +83,10 @@ import static org.labkey.api.util.DOM.Attribute.height; import static org.labkey.api.util.DOM.Attribute.href; -import static org.labkey.api.util.DOM.Attribute.onclick; import static org.labkey.api.util.DOM.Attribute.src; import static org.labkey.api.util.DOM.Attribute.title; import static org.labkey.api.util.DOM.Attribute.width; +import static org.labkey.api.util.DOM.DIV; import static org.labkey.api.util.DOM.IMG; import static org.labkey.api.util.DOM.at; @@ -149,13 +151,16 @@ public void renderGridCellContents(RenderContext ctx, Writer out) throws IOExcep if(id != null && container != null) { ActionURL detailsPage = PageFlowUtil.urlProvider(ProjectUrls.class).getBeginURL(container); // experiment container - DOM.SPAN(at(onclick, "viewExperimentDetails(this,'" + container.getPath() + "', '" + id + "','" + detailsPage + "')") + PageConfig pageConfig = HttpView.currentPageConfig(); + String spanId = pageConfig.makeId("expt_details_"); + DOM.SPAN(at(DOM.Attribute.id, spanId) .data("active", "false") // will be rendered as "data-active" attribute .data("loaded", "false"), // will be rendered as "data-loaded" attribute IMG(at(DOM.Attribute.id, "expandcontract-" + id) .at(src, PageFlowUtil.staticResourceUrl("_images/plus.gif"))), HtmlString.NBSP) .appendTo(out); + pageConfig.addHandler(spanId, "click", "viewExperimentDetails(this,'" + container.getPath() + "', '" + id + "','" + detailsPage + "')"); } super.renderGridCellContents(ctx, out); } @@ -204,11 +209,12 @@ public void renderGridCellContents(RenderContext ctx, Writer out) throws IOExcep } else { - String content = "
Share"; - content += "
"; - out.write(content); + var link = new Link.LinkBuilder("Share") + .clearClasses().addClass("button-small button-small-green") + .style("margin:0px 5px 0px 2px;") + .onClick("showShareLink(this, '" + PageFlowUtil.filter(accessUrl) + "');return false;"); + DIV(link.build()).appendTo(out); + } } }); diff --git a/panoramapublic/src/org/labkey/panoramapublic/view/expannotations/experimentDetails.jsp b/panoramapublic/src/org/labkey/panoramapublic/view/expannotations/experimentDetails.jsp index e2d626af..16003f43 100644 --- a/panoramapublic/src/org/labkey/panoramapublic/view/expannotations/experimentDetails.jsp +++ b/panoramapublic/src/org/labkey/panoramapublic/view/expannotations/experimentDetails.jsp @@ -292,7 +292,9 @@
<%=h(linkText)%>: <%=h(accessUrl)%> - Share + <%=link("Share").clearClasses().addClass("button-small button-small-green") + .style("margin:0px 5px 0px 2px") + .onClick("showShareLink(this, '" + h(accessUrl) + "'); return false;")%> <% if (annotDetails.hasVersion()) {%> Version: ;"><%=h(annotDetails.getVersion())%> <% if (annotDetails.hasVersionsLink()) { %> diff --git a/panoramapublic/src/org/labkey/panoramapublic/view/publish/pxValidationStatus.jsp b/panoramapublic/src/org/labkey/panoramapublic/view/publish/pxValidationStatus.jsp index 9878746c..d4b798f3 100644 --- a/panoramapublic/src/org/labkey/panoramapublic/view/publish/pxValidationStatus.jsp +++ b/panoramapublic/src/org/labkey/panoramapublic/view/publish/pxValidationStatus.jsp @@ -263,18 +263,27 @@ const action = isStructuralModType(modType) ? 'deleteStructuralModInfo' : 'deleteIsotopeModInfo'; const linkText = matchCount === 1 ? "Delete Match" : "Delete Matches"; - return '' + linkText + ''; + const id = 'delete-assigned-unimod-id-' + Ext4.id(); + const html = '' + linkText + ''; + const callback = () => { + console.log("attaching event handler for id " + id); + LABKEY.Utils.attachEventHandler(id, "click", function () { + return deleteModInfo(modInfoId, experimentAnnotationsId, skylineModName, action); + }); + }; + return {"html": html, "callback": callback } + // return '' + linkText + ''; } function deleteModInfo(modInfoId, experimentAnnotationsId, skylineModName, action) { - const confirmMsg = "Are you sure you want to delete the saved Unimod information for modification " + skylineModName + "?"; + const confirmMsg = "Are you sure you want to delete the saved Unimod information for modification '" + skylineModName + "'?"; const params = { 'id': experimentAnnotationsId, 'modInfoId': modInfoId, 'returnUrl': returnUrl }; - var href = LABKEY.ActionURL.buildURL('panoramapublic', action, LABKEY.ActionURL.getContainer(), params); + const href = LABKEY.ActionURL.buildURL('panoramapublic', action, LABKEY.ActionURL.getContainer(), params); return LABKEY.Utils.confirmAndPost(confirmMsg, href); } @@ -331,8 +340,16 @@ sep = isotopic ? '
' : ' + '; } if (record.data['modInfoId']) { - ret += deleteModInfoLink(record.data['modInfoId'], record.data['skylineModName'], + const link = deleteModInfoLink(record.data['modInfoId'], record.data['skylineModName'], <%=experimentAnnotationsId%>, record.data['modType'], matches.length); + ret += link.html; + Ext4.defer(function() + { + // Attach the onclick handler in a deferred function so that it fires after the renderer function is executed. + // This cannot be added to the "afterrender" listener since the renderer function is executing after "afterrender" + // is fired. + link.callback(); + }, 100); } return ret; } diff --git a/panoramapublic/src/org/labkey/panoramapublic/view/search/panoramaWebSearch.jsp b/panoramapublic/src/org/labkey/panoramapublic/view/search/panoramaWebSearch.jsp index a63d2dd6..beca29da 100644 --- a/panoramapublic/src/org/labkey/panoramapublic/view/search/panoramaWebSearch.jsp +++ b/panoramapublic/src/org/labkey/panoramapublic/view/search/panoramaWebSearch.jsp @@ -87,7 +87,7 @@ - + <%=button("Clear All").id("clear-all-button-id-experiment").addClass("clear-all-button").onClick("clearInputFieldsAndResetURL('experiment')").build()%> @@ -114,7 +114,7 @@ - + <%=button("Clear All").id("clear-all-button-id-protein").addClass("clear-all-button").onClick("clearInputFieldsAndResetURL('protein')").build()%> @@ -138,7 +138,7 @@ - + <%=button("Clear All").id("clear-all-button-id-peptide").addClass("clear-all-button").onClick("clearInputFieldsAndResetURL('peptide')").build()%> @@ -162,7 +162,7 @@ - + <%=button("Clear All").id("clear-all-button-id-small-molecule").addClass("clear-all-button").onClick("clearInputFieldsAndResetURL('smallMolecule')").build()%> @@ -170,7 +170,7 @@
- + <%=button("Search").id("search-button-id").addClass("labkey-button").onClick("handleRendering('true')").build()%>
diff --git a/panoramapublic/src/org/labkey/panoramapublic/view/viewSlideshow.jsp b/panoramapublic/src/org/labkey/panoramapublic/view/viewSlideshow.jsp index 80f238e1..3d9887c4 100644 --- a/panoramapublic/src/org/labkey/panoramapublic/view/viewSlideshow.jsp +++ b/panoramapublic/src/org/labkey/panoramapublic/view/viewSlideshow.jsp @@ -109,6 +109,6 @@ - + <%=button("View").style("margin:15px 0 20px 0").onClick("viewSlideshow()").build()%>
\ No newline at end of file diff --git a/panoramapublic/webapp/PanoramaPublic/js/slideshow.js b/panoramapublic/webapp/PanoramaPublic/js/slideshow.js index aadc1d7e..499d8cfb 100644 --- a/panoramapublic/webapp/PanoramaPublic/js/slideshow.js +++ b/panoramapublic/webapp/PanoramaPublic/js/slideshow.js @@ -5,6 +5,7 @@ let slideIndex; let slides, dots, text; let wait; +const DOT_NAV_ID_PREFIX = "slideshow-dot-"; function setDescSize(fixed) { @@ -76,6 +77,17 @@ function addSlides(json) appendDot(slideshowDots, i + existingSlideCount + 1); appendText(entry, slideshowTexts); } + + // Attach the 'onclick' event handlers + for(let i = 0; i < catalog.length; i++) + { + const index = i + existingSlideCount + 1; + const el = document.getElementById(DOT_NAV_ID_PREFIX + index); + if (el) + { + el.onclick = function() { currentSlide(index); }; + } + } showSlides(); } else @@ -111,7 +123,7 @@ function appendDot(dotsContainer, index) const dot = document.createElement('span'); const cls = index === 1 ? "dot active" : "dot"; dot.setAttribute('class', cls); - dot.setAttribute('onclick', 'currentSlide(' + index + ')'); + dot.setAttribute('id', DOT_NAV_ID_PREFIX + index); dotsContainer.appendChild(dot); dotsContainer.appendChild(document.createTextNode(" ") ); } @@ -178,6 +190,8 @@ function showSlides() function plusSlides(position) { + if (!slides) return; + let i; setDescSize(true); slideIndex += position; @@ -233,6 +247,9 @@ function appendSlidesContainer(parentDivId) return false; } + const nextSlideBtnId = "next-slide-btn"; + const prevSlideBtnId = "prev-slide-btn"; + let slideshowHtml = ''; slideshowHtml += '