From d0567e6d2c3624ed9809a2485b1d6a905e865680 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cchrisshank=E2=80=9D?= <chris.shank.23@gmail.com>
Date: Thu, 19 Dec 2024 00:41:27 -0800
Subject: [PATCH] use private class fields for graph

---
 labs/folk-graph.ts | 48 +++++++++++++++++++++++-----------------------
 1 file changed, 24 insertions(+), 24 deletions(-)

diff --git a/labs/folk-graph.ts b/labs/folk-graph.ts
index a9329ed..2c72f8c 100644
--- a/labs/folk-graph.ts
+++ b/labs/folk-graph.ts
@@ -8,10 +8,10 @@ import { FolkShape } from './folk-shape.ts';
 export class FolkGraph extends FolkBaseSet implements AnimationFrameControllerHost {
   static override tagName = 'folk-graph';
 
-  private graphSim = new Layout();
-  private nodes = new Map<FolkShape, number>();
-  private arrows = new Set<FolkBaseConnection>();
-  private integrator = TransformIntegrator.register('graph');
+  #graphSim = new Layout();
+  #nodes = new Map<FolkShape, number>();
+  #arrows = new Set<FolkBaseConnection>();
+  #integrator = TransformIntegrator.register('graph');
   #rAF = new AnimationFrameController(this);
 
   connectedCallback() {
@@ -24,24 +24,24 @@ export class FolkGraph extends FolkBaseSet implements AnimationFrameControllerHo
   disconnectedCallback() {
     super.disconnectedCallback();
     this.#rAF.stop();
-    this.nodes.clear();
-    this.arrows.clear();
+    this.#nodes.clear();
+    this.#arrows.clear();
   }
 
   override update(changedProperties: PropertyValues<this>) {
     super.update(changedProperties);
     if (changedProperties.has('sourceElements')) {
-      this.createGraph();
+      this.#createGraph();
     }
   }
 
   async tick() {
-    this.graphSim.start(1, 0, 0, 0, true, false);
+    this.#graphSim.start(1, 0, 0, 0, true, false);
 
     // Yield graph layout effects
-    for (const node of this.graphSim.nodes() as any[]) {
+    for (const node of this.#graphSim.nodes() as any[]) {
       const shape = node.id;
-      this.integrator.yield(shape, {
+      this.#integrator.yield(shape, {
         x: node.x - shape.width / 2,
         y: node.y - shape.height / 2,
         rotation: shape.rotation,
@@ -51,10 +51,10 @@ export class FolkGraph extends FolkBaseSet implements AnimationFrameControllerHo
     }
 
     // Get integrated results and update graph state
-    const results = await this.integrator.integrate();
+    const results = await this.#integrator.integrate();
     for (const [shape, result] of results) {
       // TODO: this is a hack to get the node from the graph
-      const node = this.graphSim.nodes().find((n: any) => n.id === shape);
+      const node = this.#graphSim.nodes().find((n: any) => n.id === shape);
       if (node) {
         node.x = result.x + shape.width / 2;
         node.y = result.y + shape.height / 2;
@@ -62,23 +62,23 @@ export class FolkGraph extends FolkBaseSet implements AnimationFrameControllerHo
     }
   }
 
-  private createGraph() {
-    this.nodes.clear();
-    this.arrows.clear();
+  #createGraph() {
+    this.#nodes.clear();
+    this.#arrows.clear();
 
-    const colaNodes = this.createNodes();
-    const colaLinks = this.createLinks();
+    const colaNodes = this.#createNodes();
+    const colaLinks = this.#createLinks();
 
     console.log(colaNodes, colaLinks);
 
-    this.graphSim.nodes(colaNodes).links(colaLinks).linkDistance(250).avoidOverlaps(true).handleDisconnected(true);
+    this.#graphSim.nodes(colaNodes).links(colaLinks).linkDistance(250).avoidOverlaps(true).handleDisconnected(true);
   }
 
-  private createNodes() {
+  #createNodes() {
     return Array.from(this.sourceElements)
       .filter((element): element is FolkShape => element instanceof FolkShape)
       .map((shape, index) => {
-        this.nodes.set(shape, index);
+        this.#nodes.set(shape, index);
         const rect = shape.getTransformDOMRect();
         return {
           id: shape,
@@ -91,13 +91,13 @@ export class FolkGraph extends FolkBaseSet implements AnimationFrameControllerHo
       });
   }
 
-  private createLinks() {
+  #createLinks() {
     return Array.from(this.sourceElements)
       .filter((element): element is FolkBaseConnection => element instanceof FolkBaseConnection)
       .map((arrow) => {
-        this.arrows.add(arrow);
-        const source = this.nodes.get(arrow.sourceElement as FolkShape);
-        const target = this.nodes.get(arrow.targetElement as FolkShape);
+        this.#arrows.add(arrow);
+        const source = this.#nodes.get(arrow.sourceElement as FolkShape);
+        const target = this.#nodes.get(arrow.targetElement as FolkShape);
         return source !== undefined && target !== undefined ? { source, target } : null;
       })
       .filter((link): link is { source: number; target: number } => link !== null);