Block event propagation when lightbox is triggered

1 files changed, 10 insertions, 6 deletions

diff --git a/script.js b/script.js
index a016eb4e..9e3d42b5 100644
--- a/script.js
+++ b/script.js
@@ -80,11 +80,14 @@ function closeModal() {
   gradioApp().getElementById("lightboxModal").style.display = "none";
 }
 
-function showModal(elem) {
-  gradioApp().getElementById("modalImage").src = elem.src
+function showModal(event) {
+  var source = event.target || event.srcElement;
+  gradioApp().getElementById("modalImage").src = source.src
   gradioApp().getElementById("lightboxModal").style.display = "block";
+  event.stopPropagation()
 }
 
+
 function showGalleryImage(){
     setTimeout(function() {
         fullImg_preview = gradioApp().querySelectorAll('img.w-full.object-contain')
@@ -92,12 +95,13 @@ function showGalleryImage(){
         if(fullImg_preview != null){
             fullImg_preview.forEach(function function_name(e) {
                 if(e && e.parentElement.tagName == 'DIV'){
+
                     e.style.cursor='pointer'
 
-                    elemfunc = function(elem){
-                        elem.onclick = function(){showModal(elem)};
-                    }
-                    elemfunc(e)
+                    e.addEventListener('click', function (evt) {
+                      showModal(evt)
+
+                    },true);
                 }
             });
         }