sync shared AI connection between playground and deepresearch some small issuse left

Author: thefirehacker

Canvas.html

@@ -1259,6 +1259,9 @@ <h3>🎮 Controls</h3>
   <!-- Configuration and Analytics -->
   <script src="config.js"></script>
 
+  <!-- Shared Systems -->
+  <script src="lib/Pages/shared/ai-connection-manager.js"></script>
+  
   <!-- AI Agent System -->
   <script src="lib/agent/canvas.js"></script>
 
@@ -2270,6 +2273,32 @@ <h2 style="color: white; margin-bottom: 20px; text-align: center;">🤖 Local Qw
         updateStatus('🦙 Connecting to Ollama...');
         document.getElementById('aiStatus').textContent = 'AI: Connecting to Ollama...';
 
+        // Check if we already have a shared AI connection
+        if (window.SharedAIConnection && window.SharedAIConnection.isAIConnected()) {
+          const currentProvider = window.SharedAIConnection.getProviderInfo();
+          console.log('✅ Shared AI connection already exists:', currentProvider);
+          
+          if (currentProvider.provider === 'ollama') {
+            // Use existing Ollama connection
+            const sharedAI = window.SharedAIConnection.getAIAssistant();
+            aiSession = { 
+              type: 'ollama', 
+              model: currentProvider.model,
+              baseURL: currentProvider.baseURL || 'http://localhost:11434'
+            };
+            
+            document.getElementById('aiStatus').textContent = `AI: Ollama (${currentProvider.model}) ✅`;
+            document.getElementById('generateBtn').disabled = false;
+            document.getElementById('initAIBtn').textContent = `🦙 Ollama Ready`;
+            
+            updateHeaderAIStatus();
+            updateStatus(`🦙 Using existing Ollama connection (${currentProvider.model})!`);
+            addChatMessage('system', `🦙 Using existing Ollama connection! Model: ${currentProvider.model}. Fully local processing with GGUF models - no API costs.`);
+            
+            return;
+          }
+        }
+        
         // Get custom URL from input field, fallback to default
         let ollamaUrl = 'http://localhost:11434';
         const urlInput = document.getElementById('ollamaUrl');
@@ -2328,6 +2357,32 @@ <h2 style="color: white; margin-bottom: 20px; text-align: center;">🤖 Local Qw
         document.getElementById('generateBtn').disabled = false;
         document.getElementById('initAIBtn').textContent = `🦙 Ollama Ready`;
 
+        // Store in shared AI connection manager for cross-environment use
+        if (window.SharedAIConnection) {
+          try {
+            // Create a mock AI assistant for Canvas's simpler needs
+            const canvasAI = {
+              type: 'ollama',
+              model: selectedModel,
+              baseURL: ollamaUrl,
+              generateContent: async (prompt, context) => {
+                // Canvas uses its own generation logic
+                return null;
+              }
+            };
+            
+            window.SharedAIConnection.setConnection('ollama', canvasAI, {
+              provider: 'ollama',
+              model: selectedModel,
+              baseURL: ollamaUrl
+            });
+            
+            console.log('✅ Ollama connection stored in shared manager');
+          } catch (sharedError) {
+            console.warn('⚠️ Failed to store in shared AI manager:', sharedError);
+          }
+        }
+        
         // Update header status
         updateHeaderAIStatus();
 

DeepResearch.html

@@ -1402,6 +1402,9 @@ <h3>✨ Features:</h3>
   <!-- JSZip for PPTX parsing -->
   <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
 
+  <!-- Shared Systems -->
+  <script src="lib/Pages/shared/ai-connection-manager.js"></script>
+  
   <!-- Vector Store Module -->
   <script src="lib/Pages/DeepResearch/vector-store.js"></script>
   <script src="lib/Pages/DeepResearch/deepresearch.js"></script>
@@ -1479,7 +1482,7 @@ <h3>✨ Features:</h3>
         }
       }, 100);
 
-      const initializeApp = () => {
+      const initializeApp = async () => {
         console.log('🔍 Script loading check:');
         console.log('  - DeepResearchApp:', !!window.DeepResearchApp);
         console.log('  - AIAssistant:', !!window.AIAssistant);
@@ -1492,13 +1495,14 @@ <h3>✨ Features:</h3>
 
         if (window.DeepResearchApp) {
           window.deepResearch = new DeepResearchApp();
+          await window.deepResearch.init();
           console.log('✅ Deep Research Studio initialized with full Vector Store support');
         } else {
           console.error('❌ DeepResearchApp not found - script loading issue');
         }
       };
 
-      const initializeAppWithoutVectorStore = () => {
+      const initializeAppWithoutVectorStore = async () => {
         console.log('🔍 Script loading check (Vector Store disabled):');
         console.log('  - DeepResearchApp:', !!window.DeepResearchApp);
         console.log('  - AIAssistant:', !!window.AIAssistant);
@@ -1513,6 +1517,7 @@ <h3>✨ Features:</h3>
           // Set a flag to disable vector store features
           window.VECTOR_STORE_DISABLED = true;
           window.deepResearch = new DeepResearchApp();
+          await window.deepResearch.init();
           console.log('⚠️ Deep Research Studio initialized WITHOUT Vector Store (document features disabled)');
         } else {
           console.error('❌ DeepResearchApp not found - script loading issue');

Playground.html

@@ -826,7 +826,8 @@ <h2>🚀 Welcome to AI Playground</h2>
   <script src="lib/Pages/DeepResearch/deepresearch.js"></script>
   <script src="lib/Pages/DeepResearch/vector-store.js"></script>
 
-  <!-- Load Shared RAG System -->
+  <!-- Load Shared Systems -->
+  <script src="lib/Pages/shared/ai-connection-manager.js"></script>
   <script src="lib/Pages/shared/rag-system.js"></script>
 
   <!-- Load User Agreement Module -->

index.html

@@ -223,6 +223,21 @@
       box-shadow: 0 8px 25px rgba(79, 172, 254, 0.6);
     }
 
+    /* Launching Soon Button Style */
+    .feature-cta.launching-soon {
+      background: linear-gradient(45deg, #ff9800 0%, #ffc107 100%);
+      color: #333;
+      cursor: default;
+      pointer-events: none;
+      opacity: 0.8;
+      box-shadow: 0 4px 15px rgba(255, 152, 0, 0.3);
+    }
+    
+    .feature-cta.launching-soon:hover {
+      transform: none;
+      box-shadow: 0 4px 15px rgba(255, 152, 0, 0.3);
+    }
+    
     .feature-cta.research {
       background: linear-gradient(45deg, #fa709a 0%, #fee140 100%);
       box-shadow: 0 4px 15px rgba(250, 112, 154, 0.4);
@@ -791,10 +806,10 @@ <h2 class="feature-title">Canvas Creative Environment</h2>
           <li>Interactive visualization tools</li>
         </ul>
 
-        <a href="Canvas.html" class="feature-cta">
-          <span>🎨</span>
-          Launch Canvas
-        </a>
+        <div class="feature-cta launching-soon">
+          <span>🚀</span>
+          Launching Soon
+        </div>
       </div>
     </div>
 
@@ -891,13 +906,14 @@ <h2 class="feature-title">Canvas Creative Environment</h2>
           window.AppConfig.trackEvent('keyboard_navigation', 'navigation', 'playground');
         }
       }
-      if (e.key === '3' || e.key === 'c' || e.key === 'C') {
-        window.location.href = 'Canvas.html';
-        // Track navigation event
-        if (window.AppConfig) {
-          window.AppConfig.trackEvent('keyboard_navigation', 'navigation', 'canvas');
-        }
-      }
+      // Canvas navigation temporarily disabled (launching soon)
+      // if (e.key === '3' || e.key === 'c' || e.key === 'C') {
+      //   window.location.href = 'Canvas.html';
+      //   // Track navigation event
+      //   if (window.AppConfig) {
+      //     window.AppConfig.trackEvent('keyboard_navigation', 'navigation', 'canvas');
+      //   }
+      // }
     });
 
     // Add smooth scroll behavior for better UX
@@ -914,13 +930,12 @@ <h2 class="feature-title">Canvas Creative Environment</h2>
       });
     });
 
-    // Track feature card clicks
-    document.querySelectorAll('.feature-cta').forEach((cta, index) => {
+    // Track feature card clicks (exclude launching-soon buttons)
+    document.querySelectorAll('.feature-cta:not(.launching-soon)').forEach((cta, index) => {
       cta.addEventListener('click', () => {
         if (window.AppConfig) {
           const feature = index === 0 ? 'deepresearch' : 
-                         index === 1 ? 'playground' : 
-                         index === 2 ? 'canvas' : 'unknown';
+                         index === 1 ? 'playground' : 'unknown';
           window.AppConfig.trackEvent('feature_clicked', 'navigation', feature);
         }
       });

lib/AIAssistant/AIAssistant-Backend.js

@@ -121,10 +121,10 @@ When user asks for something, generate creative, compact p5.js code that creates
 
   checkGlobalAgreementStatus() {
     // Check if the global agreement system has already accepted the agreement
-    if (window.userAgreement && window.userAgreement.isAccepted && window.userAgreement.isAccepted()) {
+    if (window.userAgreement && window.userAgreement.isAgreementAccepted && window.userAgreement.isAgreementAccepted()) {
       console.log('✅ Global user agreement already accepted - enabling AI features');
       this.userAgreementAccepted = true;
-      this.agreementTimestamp = Date.now();
+      this.agreementTimestamp = window.userAgreement.getAgreementTimestamp() || Date.now();
     } else {
       console.log('⚠️ Global user agreement not found or not accepted');
     }
@@ -526,12 +526,21 @@ When user asks for something, generate creative, compact p5.js code that creates
     this.agreementTimestamp = Date.now();
     this.agreementModalOpen = false;
 
+    // Sync with global agreement system
+    if (window.userAgreement && window.userAgreement.acceptAgreement) {
+      console.log('🔄 Syncing agreement acceptance with global system');
+      window.userAgreement.userAgreementAccepted = true;
+      window.userAgreement.agreementTimestamp = new Date(this.agreementTimestamp);
+      window.userAgreement.saveAgreementStatus();
+      window.userAgreement.updateAgreementStatusDisplay();
+    }
+    
     const modal = document.getElementById('userAgreementModal');
     if (modal) {
       modal.remove();
     }
 
-    console.log('✅ User agreement accepted');
+    console.log('✅ User agreement accepted and synced globally');
     console.log('🔍 pendingAIInitialization status:', this.pendingAIInitialization);
 
     if (this.pendingAIInitialization) {