Touch up theme aplicator

MrBlankCoding · MrBlankCoding · commit 5a0a1c0fa72d · 2025-11-10T23:00:57.000-05:00
diff --git a/README.md b/README.md
@@ -45,6 +45,10 @@ npm build.js
 
 ## TODO List
 
+### Element inspector
+* [ ] Fix element inspector aplication
+* [ ] Add element inspector to AI 
+
 ### Editor
 
 * [ ] Reduce editor bundle size (~1.4 MB currently)
@@ -56,6 +60,7 @@ npm build.js
 ### UI
 * [ ] Fix editor optimizations
 * [ ] Can you make it so if you have mutiple scripts running at once on the same page the notifications will expand verticlly and not all overlap
+* [ ] Improve AI settings UI layout
 
 ---
 
diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
@@ -386,15 +386,9 @@
   "aiSettingsSelectProvider": {
     "message": "Select a provider..."
   },
-  "aiSettingsProviderHint": {
-    "message": "Choose your AI provider"
-  },
   "aiSettingsApiKey": {
     "message": "API Key"
   },
-  "aiSettingsApiKeyHint": {
-    "message": "Your API key is stored locally and never sent to external servers"
-  },
   "aiSettingsApiEndpoint": {
     "message": "API Endpoint"
   },
@@ -410,9 +404,6 @@
   "aiSettingsFetchModels": {
     "message": "Fetch Models"
   },
-  "aiSettingsModelHint": {
-    "message": "AI model to use for code generation"
-  },
   "aiSettingsAdvanced": {
     "message": "Advanced Settings"
   },
diff --git a/src/ai_dom_editor/settings/ai_settings.html b/src/ai_dom_editor/settings/ai_settings.html
@@ -5,6 +5,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>AI DOM Editor Settings</title>
   <link rel="stylesheet" href="../../assets/styles/ai/ai_settings.css">
+  <script src="../../utils/theme_manager.js"></script>
 </head>
 <body>
   <div class="settings-container">
@@ -42,7 +43,6 @@ <h3>Getting Started</h3>
               <li>OpenAI: <a href="https://platform.openai.com/api-keys" target="_blank">platform.openai.com</a></li>
               <li>Anthropic: <a href="https://console.anthropic.com/" target="_blank">console.anthropic.com</a></li>
               <li>Google Gemini: <a href="https://aistudio.google.com/app/apikey" target="_blank">aistudio.google.com</a></li>
-              <li>For Gemini: Select "Google (Gemini)" provider and your model - the endpoint will be configured automatically</li>
             </ul>
           </div>
         </div>
@@ -87,7 +87,6 @@ <h2>AI Provider Configuration</h2>
                   <option value="aimlapi">AIML API</option>
                   <option value="custom">Custom Endpoint</option>
                 </select>
-                <span class="form-hint">Choose your AI provider</span>
               </div>
 
               <!-- API Key -->
@@ -107,7 +106,6 @@ <h2>AI Provider Configuration</h2>
                     <i data-feather="eye" width="18" height="18"></i>
                   </button>
                 </div>
-                <span class="form-hint">Your API key is stored locally and never sent to external servers</span>
               </div>
 
               <!-- Endpoint (shown for custom provider) -->
@@ -139,7 +137,6 @@ <h2>AI Provider Configuration</h2>
                     Fetch Models
                   </button>
                 </div>
-                <span class="form-hint">AI model to use for code generation</span>
               </div>
 
               <!-- Advanced Settings -->
diff --git a/src/ai_dom_editor/settings/ai_settings.js b/src/ai_dom_editor/settings/ai_settings.js
@@ -55,6 +55,7 @@ class AISettings {
   }
 
   async init() {
+    window.applyTheme();
     await this.loadSettings();
     this.setupEventListeners();
     feather.replace();
diff --git a/src/editor/editor.js b/src/editor/editor.js
@@ -335,7 +335,7 @@ class ScriptEditor {
     }
       this.setupBackgroundConnection();
       this.codeEditorManager.updateEditorLintAndAutocomplete();
-      this.applyTheme();
+      window.applyTheme();
 
       setTimeout(() => this.codeEditorManager.focus(), 100);
     } catch (error) {
@@ -470,25 +470,17 @@ class ScriptEditor {
       
       const { code, sourceUrl } = aiData;
 
-      console.log('📥 Loading AI-generated script...');
-
       // Validate and enhance the AI-generated script
       const enhanced = ScriptAnalyzer.validateAndEnhanceMetadata(code, {
         url: sourceUrl || '',
         hostname: sourceUrl ? new URL(sourceUrl).hostname : '',
         userPrompt: 'AI Generated Script'
       });
-
-      // Log detected APIs and any warnings
-      console.log('🔍 Analysis complete:');
-      console.log('  📊 Detected GM APIs:', Object.keys(enhanced.detectedApis || {}).length);
       
       if (enhanced.warnings && enhanced.warnings.length > 0) {
-        console.log('  ⚠️ Issues found and fixed:');
         enhanced.warnings.forEach(warning => {
-          console.log(`    - ${warning.message}`);
           if (warning.suggestion) {
-            console.log(`      💡 ${warning.suggestion}`);
+            console.log(`       ${warning.suggestion}`);
           }
         });
         
@@ -516,9 +508,8 @@ class ScriptEditor {
       // Clean up storage
       await chrome.storage.local.remove(key);
       
-      console.log('✅ AI script loaded successfully');
     } catch (err) {
-      console.error('❌ Error loading AI script:', err);
+      console.error('Error loading AI script:', err);
       this.ui.showStatusMessage('Failed to load AI-generated script', 'error');
     }
   }
diff --git a/src/utils/theme_manager.js b/src/utils/theme_manager.js
@@ -1,9 +1,9 @@
-function applyTheme() {
+window.applyTheme = function() {
   chrome.storage.local.get('settings', function(result) {
     if (result.settings && result.settings.accentColor) {
       document.documentElement.style.setProperty('--accent-color', result.settings.accentColor);
     } else {
       document.documentElement.style.setProperty('--accent-color', '#007bff');
     }
   });
-}
+}

Original file line number	Diff line number	Diff line change
`@@ -55,6 +55,7 @@ class AISettings {`
`55`	`55`	`}`
`56`	`56`
`57`	`57`	`async init() {`
	`58`	`+ window.applyTheme();`
`58`	`59`	`await this.loadSettings();`
`59`	`60`	`this.setupEventListeners();`
`60`	`61`	`feather.replace();`