diff --git a/frontend/css/style.css b/frontend/css/style.css
index aa364a7..30f0f35 100644
--- a/frontend/css/style.css
+++ b/frontend/css/style.css
@@ -65,12 +65,69 @@ main {
overflow: hidden;
font-size: 1rem;
margin-bottom: 0;
+ table-layout: fixed;
}
+
#dialog-items-table th, #dialog-items-table td {
- padding: 10px 12px;
- border-bottom: 1px solid #e3e3e3;
+ padding: 7px 10px;
+ border: 1px solid #ddd;
text-align: left;
+ vertical-align: middle;
+ font-weight: 400;
+ font-size: 0.97rem;
+ color: #2b2b2b;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
}
+
+
+/* Widen the Text/Duration column */
+#dialog-items-table th:nth-child(3), #dialog-items-table td:nth-child(3) {
+ min-width: 240px;
+ width: 40%;
+ font-weight: 400;
+ font-size: 1rem;
+}
+
+/* Make the Speaker (2nd) column narrower */
+#dialog-items-table th:nth-child(2), #dialog-items-table td:nth-child(2) {
+ width: 60px;
+ min-width: 60px;
+ max-width: 60px;
+ text-align: center;
+}
+
+/* Make the Actions (4th) column narrower */
+#dialog-items-table th:nth-child(4), #dialog-items-table td:nth-child(4) {
+ width: 60px;
+ min-width: 44px;
+ max-width: 60px;
+ text-align: center;
+}
+
+
+#dialog-items-table th:first-child, #dialog-items-table td.type-icon-cell {
+ width: 44px;
+ min-width: 36px;
+ max-width: 48px;
+ text-align: center;
+ padding-left: 0;
+ padding-right: 0;
+}
+
+.type-icon-cell {
+ text-align: center;
+ vertical-align: middle;
+}
+
+.dialog-type-icon {
+ font-size: 1.4em;
+ display: inline-block;
+ line-height: 1;
+ vertical-align: middle;
+}
+
#dialog-items-table th {
background: #f3f7fa;
color: #4a90e2;
diff --git a/frontend/js/app.js b/frontend/js/app.js
index afe1bda..7a5b856 100644
--- a/frontend/js/app.js
+++ b/frontend/js/app.js
@@ -136,7 +136,12 @@ function initializeDialogEditor() {
// Type column
const typeTd = document.createElement('td');
- typeTd.textContent = item.type === 'speech' ? 'Speech' : 'Silence';
+ typeTd.classList.add('type-icon-cell');
+ if (item.type === 'speech') {
+ typeTd.innerHTML = '🗣️';
+ } else {
+ typeTd.innerHTML = '🤫';
+ }
tr.appendChild(typeTd);
// Speaker column
@@ -301,23 +306,8 @@ function initializeDialogEditor() {
}
if (dialogItems.length === 0) {
alert('Please add at least one speech or silence line to the dialog.');
- return;
+ return; // Prevent further execution if no dialog items
}
-
- // Clear previous results and show loading/status
- if (generationLogPre) generationLogPre.textContent = 'Generating dialog...';
- if (audioPlayer) {
- audioPlayer.style.display = 'none';
- audioPlayer.src = ''; // Clear previous audio source
- }
- if (downloadZipLink) {
- downloadZipLink.style.display = 'none';
- downloadZipLink.href = '#';
- downloadZipLink.textContent = '';
- }
- if (zipArchivePlaceholder) zipArchivePlaceholder.style.display = 'block'; // Show placeholder
- if (resultsDisplaySection) resultsDisplaySection.style.display = 'block'; // Make sure it's visible
-
const payload = {
output_base_name: outputBaseName,
dialog_items: dialogItems.map(item => {
@@ -345,7 +335,10 @@ function initializeDialogEditor() {
if (generationLogPre) generationLogPre.textContent = result.log || 'No log output.';
if (result.concatenated_audio_url && audioPlayer) { // Check audioPlayer, not audioSource
- audioPlayer.src = result.concatenated_audio_url.startsWith('http') ? result.concatenated_audio_url : `${API_BASE_URL_FOR_FILES}${result.concatenated_audio_url}`;
+ // Cache-busting: append timestamp to force reload
+ let audioUrl = result.concatenated_audio_url.startsWith('http') ? result.concatenated_audio_url : `${API_BASE_URL_FOR_FILES}${result.concatenated_audio_url}`;
+ audioUrl += (audioUrl.includes('?') ? '&' : '?') + 't=' + Date.now();
+ audioPlayer.src = audioUrl;
audioPlayer.load(); // Call load() after setting new source
audioPlayer.style.display = 'block';
} else {