Update TUI to v1.3 with enhanced conversion layer and dual UI architecture

- ai.md: Added comprehensive documentation for TUI v1.3 conversion layer with 64+ supported components, CSS styling, and JavaScript interaction capabilities - oss/tui/: Created complete TUI module with converter.py implementing HTML/CSS/JS to terminal conversion engine, supporting 40+ component types and advanced styling - oss/tui/plugin.py: Implemented TUI plugin with dual startup architecture accessing WebUI's /tui interface for HTML conversion and terminal rendering - store/@{NebulaShell}/webui/tui/: Added TUI package with converter, configuration files, and index.html for terminal interface - store/@{NebulaShell}/webui/core/server.py: Enhanced WebUI server with TUI interface endpoints (/tui/*) for providing special-marked HTML to conversion layer - store/@{NebulaShell}/webui/main.py: Updated WebUI plugin to support TUI dual launch with automatic homepage redirection and navigation integration - .gitignore: Updated ignore patterns for better project cleanliness The update provides a sophisticated terminal interface that automatically converts WebUI content through a powerful transformation layer, enabling seamless dual-mode operation.
2026-05-02 04:03:34 +00:00
parent 2c2ec60a2b
commit 9f7ca46f96
18 changed files with 4797 additions and 29 deletions
--- a/store/@{NebulaShell}/webui/tui/index.html
+++ b/store/@{NebulaShell}/webui/tui/index.html
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html class="tui-page" lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>NebulaShell TUI</title>
+    <!-- TUI 标记：此页面专为终端渲染设计 -->
+    <!-- 不包含任何给用户直接查看的内容，仅用于 TUI 转换层解析 -->
+</head>
+<body class="tui-body">
+    <!-- TUI 容器标记 -->
+    <div class="tui-container" data-tui-layout="vertical">
+        <!-- 标题区域 -->
+        <header class="tui-header" data-tui-style="bold">
+            NebulaShell TUI - 终端用户界面
+        </header>
+        
+        <!-- 状态栏 -->
+        <div class="tui-status" data-tui-style="dim">
+            WebUI: http://localhost:8080 | TUI: 双启动模式
+        </div>
+        
+        <!-- 导航菜单 - TUI 会转换为键盘快捷键 -->
+        <nav class="tui-nav" data-tui-type="keyboard">
+            <a href="/" data-tui-key="1" data-tui-action="navigate">[1] 首页</a>
+            <a href="/dashboard" data-tui-key="2" data-tui-action="navigate">[2] 仪表盘</a>
+            <a href="/logs" data-tui-key="3" data-tui-action="navigate">[3] 日志</a>
+            <a href="/terminal" data-tui-key="4" data-tui-action="navigate">[4] 终端</a>
+            <a href="/plugins" data-tui-key="5" data-tui-action="navigate">[5] 插件</a>
+            <a href="/settings" data-tui-key="6" data-tui-action="navigate">[6] 设置</a>
+        </nav>
+        
+        <!-- 分隔线 -->
+        <hr class="tui-separator" data-tui-char="─">
+        
+        <!-- 操作提示 -->
+        <footer class="tui-footer" data-tui-style="dim">
+            <p>快捷键说明:</p>
+            <ul>
+                <li data-tui-key="q">q - 退出 TUI</li>
+                <li data-tui-key="r">r - 刷新当前页</li>
+                <li data-tui-key="h">h - 显示帮助</li>
+                <li data-tui-key="↑/↓">↑/↓ - 上下导航</li>
+                <li data-tui-key="Enter">Enter - 确认选择</li>
+            </ul>
+        </footer>
+    </div>
+    
+    <!-- TUI 配置脚本 - 定义键盘映射和交互行为 -->
+    <script type="application/x-tui-config">
+    {
+        "keyboard": {
+            "1": {"action": "navigate", "target": "/"},
+            "2": {"action": "navigate", "target": "/dashboard"},
+            "3": {"action": "navigate", "target": "/logs"},
+            "4": {"action": "navigate", "target": "/terminal"},
+            "5": {"action": "navigate", "target": "/plugins"},
+            "6": {"action": "navigate", "target": "/settings"},
+            "q": {"action": "quit"},
+            "r": {"action": "refresh"},
+            "h": {"action": "help"},
+            "ArrowUp": {"action": "navigate_up"},
+            "ArrowDown": {"action": "navigate_down"},
+            "Enter": {"action": "select"}
+        },
+        "mouse": {
+            "enabled": false,
+            "click_action": "select"
+        },
+        "display": {
+            "width": 80,
+            "height": 24,
+            "theme": "dark",
+            "border_style": "single",
+            "colors": {
+                "header": "bold",
+                "normal": "default",
+                "dim": "dim",
+                "selected": "reverse"
+            }
+        }
+    }
+    </script>
+    
+    <!-- TUI CSS 标记 - 仅包含终端支持的样式 -->
+    <style type="text/x-tui-css">
+    .tui-page {
+        background-color: #000000;
+        color: #ffffff;
+    }
+    .tui-header {
+        font-weight: bold;
+        text-align: center;
+    }
+    .tui-status {
+        font-style: dim;
+        border-bottom: single;
+    }
+    .tui-nav a {
+        display: block;
+        padding: 1;
+        cursor: pointer;
+    }
+    .tui-separator {
+        border-char: ─;
+    }
+    .tui-footer {
+        font-style: dim;
+        margin-top: 2;
+    }
+    </style>
+</body>
+</html>