feat: edit moving source trajectories

apps/dataset-builder/index.html

@@ -133,6 +133,19 @@
                 <label class="field"><span>시작 (s)</span><input id="source-start" type="number" min="0" step="0.01" /></label>
                 <label class="field"><span>길이 (s)</span><input id="source-duration" type="number" min="0.01" step="0.01" /></label>
               </div>
+              <section class="trajectory-editor" aria-label="음원 이동 경로">
+                <label class="check-field trajectory-toggle"><input id="source-motion" type="checkbox" /><span>시간에 따라 음원 이동</span></label>
+                <p class="section-note">경로 시간은 Scene 시작 기준입니다. 이동을 켜면 현재 위치에서 시작해 Scene 끝까지 이어지는 두 점 경로가 만들어집니다.</p>
+                <div id="trajectory-fields" class="is-hidden">
+                  <label class="field field--wide trajectory-preview">
+                    <span>경로 미리보기 · <output id="preview-time-value" for="preview-time">0.00 s</output></span>
+                    <input id="preview-time" type="range" min="0" max="1" step="0.01" value="0" />
+                  </label>
+                  <p class="section-note">경로점을 선택하면 canvas 클릭으로 그 점의 x/y를 옮길 수 있습니다. 흰 테두리 점은 현재 선택한 경로점입니다.</p>
+                  <div class="trajectory-list" id="trajectory-list"></div>
+                  <button class="button button--ghost button--full" id="add-keyframe-button" type="button">+ 경로점 추가</button>
+                </div>
+              </section>
               <label class="field field--wide"><span>신호 종류</span><select id="source-type"><option value="tone">Tone</option><option value="noise">Noise</option><option value="asset">Audio asset</option></select></label>
               <div id="tone-fields"><label class="field field--wide"><span>주파수 (Hz)</span><input id="tone-frequency" type="number" min="1" step="1" /></label></div>
               <div id="noise-fields"><label class="field field--wide"><span>Noise color</span><select id="noise-color"><option value="white">White</option><option value="pink">Pink</option></select></label></div>