# SentenceLoop

**Repository Path**: ue5/sentence-loop

## Basic Information

- **Project Name**: SentenceLoop
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-08-11
- **Last Updated**: 2026-09-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# SentenceLoop

英语音频拆句学习工具——上传长音频，自动按句子波形拆成可循环播放的片段，支持文本对齐字幕高亮。

纯前端离线应用，所有数据存浏览器本地（IndexedDB + localStorage），不上传任何服务器。

## 快速开始

```bash
npm install
npm run dev
```

浏览器自动打开 `http://localhost:3923`。也可双击 `SentenceLoop.bat` 启动。

## 功能

- **拖拽/点击上传**：支持 mp3 / wav / m4a / ogg / flac / aac
- **自动拆句**：Web Audio API 波形能量检测（RMS，10ms 窗），可调阈值/静音时长/最小段长/边距
- **波形编辑**：Canvas 渲染，分割线可拖拽 + 输入框精确到毫秒，离屏缓存高性能
- **循环播放**：逐段循环跟读，上/下段切换，进度条实时更新
- **文本字幕**：粘贴文本按行对齐，播放时当前行高亮自动滚动，段数≠行数标红提示
- **自动保存**：项目/音频/分段/参数/文本全部持久化，关闭页面不丢数据
- **多项目管理**：左侧列表切换，支持重新上传恢复损坏项目

## 技术栈

- Next.js 16 (App Router) + TypeScript
- zustand 状态管理
- idb (IndexedDB) 音频存储
- Canvas 手绘波形（无第三方波形库）

## 项目结构

```
src/
  app/           Next.js App Router 页面
  components/     UI 组件（ProjectList / WaveformEditor / SegmentTable / TextPanel / TimelineBar / ErrorBoundary）
  lib/           核心逻辑
    audio/       拆分引擎 + 循环播放器
    store.ts     zustand 全局状态
    persistence.ts  IndexedDB + localStorage 读写
    usePersistence.ts  恢复 + 自动保存 hook
    types.ts     类型定义
    theme.ts     设计 tokens
    format.ts    工具函数
scripts/         测试脚本 + 开发包装
```

## 开发

```bash
npm run build   # 生产构建
npm run lint    # ESLint 检查
```