# 2026-07-09 영상 재생목록 패널 (분할 영상 선택 재생)

**소요 시간**: 10분
**Context 사용량**: input 380k / output 5k tokens

## 작업 내용

폴더 로드 시 폴더 내 영상 파일 목록(이름 오름차순)을 패널로 표시하고,
목록에서 원하는 영상을 클릭해 바로 선택 재생할 수 있게 함.

## 수정 내용 — client/src/components/player/VideoPlayer.tsx

- **재생목록 패널** (우하단, 재생바 위):
  - 폴더 내 영상 파일명 + 길이(m:ss), 현재 재생 항목 ▶ + 주황 하이라이트
  - 항목 클릭 → 해당 세그먼트로 즉시 전환 재생 (geoStore.loadSegment 로 드론 로그도
    해당 구간 누적 오프셋으로 재정렬 — ended 자동 전환과 동일 경로)
  - 현재 재생 중인 항목 재클릭 → 처음(0초)부터 재생
  - 목록이 길면 스크롤 (max-h-48)
  - 헤더에 "N/M" 진행 표시. ended 자동 전환 시에도 videoIndex 구독으로 하이라이트 자동 갱신
- **'영상목록 N/M' 토글 버튼**: 하단 컨트롤 행(드론궤적 버튼 옆). 기본 표시(ON)
- `fmtDur` 헬퍼(초→"m:ss"), geoStore videoFiles/videoDurations/videoIndex 구독 추가
- 로컬(폴더) 재생일 때만 표시 (source.kind === 'local')

## 검증

- tsc+vite 빌드 통과, 54000 포트 새 번들(index-DLUIvK3Q.js) 서빙

## 다음 단계 참고

- 세그먼트 전환 시 약 1초 로딩 공백(objectURL 교체) — 필요 시 다음 세그먼트 프리로드 검토
- 패널 위치는 우하단 고정 — 캡처 목록 등 다른 우측 UI 와 겹치면 위치 조정 필요