Manage the options when using the API. Fixes #93

_locales/de/messages.json

@@ -386,5 +386,21 @@
   "customprompts_form_label_define_response_lang": {
     "message": "Definieren Sie die Antwortsprache im Prompt.",
     "description": ""
+  },
+  "prefs_Connection_type": {
+  "message": "Verbindungstyp",
+  "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_Web": {
+    "message": "ChatGTP Weboberfläche",
+    "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_API": {
+    "message": "ChatGTP OpenAI API",
+    "description": ""
+  },
+  "prefs_prefs_ChatGPT_API_Key": {
+    "message": "ChatGPT API-Schlüssel",
+    "description": ""
   }
 }

_locales/en/messages.json

@@ -386,5 +386,21 @@
   "customprompts_form_label_define_response_lang": {
     "message": "Define the reponse languange in the prompt",
     "description": ""
+  },
+  "prefs_Connection_type": {
+    "message": "Connection Type",
+    "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_Web": {
+    "message": "ChatGTP Web Interface",
+    "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_API": {
+    "message": "ChatGTP OpenAI API",
+    "description": ""
+  },
+  "prefs_prefs_ChatGPT_API_Key": {
+    "message": "ChatGPT API Key",
+    "description": ""
   }
 }

_locales/fr/messages.json

@@ -386,5 +386,21 @@
   "customprompts_form_label_define_response_lang": {
     "message": "Définir la langue de réponse dans le prompt.",
     "description": ""
+  },
+  "prefs_Connection_type": {
+  "message": "Type de connexion",
+  "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_Web": {
+    "message": "Interface Web ChatGTP",
+    "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_API": {
+    "message": "API OpenAI ChatGTP",
+    "description": ""
+  },
+  "prefs_prefs_ChatGPT_API_Key": {
+    "message": "Clé API ChatGPT",
+    "description": ""
   }
 }

_locales/it/messages.json

@@ -386,5 +386,21 @@
   "customprompts_form_label_define_response_lang": {
     "message": "Definisci la lingua di risposta nel prompt.",
     "description": ""
+  },
+  "prefs_Connection_type": {
+  "message": "Tipo di connessione",
+  "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_Web": {
+    "message": "Interfaccia Web ChatGTP",
+    "description": ""
+  },
+  "prefs_Connection_type_ChatGTP_API": {
+    "message": "API OpenAI per ChatGTP",
+    "description": ""
+  },
+  "prefs_prefs_ChatGPT_API_Key": {
+    "message": "Chiave API ChatGPT",
+    "description": ""
   }
 }

mzta-background.js

@@ -147,7 +147,8 @@ async function openChatGPT(promptText, action, curr_tabId, prompt_name = '', do_
         return;
     }
 
-    if(!prefs.api_active){
+    switch(prefs.connection_type){
+        case 'chatgpt_web':
         // We are using the ChatGPT web interface
         let newWindow = await browser.windows.create({
             url: "https://chatgpt.com",
@@ -198,34 +199,35 @@ async function openChatGPT(promptText, action, curr_tabId, prompt_name = '', do_
             .catch(err => {
                 console.error("[ThunderAI] ChatGPT web interface error injecting the script: ", err);
             });
-    }else{
+    break;  // chatgpt_web
+    case 'chatgpt_api':
         // We are using the ChatGPT API
-        let newWindow = await browser.windows.create({
+        let newWindow2 = await browser.windows.create({
             url: browser.runtime.getURL('api_webchat/index.html'),
             type: "popup",
             width: prefs.chatgpt_win_width,
             height: prefs.chatgpt_win_height
         });
 
-        createdWindowID = newWindow.id;
+        createdWindowID = newWindow2.id;
-        let createdTab = newWindow.tabs[0];
+        let createdTab2 = newWindow2.tabs[0];
 
         // Wait for tab loaded.         // TODO This is needed in 128+, but doesn't work in 115
         // await new Promise(resolve => {
-        //     const tabIsLoaded = tab => {
+        //     const tabIsLoaded2 = tab => {
         //         return tab.status == "complete" && tab.url != "about:blank";
         //     };
-        //     const listener = (tabId, changeInfo, updatedTab) => {
+        //     const listener2 = (tabId, changeInfo, updatedTab) => {
-        //         if (tabIsLoaded(updatedTab)) {
+        //         if (tabIsLoaded2(updatedTab)) {
-        //             browser.tabs.onUpdated.removeListener(listener);
+        //             browser.tabs.onUpdated.removeListener(listener2);
         //             resolve();
         //         }
         //     }
         //     // Early exit if loaded already
-        //     if (tabIsLoaded(createdTab)) {
+        //     if (tabIsLoaded2(createdTab2)) {
         //         resolve();
         //     } else {
-        //         browser.tabs.onUpdated.addListener(listener);
+        //         browser.tabs.onUpdated.addListener(listener2);
         //     }
         // });
 
@@ -233,7 +235,8 @@ async function openChatGPT(promptText, action, curr_tabId, prompt_name = '', do_
         let mailMessageId = -1;
         if(mailMessage) mailMessageId = mailMessage.id;
 
-        browser.tabs.sendMessage(createdTab.id, { command: "chatgpt_send", prompt: promptText, action: action, tabId: curr_tabId, mailMessageId: mailMessageId});
+        browser.tabs.sendMessage(createdTab2.id, { command: "chatgpt_send", prompt: promptText, action: action, tabId: curr_tabId, mailMessageId: mailMessageId});
+        break;  // chatgpt_api
     }
 }
 

options/mzta-options-default.js

@@ -22,6 +22,6 @@ export const prefs_default = {
     chatpgt_use_gpt4: false,
     chatgpt_keep_formatting: false,
     default_chatgpt_lang: '',
-    api_active: false,
+    connection_type: 'chatgpt_web',     //Other values: 'chatgpt_api'
     api_key_chatgpt: '',
 }

options/mzta-options.html

@@ -6,7 +6,7 @@
   </head>
   <body>
     <div id="miczRelNotes"><a href="mzta-release-notes.html">__MSG_prefs_OptionText_release_notes__</a></div>
-    <div id="miczStatusPage"><a href="https://micz.it/thunderbird-addon-thunderai/status/">__MSG_prefs_status_page__</a></div>
+    <div id="miczStatusPage" class="conntype_chatgpt_web"><a href="https://micz.it/thunderbird-addon-thunderai/status/">__MSG_prefs_status_page__</a></div>
     <table id="miczPrefs">
       <tr>
         <td><span>__MSG_prefs_OptionText_chatgpt_win_text__</span></td>
@@ -60,6 +60,22 @@
         </td>
       </tr>
       <tr>
+        <td>
+          <label>
+            <span>__MSG_prefs_Connection_type__</span>
+          </label>
+        </td>
+        <td>
+          <label>
+            <select id="connection_type" name="connection_type" class="option-input">
+              <option value="chatgpt_web">__MSG_prefs_Connection_type_ChatGTP_Web__</option>
+              <option value="chatgpt_api">__MSG_prefs_Connection_type_ChatGTP_API__</option>
+            </select>
+          </label>
+        </td>
+      </tr>
+      <tr>
+      <tr class="conntype_chatgpt_web">
         <td><label>
           <span>__MSG_prefs_OptionText_chatpgt_keep_formatting__</span>
         </label></td>
@@ -70,7 +86,7 @@
           </label>
         </td>
       </tr>
-      <tr>
+      <tr class="conntype_chatgpt_web">
         <td><label>
           <span>__MSG_prefs_OptionText_chatpgt_use_gpt4__</span>
         </label></td>
@@ -81,24 +97,13 @@
           </label>
         </td>
       </tr>
-      <tr>
+      <tr class="conntype_chatgpt_api">
         <td><label>
-          <span>API Activate</span>
+          <span>__MSG_prefs_ChatGPT_API_Key__</span>
         </label></td>
         <td>
           <label>
-            <input type="checkbox" id="api_active" name="api_active" class="option-input" />
+            <input type="text" id="api_key_chatgpt" name="api_key_chatgpt" class="option-input" style="width:28em" />
-            &nbsp;<span>Use that OpenAI API!</span>
-          </label>
-        </td>
-      </tr>
-      <tr>
-        <td><label>
-          <span>ChatGPT API Key</span>
-        </label></td>
-        <td>
-          <label>
-            <input type="text" id="api_key_chatgpt" name="api_key_chatgpt" class="option-input" />
             &nbsp;<span></span>
           </label>
         </td>

options/mzta-options.js

@@ -45,9 +45,10 @@ function saveOptions(e) {
   browser.storage.sync.set(options);
 }
 
-function restoreOptions() {
+async function restoreOptions() {
   function setCurrentChoice(result) {
     document.querySelectorAll(".option-input").forEach(element => {
+      //console.log("[ThunderAI] Options restoring " + element.id + " = " + result[element.id]);
       switch (element.type) {
         case 'checkbox':
           element.checked = result[element.id] || false;
@@ -67,6 +68,7 @@ function restoreOptions() {
         if (element.tagName === 'SELECT') {
           let default_select_value = '';
           if(element.id == 'reply_type') default_select_value = 'reply_all';
+          if(element.id == 'connection_type') default_select_value = 'chatgpt_web';
           element.value = result[element.id] || default_select_value;
           if (element.value === '') {
             element.selectedIndex = -1;
@@ -78,20 +80,47 @@ function restoreOptions() {
     });
   }
 
-  function onError(error) {
+  let getting = await browser.storage.sync.get(prefs_default);
-    console.log(`[ThunderAI] Error: ${error}`);
+  setCurrentChoice(getting);
-  }
-
-  let getting = browser.storage.sync.get(null);
-  getting.then(setCurrentChoice, onError);
 }
 
-document.addEventListener('DOMContentLoaded', () => {
+function showConnectionOptions() {
-  restoreOptions();
+  let chatgpt_web_display = 'table-row';
+  let chatgpt_api_display = 'none';
+  if (document.getElementById("connection_type").value === "chatgpt_web") {
+    chatgpt_web_display = 'table-row';
+  }else{
+    chatgpt_web_display = 'none';
+  }
+  if (document.getElementById("connection_type").value === "chatgpt_api") {
+    chatgpt_api_display = 'table-row';
+  }else{
+    chatgpt_api_display = 'none';
+  }
+  document.querySelectorAll(".conntype_chatgpt_web").forEach(element => {
+    element.style.display = chatgpt_web_display;
+  });
+  document.querySelectorAll(".conntype_chatgpt_api").forEach(element => {
+    element.style.display = chatgpt_api_display;
+  });
+}
+
+function warnAPIKeyEmpty() {
+  let apiKeyInput = document.getElementById('api_key_chatgpt');
+  if(apiKeyInput.value === ''){
+    apiKeyInput.style.border = '2px solid red';
+  }else{
+    apiKeyInput.style.border = 'none';
+  }
+}
+
+document.addEventListener('DOMContentLoaded', async () => {
+  await restoreOptions();
   i18n.updateDocument();
   document.querySelectorAll(".option-input").forEach(element => {
     element.addEventListener("change", saveOptions);
   });
+  showConnectionOptions();
   document.getElementById('btnManagePrompts').addEventListener('click', () => {
     // check if the tab is already there
     browser.tabs.query({url: browser.runtime.getURL('../customprompts/mzta-custom-prompts.html')}).then((tabs) => {
@@ -104,4 +133,7 @@ document.addEventListener('DOMContentLoaded', () => {
       }
     })
   });
+  document.getElementById("connection_type").addEventListener("change", showConnectionOptions);
+  document.getElementById("connection_type").addEventListener("change", warnAPIKeyEmpty);
+  document.getElementById("api_key_chatgpt").addEventListener("change", warnAPIKeyEmpty);
 }, { once: true });