correctly switching connectiontype in addtags page. see #438

This commit is contained in:
Mic 2025-09-03 22:48:00 +02:00
parent bf7fdd3739
commit 572b53df43
3 changed files with 38 additions and 9 deletions

View file

@ -45,7 +45,7 @@ export async function injectConnectionUI({
}
let tpl = `
<tr${tr_class ? ` class="${tr_class}"` : ''}>
<tr id="${selectId}_tr"${tr_class ? ` class="${tr_class}"` : ''}>
<td>
<label>
<span class="opt_title">__MSG_prefs_Connection_type__</span>
@ -828,6 +828,15 @@ export function updateWarnings() {
warn_Anthropic_VersionEmpty();
}
export function changeConnTypeRowColor(conntype_row, conntype_select) {
conntype_row.classList.toggle("conntype_chatgpt_web", (conntype_select.value === "chatgpt_web"));
conntype_row.classList.toggle("conntype_chatgpt_api", (conntype_select.value === "chatgpt_api"));
conntype_row.classList.toggle("conntype_ollama_api", (conntype_select.value === "ollama_api"));
conntype_row.classList.toggle("conntype_openai_comp_api", (conntype_select.value === "openai_comp_api"));
conntype_row.classList.toggle("conntype_google_gemini_api", (conntype_select.value === "google_gemini_api"));
conntype_row.classList.toggle("conntype_anthropic_api", (conntype_select.value === "anthropic_api"));
}
export function showConnectionOptions(conntype_select) {
let chatgpt_web_display = 'table-row';
let chatgpt_api_display = 'none';
@ -836,12 +845,7 @@ export function showConnectionOptions(conntype_select) {
let google_gemini_api_display = 'none';
let anthropic_api_display = 'none';
let parent = conntype_select.parentElement.parentElement.parentElement;
parent.classList.toggle("conntype_chatgpt_web", (conntype_select.value === "chatgpt_web"));
parent.classList.toggle("conntype_chatgpt_api", (conntype_select.value === "chatgpt_api"));
parent.classList.toggle("conntype_ollama_api", (conntype_select.value === "ollama_api"));
parent.classList.toggle("conntype_openai_comp_api", (conntype_select.value === "openai_comp_api"));
parent.classList.toggle("conntype_google_gemini_api", (conntype_select.value === "google_gemini_api"));
parent.classList.toggle("conntype_anthropic_api", (conntype_select.value === "anthropic_api"));
changeConnTypeRowColor(parent, conntype_select);
if (conntype_select.value === "chatgpt_web") {
chatgpt_web_display = 'table-row';
}else{

View file

@ -52,6 +52,10 @@ tr.specific_integration_sub td{
padding-left: 0.8em !important;
}
.specific_integration_sub{
display: none;
}
.btn_div{
width: 100%;
display: flex;

View file

@ -23,16 +23,18 @@ import { getPlaceholders } from "../../js/mzta-placeholders.js";
import { textareaAutocomplete } from "../../js/mzta-placeholders-autocomplete.js";
import { addTags_getExclusionList, addTags_setExclusionList } from "../../js/mzta-addatags-exclusion-list.js";
import { getAccountsList, normalizeStringList, isAPIKeyValue } from "../../js/mzta-utils.js";
import { injectConnectionUI, updateWarnings } from "../_lib/connection-ui.js";
import { injectConnectionUI, updateWarnings, changeConnTypeRowColor } from "../_lib/connection-ui.js";
let autocompleteSuggestions = [];
let taLog = new taLogger("mzta-addtags-page",true);
let conntype_select_id = 'add_tags_connection_type';
document.addEventListener('DOMContentLoaded', async () => {
try {
await injectConnectionUI({
afterTrId: 'connection_ui_anchor',
selectId: 'add_tags_connection_type',
tr_class: 'specific_integration_sub',
selectId: conntype_select_id,
no_chatgpt_web: true,
taLog: taLog
});
@ -46,6 +48,25 @@ document.addEventListener('DOMContentLoaded', async () => {
element.addEventListener("change", saveOptions);
});
let conntype_el = document.getElementById(conntype_select_id);
let add_tags_use_specific_integration_el = document.getElementById('add_tags_use_specific_integration');
let conntype_row = document.getElementById(conntype_select_id + '_tr');
add_tags_use_specific_integration_el.addEventListener('change', (event) => {
console.log(">>>>>>>>>>>>> conntype_el.value: " + conntype_el.value);
document.querySelectorAll(".specific_integration_sub").forEach(tr => {
tr.style.display = event.target.checked && tr.classList.contains('conntype_' + conntype_el.value) ? 'table-row' : 'none';
});
conntype_el.style.display = event.target.checked ? 'table-row' : 'none';
changeConnTypeRowColor(conntype_row, conntype_el);
});
console.log(">>>>>>>>>>>>> conntype_el.value: " + conntype_el.value);
document.querySelectorAll(".specific_integration_sub").forEach(tr => {
tr.style.display = add_tags_use_specific_integration_el.checked && tr.classList.contains('conntype_' + conntype_el.value) ? 'table-row' : 'none';
});
document.getElementById(conntype_select_id + '_tr').style.display = add_tags_use_specific_integration_el.checked ? 'table-row' : 'none';
changeConnTypeRowColor(conntype_row, conntype_el);
let addtags_textarea = document.getElementById('addtags_prompt_text');
let addtags_save_btn = document.getElementById('btn_save_prompt');
let addtags_reset_btn = document.getElementById('btn_reset_prompt');