Update app.py

app.py

@@ -131,35 +131,24 @@ def parse_metadata_hash(metadata_html):
 def verification_js():
     return """
     <script>
-    function updateCitationData() {
-        const citationInput = document.getElementById('citation_input');
-        const hashInput = document.getElementById('hash_input');
-        const citationOutput = document.getElementById('citation_output');
-        const hashOutput = document.getElementById('hash_output');
-
-        if (citationInput && hashInput && citationOutput && hashOutput) {
-            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'));
-                }
-            }
+    function updateCitationData(inputId, outputId) {
+        const input = document.getElementById(inputId);
+        const output = document.getElementById(outputId);
+        if (input && output) {
+            const link = input.querySelector('a');
+            output.value = link ? link.outerHTML : '';
+            // Dispatch input event to trigger Streamlit update
+            const event = new Event('input', { bubbles: true });
+            output.dispatchEvent(event);
         }
     }
 
     document.getElementById('citation_input').addEventListener('paste', function(e) {
-        setTimeout(updateCitationData, 100);
+        setTimeout(() => updateCitationData('citation_input', 'citation_output'), 100);
     });
 
     document.getElementById('hash_input').addEventListener('paste', function(e) {
-        setTimeout(updateCitationData, 100);
+        setTimeout(() => updateCitationData('hash_input', 'hash_output'), 100);
     });
     </script>
     """
@@ -340,24 +329,20 @@ with tabs[1]:
     </div>
     """, unsafe_allow_html=True)
 
-    # 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)
+    # 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" value="">
+        <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" value="">
+    </div>
+    """, unsafe_allow_html=True)
+
+    # Add JavaScript to capture pasted link data
+    components.html(verification_js(), height=0)
 
     # Initialize session state
     if 'citation_html' not in st.session_state:
@@ -365,18 +350,26 @@ with tabs[1]:
     if 'hash_html' not in st.session_state:
         st.session_state.hash_html = ''
 
-    # Update session state with form data
-    if verify_button:
-        citation_html = st.session_state.get('citation_output', '')
-        hash_html = st.session_state.get('hash_output', '')
+    # Hidden text inputs to capture JavaScript data
+    citation_html = st.text_input("Citation HTML", key="citation_output", value=st.session_state.citation_html, label_visibility="collapsed")
+    hash_html = st.text_input("Hash HTML", key="hash_output", value=st.session_state.hash_html, label_visibility="collapsed")
+
+    # Update session state
+    if citation_html != st.session_state.citation_html:
+        st.session_state.citation_html = citation_html
+    if hash_html != st.session_state.hash_html:
+        st.session_state.hash_html = hash_html
 
-        if not (citation_html and hash_html):
+    verify_button = st.button("Verify Citation", type="primary", use_container_width=True)
+
+    if verify_button:
+        if not (st.session_state.citation_html and st.session_state.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(citation_html)
+            author, year, url, fragment_text, citation_hash = parse_citation(st.session_state.citation_html)
             # Parse hash and metadata
-            scc_hash, username, task_name, date, time = parse_metadata_hash(hash_html)
+            scc_hash, username, task_name, date, time = parse_metadata_hash(st.session_state.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.")