Updated AllTalk Extension to support AllTalk V2 1. Core Feature Addition: - Added AllTalk V1/V2 server version selection - Added RVC (Realistic Voice Conversion) support for V2 - RVC features are automatically disabled when V1 is selected 2. Code Improvements: - Replaced custom debounce implementation with shared utils.js debounce utility - Fixed linting issues: - Converted HTML attribute quotes in template literals to single quotes - Added trailing commas where required - Fixed console.error message formatting 3. New Settings/Properties Added: ```javascript server_version: 'v2' (default) rvc_character_voice: 'Disabled' rvc_character_pitch: '0' rvc_narrator_voice: 'Disabled' rvc_narrator_pitch: '0' ``` 4. Bug Fixes/Improvements: - Better error handling for RVC voice fetching - Improved URL handling for V1/V2 differences in API responses - Enhanced settings initialization and validation 5. Structural Changes: - Added RVC-specific UI elements and controls - Added version-specific logic for API endpoints - Improved settings synchronization between UI and backend **NOTE** On line 70 there is an eslint bypass: ```javascript // HTML template literals can trigger ESLint quotes warnings when quotes are used in HTML attributes. // Disabling quotes rule for this one line as it's a false positive with HTML template literals. // eslint-disable-next-line quotes let html = `<div class="at-settings-separator">AllTalk V2 Settings</div>`; ``` The reason is: 1. ESLint's quotes rule wants all strings to use single quotes 2. However, this is a template literal containing HTML, where double quotes are standard for attributes 3. I tried various solutions: - Using single quotes: `<div class='at-settings-separator'>` - Using double quotes: `<div class="at-settings-separator">` - Even tried escaping quotes But ESLint just kept flagging it as an error

e857db40fb49bcd9b2f6d784276988c32d893ec2

erew123 <35898566+erew123@users.noreply.github.com>

Signed
Parents: 3138252928875c0aeeb5130188c62f49b6501c47
1 files changed, +171 -212Ignore whitespace
public/scripts/extensions/tts/alltalk.js+171 -212
@@ -1,4 +1,5 @@
11import { doExtrasFetch, getApiUrl, modules } from '../../extensions.js';
2+import { debounce } from '../../utils.js';
23import { saveTtsProviderSettings } from './index.js';
34
45export { AllTalkTtsProvider };
@@ -13,7 +14,7 @@ class AllTalkTtsProvider {
1314 // Initialize with default settings if they are not already set
1415 this.settings = {
1516 provider_endpoint: this.settings.provider_endpoint || 'http://localhost:7851',
1617 server_version: this.settings.server_version || 'v2',
1718 language: this.settings.language || 'en',
1819 voiceMap: this.settings.voiceMap || {},
1920 at_generation_method: this.settings.at_generation_method || 'standard_generation',
@@ -24,7 +25,7 @@ class AllTalkTtsProvider {
2425 rvc_character_pitch: this.settings.rvc_character_pitch || '0',
2526 rvc_narrator_voice: this.settings.rvc_narrator_voice || 'Disabled',
2627 rvc_narrator_pitch: this.settings.rvc_narrator_pitch || '0',
2728 finetuned_model: this.settings.finetuned_model || 'false',
2829 };
2930 // Separate property for dynamically updated settings from the server
3031 this.dynamicSettings = {
@@ -63,161 +64,159 @@ class AllTalkTtsProvider {
6364 };
6465
6566 get settingsHtml() {
67+ // HTML template literals can trigger ESLint quotes warnings when quotes are used in HTML attributes.
68+ // Disabling quotes rule for this one line as it's a false positive with HTML template literals.
69+ // eslint-disable-next-line quotes
6670 let html = `<div class="at-settings-separator">AllTalk V2 Settings</div>`;
6771
6872 html += `<div class="'at-settings-row"'>
69-
73+ <div class='at-settings-option'>
70- <div class="at-settings-option">
74+ <label for='at_generation_method'>AllTalk TTS Generation Method</label>
71- <label for="at_generation_method">AllTalk TTS Generation Method</label>
75+ <select id='at_generation_method'>
72- <select id="at_generation_method">
76+ <option value='standard_generation'>Standard Audio Generation (AT Narrator - Optional)</option>
7377 <option value="standard_generation"'streaming_enabled'>StandardStreaming Audio Generation (AT Narrator - OptionalDisabled)</option>
74- <option value="streaming_enabled">Streaming Audio Generation (AT Narrator - Disabled)</option>
7578 </select>
7679 </div>
7780 </div>`;
7881
7982 html += `<div class="'at-settings-row"'>
80-
83+ <div class='at-settings-option'>
81- <div class="at-settings-option">
84+ <label for='at_narrator_enabled'>AT Narrator</label>
82- <label for="at_narrator_enabled">AT Narrator</label>
85+ <select id='at_narrator_enabled'>
83- <select id="at_narrator_enabled">
86+ <option value='true'>Enabled</option>
8487 <option value="true"'silent'>Enabled (Silenced)</option>
8588 <option value="silent"'false'>Enabled (Silenced)Disabled</option>
86- <option value="false">Disabled</option>
8789 </select>
8890 </div>
8991
9092 <div class="'at-settings-option"'>
9193 <label for="'at_narrator_text_not_inside"'>Text Not Inside * or " is</label>
9294 <select id="'at_narrator_text_not_inside"'>
9395 <option value="'character"'>Character</option>
9496 <option value="'narrator"'>Narrator</option>
9597 <option value="'silent"'>Silent</option>
9698 </select>
9799 </div>
98-
99100 </div>`;
100101
101102 html += `<div class="'at-settings-row"'>
102103 <div class="'at-settings-option"'>
103104 <label for="'narrator_voice"'>Narrator Voice</label>
104105 <select id="'narrator_voice"'>`;
105106 if (this.voices) {
106107 for (let voice of this.voices) {
107108 html += `<option value="'${voice.voice_id}"'>${voice.name}</option>`;
108109 }
109110 }
110111 html += `</select>
111112 </div>
112113 <div class="'at-settings-option"'>
113114 <label for="'language_options"'>Language</label>
114115 <select id="'language_options"'>`;
115116 for (let language in this.languageLabels) {
116117 html += `<option value="'${this.languageLabels[language]}"' ${this.languageLabels[language] === this.settings?.language ? 'selected="selected"' : ''}>${language}</option>`;
117118 }
118119 html += `</select>
119120 </div>
120121 </div>`;
121122
122123 html += `<div class="'at-settings-row"'>
123124 <div class="'at-settings-option"'>
124125 <label for="'rvc_character_voice"'>RVC Character</label>
125126 <select id="'rvc_character_voice"'>`;
126127 if (this.rvcVoices) {
127128 for (let rvccharvoice of this.rvcVoices) {
128129 html += `<option value="'${rvccharvoice.voice_id}"'>${rvccharvoice.name}</option>`;
129130 }
130131 }
131132 html += `</select>
132133 </div>
133134 <div class="'at-settings-option"'>
134135 <label for="'rvc_narrator_voice"'>RVC Narrator</label>
135136 <select id="'rvc_narrator_voice"'>`;
136137 if (this.rvcVoices) {
137138 for (let rvcnarrvoice of this.rvcVoices) {
138139 html += `<option value="'${rvcnarrvoice.voice_id}"'>${rvcnarrvoice.name}</option>`;
139140 }
140141 }
141142 html += `</select>
142143 </div>
143144</div>`;
144145
145- // Add the RVC pitch control row
146+ html += `<div class='at-settings-row'>
146147 html += `<div class="'at-settings-row"option'>
147- <div class="at-settings-option">
148+ <label for='rvc_character_pitch'>RVC Character Pitch</label>
148- <label for="rvc_character_pitch">RVC Character Pitch</label>
149+ <select id='rvc_character_pitch'>`;
149- <select id="rvc_character_pitch">`;
150150 for (let i = -24; i <= 24; i++) {
151151 const selected = i === 0 ? 'selected="selected"' : '';
152152 html += `<option value="'${i}"' ${selected}>${i}</option>`;
153153 }
154154 html += `</select>
155155 </div>
156156 <div class="'at-settings-option"'>
157157 <label for="'rvc_narrator_pitch"'>RVC Narrator Pitch</label>
158158 <select id="'rvc_narrator_pitch"'>`;
159159 for (let i = -24; i <= 24; i++) {
160160 const selected = i === 0 ? 'selected="selected"' : '';
161161 html += `<option value="'${i}"' ${selected}>${i}</option>`;
162162 }
163163 html += `</select>
164164 </div>
165165 </div>`;
166166
167167 html += `<div class="'at-model-endpoint-row"'>
168168 <div class="'at-model-option"'>
169169 <label for="'switch_model"'>Switch Model</label>
170170 <select id="'switch_model"'>
171171 <!-- Options will be dynamically populated -->
172172 </select>
173173 </div>
174174
175175 <div class="'at-endpoint-option"'>
176176 <label for="'at_server"'>AllTalk Endpoint:</label>
177177 <input id="'at_server"' type="'text"' class="'text_pole"' maxlength="'80"' value="'${this.settings.provider_endpoint}"'/>
178178 </div>
179179 </div>`;
180180
181181 html += `<div class="'at-settings-row"'>
182182 <div class="'at-settings-option"'>
183183 <label for="'server_version"'>AllTalk Server Version</label>
184184 <select id="'server_version"'>
185185 <option value="'v1"'>AllTalk V1</option>
186186 <option value="'v2"'>AllTalk V2</option>
187187 </select>
188188 </div>
189189 </div>`;
190190
191191 html += `<div class="'at-model-endpoint-row"'>
192192 <div class="'at-settings-option"'>
193193 <label for="'low_vram"'>Low VRAM</label>
194194 <input id="'low_vram"' type="'checkbox"'/>
195195 </div>
196196 <div class="'at-settings-option"'>
197197 <label for="'deepspeed"'>DeepSpeed</label>
198198 <input id="'deepspeed"' type="'checkbox"'/>
199199 </div>
200200 <div class="'at-settings-option status-option"'>
201201 <span>Status: <span id="'status_info"'>Ready</span></span>
202202 </div>
203203 <div class="'at-settings-option empty-option"'>
204204 <!-- This div remains empty for spacing -->
205205 </div>
206206</div>`;
207207
208-
208+ html += `<div class='at-website-row'>
209209 html += `<div class="'at-website-row"option'>
210- <div class="at-website-option">
210+ <span>AllTalk V2<a target='_blank' href='${this.settings.provider_endpoint}'>Config & Docs</a>.</span>
211- <span>AllTalk V2<a target="_blank" href="${this.settings.provider_endpoint}">Config & Docs</a>.</span>
212211 </div>
213212
214213 <div class="'at-website-option"'>
215214 <span>AllTalk <a target="'_blank"' href="'https://github.com/erew123/alltalk_tts/"'>Website</a>.</span>
216215 </div>
217216</div>`;
218217
219218 html += `<div class="'at-website-row"'>
220219<div class="'at-website-option"'>
221220<span>- If you <strong>change your TTS engine</strong> in AllTalk, you will need to <strong>Reload</strong> (button above) and re-select your voices.</span><br><br>
222221<span>- Assuming the server is <strong>Status: Ready</strong>, most problems will be resolved by hitting Reload and selecting voices that match the loaded TTS engine.</span><br><br>
223222<span>- <strong>Text-generation-webui</strong> users - Uncheck <strong>Enable TTS</strong> in the TGWUI interface, or you will hear 2x voices and file names being generated.</span>
@@ -258,7 +257,7 @@ class AllTalkTtsProvider {
258257 $('#rvc_character_voice').val(this.settings.rvc_character_voice);
259258 $('#rvc_narrator_voice').val(this.settings.rvc_narrator_voice);
260259 $('#rvc_character_pitch').val(this.settings.rvc_character_pitch);
261260 $('#rvc_narrator_pitch').val(this.settings.rvc_narrator_pitch);
262261
263262 console.debug('AllTalkTTS: Settings loaded');
264263 try {
@@ -273,7 +272,7 @@ class AllTalkTtsProvider {
273272 this.applySettingsToHTML();
274273 updateStatus('Ready');
275274 } catch (error) {
276275 console.error("'Error loading settings:"', error);
277276 updateStatus('Offline');
278277 }
279278 }
@@ -381,7 +380,7 @@ class AllTalkTtsProvider {
381380 name: filename,
382381 voice_id: filename,
383382 preview_url: null, // Preview URL will be dynamically generated
384383 lang: 'en', // Default language
385384 };
386385 });
387386 this.voices = voices; // Assign to the class property
@@ -393,7 +392,7 @@ class AllTalkTtsProvider {
393392 console.log('Skipping RVC voices fetch for V1 server');
394393 return [];
395394 }
396-
395+
397396 console.log('Fetching RVC Voices');
398397 try {
399398 const response = await fetch(`${this.settings.provider_endpoint}/api/rvcvoices`);
@@ -402,20 +401,20 @@ class AllTalkTtsProvider {
402401 console.error('Error text:', errorText);
403402 throw new Error(`HTTP ${response.status}: ${errorText}`);
404403 }
405-
404+
406405 const data = await response.json();
407406 if (!data || !data.rvcvoices) {
408407 console.error('Invalid data format:', data);
409408 throw new Error('Invalid data format received from /api/rvcvoices');
410409 }
411-
410+
412411 const voices = data.rvcvoices.map(filename => {
413412 return {
414413 name: filename,
415414 voice_id: filename,
416415 };
417416 });
418-
417+
419418 console.log('RVC voices:', voices);
420419 this.rvcVoices = voices; // Assign to the class property
421420 this.updateRvcVoiceDropdowns(); // Update UI after fetching voices
@@ -467,11 +466,11 @@ class AllTalkTtsProvider {
467466 // Handle all RVC-related elements
468467 const rvcElements = document.querySelectorAll('.rvc-setting');
469468 const isV2 = this.settings.server_version === 'v2';
470-
469+
471470 rvcElements.forEach(element => {
472471 element.style.display = isV2 ? 'block' : 'none';
473472 });
474-
473+
475474 // Update and disable/enable character voice dropdown
476475 const rvcCharacterVoiceSelect = document.getElementById('rvc_character_voice');
477476 if (rvcCharacterVoiceSelect) {
@@ -489,7 +488,7 @@ class AllTalkTtsProvider {
489488 }
490489 }
491490 }
492-
491+
493492 // Update and disable/enable narrator voice dropdown
494493 const rvcNarratorVoiceSelect = document.getElementById('rvc_narrator_voice');
495494 if (rvcNarratorVoiceSelect) {
@@ -507,13 +506,13 @@ class AllTalkTtsProvider {
507506 }
508507 }
509508 }
510-
509+
511510 // Update pitch inputs
512511 const characterPitch = document.getElementById('rvc_character_pitch');
513512 if (characterPitch) {
514513 characterPitch.disabled = !isV2;
515514 }
516-
515+
517516 const narratorPitch = document.getElementById('rvc_narrator_pitch');
518517 if (narratorPitch) {
519518 narratorPitch.disabled = !isV2;
@@ -602,7 +601,7 @@ class AllTalkTtsProvider {
602601 const languageSelect = document.getElementById('language_options');
603602 if (languageSelect) {
604603 // Ensure default language is set
605604 this.settings.language = this.settings.language || 'en';
606605
607606 languageSelect.innerHTML = '';
608607 for (let language in this.languageLabels) {
@@ -622,56 +621,54 @@ class AllTalkTtsProvider {
622621 //########################################//
623622
624623 setupEventListeners() {
625-
626- let debounceTimeout;
627- const debounceDelay = 1400; // Milliseconds
628-
629624 // Define the event handler function
630625 const onModelSelectChange = async (event) => {
631626 console.log("'Model select change event triggered"'); // Debugging statement
632627 const selectedModel = event.target.value;
633628 console.log(`Selected model: ${selectedModel}`); // Debugging statement
634- // Set status to Processing
635629 updateStatus('Processing');
636630 try {
637631 const response = await fetch(`${this.settings.provider_endpoint}/api/reload?tts_method=${encodeURIComponent(selectedModel)}`, {
638632 method: 'POST',
639633 });
640634 if (!response.ok) {
641635 throw new Error(`HTTP Error: ${response.status}`);
642636 }
643637 const data = await response.json();
644638 console.log("'POST response data:"', data); // Debugging statement
645- // Set status to Ready if successful
646639 updateStatus('Ready');
647640 } catch (error) {
648641 console.error("'POST request error:"', error); // Debugging statement
649- // Set status to Error in case of failure
650642 updateStatus('Error');
651643 }
652-
653- // Handle response or error
654644 };
655645
646+ // Switch Model Listener with debounce
647+ const modelSelect = document.getElementById('switch_model');
648+ if (modelSelect) {
649+ const debouncedModelSelectChange = debounce(onModelSelectChange, 1400);
650+ modelSelect.addEventListener('change', debouncedModelSelectChange);
651+ }
652+
656653 // AllTalk Server version change listener
657654 const serverVersionSelect = document.getElementById('server_version');
658655 if (serverVersionSelect) {
659656 serverVersionSelect.addEventListener('change', async (event) => {
660657 this.settings.server_version = event.target.value;
661- // Clear and refetch voices if needed
662658 if (event.target.value === 'v2') {
663659 await this.fetchRvcVoiceObjects();
664660 }
665661 this.updateRvcVoiceDropdowns();
666662 this.onSettingsChange();
667663 });
668664 }
669665
666+ // RVC Voice and Pitch listeners
670667 const rvcCharacterVoiceSelect = document.getElementById('rvc_character_voice');
671668 if (rvcCharacterVoiceSelect) {
672669 rvcCharacterVoiceSelect.addEventListener('change', (event) => {
673670 this.settings.rvccharacter_voice_gen = event.target.value;
674671 this.onSettingsChange(); // Save the settings after change
675672 });
676673 }
677674
@@ -679,7 +676,7 @@ class AllTalkTtsProvider {
679676 if (rvcNarratorVoiceSelect) {
680677 rvcNarratorVoiceSelect.addEventListener('change', (event) => {
681678 this.settings.rvcnarrator_voice_gen = event.target.value;
682679 this.onSettingsChange(); // Save the settings after change
683680 });
684681 }
685682
@@ -687,7 +684,7 @@ class AllTalkTtsProvider {
687684 if (rvcCharacterPitchSelect) {
688685 rvcCharacterPitchSelect.addEventListener('change', (event) => {
689686 this.settings.rvc_character_pitch = event.target.value;
690687 this.onSettingsChange(); // Save the settings after change
691688 });
692689 }
693690
@@ -695,59 +692,34 @@ class AllTalkTtsProvider {
695692 if (rvcNarratorPitchSelect) {
696693 rvcNarratorPitchSelect.addEventListener('change', (event) => {
697694 this.settings.rvc_narrator_pitch = event.target.value;
698695 this.onSettingsChange(); // Save the settings after change
699696 });
700- }
701-
702- const debouncedModelSelectChange = (event) => {
703- clearTimeout(debounceTimeout);
704- debounceTimeout = setTimeout(() => {
705- onModelSelectChange(event);
706- }, debounceDelay);
707- };
708-
709- // Switch Model Listener
710- const modelSelect = document.getElementById('switch_model');
711- if (modelSelect) {
712- // Remove the event listener if it was previously added
713- modelSelect.removeEventListener('change', debouncedModelSelectChange);
714- // Add the debounced event listener
715- modelSelect.addEventListener('change', debouncedModelSelectChange);
716697 }
717698
718699 // DeepSpeed Listener
719700 const deepspeedCheckbox = document.getElementById('deepspeed');
720701 if (deepspeedCheckbox) {
721702 deepspeedCheckbox.addEventListener('change',const handleDeepSpeedChange = async (event) => {
722703 const deepSpeedValue = event.target.checked ? 'True' : 'False';
723- // Set status to Processing
724704 updateStatus('Processing');
725705 try {
726706 const response = await fetch(`${this.settings.provider_endpoint}/api/deepspeed?new_deepspeed_value=${deepSpeedValue}`, {
727707 method: 'POST',
728708 });
729709 if (!response.ok) {
730710 throw new Error(`HTTP Error: ${response.status}`);
731711 }
732712 const data = await response.json();
733713 console.log("'POST response data:"', data); // Debugging statement
734- // Set status to Ready if successful
735714 updateStatus('Ready');
736715 } catch (error) {
737716 console.error("'POST request error:"', error); // Debugging statement
738- // Set status to Error in case of failure
739717 updateStatus('Error');
740718 }
741- });
742- }
743-
744- function lowvramdebounce(func, delay) {
745- let debounceTimer;
746- return function (...args) {
747- const context = this;
748- clearTimeout(debounceTimer);
749- debounceTimer = setTimeout(() => func.apply(context, args), delay);
750719 };
720+
721+ const debouncedHandleDeepSpeedChange = debounce(handleDeepSpeedChange, 300);
722+ deepspeedCheckbox.addEventListener('change', debouncedHandleDeepSpeedChange);
751723 }
752724
753725 // Low VRAM Listener
@@ -755,38 +727,33 @@ class AllTalkTtsProvider {
755727 if (lowVramCheckbox) {
756728 const handleLowVramChange = async (event) => {
757729 const lowVramValue = event.target.checked ? 'True' : 'False';
758- // Set status to Processing
759730 updateStatus('Processing');
760731 try {
761732 const response = await fetch(`${this.settings.provider_endpoint}/api/lowvramsetting?new_low_vram_value=${lowVramValue}`, {
762733 method: 'POST',
763734 });
764735 if (!response.ok) {
765736 throw new Error(`HTTP Error: ${response.status}`);
766737 }
767738 const data = await response.json();
768739 console.log("'POST response data:"', data); // Debugging statement
769- // Set status to Ready if successful
770740 updateStatus('Ready');
771741 } catch (error) {
772742 console.error("'POST request error:"', error); // Debugging statement
773- // Set status to Error in case of failure
774743 updateStatus('Error');
775744 }
776745 };
777746
778747 const debouncedHandleLowVramChange = lowvramdebouncedebounce(handleLowVramChange, 300); // Adjust delay as needed
779-
780748 lowVramCheckbox.addEventListener('change', debouncedHandleLowVramChange);
781749 }
782750
783-
751+ // Other listeners without debounce since they don't need it
784- // Narrator Voice Dropdown Listener
785752 const narratorVoiceSelect = document.getElementById('narrator_voice');
786753 if (narratorVoiceSelect) {
787754 narratorVoiceSelect.addEventListener('change', (event) => {
788755 this.settings.narrator_voice_gen = `${event.target.value}`;
789756 this.onSettingsChange(); // Save the settings after change
790757 });
791758 }
792759
@@ -794,7 +761,7 @@ class AllTalkTtsProvider {
794761 if (textNotInsideSelect) {
795762 textNotInsideSelect.addEventListener('change', (event) => {
796763 this.settings.text_not_inside = event.target.value;
797764 this.onSettingsChange(); // Save the settings after change
798765 });
799766 }
800767
@@ -809,15 +776,10 @@ class AllTalkTtsProvider {
809776 const narratorOption = event.target.value;
810777 this.settings.narrator_enabled = narratorOption;
811778
812- // Check if narrator is disabled
813779 const isNarratorDisabled = narratorOption === 'false';
814780 textNotInsideSelect.disabled = isNarratorDisabled;
815781 narratorVoiceSelect.disabled = isNarratorDisabled;
816782
817- console.log(`Narrator option: ${narratorOption}`);
818- console.log(`textNotInsideSelect disabled: ${textNotInsideSelect.disabled}`);
819- console.log(`narratorVoiceSelect disabled: ${narratorVoiceSelect.disabled}`);
820-
821783 if (narratorOption === 'true') {
822784 ttsPassAsterisksCheckbox.checked = false;
823785 $('#tts_pass_asterisks').click();
@@ -842,47 +804,44 @@ class AllTalkTtsProvider {
842804 });
843805 }
844806
845-
846807 // Event Listener for AT Generation Method Dropdown
847808 const atGenerationMethodSelect = document.getElementById('at_generation_method');
848- const atNarratorEnabledSelect = document.getElementById('at_narrator_enabled');
849809 if (atGenerationMethodSelect) {
850810 atGenerationMethodSelect.addEventListener('change', (event) => {
851811 const selectedMethod = event.target.value;
852812
853813 if (selectedMethod === 'streaming_enabled') {
854814 // Disable and unselect AT Narrator
855815 atNarratorEnabledSelectatNarratorSelect.disabled = true;
856816 atNarratorEnabledSelectatNarratorSelect.value = 'false';
857817 textNotInsideSelect.disabled = true;
858818 narratorVoiceSelect.disabled = true;
859819 } else if (selectedMethod === 'standard_generation') {
860820 // Enable AT Narrator
861821 atNarratorEnabledSelectatNarratorSelect.disabled = false;
862822 }
863823 this.settings.at_generation_method = selectedMethod; // Update the setting here
864824 this.onSettingsChange(); // Save the settings after change
865825 });
866826 }
867827
868828 // Listener for Language Dropdown Listener
869829 const languageSelect = document.getElementById('language_options');
870830 if (languageSelect) {
871831 languageSelect.addEventListener('change', (event) => {
872832 this.settings.language = event.target.value;
873833 this.onSettingsChange(); // Save the settings after change
874834 });
875835 }
876836
877837 // Listener for AllTalk Endpoint Input Listener
878838 const atServerInput = document.getElementById('at_server');
879839 if (atServerInput) {
880840 atServerInput.addEventListener('input', (event) => {
881841 this.settings.provider_endpoint = event.target.value;
882842 this.onSettingsChange(); // Save the settings after change
883843 });
884844 }
885-
886845 }
887846
888847 //#############################//
@@ -900,7 +859,7 @@ class AllTalkTtsProvider {
900859 this.settings.rvc_character_voice = $('#rvc_character_voice').val();
901860 this.settings.rvc_narrator_voice = $('#rvc_narrator_voice').val();
902861 this.settings.rvc_character_pitch = $('#rvc_character_pitch').val();
903862 this.settings.rvc_narrator_pitch = $('#rvc_narrator_pitch').val();
904863 this.settings.narrator_voice_gen = $('#narrator_voice').val();
905864 // Save the updated settings
906865 saveTtsProviderSettings();
@@ -931,44 +890,44 @@ class AllTalkTtsProvider {
931890 try {
932891 // Prepare data for POST request
933892 const postData = new URLSearchParams();
934893 postData.append("'voice"', `${voiceName}`);
935-
894+
936895 // Add RVC parameters for V2 if applicable
937896 if (this.settings.server_version === 'v2' && this.settings.rvc_character_voice !== 'Disabled') {
938897 postData.append("'rvccharacter_voice_gen"', this.settings.rvc_character_voice);
939898 postData.append("'rvccharacter_pitch"', this.settings.rvc_character_pitch || "'0"');
940899 }
941-
900+
942901 // Making the POST request
943902 const response = await fetch(`${this.settings.provider_endpoint}/api/previewvoice/`, {
944903 method: "'POST"',
945904 headers: {
946905 'Content-Type': 'application/x-www-form-urlencoded',
947906 },
948907 body: postData,
949908 });
950-
909+
951910 if (!response.ok) {
952911 const errorText = await response.text();
953912 console.error(`['previewTtsVoice] Error Response Text:`', errorText);
954913 throw new Error(`HTTP ${response.status}: ${errorText}`);
955914 }
956-
915+
957916 const data = await response.json();
958917 if (data.output_file_url) {
959918 // Handle V1/V2 URL differences
960919 const fullUrl = this.settings.server_version === 'v1'
961920 ? data.output_file_url
962921 : `${this.settings.provider_endpoint}${data.output_file_url}`;
963-
922+
964923 const audioElement = new Audio(fullUrl);
965924 audioElement.play().catch(e => console.error("'Error playing audio:"', e));
966925 } else {
967926 console.warn("['previewTtsVoice] No output file URL received in the response"');
968927 throw new Error("'No output file URL received in the response"');
969928 }
970929 } catch (error) {
971930 console.error("['previewTtsVoice] Exception caught during preview generation:"', error);
972931 throw error;
973932 }
974933 }
@@ -1003,7 +962,7 @@ class AllTalkTtsProvider {
1003962 if (this.settings.at_generation_method === 'streaming_enabled') {
1004963 // Construct the streaming URL
1005964 const streamingUrl = `${this.settings.provider_endpoint}/api/tts-generate-streaming?text=${encodeURIComponent(inputText)}&voice=${encodeURIComponent(voiceId)}&language=${encodeURIComponent(this.settings.language)}&output_file=stream_output.wav`;
1006965 console.log("'Streaming URL:"', streamingUrl);
1007966
1008967 // Return the streaming URL directly
1009968 return streamingUrl;
@@ -1017,7 +976,7 @@ class AllTalkTtsProvider {
1017976 return audioResponse; // Return the fetch response directly
1018977 }
1019978 } catch (error) {
1020979 console.error("'Error in generateTts:"', error);
1021980 throw error;
1022981 }
1023982 }
@@ -1030,30 +989,30 @@ class AllTalkTtsProvider {
1030989 async fetchTtsGeneration(inputText, voiceId) {
1031990 const requestBody = new URLSearchParams({
1032991 'text_input': inputText,
1033992 'text_filtering': "'standard"',
1034993 'character_voice_gen': voiceId,
1035994 'narrator_enabled': this.settings.narrator_enabled,
1036995 'narrator_voice_gen': this.settings.narrator_voice_gen,
1037996 'text_not_inside': this.settings.at_narrator_text_not_inside,
1038997 'language': this.settings.language,
1039998 'output_file_name': "'st_output"',
1040999 'output_file_timestamp': "'true"',
10411000 'autoplay': "'false"',
10421001 'autoplay_volume': "'0.8"',
10431002 });
1044-
1003+
10451004 // Add RVC parameters only for V2
10461005 if (this.settings.server_version === 'v2') {
10471006 if (this.settings.rvc_character_voice !== 'Disabled') {
10481007 requestBody.append('rvccharacter_voice_gen', this.settings.rvc_character_voice);
10491008 requestBody.append('rvccharacter_pitch', this.settings.rvc_character_pitch || "'0"');
10501009 }
10511010 if (this.settings.rvc_narrator_voice !== 'Disabled') {
10521011 requestBody.append('rvcnarrator_voice_gen', this.settings.rvc_narrator_voice);
10531012 requestBody.append('rvcnarrator_pitch', this.settings.rvc_narrator_pitch || "'0"');
10541013 }
10551014 }
1056-
1015+
10571016 try {
10581017 const response = await doExtrasFetch(
10591018 `${this.settings.provider_endpoint}/api/tts-generate`,
@@ -1063,25 +1022,25 @@ class AllTalkTtsProvider {
10631022 'Content-Type': 'application/x-www-form-urlencoded',
10641023 'Cache-Control': 'no-cache',
10651024 },
10661025 body: requestBody,
10671026 },
10681027 );
1069-
1028+
10701029 if (!response.ok) {
10711030 const errorText = await response.text();
10721031 console.error(`['fetchTtsGeneration] Error Response Text:`', errorText);
10731032 throw new Error(`HTTP ${response.status}: ${errorText}`);
10741033 }
10751034 const data = await response.json();
1076-
1035+
10771036 // Handle V1/V2 URL differences
10781037 const outputUrl = this.settings.server_version === 'v1'
10791038 ? data.output_file_url // V1 returns full URL
10801039 : `${this.settings.provider_endpoint}${data.output_file_url}`; // V2 returns relative path
1081-
1040+
10821041 return outputUrl;
10831042 } catch (error) {
10841043 console.error("'[fetchTtsGeneration] Exception caught:"', error);
10851044 throw error;
10861045 }
10871046 }