jason/ThunderAI
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement dynamic rendering of ChatGPT web model options in settings

Browse source
This commit is contained in:
Mic 2025-04-16 23:29:00 +02:00
parent ed666cfd87
commit a05cb2d4d7
2 changed files with 55 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
options/mzta-options.html
View file

@ -123,7 +123,7 @@
<tr class="conntype_chatgpt_web">
<td><label>
<span>__MSG_prefs_OptionText_chatgpt_web_model__</span>
<br><table title="__MSG_prefs_OptionText_chatgpt_web_model_tooltip__"><tr><td><i class="small_info"><nobr>__MSG_AllowedValues__:</nobr></i></td><td><i class="small_info"> &nbsp; <nobr class="conntype_chatgpt_web_option">gpt-4o</nobr> &nbsp; <nobr class="conntype_chatgpt_web_option">gpt-4o-mini</nobr> &nbsp; <nobr class="conntype_chatgpt_web_option">gpt-4</nobr> &nbsp; <nobr class="conntype_chatgpt_web_option">o1</nobr> &nbsp; <nobr class="conntype_chatgpt_web_option">o3-mini</nobr> &nbsp; <nobr class="conntype_chatgpt_web_option">o3-mini-high</nobr></i></td></tr></table>
<br><table title="__MSG_prefs_OptionText_chatgpt_web_model_tooltip__"><tr id="chatgpt_web_models_list"></tr></table>
</label></td>
<td>
<label>

62
options/mzta-options.js
View file

@ -28,6 +28,8 @@ let taLog = new taLogger("mzta-options",true);
let _isThunderbird128OrGreater = true;
let permission_all_urls = false;
const ChatGPTWeb_models = ['gpt-4o', 'gpt-4o-mini', 'gpt-4', 'o1', 'o3-mini', 'o3-mini-high'];
function saveOptions(e) {
e.preventDefault();
let options = {};
@ -309,6 +311,48 @@ async function disable_GetCalendarEvent(){
no_sparks_tr.style.display = (is_spark_present || (conntype_select.value === "chatgpt_web")) ? 'none' : 'table-row';
}
function getChatGPTWebModelsList_HTML(values, targetRowId) {
const rowElement = document.getElementById(targetRowId);
if (!rowElement) return;
// Clears any existing td elements
rowElement.innerHTML = '';
// First TD: label
const labelTd = document.createElement('td');
const label = document.createElement('i');
label.className = 'small_info';
const labelNobr = document.createElement('nobr');
labelNobr.textContent = browser.i18n.getMessage("AllowedValues") + ":";
label.appendChild(labelNobr);
labelTd.appendChild(label);
// Second TD: values
const valuesTd = document.createElement('td');
const valuesContainer = document.createElement('i');
valuesContainer.className = 'small_info';
values.forEach(value => {
const nbspBefore = document.createTextNode(' \u00A0 '); // " &nbsp; "
const valueNobr = document.createElement('nobr');
valueNobr.className = 'conntype_chatgpt_web_option';
valueNobr.textContent = value;
const nbspAfter = document.createTextNode(' \u00A0 ');
valuesContainer.appendChild(nbspBefore);
valuesContainer.appendChild(valueNobr);
valuesContainer.appendChild(nbspAfter);
});
valuesTd.appendChild(valuesContainer);
// Adds the td elements to the row
rowElement.appendChild(labelTd);
rowElement.appendChild(valuesTd);
}
document.addEventListener('DOMContentLoaded', async () => {
await restoreOptions();
@ -327,14 +371,7 @@ document.addEventListener('DOMContentLoaded', async () => {
document.querySelectorAll(".option-input").forEach(element => {
element.addEventListener("change", saveOptions);
});
document.querySelectorAll(".conntype_chatgpt_web_option").forEach(element => {
element.addEventListener("click", () => {
let el = document.getElementById("chatgpt_web_model");
el.value = element.textContent;
el.dispatchEvent(new Event('change'), { bubbles: true });
});
});
let addtags_el = document.getElementById('add_tags');
let addtags_info_btn = document.getElementById('btnManageTagsInfo');
addtags_el.addEventListener('click', (event) => {
@ -456,6 +493,15 @@ document.addEventListener('DOMContentLoaded', async () => {
permission_all_urls = await messenger.permissions.request({ origins: ["<all_urls>"] });
});
getChatGPTWebModelsList_HTML(ChatGPTWeb_models, 'chatgpt_web_models_list');
document.querySelectorAll(".conntype_chatgpt_web_option").forEach(element => {
element.addEventListener("click", () => {
let el = document.getElementById("chatgpt_web_model");
el.value = element.textContent;
el.dispatchEvent(new Event('change'), { bubbles: true });
});
});
let conntype_select = document.getElementById("connection_type");
conntype_select.addEventListener("change", showConnectionOptions);
conntype_select.addEventListener("change", warn_ChatGPT_APIKeyEmpty);