// 입력과 출력 부품. 입력은 손으로 켜고 끄는 토글, 출력은 LED 이며 둘 다 회로가 계산한 신호로만 상태를 보입니다.
// 입력은 노드와 신호값이고 출력은 핀을 뺀 몸체의 SVG 조각입니다. 핀은 ui.render 가 더합니다.
// 같은 노드와 신호면 늘 같은 조각이 나옵니다. 아이디는 파서가 영숫자와 밑줄만 받으므로 그대로 넣습니다.
// 상태를 들지 않습니다. 페이지가 data-input-id 로 토글을 처리합니다.
// Input toggle and output LED bodies drawn from computed signals.

import core.netlist
import ui.signalviz

export function 입력몸체(노드값: netlist.노드, 켜짐: bool) -> string {
  let x = 노드값.x
  let y = 노드값.y
  let 손잡이x = if 켜짐 { x + 27 } else { x + 13 }
  [
    "<g class=\"node input\" data-node-id=\"{노드값.아이디}\" data-input-id=\"{노드값.아이디}\" tabindex=\"0\" role=\"switch\">",
    "<rect x=\"{x}\" y=\"{y}\" width=\"40\" height=\"30\" rx=\"15\" fill=\"{signalviz.벨럼}\" stroke=\"{signalviz.먹}\" stroke-width=\"2\" />",
    "<circle cx=\"{손잡이x}\" cy=\"{y + 15}\" r=\"9\" fill=\"{signalviz.신호색(켜짐)}\" stroke=\"{signalviz.먹}\" stroke-width=\"1.5\" />",
    "<text x=\"{x + 20}\" y=\"{y - 5}\" text-anchor=\"middle\" font-size=\"10\" font-family=\"monospace\" fill=\"{signalviz.라벨색}\">{노드값.아이디}</text>",
    "</g>",
  ].join("")
}

export function 출력몸체(노드값: netlist.노드, 켜짐: bool) -> string {
  let x = 노드값.x
  let y = 노드값.y
  let 채움 = if 켜짐 { signalviz.시그널 } else { signalviz.벨럼 }
  [
    "<g class=\"node output\" data-node-id=\"{노드값.아이디}\" data-output-id=\"{노드값.아이디}\">",
    "<circle cx=\"{x + 15}\" cy=\"{y + 15}\" r=\"14\" fill=\"{채움}\" stroke=\"{signalviz.먹}\" stroke-width=\"2\" />",
    "<text x=\"{x + 15}\" y=\"{y - 5}\" text-anchor=\"middle\" font-size=\"10\" font-family=\"monospace\" fill=\"{signalviz.라벨색}\">{노드값.아이디}</text>",
    "</g>",
  ].join("")
}
