Merge pull request #413 from ReactiveBayes/gen-chat

ReactiveBayes · Jan 23, 2025 · 7a6f871 · 7a6f871
2 parents b7e56a2 + 7a5ad63
commit 7a6f871
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 86 deletions.
diff --git a/docs/make.jl b/docs/make.jl
@@ -25,8 +25,6 @@ makedocs(;
             "assets/theme.css",
             "assets/header.css",
             "assets/header.js",
-            asset("https://www.gstatic.com/dialogflow-console/fast/df-messenger/prod/v1/themes/df-messenger-default.css"),
-            asset("https://www.gstatic.com/dialogflow-console/fast/df-messenger/prod/v1/df-messenger.js"),
             "assets/chat.js"
         ],
         description = "Julia package for automated Bayesian inference on a factor graph with reactive message passing",

diff --git a/docs/src/assets/chat.js b/docs/src/assets/chat.js
@@ -1,92 +1,46 @@
 // In docs/src/assets/chat-widget.js
 document.addEventListener('DOMContentLoaded', function() {
-    const messenger = document.createElement('df-messenger');
-    messenger.setAttribute('project-id', 'synthetic-shape-442012-s9');
-    messenger.setAttribute('agent-id', '94fb46c1-e089-404f-8e0f-4478927e5755');
-    messenger.setAttribute('language-code', 'en');
-    messenger.setAttribute('max-query-length', '-1');
-
-    const chatBubble = document.createElement('df-messenger-chat-bubble');
-    chatBubble.setAttribute('chat-title', 'RxInfer Documentation Chatbot');
-    chatBubble.setAttribute('chat-subtitle', `
-        Ask questions about RxInfer Documentation
-    `);
-    chatBubble.setAttribute('chat-title-icon', 'https://reactivebayes.github.io/RxInfer.jl/stable/assets/ld-rxinfer.png');
-    messenger.appendChild(chatBubble);
-
-    document.body.appendChild(messenger);
-
-    const desiredWidth = 720;
-
-    // Function to update chat window width
-    const updateChatWidth = () => {
-        const maxWidth = desiredWidth;
-        const padding = 32; // 16px padding on each side
-        const availableWidth = Math.min(window.innerWidth - padding, maxWidth);
+    // Create and append the search widget
+    const searchWidget = document.createElement('gen-search-widget');
+    searchWidget.setAttribute('configId', '1bea2ada-cbee-4d63-9154-6e68f77e8aa0');
+    searchWidget.setAttribute('triggerId', 'searchWidgetTrigger');
+    document.body.appendChild(searchWidget);
+
+    // Find the docs search query element
+    const docsSearchQuery = document.getElementById('documenter-search-query');
+    if (docsSearchQuery) {
+        // Create container for AI search
+        const aiSearchContainer = document.createElement('div');
+        aiSearchContainer.style.cssText = `
+            width: 14.4rem;
+        `;
+        aiSearchContainer.classList.add('mx-auto');
 
-        style.textContent = `
-            df-messenger {
-                z-index: 999;
-                position: fixed;
-                bottom: 16px;
-                right: 16px;
-                --df-messenger-font-family: 'PT Mono', system-ui, -apple-system, sans-serif;
-                --df-messenger-primary-color: rgb(22, 87, 152);
-                --df-messenger-focus-color: rgb(22, 87, 152);
-                --df-messenger-chat-window-width: ${availableWidth}px;
-                --df-messenger-chat-window-offset: 64px;
-                --df-messenger-titlebar-icon-width: 64px;
-                --df-messenger-titlebar-icon-height: 64px;
-                --df-messenger-titlebar-icon-padding: 0 24px 0 0;
-            }
+        // Add "or" text
+        const orText = document.createElement('div');
+        orText.textContent = 'or';
+        orText.style.cssText = `
+            text-align: center;
+            color: #666;
+            font-size: 0.9em;
         `;
-    };
-
-    // Add styles using documented properties
-    const style = document.createElement('style');
-    updateChatWidth(); // Initial width setting
-    document.head.appendChild(style);
+
+        aiSearchContainer.appendChild(orText);
 
-    // Update width on window resize
-    window.addEventListener('resize', updateChatWidth);
+        // Create and append the trigger input
+        const searchTrigger = document.createElement('input');
+        searchTrigger.setAttribute('placeholder', 'Search with Gemini');
+        searchTrigger.setAttribute('id', 'searchWidgetTrigger');
+        searchTrigger.classList.add('docs-search-query','input','is-rounded','is-small','is-clickable','my-2','py-1','px-2');
+
+        aiSearchContainer.appendChild(searchTrigger);
+        docsSearchQuery.parentNode.insertBefore(aiSearchContainer, docsSearchQuery.nextSibling);
 
-    // Wait for custom element to be defined
-    customElements.whenDefined('df-messenger').then(() => {
-        setTimeout(() => {
-            const chatWrapper = chatBubble.shadowRoot?.querySelector('.chat-wrapper');
-            console.log(chatWrapper);
-            if (chatWrapper) {
-                const footer = document.createElement('div');
-                const updateFooterWidth = () => {
-                    const maxWidth = desiredWidth;
-                    const padding = 32;
-                    const availableWidth = Math.min(window.innerWidth - padding, maxWidth);
-                    footer.style.cssText = `
-                        font-size: 11px;
-                        color: #6B7280;
-                        background: #ffffff;
-                        width: ${availableWidth + 2}px;
-                        border-radius: 0 0 4px 4px;
-                    `;
-                };
-
-                updateFooterWidth(); // Initial footer width
-                window.addEventListener('resize', updateFooterWidth);
+
+    }
 
-                const footerText = document.createElement('div');
-                footerText.style.cssText = `
-                    padding: 8px 16px;
-                    line-height: 1.4;
-                `;
-                footerText.innerHTML = `
-                    Responses are automatically generated and may not be accurate.
-                    Please <a href="https://github.com/ReactiveBayes/RxInfer.jl/issues" target="_blank" style="color: rgb(22, 87, 152); text-decoration: none;">open an issue</a> if you find any inaccuracies.
-                    Powered by Gemini.
-                    Sponsored by <a href="https://lazydynamics.com" target="_blank" style="color: rgb(22, 87, 152); text-decoration: none;">Lazy Dynamics</a>.
-                `;
-                footer.appendChild(footerText);
-                chatWrapper.appendChild(footer);
-            }
-        }, 10);
-    });
+    // Load the Google Gen AI SDK
+    const script = document.createElement('script');
+    script.src = 'https://cloud.google.com/ai/gen-app-builder/client?hl=en_US';
+    document.head.appendChild(script);
 });