spec - graph-cy-controller.ts

Referenced by 5

Labels 1

Idea	Status	Tags	Summary
graph_cy_controller			the cytoscape object should use event driven patterns; lifecycle is documented here. GraphCyController in ["../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts"] owns the cytoscape instance with inline lifecycle state ( idle, syncing, layouting, physics ). syncGeneration cancels stale layout callbacks when the slice changes mid-layout. Selection and drag-pinned positions are tracked in userPositionedNodes on the controller. syncSlice diffs elements ( add / remove / update the delta ) via ["../../../packages/extension/webviews/shared/graph/graph-cy-elements.ts"] so surviving nodes keep positions; requestLayout restarts the active algorithm and clears user pins. Pointer / selection wiring lives in ["../../../packages/extension/webviews/shared/graph/graph-cy-interactions.ts"]; compound hover / selection in ["../../../packages/extension/webviews/shared/graph/graph-cy-highlight.ts"]. Live physics is the custom simulation in ["../../../packages/extension/webviews/shared/graph/graph-physics.ts"]; one instance persists with the cytoscape instance and is paused / resumed, never rebuilt. Grabbing a node pins it in the running sim ( its live position keeps exerting forces ); release unpins with no restart and no snap. ResizeObserver debounces cy. resize ( ) and re-triggers a pending sync when the container gains size. Mount only while the graph container is visible and non-zero — do not keep cytoscape alive under display: none; WebGL init on a zero-size hidden container can break the host webview before messaging is attached. Viewport fitting per [reframe_view]; tracks lastSyncedNodeSetKey vs fittedNodeSetKey to drive [auto_reframe]. Label visibility per [graph_label_modes] / [graph_label_auto]: setLabelMode updates text-opacity from zoom ( and hover / drag force-opaque in auto ).
graph_label_auto	done		In Labels auto mode, visibility follows viewport zoom continuously rather than a hard cut. Below a low zoom threshold labels are fully hidden; above a slightly higher threshold they are fully opaque; between those thresholds opacity ramps briefly through a muted / semi-transparent phase ( GRAPH_LABEL_FADE_START → GRAPH_LABEL_FADE_END ). Hovered or dragged nodes remain fully opaque even when ambient auto opacity is low or zero. Zoom and Fit from [view_controls] / [reframe_view] must update this opacity on each paint or zoom event. Applies to Ideas Summary GraphCyController and HTML export canvas graph alike.
graph_label_modes	done		Every interactive graph should provide a Labels control that cycles auto ( default ), on, and off without changing graph membership. On forces full opacity; off hides all labels; auto follows [graph_label_auto]. Reset / default restore auto. Ideas Summary: control in ["../../../packages/extension/webviews/ideas-summary/components/GraphControls.svelte"], mode persisted via ["../module/ideas_summary/graphical_graph.rq".graph_ui_persistence]. HTML export: control in ["../../../packages/analytical/src/export/html-export-template.ts"] / ["../../../packages/analytical/src/export/html-export-assets.ts"]. Driven by the same viewport zoom as [view_controls].
graph_library			Reusable cytoscape-based graph visualization library for force-directed and compound graphs. Provides a mount → sync slice → layout → optional live physics → destroy lifecycle with a simplified API. Implementation lives in ["../../../packages/extension/webviews/shared/graph/graph-cytoscape.ts"], ["../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts"], ["../../../packages/extension/webviews/shared/graph/graph-cy-elements.ts"], ["../../../packages/extension/webviews/shared/graph/graph-cy-interactions.ts"], ["../../../packages/extension/webviews/shared/graph/graph-cy-highlight.ts"], ["../../../packages/extension/webviews/shared/graph/graph-physics.ts"], ["../../../packages/extension/webviews/shared/graph/graph-groups.ts"], and ["../../../packages/extension/webviews/shared/graph/graph-theme.ts"]. Ideas Summary re-exports the shared modules from ["../../../packages/extension/webviews/ideas-summary/lib/"] for backward-compatible import paths. Consumers pass a node / edge slice and sync options; the library owns the cytoscape instance, diffing, layout runs, and optional continuous physics.
reframe_view			Shared viewport behaviour for every surface that mounts GraphCyController ( Ideas Summary graph tab, activity bar mini graph, and future consumers ). Implementation: reframeGraphToViewport and GraphCyController. reframeToViewport in ["../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts"]. [manual_reframe] [auto_reframe] [reframe_animation] Constants: GRAPH_VIEWPORT_PADDING ( 36 px padding around the element bounding box ), GRAPH_REFRAME_ANIMATION_MS ( 400 ms animated transition ). Reframes resize the cytoscape container first, then fit all elements and centre the camera. Does not clear selection, centreId, user-pinned drag positions, or live physics state — viewport only.

Reference labels

../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts