Skip to content

Latest commit

 

History

History
59 lines (46 loc) · 1.65 KB

File metadata and controls

59 lines (46 loc) · 1.65 KB

SubSync — Next.js SRT Subtitle Resync Tool

Fix audio/subtitle sync delays by shifting .srt timestamps visually.

Quick start

npm install
npm run dev

Then open http://localhost:3000.

Features

  • Drag-and-drop .srt file loading
  • Visual offset control — slider (±30s), step buttons, quick presets, manual ms input
  • Split preview — original vs shifted timestamps side-by-side
  • Inline text editing — click any entry to fix subtitle text
  • FPS conversion — rescale all timestamps across frame rates (23.976 → 25fps etc.)
  • Undo stack — up to 50 steps, Ctrl+Z
  • Search — filter entries by text with highlight
  • Smart download — filename encodes the applied offset

Keyboard shortcuts

Key Action
/ Nudge offset ±500ms
Ctrl+Z Undo last change
Ctrl+S Download resynced .srt

Project structure

src/
  app/
    layout.tsx       # Root layout, font loading
    page.tsx         # Main page, composes all components
    globals.css      # Design tokens (CSS variables)
    page.module.css  # Page-level layout styles
  components/
    DropZone.tsx     # File upload with drag-and-drop
    OffsetControls.tsx  # Slider, presets, FPS converter, actions
    EntryList.tsx    # Virtualisation-ready subtitle list with inline editing
    Toast.tsx        # Notification toasts
  lib/
    srt.ts           # SRT parser, serialiser, FPS converter, timestamp utils
    useSubSync.ts    # All app state via useReducer + history stack

Build for production

npm run build
npm start

Or deploy to Vercel with zero config.