|
|
| (4 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /* Any JavaScript here will be loaded for all users on every page load. */ | | /* Any JavaScript here will be loaded for all users on every page load. */ |
| // Helix Project AI Assistant - Chatbase with Fallback Bubble | | // Helix Project - Chatbase Integration Only |
| window.addEventListener('load', function() {
| | console.log('Loading Helix Chatbase integration...'); |
| console.log('Loading Helix AI Assistant for Wiki...');
| |
|
| |
| // Add the chat bubble to wiki pages
| |
| addChatBubbleToWiki();
| |
|
| |
| // Your existing Chatbase integration
| |
| var script = document.createElement('script');
| |
| script.src = 'https://www.chatbase.co/embed.min.js';
| |
| script.setAttribute('chatbotId', 'i65eBj3COxUlFEU_Lsrw0');
| |
| script.setAttribute('domain', 'www.chatbase.co');
| |
| script.defer = true;
| |
|
| |
| script.onload = function() {
| |
| console.log('Chatbase loaded on wiki');
| |
| };
| |
|
| |
| script.onerror = function() {
| |
| console.log('Chatbase failed, using wiki chat bubble');
| |
| };
| |
|
| |
| document.body.appendChild(script);
| |
| });
| |
|
| |
|
| // Add chat bubble specifically for wiki pages | | // Only load Chatbase - remove custom chat bubble code |
| function addChatBubbleToWiki() {
| | var script = document.createElement('script'); |
| // Remove any existing chat bubbles first
| | script.src = 'https://www.chatbase.co/embed.min.js'; |
| const existingBubbles = document.querySelectorAll('[id="helix-wiki-chat"]');
| | script.setAttribute('chatbotId', 'i65eBj3COxUlFEU_Lsrw0'); |
| existingBubbles.forEach(bubble => bubble.remove());
| | script.setAttribute('domain', 'www.chatbase.co'); |
|
| | script.defer = true; |
| const chatBubble = document.createElement('div');
| | document.body.appendChild(script); |
| chatBubble.id = 'helix-wiki-chat';
| |
| chatBubble.innerHTML = '💬 AI Assistant';
| |
| chatBubble.style.cssText = `
| |
| position: fixed;
| |
| bottom: 20px;
| |
| right: 20px;
| |
| background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
| |
| color: white;
| |
| padding: 15px 20px;
| |
| border-radius: 25px;
| |
| cursor: pointer;
| |
| z-index: 10000;
| |
| box-shadow: 0 4px 20px rgba(0,0,0,0.3);
| |
| font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
| |
| font-size: 14px;
| |
| font-weight: 600;
| |
| transition: all 0.3s ease;
| |
| `;
| |
|
| |
| // Add hover effects
| |
| chatBubble.onmouseenter = function() {
| |
| this.style.transform = 'scale(1.1)';
| |
| this.style.boxShadow = '0 6px 25px rgba(0,0,0,0.4)';
| |
| };
| |
|
| |
| chatBubble.onmouseleave = function() {
| |
| this.style.transform = 'scale(1)';
| |
| this.style.boxShadow = '0 4px 20px rgba(0,0,0,0.3)';
| |
| };
| |
|
| |
| // Make it do something useful
| |
| chatBubble.onclick = function() {
| |
| // Show a helpful modal for wiki users
| |
| showWikiHelpModal();
| |
| };
| |
|
| |
| document.body.appendChild(chatBubble);
| |
| console.log('Wiki chat bubble added');
| |
| }
| |
|
| |
|
| // Helpful modal for wiki users
| | console.log('Chatbase integration loaded successfully'); |
| function showWikiHelpModal() {
| |
| const modal = document.createElement('div');
| |
| modal.style.cssText = `
| |
| position: fixed;
| |
| top: 50%;
| |
| left: 50%;
| |
| transform: translate(-50%, -50%);
| |
| background: white;
| |
| padding: 30px;
| |
| border-radius: 15px;
| |
| box-shadow: 0 10px 40px rgba(0,0,0,0.3);
| |
| z-index: 10001;
| |
| min-width: 400px;
| |
| max-width: 90vw;
| |
| text-align: left;
| |
| `;
| |
|
| |
| modal.innerHTML = `
| |
| <h3 style="margin: 0 0 15px 0; color: #333; border-bottom: 2px solid #667eea; padding-bottom: 10px;">Helix AI Assistant</h3>
| |
| <p style="color: #666; margin-bottom: 15px;">I can help you with:</p>
| |
| <ul style="color: #666; margin-bottom: 20px; padding-left: 20px;">
| |
| <li>Wiki editing and formatting</li>
| |
| <li>Finding information in the Helix Project</li>
| |
| <li>MediaWiki syntax help</li>
| |
| <li>Project documentation</li>
| |
| </ul>
| |
| <p style="color: #888; font-size: 12px; margin-bottom: 20px; background: #f5f5f5; padding: 10px; border-radius: 5px;">
| |
| <strong>Note:</strong> Full chat integration coming soon. For now, you can ask questions in the wiki discussion pages.
| |
| </p>
| |
| <div style="text-align: center;">
| |
| <button onclick="closeModal()" style="
| |
| background: #667eea;
| |
| color: white;
| |
| border: none;
| |
| padding: 10px 20px;
| |
| border-radius: 5px;
| |
| cursor: pointer;
| |
| margin: 0 5px;
| |
| ">Got it!</button>
| |
| <button onclick="window.location.href='/wiki/Help:Contents'" style="
| |
| background: transparent;
| |
| color: #667eea;
| |
| border: 1px solid #667eea;
| |
| padding: 10px 20px;
| |
| border-radius: 5px;
| |
| cursor: pointer;
| |
| margin: 0 5px;
| |
| ">Wiki Help</button>
| |
| </div>
| |
| `;
| |
|
| |
| // Add overlay
| |
| const overlay = document.createElement('div');
| |
| overlay.style.cssText = `
| |
| position: fixed;
| |
| top: 0;
| |
| left: 0;
| |
| width: 100%;
| |
| height: 100%;
| |
| background: rgba(0,0,0,0.5);
| |
| z-index: 10000;
| |
| `;
| |
| overlay.id = 'helix-modal-overlay';
| |
|
| |
| // Close function
| |
| window.closeModal = function() {
| |
| modal.remove();
| |
| overlay.remove();
| |
| };
| |
|
| |
| overlay.onclick = window.closeModal;
| |
|
| |
| document.body.appendChild(overlay);
| |
| document.body.appendChild(modal);
| |
| }
| |
