Aislo/resources/tester/helper_139_6_line_shift.cjs

/* 139-6 고른 설계선 [◀ ▶] 노견 확장 헬퍼 — `_Cross_Design_Pick.attachDesignLinePick` 을 그 자리에서
 * 트랜스파일해 흉내 DOM 으로 돌림. 짝 = `test_139_6_line_shift.py`.
 */
const fs = require("fs");
const path = require("path");
const ts = require(path.join(__dirname, "..", "..", "config", "node_modules", "typescript"));

const ROOT = path.join(__dirname, "..", "..");
const cache = new Map();

class Node {
  constructor(tag) {
    this.tagName = tag;
    this.children = [];
    this.attrs = {};
    this.listeners = {};
    this.hidden = false;
    this._text = "";
    this._cls = new Set();
    const self = this;
    this.classList = {
      add: (...n) => n.forEach((c) => self._cls.add(c)),
      toggle: (c, on) => ((on ?? !self._cls.has(c)) ? self._cls.add(c) : self._cls.delete(c)),
      contains: (c) => self._cls.has(c),
    };
  }
  set className(v) {
    this._cls = new Set(String(v).split(/\s+/).filter(Boolean));
  }
  set textContent(v) {
    this._text = String(v);
  }
  get textContent() {
    return this._text + this.children.map((c) => c.textContent).join("");
  }
  append(...kids) {
    this.children.push(...kids);
  }
  insertBefore(kid) {
    this.children.push(kid);
  }
  setAttribute(n, v) {
    this.attrs[n] = String(v);
    if (n === "class") this.className = v;
  }
  getAttribute(n) {
    return this.attrs[n] ?? null;
  }
  hasAttribute(n) {
    return n in this.attrs;
  }
  addEventListener(t, fn) {
    (this.listeners[t] ??= []).push(fn);
  }
  click() {
    (this.listeners.click ?? []).forEach((fn) => fn({ stopPropagation: () => undefined }));
  }
}
globalThis.document = {
  createElement: (t) => new Node(t),
  createElementNS: (_n, t) => new Node(t),
};

function loadTs(file) {
  const full = path.resolve(file);
  if (cache.has(full)) return cache.get(full);
  const js = ts.transpileModule(fs.readFileSync(full, "utf8"), {
    compilerOptions: { module: ts.ModuleKind.CommonJS, target: ts.ScriptTarget.ES2020 },
  }).outputText;
  const box = { exports: {} };
  cache.set(full, box.exports);
  const req = (r) =>
    r.startsWith("@util/")
      ? loadTs(path.join(ROOT, "common_util", `${r.slice(6)}.ts`))
      : loadTs(path.join(path.dirname(full), `${r}.ts`));
  new Function("exports", "module", "require", js)(box.exports, box, req);
  cache.set(full, box.exports);
  return box.exports;
}

const pick = loadTs(path.join(ROOT, "B06_Section", "B06_Section_UI_Cross_Design_Pick.ts"));
const x = (o) => 100 - o * 12; // +offset = 화면 왼쪽
const y = (e) => 900 - (e - 100) * 12;
const design = {
  road_edges: {
    left: { offset_m: 2, elevation_m: 100 },
    right: { offset_m: -2, elevation_m: 100 },
  },
  ditch: null,
  ditch_side: "left",
  ditch_enabled: false,
  section_mode: "both_fill",
};
const line = (pts) => {
  const el = new Node("polyline");
  el.setAttribute("class", "b06-chart__design-cross");
  el.setAttribute("points", pts.map(([o, e]) => `${x(o)},${y(e)}`).join(" "));
  el.setAttribute(pick.DESIGN_LINE_ATTR, "");
  return el;
};
const layer = new Node("g");
// 좌 성토 사면 · 노면 · 우 성토 사면
layer.append(
  line([
    [6, 97],
    [2, 100],
  ]),
  line([
    [2, 100],
    [-2, 100],
  ]),
  line([
    [-2, 100],
    [-6, 97],
  ]),
);
const values = { left: 0, right: 0 };
const handle = pick.attachDesignLinePick({
  layer,
  design,
  x,
  toDisplayY: y,
  onPick: () => undefined,
  shift: {
    valueOf: (side) => values[side],
    set: (side, v) => (values[side] = v),
  },
});
const [left, right] = handle.label.children.filter((c) => c.tagName === "button");
const pieceAt = (offset) =>
  handle.pieces.findIndex(
    (p) =>
      Math.min(p.from.offset, p.to.offset) <= offset &&
      offset <= Math.max(p.from.offset, p.to.offset),
  );
const log = [];
handle.setActive(pieceAt(4)); // 좌 사면
left.click(); // 화면 왼쪽 = 좌측 바깥 → +0.1
left.click();
log.push({ ...values });
right.click(); // 안쪽 → 0.1
right.click();
right.click(); // 0 아래 금지
log.push({ ...values });
handle.setActive(pieceAt(-4)); // 우 사면
left.click(); // 화면 왼쪽 = 우측 안쪽 → 0 에서 멈춤
right.click(); // 우측 바깥 → +0.1
log.push({ ...values });
handle.setActive(pieceAt(-4));
const text = handle.label.textContent;
process.stdout.write(JSON.stringify({ log, text, buttons: [left.textContent, right.textContent] }));