111 lines
4.7 KiB
HTML
111 lines
4.7 KiB
HTML
<div id="options-modal" class="modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h2>Options</h2>
|
|
<span class="close">×</span>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<!-- TTS Section -->
|
|
<div class="options-section">
|
|
<h3>Text-to-Speech</h3>
|
|
|
|
<div class="option-item">
|
|
<label>Enable TTS:</label>
|
|
<input type="checkbox" id="tts-enabled" data-pref-bind="tts.enabled">
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>TTS System:</label>
|
|
<select id="tts-system" data-pref-bind="tts.preferred_handler"></select>
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>Voice:</label>
|
|
<select id="tts-voice" data-pref-bind="tts.voice"></select>
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>Speech:</label>
|
|
<span class="slider-value">100%</span>
|
|
<input type="range" id="tts-speed" min="50" max="200" value="100"
|
|
data-pref-bind="app.speed" data-pref-transform="range:0.5,2.0">
|
|
</div>
|
|
|
|
<!-- API Settings -->
|
|
<div id="api-settings" class="options-section" style="display: none;">
|
|
<!-- ElevenLabs Settings -->
|
|
<div class="api-settings eleven-labs-settings" style="display: none;">
|
|
<h3>ElevenLabs API Settings</h3>
|
|
|
|
<div class="option-item">
|
|
<label>API Key:</label>
|
|
<input type="password" id="elevenlabs-api-key" data-pref-bind="tts.elevenlabs-tts_api_key">
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>API URL:</label>
|
|
<input type="text" id="elevenlabs-api-url" data-pref-bind="tts.elevenlabs-tts_api_url">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- OpenAI Settings -->
|
|
<div class="api-settings openai-settings" style="display: none;">
|
|
<h3>OpenAI API Settings</h3>
|
|
|
|
<div class="option-item">
|
|
<label>API Key:</label>
|
|
<input type="password" id="openai-api-key" data-pref-bind="tts.openai-tts_api_key">
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>API URL:</label>
|
|
<input type="text" id="openai-api-url" data-pref-bind="tts.openai-tts_api_url">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Audio Section -->
|
|
<div class="options-section">
|
|
<h3>Audio</h3>
|
|
|
|
<div class="option-item">
|
|
<label>Master Volume:</label>
|
|
<span class="slider-value">100%</span>
|
|
<input type="range" id="master-volume" min="0" max="100" value="100"
|
|
data-pref-bind="audio.masterVolume" data-pref-transform="range:0,1">
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>Music Volume:</label>
|
|
<span class="slider-value">70%</span>
|
|
<input type="range" id="music-volume" min="0" max="100" value="70"
|
|
data-pref-bind="audio.musicVolume" data-pref-transform="range:0,1">
|
|
</div>
|
|
|
|
<div class="option-item">
|
|
<label>Sound Effects Volume:</label>
|
|
<span class="slider-value">100%</span>
|
|
<input type="range" id="sfx-volume" min="0" max="100" value="100"
|
|
data-pref-bind="audio.sfxVolume" data-pref-transform="range:0,1">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Language Section -->
|
|
<div class="options-section">
|
|
<h3>Language</h3>
|
|
|
|
<div class="option-item">
|
|
<label>Language:</label>
|
|
<select id="language" data-pref-bind="app.locale"></select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
<button id="close-options">Close</button>
|
|
</div>
|
|
</div>
|
|
</div>
|