/* =============================================================================
 * B05_Profile_UI_RouteEdit_SnapStep.ts
 * 노선 편집 [측점 스냅] 단추 · 스냅 간격 고르기(390-2 · 요구 242-11).
 *
 * 간격 = 0.1 m · 1 m · 10 m · 측점 No.(편집 창 측점 간격 · 기본) — 곡선 MC 를 그 간격 배수에 맞춤.
 * 고른 값은 프로젝트별 화면 기억(pref `routeedit-snap-step`) · [저장] 대상 아님(서버 · 추천은 측점 No. 그대로).
 * 스냅 끔이면 고르기는 흐림(CSS) · 고를 수는 있음.
 * ========================================================================== */

import { readState, writeState } from "../A00_Common/b_page_state";
import type { RouteEditChrome } from "./B05_Profile_UI_RouteEdit_Chrome";

const STEPS = ["0.1", "1", "10", "station"];

/** [측점 스냅] 단추 켬끔 모양(`is-active` · `aria-pressed`). */
export function paintStationSnap(button: HTMLButtonElement, on: boolean): void {
  button.classList.toggle("is-active", on);
  button.setAttribute("aria-pressed", String(on));
}

/**
 * 단추 · 고르기 배선 — `onChange(true)` = 단추 누름(켬끔 바꿈) · `onChange(false)` = 간격 바꿈.
 * 돌려주는 함수 = 지금 스냅 간격(m).
 */
export function bindStationSnap(
  chrome: Pick<RouteEditChrome, "overlay" | "stationSnapButton">,
  projectId: string,
  stationIntervalM: number,
  onChange: (toggle: boolean) => void,
): () => number {
  const select = chrome.overlay.querySelector<HTMLSelectElement>('[data-act="snap-step"]')!;
  const saved = readState<string>("routeedit-snap-step", projectId);
  select.value = saved && STEPS.includes(saved) ? saved : "station";
  select.addEventListener("change", () => {
    writeState("routeedit-snap-step", select.value, projectId);
    onChange(false);
  });
  chrome.stationSnapButton.addEventListener("click", () => onChange(true));
  return () => (select.value === "station" ? stationIntervalM : Number(select.value));
}