feat: add OCSF schema visualizer

[PR0CK0]

Summary

Adds a self-contained, interactive graph visualizer for exploring the OCSF schema, served at /visualizer.

I built it a while ago, it's hosted publicly on my own site; check it out live here: https://procko.pro/ocsf-visualizer/

Built on Cytoscape.js (loaded from CDN). No build step — a single static HTML file in priv/static/visualizer/.

Changes

• GET /visualizer route → PageController.visualizer/2 redirects to index.html
• priv/static/visualizer/ whitelisted in endpoint static file serving
• Nav link added to app layout
• priv/static/visualizer/index.html — the visualizer app

How it works

Fetches live schema data from the existing /api endpoints (events, objects, versions). Renders classes and objects as a Cytoscape graph with clickable nodes that link back to the schema browser. Supports version switching.

Testing

1. Start the server normally (mix phx.server)
2. Navigate to /visualizer
3. Select a schema version — graph should populate with events and objects
4. Click a node — detail panel should appear with a link to the schema browser

No new dependencies. No changes to existing routes or behavior.

@floydtree from our conversation ~last month in Slack. Haven't PR'd to a public project in a while. Let me know if anything needs to change. Would appreciate a code review from anyone interested here.

[floydtree]

This is great! What I was thinking when I first saw your visualizer is, to have a context aware visualizer button (similar to JSON schema, sample etc)

Basically, each event class, object get a visualizer scoped down to that specific page. The overall, non-scoped visualizer can be available for the categories pages.

Let me know what you think

[PR0CK0]

This is great! What I was thinking when I first saw your visualizer is, to have a context aware visualizer button (similar to JSON schema, sample etc)

Basically, each event class, object get a visualizer scoped down to that specific page. The overall, non-scoped visualizer can be available for the categories pages.

Let me know what you think

@floydtree

Interesting. Can you use Claude/Codex to craft a demonstration of what you mean?

Right now, in the visualizer, when you click a class/object, it opens the tab where it shows the specific attributes and optional/recommended/required values. Is this similar to what you're describing?

Thank you!

[floydtree]

@PR0CK0 hey, sorry it took a while. But take a look #184, that's what I was thinking. If you have any feedback on it, please do share! Thanks for the inspiration for this update!