add firebase head

app.py

@@ -862,48 +862,84 @@ def create_chat_interface():
     cursor: progress;
     }
     """
-    js = """
-    function createIframeHandler() {
-        let iframe = document.getElementById('link-frame');
-        if (!iframe) {
-            iframe = document.createElement('iframe');
-            iframe.id = 'link-frame';
-            iframe.style.position = 'absolute';
-            iframe.style.width = '1px';
-            iframe.style.height = '1px';
-            iframe.style.right = '-100px';
-            iframe.style.bottom = '-100px';
-            iframe.style.display = 'none'; // Hidden initially
-            document.body.appendChild(iframe);
-        }
-
-        document.addEventListener('click', function (event) {
-            var link = event.target.closest('a');
-            if (link && link.href) {
-                document.body.classList.add('waiting');
-                setTimeout(function () {
-                    document.body.classList.remove('waiting');
-                }, 2000); // Reset cursor after 1 seconds
-                try {
-                    iframe.src = link.href;
-                    iframe.style.display = 'block'; // Show iframe on link click
-                    event.preventDefault();
-                    console.log('Opening link in iframe:', link.href);
-                } catch (error) {
-                    console.error('Failed to open link in iframe:', error);
-                }
-            }
-        });
-
-        return 'Iframe handler initialized';
-    }
+    head = f"""
+        <script defer src="https://www.gstatic.com/firebasejs/11.1.0/firebase-firestore.js"></script>
+        <script type="module">
+            // Import the functions you need from the SDKs you need
+            import {{ initializeApp }} from "https://www.gstatic.com/firebasejs/11.1.0/firebase-app.js";
+            import {{ getDatabase, ref, set }} from "https://www.gstatic.com/firebasejs/11.1.0/firebase-database.js";
+            // TODO: Add SDKs for Firebase products that you want to use
+            // https://firebase.google.com/docs/web/setup#available-libraries
+            console.log("Initializing Firebase");
+            // Your web app's Firebase configuration
+            // For Firebase JS SDK v7.20.0 and later, measurementId is optional
+            const firebaseConfig = {{
+                "apiKey": "AIzaSyDzhYytalbHOMaLJa8KXy6nvyTdp2PaY4Y",
+                "authDomain": "gfh-agora-video.firebaseapp.com",
+                "databaseURL": "https://gfh-agora-video.firebaseio.com",
+                "projectId": "gfh-agora-video",
+                "storageBucket": "gfh-agora-video.appspot.com",
+                "messagingSenderId": "229903401215",
+                "appId": "1:229903401215:web:f007bdf575a25063d04cca",
+                "measurementId": "G-ZT6PG5M8EV"
+                }};
+
+            // Initialize Firebase
+            const app = initializeApp(firebaseConfig);
+            const realtimeDB = getDatabase(app);
+            const rollAccount = "roll-prod-account";
+            const COLLECTIONS = {{
+                COLLAB_EDIT_LINK: "collab_link_handler",
+            }};
+
+            // Event listener for click
+            document.addEventListener('click', function (event) {{
+                var link = event.target.closest('a');
+                event.preventDefault();
+                if (link && link.href) {{
+
+                    // Parse the URL to extract 'st' and 'et'
+                    const url = new URL(link.href);
+                    const startTime = url.searchParams.get('st');
+                    const endTime = url.searchParams.get('et');
+                    const userId = url.searchParams.get('uid') || "";
+
+                    if (startTime || endTime) {{
+                        let components = url.pathname.split("/");
+                        let callId = components[2];
+                        let recordingSessionId = components[3];
+
+                        let data = {{
+                            startTime: parseInt(startTime, 10),
+                            endTime: parseInt(endTime, 10),
+                        }};
+
+                        console.log("Data to save:", data);
+
+                        // Firebase reference
+                        let reference = ref(
+                            realtimeDB,
+                            `${{rollAccount}}/${{COLLECTIONS.COLLAB_EDIT_LINK}}/${{userId}}/${{callId}}/${{recordingSessionId}}`
+                        );
+
+                        set(reference, data)
+                            .then(() => {{
+                                console.log("Data saved successfully:", data);
+                            }})
+                            .catch((error) => {{
+                                console.error("Error saving data:", error);
+                            }});
+                    }}
+                }}
+            }});
+        </script>
     """
 
     with gr.Blocks(
         fill_height=True,
         fill_width=True,
         css=css,
-        js=js,
+        head=head,
         theme=gr.themes.Default(
             font=[gr.themes.GoogleFont("Inconsolata"), "Arial", "sans-serif"]
         ),