Update app.py

app.py

@@ -28,6 +28,11 @@ function run(inn) {
     var frame_on = document.getElementById("frame" + String(inn));
     frame_on.style.display = 'block';
 }
+function closefn(inn) {
+    console.log(inn);
+    var frame_off = document.getElementById("frame" + String(inn));
+    frame_off.style.display = 'none';
+}
 </script>
 """.replace("/abs/","/pdf/")
 def search(q,rn):
@@ -37,12 +42,14 @@ def search(q,rn):
     html=""
     for i,c in enumerate(cont):
         pdflink=c['id'].replace('/abs/','/pdf/')
-        html+=f"""<div class='card_div' id='id{i}' onclick="run({i})">"""
-        html+=f"<div class='title_div'>{c['title']}</div>"
-        html+=f"<div style='color:white;'>{c['summary']}</div>"
-        html+=f"<div><a href='{pdflink}' target='_blank'>{pdflink}</a></div>"
-        html+="</div>"
-        html+=f"""<div id=frame{i} class='frame_class'><iframe src="https://docs.google.com/viewer?url={c['id'].replace('/abs/','/pdf/')}&embedded=true" frameborder="0" height="1200px" width="100%"></iframe></div>"""
+        html+=f"""<div class='card_div' id='id{i}' onclick="run({i})">
+                   <div class='title_div'>{c['title']}</div>
+                    <div style='color:white;'>{c['summary']}</div>
+                    <div><a href='{pdflink}' target='_blank'>{pdflink}</a></div>
+                   </div>
+        <div id=frame{i} class='frame_class'>
+        <div id=close{i} class='x_btn' onclick='closefn({i})'>X</div>
+        <iframe src="https://docs.google.com/viewer?url={c['id'].replace('/abs/','/pdf/')}&embedded=true" frameborder="0" height="1200px" width="100%"></iframe></div>"""
     return(json.dumps(cont,indent=4)),html
 with gr.Blocks(css=style,head=head) as b:
     with gr.Group():