diff --git a/index.html b/index.html
index 0196b9a..5c9f5e1 100644
--- a/index.html
+++ b/index.html
@@ -1,5 +1,6 @@
+
Audiobook Generator
@@ -7,60 +8,86 @@
<link href="bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
+
<body>
-<!-- Example Key for test usage: -->
-<!-- Example data: eins. zwei. drei. vier. fünf. sechs. sieben. acht. neun. zehn. -->
-<!-- Header Section -->
-<header>
- <h1>Text-to-Audio Converter</h1>
-</header>
+ <!-- Example Key for test usage: -->
+ <!-- Example data: eins. zwei. drei. vier. fünf. sechs. sieben. acht. neun. zehn. -->
+ <!-- Header Section -->
+ <header>
+ <h1>Text-to-Audio Converter</h1>
+ </header>
+
+ <!-- API Key Input Section -->
+ <div id="api-key-section">
+ <label for="api-key">Enter OpenAI API Key:</label>
+ <input type="text" id="api-key" name="api-key">
+ </div>
-<!-- API Key Input Section -->
-<div id="api-key-section">
- <label for="api-key">Enter OpenAI API Key:</label>
- <input type="text" id="api-key" name="api-key">
-</div>
+ <!-- File Upload and Text Input Section -->
+ <div id="input-section">
+ <input type="file" id="file-upload" name="file-upload">
+ <label for="file-upload">Upload .txt or .ePub File OR enter some text</label>
+ <textarea id="text-input" name="text-input" rows="10" cols="50"
+ placeholder="Paste or type text here"></textarea>
+ </div>
-<!-- File Upload and Text Input Section -->
-<div id="input-section">
- <input type="file" id="file-upload" name="file-upload">
- <label for="file-upload">Upload .txt or .ePub File OR enter some text</label>
- <textarea id="text-input" name="text-input" rows="10" cols="50" placeholder="Paste or type text here"></textarea>
-</div>
-<!-- Cost Estimation Section -->
-<div id="cost-estimation">
- <p id="cost-estimate-display">Estimated Cost for Conversion: $X.XX</p>
-</div>
+ <!-- Voice Section -->
+ <div id="voice-section">
+ <label for="voice">Choose your voice</label>
+ <select id="voice" class="form-select" aria-label="voice">
+ <option selected value="onyx">Onyx</option>
+ <option value="nova">Nova</option>
+ <option value="alloy">Alloy</option>
+ <option value="echo">Echo</option>
+ <option value="fable">Fable</option>
+ <option value="shimmer">Shimmer</option>
+ </select>
+ <p>
+ If you want to hear examples of the voices check out the
+ <a href="https://platform.openai.com/docs/guides/text-to-speech"
+ target="_blank">OpenAI documentation</a>.
+ </p>
+ </div>
-<!-- Audiobook Generation Section -->
-<div id="generate-section">
- <button id="generate-audiobook">Generate Audiobook</button>
-</div>
-<!-- Error Indicator (Hidden Initially) -->
-<div id="error-indicator" style="display: none;">
- <p style="color:red;">An error occured calling the OpenAI API: <br/>Are you sure that the entered key is valid and that there is enough credit balance on your account?</p>
-</div>
-<!-- Progress Indicator (Hidden Initially) -->
-<div id="progress-indicator" style="display: none;">
- <p>Converting...</p>
-</div>
+ <!-- Cost Estimation Section -->
+ <div id="cost-estimation">
+ <p id="cost-estimate-display">Estimated Cost for Conversion: $X.XX</p>
+ </div>
-<!-- Footer Section -->
-<footer>
- <p>
- By using this Text-to-Audio Converter / Audiobook Creator, you acknowledge that you have read and agreed to all terms and conditions outlined in the licenses and agreements of this repository. For more details, please visit
- <a href="https://github.com/TheMorpheus407/OpenAI-Audiobook-Generator" target="_blank">https://github.com/TheMorpheus407/OpenAI-Audiobook-Generator</a>.
- </p>
- <p>Get your OpenAI API Key <a href="https://platform.openai.com/api-keys">here</a>.</p>
- <p id="status">This will take some time... Make sure to not interrupt the process!</p>
- <p>Step 1: Creating TTS: <progress id="progressbar1" value="0" max="0"></progress></p>
- <p>Step 2: Creating your file: <progress id="progressbar2" value="0" max="0"></progress></p>
-</footer>
+ <!-- Audiobook Generation Section -->
+ <div id="generate-section">
+ <button id="generate-audiobook">Generate Audiobook</button>
+ </div>
+ <!-- Error Indicator (Hidden Initially) -->
+ <div id="error-indicator" style="display: none;">
+ <p style="color:red;">An error occured calling the OpenAI API: <br />Are you sure that the entered key is valid
+ and that there is enough credit balance on your account?</p>
+ </div>
+ <!-- Progress Indicator (Hidden Initially) -->
+ <div id="progress-indicator" style="display: none;">
+ <p>Converting...</p>
+ </div>
+ <!-- Footer Section -->
+ <footer>
+ <p>
+ By using this Text-to-Audio Converter / Audiobook Creator, you acknowledge that you have read and agreed to
+ all terms and conditions outlined in the licenses and agreements of this repository. For more details,
+ please visit
+ <a href="https://github.com/TheMorpheus407/OpenAI-Audiobook-Generator"
+ target="_blank">https://github.com/TheMorpheus407/OpenAI-Audiobook-Generator</a>.
+ </p>
+ <p>Get your OpenAI API Key <a href="https://platform.openai.com/api-keys" target="_blank">here</a>.</p>
+ <p id="status">This will take some time... Make sure to not interrupt the process!</p>
+ <p>Step 1: Creating TTS: <progress id="progressbar1" value="0" max="0"></progress></p>
+ <p>Step 2: Creating your file: <progress id="progressbar2" value="0" max="0"></progress></p>
+ </footer>
-<script src="jszip.min.js"></script>
-<script src="audiobuffer-to-wav.js"></script>
-<script src="main.js"></script>
+
+ <script src="jszip.min.js"></script>
+ <script src="audiobuffer-to-wav.js"></script>
+ <script src="main.js"></script>
</body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/main.js b/main.js
index 577efc6..6bb48bb 100644
--- a/main.js
+++ b/main.js
@@ -161,7 +161,7 @@ function callOpenAIAPI(segment, apiKey, callback) {
var data = JSON.stringify({
"model": "tts-1",
"input": segment,
- "voice": "onyx"
+ "voice": document.getElementById("voice").value
});
xhr.send(data);
}