feat(web-ui): SetupTab visual_defaults 6옵션 확장

This commit is contained in:
2026-05-09 13:36:26 +09:00
parent 120c39a3ef
commit 3f5cd32c77
2 changed files with 47 additions and 5 deletions

View File

@@ -3236,6 +3236,15 @@
.setup-card button:hover { .setup-card button:hover {
background: rgba(245, 166, 35, 0.25); background: rgba(245, 166, 35, 0.25);
} }
.setup-checkbox {
display: flex;
align-items: center;
gap: 8px;
cursor: pointer;
}
.setup-checkbox input[type="checkbox"] {
width: auto;
}
.setup-channel { .setup-channel {
display: flex; display: flex;
align-items: center; align-items: center;

View File

@@ -113,19 +113,52 @@ export default function SetupTab() {
<section className="setup-card"> <section className="setup-card">
<h3>영상 비주얼 기본값</h3> <h3>영상 비주얼 기본값</h3>
<label>해상도 <label>해상도
<select value={setup.visual_defaults.resolution} <select value={setup.visual_defaults.resolution || '1920x1080'}
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, resolution: e.target.value}}))}> onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, resolution: e.target.value}}))}>
<option value="1920x1080">1920×1080 (가로)</option> <option value="1920x1080">1920×1080 (가로)</option>
<option value="1080x1920">1080×1920 (세로/Shorts)</option> <option value="1080x1920">1080×1920 (세로/Shorts)</option>
</select> </select>
</label> </label>
<label>스타일
<select value={setup.visual_defaults.style} <label>기본 시각 스타일
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, style: e.target.value}}))}> <select value={setup.visual_defaults.default_visual_style || 'essential'}
<option value="visualizer">Visualizer (파형)</option> onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, default_visual_style: e.target.value}}))}>
<option value="essential">essential (배경 + 중앙 비주얼)</option>
<option value="single">single (커버 + 가장자리 파형)</option>
</select> </select>
</label> </label>
<label>기본 배경 모드
<select value={setup.visual_defaults.default_background_mode || 'static'}
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, default_background_mode: e.target.value}}))}>
<option value="static">정적 사진</option>
<option value="video_loop">영상 루프 (Pexels)</option>
</select>
</label>
<label>기본 배경 키워드 (비우면 장르 기반 자동)
<input value={setup.visual_defaults.default_background_keyword || ''}
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, default_background_keyword: e.target.value}}))}
placeholder="lofi cafe, rainy window, mountain ..." />
</label>
<label>배경 이미지 소스 (정적 모드)
<select value={setup.visual_defaults.background_image_source || 'ai'}
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, background_image_source: e.target.value}}))}>
<option value="ai">AI 생성 (DALL·E)</option>
<option value="pexels">Pexels 스톡 사진</option>
</select>
</label>
<label className="setup-checkbox">
<input type="checkbox"
checked={setup.visual_defaults.subtitle_track_titles ?? true}
onChange={e => setSetup(s => ({...s, visual_defaults: {...s.visual_defaults, subtitle_track_titles: e.target.checked}}))}/>
Mix에서 곡명 자막 표시 (트랙 시작 5)
</label>
<button onClick={() => save({ visual_defaults: setup.visual_defaults })}>저장</button> <button onClick={() => save({ visual_defaults: setup.visual_defaults })}>저장</button>
</section> </section>