Update app.py

app.py

@@ -127,7 +127,7 @@ def parse_metadata_hash(metadata_html):
             return scc_hash, username, task_name, date, time
     return None, None, None, None, None
 
-# --- JavaScript for extracting link attributes ---
+# --- JavaScript for capturing pasted links ---
 def verification_js():
     return """
     <script>
@@ -138,20 +138,28 @@ def verification_js():
         const hashOutput = document.getElementById('hash_output');
 
         if (citationInput && hashInput && citationOutput && hashOutput) {
-            const citationLink = citationInput.getElementsByTagName('a')[0];
-            const hashLink = hashInput.getElementsByTagName('a')[0];
+            const citationLink = citationInput.querySelector('a');
+            const hashLink = hashInput.querySelector('a');
 
             citationOutput.value = citationLink ? citationLink.outerHTML : '';
             hashOutput.value = hashLink ? hashLink.outerHTML : '';
+
+            // Trigger form submission to update Streamlit
+            if (citationLink || hashLink) {
+                const form = document.getElementById('verify_form');
+                if (form) {
+                    form.dispatchEvent(new Event('submit'));
+                }
+            }
         }
     }
 
     document.getElementById('citation_input').addEventListener('paste', function(e) {
-        setTimeout(updateCitationData, 0);
+        setTimeout(updateCitationData, 100);
     });
 
     document.getElementById('hash_input').addEventListener('paste', function(e) {
-        setTimeout(updateCitationData, 0);
+        setTimeout(updateCitationData, 100);
     });
     </script>
     """
@@ -328,68 +336,47 @@ with tabs[1]:
     st.header("Verify Citation")
     st.markdown("""
     <div class="info-card">
-    Paste the generated citation and hash with their embedded links below to verify the citation's authenticity. Copy the rendered links directly from the output.
-    </div>
-    """, unsafe_allow_html=True)
-
-    # Input fields for citation and hash
-    st.markdown("""
-    <div>
-        <label>Paste Citation (with embedded link)</label>
-        <div id="citation_input" contenteditable="true" style="border: 1px solid #e0e0e0; border-radius: 4px; padding: 0.5rem; min-height: 50px; margin-bottom: 1rem;"></div>
-        <input type="hidden" id="citation_output" name="citation_output">
-        <label>Paste Hash (with embedded link)</label>
-        <div id="hash_input" contenteditable="true" style="border: 1px solid #e0e0e0; border-radius: 4px; padding: 0.5rem; min-height: 50px; margin-bottom: 1rem;"></div>
-        <input type="hidden" id="hash_output" name="hash_output">
+    Paste the rendered citation and hash links (e.g., "Author (Year)" and "Author (Year). Hash") directly from the 'Citation Generator' tab to verify the citation's authenticity.
     </div>
     """, unsafe_allow_html=True)
 
-    # Add JavaScript to capture pasted link data
-    components.html(verification_js(), height=0)
-
-    # Use session state to store the extracted data
+    # Form to handle submission
+    with st.form(key="verify_form"):
+        st.markdown("""
+        <div>
+            <label>Paste Citation (with embedded link)</label>
+            <div id="citation_input" contenteditable="true" style="border: 1px solid #e0e0e0; border-radius: 4px; padding: 0.5rem; min-height: 50px; margin-bottom: 1rem;"></div>
+            <input type="hidden" id="citation_output" name="citation_output">
+            <label>Paste Hash (with embedded link)</label>
+            <div id="hash_input" contenteditable="true" style="border: 1px solid #e0e0e0; border-radius: 4px; padding: 0.5rem; min-height: 50px; margin-bottom: 1rem;"></div>
+            <input type="hidden" id="hash_output" name="hash_output">
+        </div>
+        """, unsafe_allow_html=True)
+
+        # Add JavaScript to capture pasted link data
+        components.html(verification_js(), height=0)
+
+        # Submit button for the form
+        verify_button = st.form_submit_button("Verify Citation", type="primary", use_container_width=True)
+
+    # Initialize session state
     if 'citation_html' not in st.session_state:
         st.session_state.citation_html = ''
     if 'hash_html' not in st.session_state:
         st.session_state.hash_html = ''
 
-    # JavaScript to update session state via URL parameters
-    st.markdown("""
-    <script>
-        function updateSessionState() {
-            const citationOutput = document.getElementById('citation_output').value;
-            const hashOutput = document.getElementById('hash_output').value;
-            const params = new URLSearchParams(window.location.search);
-            params.set('citation_html', encodeURIComponent(citationOutput));
-            params.set('hash_html', encodeURIComponent(hashOutput));
-            window.history.replaceState({}, '', `${window.location.pathname}?${params}`);
-        }
-        document.getElementById('citation_input').addEventListener('paste', function() {
-            setTimeout(updateCitationData, 0);
-            setTimeout(updateSessionState, 100);
-        });
-        document.getElementById('hash_input').addEventListener('paste', function() {
-            setTimeout(updateCitationData, 0);
-            setTimeout(updateSessionState, 100);
-        });
-    </script>
-    """, unsafe_allow_html=True)
-
-    # Retrieve data from URL parameters
-    query_params = st.experimental_get_query_params()
-    st.session_state.citation_html = query_params.get('citation_html', [''])[0]
-    st.session_state.hash_html = query_params.get('hash_html', [''])[0]
-
-    verify_button = st.button("Verify Citation", type="primary", use_container_width=True)
-
+    # Update session state with form data
     if verify_button:
-        if not (st.session_state.citation_html and st.session_state.hash_html):
+        citation_html = st.session_state.get('citation_output', '')
+        hash_html = st.session_state.get('hash_output', '')
+
+        if not (citation_html and hash_html):
             st.error("Please paste both the citation and hash links before verifying.")
         else:
             # Parse citation
-            author, year, url, fragment_text, citation_hash = parse_citation(st.session_state.citation_html)
+            author, year, url, fragment_text, citation_hash = parse_citation(citation_html)
             # Parse hash and metadata
-            scc_hash, username, task_name, date, time = parse_metadata_hash(st.session_state.hash_html)
+            scc_hash, username, task_name, date, time = parse_metadata_hash(hash_html)
 
             if not all([author, year, url, fragment_text, scc_hash, username, task_name, date, time]):
                 st.error("Invalid citation or hash format. Please ensure both inputs are correctly pasted links from the generated output.")