fix(hermes): make TTS button responsive on AI messages

- Add ID to voice select element for reliable access
- Fix TTS button click handler to find voice selection properly
- Add debugging logs for voice selection
- Use document.getElementById instead of variable scope
This commit is contained in:
Russell Ballestrini 2025-07-02 07:24:28 -04:00
parent af580c67ac
commit 8651aaa54a

View file

@ -662,18 +662,18 @@ async function openHermesModalNew() {
background: white;
`;
// Store models for selection handler
let loadedModels = [];
// Load models
const loadModels = async () => {
try {
console.log("Loading models for Hermes modal...");
await fetchModelsFromEndpoints();
console.log("Models registry updated:", modelRegistry);
const models = await fetchModelsFromEndpoints();
console.log("Models loaded:", models);
loadedModels = models; // Store for selection handler
modelSelect.innerHTML = '';
// Get models from registry
const models = Object.values(modelRegistry);
console.log("Available models:", models);
if (models && models.length > 0) {
models.forEach(model => {
const option = document.createElement("option");
@ -709,12 +709,13 @@ async function openHermesModalNew() {
// Handle model selection changes
modelSelect.onchange = () => {
const selectedModel = modelSelect.value;
if (selectedModel && modelRegistry[selectedModel]) {
const selectedUniqueId = modelSelect.value;
const selectedModel = loadedModels.find(model => model.uniqueId === selectedUniqueId);
if (selectedModel) {
// Update the global model selection
localStorage.setItem('selectedModel', modelRegistry[selectedModel].modelName);
localStorage.setItem('selectedEndpoint', modelRegistry[selectedModel].endpointId);
console.log("Model changed to:", modelRegistry[selectedModel]);
localStorage.setItem('selectedModel', selectedModel.modelName);
localStorage.setItem('selectedEndpoint', selectedModel.endpointId);
console.log("Model changed to:", selectedModel);
}
};
@ -730,6 +731,7 @@ async function openHermesModalNew() {
voiceLabel.style.cssText = `display: block; margin-bottom: 8px; font-weight: 600; color: #495057;`;
const voiceSelect = document.createElement("select");
voiceSelect.id = "hermes-voice-select";
voiceSelect.style.cssText = `
width: 100%;
padding: 8px 12px;
@ -1006,7 +1008,11 @@ async function openHermesModalNew() {
transition: all 0.2s;
`;
ttsBtn.onclick = () => {
const selectedVoice = voiceSelect.value || 'alloy';
// Find voice selection from the modal by ID
const modalVoiceSelect = document.getElementById('hermes-voice-select');
const selectedVoice = modalVoiceSelect?.value || 'alloy';
console.log("TTS button clicked, using voice:", selectedVoice);
console.log("Found voice select:", modalVoiceSelect);
speakText(response, selectedVoice, 1.0);
};