@@ -28,12 +28,16 @@ const translations = {
2828 availableVoices : "Available Voices" ,
2929 apiReference : "API Reference" ,
3030 queueStatus : "Queue Status" ,
31- activeRequests : "Active Requests" ,
31+ processingNow : "Processing Now" ,
32+ waitingInQueue : "Waiting in Queue" ,
33+ totalReported : "Total Reported" ,
3234 maxCapacity : "Maximum Capacity" ,
3335 noLoad : "No Load" ,
3436 lowLoad : "Low Load" ,
3537 mediumLoad : "Medium Load" ,
36- highLoad : "High Load"
38+ highLoad : "High Load" ,
39+ error : "Error" ,
40+ queueError : "Queue status unavailable"
3741 } ,
3842 zh : {
3943 title : "OpenAI TTS API 文档" ,
@@ -47,12 +51,16 @@ const translations = {
4751 availableVoices : "可用语音" ,
4852 apiReference : "API 参考" ,
4953 queueStatus : "队列状态" ,
50- activeRequests : "活动请求" ,
54+ processingNow : "正在处理" ,
55+ waitingInQueue : "队列等待" ,
56+ totalReported : "报告总数" ,
5157 maxCapacity : "最大容量" ,
5258 noLoad : "无负载" ,
5359 lowLoad : "低负载" ,
5460 mediumLoad : "中负载" ,
55- highLoad : "高负载"
61+ highLoad : "高负载" ,
62+ error : "错误" ,
63+ queueError : "队列状态不可用"
5664 }
5765} ;
5866
@@ -121,60 +129,95 @@ function updateLastUpdate() {
121129
122130// Function to update queue size with visual indicators
123131async function updateQueueSize ( ) {
132+ const processingTasksElement = document . getElementById ( 'processing-tasks' ) ;
133+ const waitingTasksElement = document . getElementById ( 'waiting-tasks' ) ;
134+ const totalTasksElement = document . getElementById ( 'total-tasks' ) ;
135+ const maxQueueSizeElement = document . getElementById ( 'max-queue-size' ) ;
136+ const queueProgressBar = document . getElementById ( 'queue-progress-bar' ) ;
137+ const statusIndicator = document . getElementById ( 'status-indicator' ) ;
138+ const queueLoadText = document . getElementById ( 'queue-load-text' ) ;
139+ const queueErrorTextElement = document . getElementById ( 'queue-error-text' ) ;
140+
124141 try {
125142 const response = await fetch ( '/api/queue-size' ) ;
126- if ( ! response . ok ) {
127- throw new Error ( `HTTP error! status: ${ response . status } ` ) ;
143+ // Don't throw immediately for non-200, as 500 might contain error info
144+ const data = await response . json ( ) ;
145+
146+ if ( ! response . ok || data . error ) {
147+ // Handle error reported by the API (e.g., inspection failure)
148+ console . error ( 'Error fetching queue size:' , data . error || `HTTP error! status: ${ response . status } ` ) ;
149+ showQueueErrorState ( data . error || `HTTP ${ response . status } ` ) ;
150+ return ; // Stop processing if there's an error
128151 }
129- const data = await response . json ( ) ;
130152
131- // Get elements
132- const queueSizeElement = document . getElementById ( 'queue-size' ) ;
133- const maxQueueSizeElement = document . getElementById ( 'max-queue-size' ) ;
134- const queueProgressBar = document . getElementById ( 'queue-progress-bar' ) ;
135- const statusIndicator = document . getElementById ( 'status-indicator' ) ;
136- const queueLoadText = document . getElementById ( 'queue-load-text' ) ;
153+ // Clear any previous error message
154+ if ( queueErrorTextElement ) {
155+ queueErrorTextElement . textContent = '' ;
156+ queueErrorTextElement . style . display = 'none' ;
157+ }
158+
159+ // Calculate waiting tasks
160+ const waitingTasks = data . reserved_tasks + data . scheduled_tasks ;
137161
138- // Check if elements exist before updating
139- if ( queueSizeElement ) queueSizeElement . textContent = data . queue_size ;
140- if ( maxQueueSizeElement ) maxQueueSizeElement . textContent = data . max_queue_size ;
162+ // Update text content
163+ if ( processingTasksElement ) processingTasksElement . textContent = data . active_tasks ;
164+ if ( waitingTasksElement ) waitingTasksElement . textContent = waitingTasks ;
165+ if ( totalTasksElement ) totalTasksElement . textContent = data . total_reported_by_workers ;
166+ if ( maxQueueSizeElement ) maxQueueSizeElement . textContent = data . max_queue_size_limit ;
141167
142- // Calculate load percentage
143- const loadPercentage = ( data . queue_size / data . max_queue_size ) * 100 ;
168+ // Calculate load percentage based on total reported tasks
169+ // Avoid division by zero if max_queue_size_limit is 0 or undefined
170+ const maxLimit = data . max_queue_size_limit || 1 ; // Use 1 to prevent division by zero
171+ const loadPercentage = ( data . total_reported_by_workers / maxLimit ) * 100 ;
144172
145- // Update progress bar if it exists
173+ // Update progress bar
146174 if ( queueProgressBar ) {
147175 queueProgressBar . style . width = `${ Math . min ( loadPercentage , 100 ) } %` ;
148176 }
149177
150- // Update status indicators if they exist
178+ // Update status indicators
151179 if ( statusIndicator && queueProgressBar && queueLoadText ) {
152180 updateLoadStatus ( loadPercentage ) ;
153181 }
154182
155183 } catch ( error ) {
156- console . error ( 'Error fetching queue size:' , error ) ;
157- // Show error state in UI if elements exist
158- const queueSizeElement = document . getElementById ( 'queue-size' ) ;
159- const maxQueueSizeElement = document . getElementById ( 'max-queue-size' ) ;
160- const queueProgressBar = document . getElementById ( 'queue-progress-bar' ) ;
161- const statusIndicator = document . getElementById ( 'status-indicator' ) ;
162- const queueLoadText = document . getElementById ( 'queue-load-text' ) ;
163-
164- if ( queueSizeElement ) queueSizeElement . textContent = '?' ;
165- if ( maxQueueSizeElement ) maxQueueSizeElement . textContent = '?' ;
166- if ( queueProgressBar ) queueProgressBar . style . width = '0%' ;
167- if ( statusIndicator ) {
168- statusIndicator . classList . remove ( 'indicator-low' , 'indicator-medium' , 'indicator-high' ) ;
169- statusIndicator . classList . add ( 'indicator-error' ) ;
170- }
171- if ( queueProgressBar ) {
172- queueProgressBar . classList . remove ( 'progress-low' , 'progress-medium' , 'progress-high' ) ;
173- }
174- if ( queueLoadText ) {
175- queueLoadText . classList . remove ( 'low-load' , 'medium-load' , 'high-load' ) ;
176- queueLoadText . textContent = 'Error' ;
177- }
184+ // Handle network errors or JSON parsing errors
185+ console . error ( 'Failed to fetch or parse queue size:' , error ) ;
186+ showQueueErrorState ( translations [ currentLang ] . queueError || 'Queue status unavailable' ) ;
187+ }
188+ }
189+
190+ // Function to display error state in the queue status UI
191+ function showQueueErrorState ( errorMessage ) {
192+ const processingTasksElement = document . getElementById ( 'processing-tasks' ) ;
193+ const waitingTasksElement = document . getElementById ( 'waiting-tasks' ) ;
194+ const totalTasksElement = document . getElementById ( 'total-tasks' ) ;
195+ const maxQueueSizeElement = document . getElementById ( 'max-queue-size' ) ;
196+ const queueProgressBar = document . getElementById ( 'queue-progress-bar' ) ;
197+ const statusIndicator = document . getElementById ( 'status-indicator' ) ;
198+ const queueLoadText = document . getElementById ( 'queue-load-text' ) ;
199+ const queueErrorTextElement = document . getElementById ( 'queue-error-text' ) ;
200+
201+ if ( processingTasksElement ) processingTasksElement . textContent = '?' ;
202+ if ( waitingTasksElement ) waitingTasksElement . textContent = '?' ;
203+ if ( totalTasksElement ) totalTasksElement . textContent = '?' ;
204+ if ( maxQueueSizeElement ) maxQueueSizeElement . textContent = '?' ;
205+
206+ if ( queueProgressBar ) {
207+ queueProgressBar . style . width = '0%' ;
208+ queueProgressBar . classList . remove ( 'progress-low' , 'progress-medium' , 'progress-high' ) ;
209+ }
210+ if ( statusIndicator ) {
211+ statusIndicator . classList . remove ( 'indicator-low' , 'indicator-medium' , 'indicator-high' ) ;
212+ statusIndicator . classList . add ( 'indicator-error' ) ;
213+ }
214+ if ( queueLoadText ) {
215+ queueLoadText . classList . remove ( 'low-load' , 'medium-load' , 'high-load' ) ;
216+ queueLoadText . textContent = translations [ currentLang ] . error || 'Error' ;
217+ }
218+ if ( queueErrorTextElement ) {
219+ queueErrorTextElement . textContent = errorMessage ;
220+ queueErrorTextElement . style . display = 'block' ;
178221 }
179222}
180223
0 commit comments