1
0
Files
PPTX/preview/server.py
lanyuanxiaoyao ed940f0690 refactor: modularize yaml2pptx into layered architecture
Refactor yaml2pptx.py from a 1,245-line monolithic script into a modular
architecture with clear separation of concerns. The entry point is now
127 lines, with business logic distributed across focused modules.

Architecture:
- core/: Domain models (elements, template, presentation)
- loaders/: YAML loading and validation
- renderers/: PPTX and HTML rendering
- preview/: Flask preview server
- utils.py: Shared utilities

Key improvements:
- Element abstraction layer using dataclass with validation
- Renderer logic built into generator classes
- Single-direction dependencies (no circular imports)
- Each module 150-300 lines for better readability
- Backward compatible CLI interface

Documentation:
- README.md: User-facing usage guide
- README_DEV.md: Developer documentation

OpenSpec:
- Archive refactor-yaml2pptx-modular change (63/70 tasks complete)
- Sync 5 delta specs to main specs (2 new + 3 updated)
2026-03-02 16:43:45 +08:00

245 lines
6.4 KiB
Python

"""
预览服务器模块
提供浏览器预览功能,支持文件监听和热重载。
"""
import sys
import queue
import webbrowser
import random
from pathlib import Path
from threading import Thread
try:
from flask import Flask, Response
from watchdog.observers import Observer
from watchdog.events import FileSystemEventHandler
except ImportError:
Flask = None
Observer = None
FileSystemEventHandler = None
from core.presentation import Presentation
from renderers.html_renderer import HtmlRenderer
from loaders.yaml_loader import YAMLError
from utils import log_info, log_error
# HTML 模板
HTML_TEMPLATE = """
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>YAML Preview</title>
<style>
* { box-sizing: border-box; }
body {
margin: 0;
padding: 20px;
background: #f5f5f5;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.slide {
width: 960px;
height: 540px;
position: relative;
background: white;
margin: 20px auto;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
overflow: hidden;
}
.slide-number {
position: absolute;
bottom: 10px;
right: 10px;
font-size: 12px;
color: #999;
z-index: 1000;
}
.element {
position: absolute;
}
table.element {
border-collapse: collapse;
}
table.element td {
padding: 8px;
border: 1px solid #ddd;
}
</style>
</head>
<body>
{{ slides_html }}
<script>
const eventSource = new EventSource('/events');
eventSource.onmessage = (e) => {
if (e.data === 'reload') {
console.log('[Preview] 重新加载...');
location.reload();
}
};
eventSource.onerror = () => {
console.error('[Preview] 连接断开');
};
</script>
</body>
</html>
"""
ERROR_TEMPLATE = """
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>预览错误</title>
<style>
body {
margin: 0;
padding: 40px;
background: #f5f5f5;
font-family: monospace;
}
.error {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background: #fff3cd;
border: 2px solid #ffc107;
border-radius: 4px;
color: #856404;
}
h1 { margin-top: 0; }
</style>
</head>
<body>
<div class="error">
<h1>⚠️ YAML 解析错误</h1>
<pre>{{ error }}</pre>
</div>
<script>
const eventSource = new EventSource('/events');
eventSource.onmessage = () => location.reload();
</script>
</body>
</html>
"""
# 全局变量
app = None
change_queue = None
current_yaml_file = None
current_template_dir = None
class YAMLChangeHandler:
"""文件变化处理器"""
def on_modified(self, event):
if event.src_path.endswith('.yaml'):
log_info(f"检测到文件变化: {event.src_path}")
if change_queue:
change_queue.put('reload')
def generate_preview_html(yaml_file, template_dir):
"""生成完整的预览 HTML 页面"""
try:
pres = Presentation(yaml_file, template_dir)
renderer = HtmlRenderer()
slides_html = ""
for i, slide_data in enumerate(pres.data.get('slides', [])):
rendered = pres.render_slide(slide_data)
slides_html += renderer.render_slide(rendered, i, Path(yaml_file).parent)
return HTML_TEMPLATE.replace('{{ slides_html }}', slides_html)
except YAMLError as e:
return ERROR_TEMPLATE.replace('{{ error }}', str(e))
def create_flask_app():
"""创建 Flask 应用"""
flask_app = Flask(__name__)
@flask_app.route('/')
def index():
"""主页面"""
try:
return generate_preview_html(current_yaml_file, current_template_dir)
except Exception as e:
return ERROR_TEMPLATE.replace('{{ error }}', f"生成预览失败: {str(e)}")
@flask_app.route('/events')
def events():
"""SSE 事件流"""
def event_stream():
while True:
change_queue.get()
yield 'data: reload\\n\\n'
return Response(event_stream(), mimetype='text/event-stream')
return flask_app
def start_preview_server(yaml_file, template_dir, port):
"""启动预览服务器"""
global app, change_queue, current_yaml_file, current_template_dir
if Flask is None:
log_error("预览功能需要 flask 和 watchdog 依赖")
log_error("请确保使用 uv 运行脚本,依赖会自动安装")
sys.exit(1)
# 如果没有指定端口,随机选择 20000-30000 之间的端口
if port is None:
port = random.randint(20000, 30000)
current_yaml_file = yaml_file
current_template_dir = template_dir
change_queue = queue.Queue()
# 创建 Flask 应用
app = create_flask_app()
# 启动文件监听
if FileSystemEventHandler:
handler = YAMLChangeHandler()
if hasattr(handler, 'on_modified'):
# 创建一个简单的事件处理器
class SimpleHandler(FileSystemEventHandler):
def on_modified(self, event):
handler.on_modified(event)
observer = Observer()
observer.schedule(SimpleHandler(), str(Path(yaml_file).parent), recursive=False)
observer.start()
# 输出日志
log_info(f"正在监听: {yaml_file}")
log_info(f"预览地址: http://localhost:{port}")
log_info("按 Ctrl+C 停止")
# 自动打开浏览器
Thread(target=lambda: webbrowser.open(f'http://localhost:{port}')).start()
# 启动 Flask
try:
app.run(host='0.0.0.0', port=port, debug=False, threaded=True)
except OSError as e:
if 'Address already in use' in str(e):
log_error(f"端口 {port} 已被占用")
log_error(f"请使用 --port 参数指定其他端口,例如: --port {port + 1}")
else:
log_error(f"启动服务器失败: {str(e)}")
sys.exit(1)
except KeyboardInterrupt:
if 'observer' in locals():
observer.stop()
observer.join()
log_info("已停止")