Aislo/B05_Profile/B05_Profile_UI_RouteEdit_SnapStep.ts

/* =============================================================================
 * 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) · 고를 수는 있음.
 * 상태줄 글은 고른 간격 따라(390-4) — 측점 No. = 「일반측점에」 · 그 밖 = 「1 m 배수에」 꼴.
 * ========================================================================== */

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));
}

/** 스냅 뒤 상태줄 글 — `step` = 고르기 값("0.1" · "1" · "10" · "station"). */
export function snapFitText(step: string): string {
  const where = step === "station" ? "일반측점" : `${step} m 배수`;
  return `곡선 가운데(MC)를 ${where}에 맞췄습니다.`;
}

export type SnapStep = { (): number; text: () => string };

/**
 * 단추 · 고르기 배선 — `onChange(true)` = 단추 누름(켬끔 바꿈) · `onChange(false)` = 간격 바꿈.
 * 돌려주는 함수 = 지금 스냅 간격(m) · `.text()` = 스냅 뒤 상태줄 글.
 */
export function bindStationSnap(
  chrome: Pick<RouteEditChrome, "overlay" | "stationSnapButton">,
  projectId: string,
  stationIntervalM: number,
  onChange: (toggle: boolean) => void,
): SnapStep {
  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));
  const stepM = () => (select.value === "station" ? stationIntervalM : Number(select.value));
  return Object.assign(stepM, { text: () => snapFitText(select.value) });
}