/* =============================================================================
 * D03_PlanAnalysis_UI_SatLight.ts
 * D03 위성 바탕 밝기(요구 475) — 노선 선 대비를 위해 위성을 조금 어둡게 · 사용자가 범례에서 조절.
 *   값 = 밝기 상한(0.4~1) · 계정 화면 취향으로 기억. 칠하기 = `D03_PlanAnalysis_UI_MapGl` `setSatelliteLight`.
 * ========================================================================== */

import { createSlider } from "@ui/ui_template_input";
import { readByKey, writeByKey } from "../A00_Common/b_page_state";

const PREF_KEY = "aislo:pref:d03.satellite-light";
export const SAT_LIGHT_MIN = 0.4;
export const SAT_LIGHT_MAX = 1;
export const SAT_LIGHT_DEFAULT = 0.8;

/** 기억한 밝기 — 없거나 깨지면 처음 값. */
export function readSatLight(): number {
  const value = Number(readByKey(PREF_KEY));
  return readByKey(PREF_KEY) !== null && value >= SAT_LIGHT_MIN && value <= SAT_LIGHT_MAX
    ? value
    : SAT_LIGHT_DEFAULT;
}

/** 범례 「위성 밝기」 칸 — 움직이면 바로 `onChange` · 기억. */
export function createSatLightRow(value: number, onChange: (value: number) => void): HTMLElement {
  const { root, input } = createSlider({
    label: "위성 밝기",
    min: SAT_LIGHT_MIN,
    max: SAT_LIGHT_MAX,
    step: 0.05,
    value,
    format: (v) => `${Math.round(v * 100)} %`,
    onInput: (v) => {
      writeByKey(PREF_KEY, String(v));
      onChange(v);
    },
  });
  input.dataset.role = "satellite-light";
  return root;
}