diff --git a/web/process.html b/web/process.html
index 266c736..a37fa5f 100644
--- a/web/process.html
+++ b/web/process.html
@@ -87,41 +87,7 @@
}
.input-area {
- background: #16213e;
- padding: 10px 20px;
- border-top: 1px solid #0f3460;
- display: flex;
- gap: 10px;
- }
-
- .input-area input {
- flex: 1;
- padding: 8px 12px;
- border: 1px solid #0f3460;
- border-radius: 4px;
- background: #1a1a2e;
- color: #eee;
- font-size: 14px;
- font-family: 'Consolas', 'Monaco', monospace;
- }
-
- .input-area input:focus {
- outline: none;
- border-color: #e94560;
- }
-
- .input-area button {
- padding: 8px 16px;
- background: #e94560;
- color: white;
- border: none;
- border-radius: 4px;
- cursor: pointer;
- font-size: 12px;
- }
-
- .input-area button:hover {
- background: #ff6b6b;
+ display: none;
}
.loading {
@@ -152,7 +118,6 @@
@@ -167,6 +132,7 @@
let fitAddon = null;
let ws = null;
let connected = false;
+ let inputBuffer = ''; // 缓存用户输入
// 初始化终端
function initTerminal() {
@@ -176,8 +142,8 @@
cursorBlink: true,
fontSize: 14,
fontFamily: '"Source Code Pro", "Courier New", monospace',
- letterSpacing: 0, // 禁用自动间距调整
- lineHeight: 1.2, // 调整行高
+ letterSpacing: 0,
+ lineHeight: 1.3,
theme: {
background: '#1a1a2e',
foreground: '#eee',
@@ -211,11 +177,49 @@
terminal.open(document.getElementById('terminal'));
fitAddon.fit();
+ // 监听终端输入事件
+ terminal.onData((data) => {
+ // 处理输入
+ if (data === '\r' || data === '\n') {
+ // 用户按了回车
+ if (inputBuffer) {
+ sendInput();
+ }
+ } else if (data === '\u007F') {
+ // 处理退格键
+ if (inputBuffer.length > 0) {
+ inputBuffer = inputBuffer.slice(0, -1);
+ terminal.write('\b \b');
+ }
+ } else if (data === '\u0003') {
+ // Ctrl+C - 中断
+ inputBuffer = '';
+ terminal.write('^C\r\n');
+ } else {
+ // 普通字符
+ inputBuffer += data;
+ terminal.write(data);
+ }
+ });
+
window.addEventListener('resize', () => {
fitAddon.fit();
});
}
+ // 发送输入到服务器
+ function sendInput() {
+ if (!inputBuffer) return;
+
+ const input = inputBuffer;
+ inputBuffer = '';
+
+ sendMessage({
+ type: 'input',
+ input: input
+ });
+ }
+
// 连接WebSocket
function connectWebSocket() {
const protocol = location.protocol === 'https:' ? 'wss:' : 'ws:';
@@ -233,13 +237,9 @@
terminal.clear();
terminal.writeln('\x1b[32m[✓] WebSocket 连接成功,游戏进程已启动\x1b[0m');
terminal.writeln('');
+ terminal.focus(); // 设置终端焦点以接收输入
}
- // 启用输入
- document.getElementById('game-input').disabled = false;
- document.getElementById('send-btn').disabled = false;
- document.getElementById('game-input').focus();
-
// 启动心跳
startHeartbeat();
};
@@ -279,8 +279,11 @@
}
switch (data.type) {
case 'output':
- // 进程输出 - 直接写入,游戏进程负责清屏
- terminal.write(data.text);
+ terminal.clear();
+ const lines = data.text.split('\n');
+ lines.forEach(line => {
+ terminal.writeln(line);
+ });
break;
case 'system':
@@ -312,28 +315,6 @@
return true;
}
- // 发送输入
- function sendInput() {
- const inputEl = document.getElementById('game-input');
- const input = inputEl.value;
- inputEl.value = '';
-
- if (!input) return;
-
- // 立即在终端显示用户输入(带换行)
- if (terminal) {
- terminal.writeln(input);
- }
-
- // 发送到服务器
- sendMessage({
- type: 'input',
- input: input
- });
-
- inputEl.focus();
- }
-
// 断开连接
function disconnect() {
if (ws) {
@@ -356,13 +337,6 @@
}
}
- // 键盘处理
- document.addEventListener('keypress', (e) => {
- if (e.key === 'Enter' && document.activeElement.id === 'game-input') {
- sendInput();
- }
- });
-
// 心跳保活
function startHeartbeat() {
setInterval(() => {