nanocode/audiobook-player

📚 Audiobook Player

极简沉浸式的英文有声书 Web 应用。

✨ Features

• 🎨 极简设计 - 米白底色，纸质书阅读体验
• 🌙 夜间模式 - 一键切换深色主题
• 📱 移动优先 - 完美适配手机，支持 App 内嵌浏览器
• 🔊 流式朗读 - 实时 TTS，无需等待完整转换
• 🔄 断点续读 - 自动保存阅读进度
• ⚡ 懒加载 - 长文章分段加载，流畅滑动
• 👆 手势支持 - 滑动返回，双击缩放

🏗️ 架构

Flask Backend                    Frontend
├── / (index)      ────────▶   首页（来源选择）
├── /list/<source> ────────▶   故事列表
├── /play/<path>   ────────▶   播放页面
│                                   ├─ 顶部固定播放器
│                                   └─ 下方内容区
└── /api/stream    ────────▶   TTS 音频流

🚀 快速开始

cd ~/nanocode/audiobook-player

# 安装依赖
pip3 install -r requirements.txt

# 启动服务器
./start.sh start-bg

# 查看状态
./start.sh status

访问：http://localhost:5000

📁 目录结构

/home/ubuntu/media/
├── libraryofshortstories/
│   ├── the-1000000-bank-note/
│   │   ├── content.txt
│   │   └── metadata.md
│   └── ...
└── public-domain-poetry/
    └── ...

🎮 页面导航

页面	路径	功能
首页	/	显示所有来源（libraryofshortstories, poetry等）
列表	/list/<source>	该来源下的故事列表
播放	/play/<source>/<story>	播放器 + 文章内容

🎨 设计规范

• 配色：米白 #F5F1E8 / 深黑 #1A1A1A
• 字体：Georgia 衬线体
• 播放器：固定 100px，磨砂玻璃效果
• 卡片：圆角 16px，阴影
• 触摸区：≥ 80px

🔧 开发计划

• 基础 Flask 框架
• 三页面模板
• 流式 TTS 播放
• 主题切换
• 阅读进度同步
• 播放速度调节
• 收藏功能

📱 App 集成

适合嵌入手机 App 的 WebView：

// iOS WKWebView
let webView = WKWebView()
webView.load(URLRequest(url: URL(string: "http://129.211.173.87:5000")!))

// Android WebView
webView.loadUrl("http://129.211.173.87:5000")

特点：

• 每页独立返回按钮，不依赖浏览器导航
• 无地址栏干扰
• 响应式布局