refactor(test_page.html): 优化UI布局和输入提示，增加本地存储功能

- 在OTA和WebSocket服务器地址输入框中添加更详细的占位符提示
- 增加本地存储功能，保存并恢复OTA和WebSocket服务器地址

main/xiaozhi-server/test/test_page.html

@@ -14,7 +14,7 @@
         }
 
         .container {
-            max-width: 800px;
+            max-width: 1000px;
             margin: 0 auto;
             background-color: white;
             border-radius: 10px;
@@ -482,9 +482,10 @@
                 </span>
             </h2>
             <div class="connection-controls">
-                <input type="text" id="otaUrl" value="http://127.0.0.1:8002/xiaozhi/ota/" placeholder="OTA服务器地址" />
+                <input type="text" id="otaUrl" value="http://127.0.0.1:8002/xiaozhi/ota/"
+                    placeholder="OTA服务器地址，如：http://127.0.0.1:8002/xiaozhi/ota/" />
                 <input type="text" id="serverUrl" value="ws://127.0.0.1:8000/xiaozhi/v1/"
-                    placeholder="WebSocket服务器地址" />
+                    placeholder="WebSocket服务器地址，如：ws://127.0.0.1:8000/xiaozhi/v1/" />
                 <button id="connectButton">连接</button>
                 <button id="authTestButton">测试认证</button>
             </div>
@@ -1061,7 +1062,7 @@
             }
         }
 
-        // 初始化音频录制和处理 
+        // 初始化音频录制和处理
         async function initAudio() {
             try {
                 // 请求麦克风权限
@@ -1306,7 +1307,8 @@
                 // 先检查OTA状态
                 log('正在检查OTA状态...', 'info');
                 const otaUrl = document.getElementById('otaUrl').value.trim();
-
+                localStorage.setItem('otaUrl', otaUrl);
+                localStorage.setItem('wsUrl', url);
                 try {
                     const otaResponse = await fetch(otaUrl, {
                         method: 'POST',
@@ -1633,6 +1635,16 @@
             // 初始更新显示值
             updateDisplayValues();
 
+            const savedOtaUrl = localStorage.getItem('otaUrl');
+            if (savedOtaUrl) {
+                document.getElementById('otaUrl').value = savedOtaUrl;
+            }
+
+            const savedWsUrl = localStorage.getItem('wsUrl');
+            if (savedWsUrl) {
+                document.getElementById('serverUrl').value = savedWsUrl;
+            }
+
             // 切换面板显示
             toggleButton.addEventListener('click', () => {
                 const isExpanded = configPanel.classList.contains('expanded');
@@ -1954,7 +1966,7 @@
                     this.buffer = new Int16Array(this.frameSize);
                     this.bufferIndex = 0;
                     this.isRecording = false;
-                    
+
                     // 监听来自主线程的消息
                     this.port.onmessage = (event) => {
                         if (event.data.command === 'start') {
@@ -1962,7 +1974,7 @@
                             this.port.postMessage({ type: 'status', status: 'started' });
                         } else if (event.data.command === 'stop') {
                             this.isRecording = false;
-                            
+
                             // 发送剩余的缓冲区
                             if (this.bufferIndex > 0) {
                                 const finalBuffer = this.buffer.slice(0, this.bufferIndex);
@@ -1972,18 +1984,18 @@
                                 });
                                 this.bufferIndex = 0;
                             }
-                            
+
                             this.port.postMessage({ type: 'status', status: 'stopped' });
                         }
                     };
                 }
-                
+
                 process(inputs, outputs, parameters) {
                     if (!this.isRecording) return true;
-                    
+
                     const input = inputs[0][0]; // 获取第一个输入通道
                     if (!input) return true;
-                    
+
                     // 将浮点采样转换为16位整数并存储
                     for (let i = 0; i < input.length; i++) {
                         if (this.bufferIndex >= this.frameSize) {
@@ -1994,15 +2006,15 @@
                             });
                             this.bufferIndex = 0;
                         }
-                        
+
                         // 转换为16位整数 (-32768到32767)
                         this.buffer[this.bufferIndex++] = Math.max(-32768, Math.min(32767, Math.floor(input[i] * 32767)));
                     }
-                    
+
                     return true;
                 }
             }
-            
+
             registerProcessor('audio-recorder-processor', AudioRecorderProcessor);
         `;