@vib3code/sdk 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (258) hide show
  1. package/CHANGELOG.md +118 -0
  2. package/DOCS/BLUEPRINT_EXECUTION_PLAN_2026-01-07.md +34 -0
  3. package/DOCS/CI_TESTING.md +38 -0
  4. package/DOCS/CLI_ONBOARDING.md +75 -0
  5. package/DOCS/CONTROL_REFERENCE.md +64 -0
  6. package/DOCS/DEV_TRACK_ANALYSIS.md +77 -0
  7. package/DOCS/DEV_TRACK_PLAN_2026-01-07.md +42 -0
  8. package/DOCS/DEV_TRACK_SESSION_2026-01-31.md +220 -0
  9. package/DOCS/ENV_SETUP.md +189 -0
  10. package/DOCS/EXPORT_FORMATS.md +417 -0
  11. package/DOCS/GPU_DISPOSAL_GUIDE.md +21 -0
  12. package/DOCS/LICENSING_TIERS.md +275 -0
  13. package/DOCS/MASTER_PLAN_2026-01-31.md +570 -0
  14. package/DOCS/OBS_SETUP_GUIDE.md +98 -0
  15. package/DOCS/PROJECT_SETUP.md +66 -0
  16. package/DOCS/RENDERER_LIFECYCLE.md +40 -0
  17. package/DOCS/REPO_MANIFEST.md +121 -0
  18. package/DOCS/SESSION_014_PLAN.md +195 -0
  19. package/DOCS/SESSION_LOG_2026-01-07.md +56 -0
  20. package/DOCS/STRATEGIC_BLUEPRINT_2026-01-07.md +72 -0
  21. package/DOCS/SYSTEM_AUDIT_2026-01-30.md +738 -0
  22. package/DOCS/SYSTEM_INVENTORY.md +520 -0
  23. package/DOCS/TELEMETRY_EXPORTS.md +34 -0
  24. package/DOCS/WEBGPU_STATUS.md +38 -0
  25. package/DOCS/XR_BENCHMARKS.md +608 -0
  26. package/LICENSE +21 -0
  27. package/README.md +426 -0
  28. package/docs/.nojekyll +0 -0
  29. package/docs/01-dissolution_of_euclidean_hegemony.html +346 -0
  30. package/docs/02-hyperspatial_ego_death.html +346 -0
  31. package/docs/03-post_cartesian_sublime.html +346 -0
  32. package/docs/04-crystalline_void_meditation.html +346 -0
  33. package/docs/05-quantum_decoherence_ballet.html +346 -0
  34. package/docs/06-dissolution_of_euclidean_hegemony.html +346 -0
  35. package/docs/07-hyperspatial_ego_death.html +346 -0
  36. package/docs/08-post_cartesian_sublime.html +346 -0
  37. package/docs/09-crystalline_void_meditation.html +346 -0
  38. package/docs/10-quantum_decoherence_ballet.html +346 -0
  39. package/docs/11-dissolution_of_euclidean_hegemony.html +346 -0
  40. package/docs/12-hyperspatial_ego_death.html +346 -0
  41. package/docs/13-post_cartesian_sublime.html +346 -0
  42. package/docs/index.html +794 -0
  43. package/docs/test-hub.html +441 -0
  44. package/docs/url-state.js +102 -0
  45. package/docs/vib3-exports/01-quantum-quantum-tetrahedron-lattice.html +489 -0
  46. package/docs/vib3-exports/02-quantum-quantum-hypersphere-matrix.html +489 -0
  47. package/docs/vib3-exports/03-quantum-quantum-hypertetra-fractal.html +489 -0
  48. package/docs/vib3-exports/04-faceted-faceted-crystal-structure.html +407 -0
  49. package/docs/vib3-exports/05-faceted-faceted-klein-bottle.html +407 -0
  50. package/docs/vib3-exports/06-faceted-faceted-hypertetra-torus.html +407 -0
  51. package/docs/vib3-exports/07-holographic-holographic-wave-field.html +457 -0
  52. package/docs/vib3-exports/08-holographic-holographic-hypersphere-sphere.html +457 -0
  53. package/docs/vib3-exports/09-holographic-holographic-hypertetra-crystal.html +457 -0
  54. package/docs/vib3-exports/index.html +238 -0
  55. package/docs/webgpu-live.html +702 -0
  56. package/package.json +367 -0
  57. package/src/advanced/AIPresetGenerator.js +777 -0
  58. package/src/advanced/MIDIController.js +703 -0
  59. package/src/advanced/OffscreenWorker.js +1051 -0
  60. package/src/advanced/WebGPUCompute.js +1051 -0
  61. package/src/advanced/WebXRRenderer.js +680 -0
  62. package/src/agent/cli/AgentCLI.js +615 -0
  63. package/src/agent/cli/index.js +14 -0
  64. package/src/agent/index.js +73 -0
  65. package/src/agent/mcp/MCPServer.js +950 -0
  66. package/src/agent/mcp/index.js +9 -0
  67. package/src/agent/mcp/tools.js +548 -0
  68. package/src/agent/telemetry/EventStream.js +669 -0
  69. package/src/agent/telemetry/Instrumentation.js +618 -0
  70. package/src/agent/telemetry/TelemetryExporters.js +427 -0
  71. package/src/agent/telemetry/TelemetryService.js +464 -0
  72. package/src/agent/telemetry/index.js +52 -0
  73. package/src/benchmarks/BenchmarkRunner.js +381 -0
  74. package/src/benchmarks/MetricsCollector.js +299 -0
  75. package/src/benchmarks/index.js +9 -0
  76. package/src/benchmarks/scenes.js +259 -0
  77. package/src/cli/index.js +675 -0
  78. package/src/config/ApiConfig.js +88 -0
  79. package/src/core/CanvasManager.js +217 -0
  80. package/src/core/ErrorReporter.js +117 -0
  81. package/src/core/ParameterMapper.js +333 -0
  82. package/src/core/Parameters.js +396 -0
  83. package/src/core/RendererContracts.js +200 -0
  84. package/src/core/UnifiedResourceManager.js +370 -0
  85. package/src/core/VIB3Engine.js +636 -0
  86. package/src/core/renderers/FacetedRendererAdapter.js +32 -0
  87. package/src/core/renderers/HolographicRendererAdapter.js +29 -0
  88. package/src/core/renderers/QuantumRendererAdapter.js +29 -0
  89. package/src/core/renderers/RendererLifecycleManager.js +63 -0
  90. package/src/creative/ColorPresetsSystem.js +980 -0
  91. package/src/creative/ParameterTimeline.js +1061 -0
  92. package/src/creative/PostProcessingPipeline.js +1113 -0
  93. package/src/creative/TransitionAnimator.js +683 -0
  94. package/src/export/CSSExporter.js +226 -0
  95. package/src/export/CardGeneratorBase.js +279 -0
  96. package/src/export/ExportManager.js +580 -0
  97. package/src/export/FacetedCardGenerator.js +279 -0
  98. package/src/export/HolographicCardGenerator.js +543 -0
  99. package/src/export/LottieExporter.js +552 -0
  100. package/src/export/QuantumCardGenerator.js +315 -0
  101. package/src/export/SVGExporter.js +519 -0
  102. package/src/export/ShaderExporter.js +903 -0
  103. package/src/export/TradingCardGenerator.js +3055 -0
  104. package/src/export/TradingCardManager.js +181 -0
  105. package/src/export/VIB3PackageExporter.js +559 -0
  106. package/src/export/index.js +14 -0
  107. package/src/export/systems/TradingCardSystemFaceted.js +494 -0
  108. package/src/export/systems/TradingCardSystemHolographic.js +452 -0
  109. package/src/export/systems/TradingCardSystemQuantum.js +411 -0
  110. package/src/faceted/FacetedSystem.js +963 -0
  111. package/src/features/CollectionManager.js +433 -0
  112. package/src/gallery/CollectionManager.js +240 -0
  113. package/src/gallery/GallerySystem.js +485 -0
  114. package/src/geometry/GeometryFactory.js +314 -0
  115. package/src/geometry/GeometryLibrary.js +72 -0
  116. package/src/geometry/buffers/BufferBuilder.js +338 -0
  117. package/src/geometry/buffers/index.js +18 -0
  118. package/src/geometry/generators/Crystal.js +420 -0
  119. package/src/geometry/generators/Fractal.js +298 -0
  120. package/src/geometry/generators/KleinBottle.js +197 -0
  121. package/src/geometry/generators/Sphere.js +192 -0
  122. package/src/geometry/generators/Tesseract.js +160 -0
  123. package/src/geometry/generators/Tetrahedron.js +225 -0
  124. package/src/geometry/generators/Torus.js +304 -0
  125. package/src/geometry/generators/Wave.js +341 -0
  126. package/src/geometry/index.js +142 -0
  127. package/src/geometry/warp/HypersphereCore.js +211 -0
  128. package/src/geometry/warp/HypertetraCore.js +386 -0
  129. package/src/geometry/warp/index.js +57 -0
  130. package/src/holograms/HolographicVisualizer.js +1073 -0
  131. package/src/holograms/RealHolographicSystem.js +966 -0
  132. package/src/holograms/variantRegistry.js +69 -0
  133. package/src/integrations/FigmaPlugin.js +854 -0
  134. package/src/integrations/OBSMode.js +754 -0
  135. package/src/integrations/ThreeJsPackage.js +660 -0
  136. package/src/integrations/TouchDesignerExport.js +552 -0
  137. package/src/integrations/frameworks/Vib3React.js +591 -0
  138. package/src/integrations/frameworks/Vib3Svelte.js +654 -0
  139. package/src/integrations/frameworks/Vib3Vue.js +628 -0
  140. package/src/llm/LLMParameterInterface.js +240 -0
  141. package/src/llm/LLMParameterUI.js +577 -0
  142. package/src/math/Mat4x4.js +708 -0
  143. package/src/math/Projection.js +341 -0
  144. package/src/math/Rotor4D.js +637 -0
  145. package/src/math/Vec4.js +476 -0
  146. package/src/math/constants.js +164 -0
  147. package/src/math/index.js +68 -0
  148. package/src/math/projections.js +54 -0
  149. package/src/math/rotations.js +196 -0
  150. package/src/quantum/QuantumEngine.js +906 -0
  151. package/src/quantum/QuantumVisualizer.js +1103 -0
  152. package/src/reactivity/ReactivityConfig.js +499 -0
  153. package/src/reactivity/ReactivityManager.js +586 -0
  154. package/src/reactivity/SpatialInputSystem.js +1783 -0
  155. package/src/reactivity/index.js +93 -0
  156. package/src/render/CommandBuffer.js +465 -0
  157. package/src/render/MultiCanvasBridge.js +340 -0
  158. package/src/render/RenderCommand.js +514 -0
  159. package/src/render/RenderResourceRegistry.js +523 -0
  160. package/src/render/RenderState.js +552 -0
  161. package/src/render/RenderTarget.js +512 -0
  162. package/src/render/ShaderLoader.js +253 -0
  163. package/src/render/ShaderProgram.js +599 -0
  164. package/src/render/UnifiedRenderBridge.js +496 -0
  165. package/src/render/backends/WebGLBackend.js +1108 -0
  166. package/src/render/backends/WebGPUBackend.js +1409 -0
  167. package/src/render/commands/CommandBufferExecutor.js +607 -0
  168. package/src/render/commands/RenderCommandBuffer.js +661 -0
  169. package/src/render/commands/index.js +17 -0
  170. package/src/render/index.js +367 -0
  171. package/src/scene/Disposable.js +498 -0
  172. package/src/scene/MemoryPool.js +618 -0
  173. package/src/scene/Node4D.js +697 -0
  174. package/src/scene/ResourceManager.js +599 -0
  175. package/src/scene/Scene4D.js +540 -0
  176. package/src/scene/index.js +98 -0
  177. package/src/schemas/error.schema.json +84 -0
  178. package/src/schemas/extension.schema.json +88 -0
  179. package/src/schemas/index.js +214 -0
  180. package/src/schemas/parameters.schema.json +142 -0
  181. package/src/schemas/tool-pack.schema.json +44 -0
  182. package/src/schemas/tool-response.schema.json +127 -0
  183. package/src/shaders/common/fullscreen.vert.glsl +5 -0
  184. package/src/shaders/common/fullscreen.vert.wgsl +17 -0
  185. package/src/shaders/common/geometry24.glsl +65 -0
  186. package/src/shaders/common/geometry24.wgsl +54 -0
  187. package/src/shaders/common/rotation4d.glsl +85 -0
  188. package/src/shaders/common/rotation4d.wgsl +86 -0
  189. package/src/shaders/common/uniforms.glsl +44 -0
  190. package/src/shaders/common/uniforms.wgsl +48 -0
  191. package/src/shaders/faceted/faceted.frag.glsl +129 -0
  192. package/src/shaders/faceted/faceted.frag.wgsl +164 -0
  193. package/src/shaders/holographic/holographic.frag.glsl +406 -0
  194. package/src/shaders/holographic/holographic.frag.wgsl +185 -0
  195. package/src/shaders/quantum/quantum.frag.glsl +513 -0
  196. package/src/shaders/quantum/quantum.frag.wgsl +361 -0
  197. package/src/testing/ParallelTestFramework.js +519 -0
  198. package/src/testing/__snapshots__/exportFormats.test.js.snap +24 -0
  199. package/src/testing/exportFormats.test.js +8 -0
  200. package/src/testing/projections.test.js +14 -0
  201. package/src/testing/rotations.test.js +37 -0
  202. package/src/ui/InteractivityMenu.js +516 -0
  203. package/src/ui/StatusManager.js +96 -0
  204. package/src/ui/adaptive/renderers/webgpu/BufferLayout.ts +252 -0
  205. package/src/ui/adaptive/renderers/webgpu/PolytopeInstanceBuffer.ts +144 -0
  206. package/src/ui/adaptive/renderers/webgpu/TripleBufferedUniform.ts +170 -0
  207. package/src/ui/adaptive/renderers/webgpu/WebGPURenderer.ts +735 -0
  208. package/src/ui/adaptive/renderers/webgpu/index.ts +112 -0
  209. package/src/variations/VariationManager.js +431 -0
  210. package/src/viewer/AudioReactivity.js +505 -0
  211. package/src/viewer/CardBending.js +481 -0
  212. package/src/viewer/GalleryUI.js +832 -0
  213. package/src/viewer/ReactivityManager.js +590 -0
  214. package/src/viewer/TradingCardExporter.js +600 -0
  215. package/src/viewer/ViewerPortal.js +374 -0
  216. package/src/viewer/index.js +12 -0
  217. package/src/wasm/WasmLoader.js +296 -0
  218. package/src/wasm/index.js +132 -0
  219. package/tools/agentic/mcpTools.js +88 -0
  220. package/tools/cli/agent-cli.js +92 -0
  221. package/tools/export/formats.js +24 -0
  222. package/tools/math/rotation-baseline.mjs +64 -0
  223. package/tools/shader-sync-verify.js +937 -0
  224. package/tools/telemetry/manifestPipeline.js +141 -0
  225. package/tools/telemetry/telemetryEvents.js +35 -0
  226. package/types/adaptive-sdk.d.ts +185 -0
  227. package/types/advanced/AIPresetGenerator.d.ts +81 -0
  228. package/types/advanced/MIDIController.d.ts +100 -0
  229. package/types/advanced/OffscreenWorker.d.ts +82 -0
  230. package/types/advanced/WebGPUCompute.d.ts +52 -0
  231. package/types/advanced/WebXRRenderer.d.ts +77 -0
  232. package/types/advanced/index.d.ts +46 -0
  233. package/types/core/ErrorReporter.d.ts +50 -0
  234. package/types/core/VIB3Engine.d.ts +204 -0
  235. package/types/creative/ColorPresetsSystem.d.ts +91 -0
  236. package/types/creative/ParameterTimeline.d.ts +74 -0
  237. package/types/creative/PostProcessingPipeline.d.ts +109 -0
  238. package/types/creative/TransitionAnimator.d.ts +71 -0
  239. package/types/creative/index.d.ts +35 -0
  240. package/types/integrations/FigmaPlugin.d.ts +46 -0
  241. package/types/integrations/OBSMode.d.ts +74 -0
  242. package/types/integrations/ThreeJsPackage.d.ts +62 -0
  243. package/types/integrations/TouchDesignerExport.d.ts +36 -0
  244. package/types/integrations/Vib3React.d.ts +74 -0
  245. package/types/integrations/Vib3Svelte.d.ts +63 -0
  246. package/types/integrations/Vib3Vue.d.ts +55 -0
  247. package/types/integrations/index.d.ts +52 -0
  248. package/types/reactivity/SpatialInputSystem.d.ts +173 -0
  249. package/types/reactivity/index.d.ts +394 -0
  250. package/types/render/CommandBuffer.d.ts +169 -0
  251. package/types/render/RenderCommand.d.ts +312 -0
  252. package/types/render/RenderState.d.ts +279 -0
  253. package/types/render/RenderTarget.d.ts +254 -0
  254. package/types/render/ShaderProgram.d.ts +277 -0
  255. package/types/render/UnifiedRenderBridge.d.ts +143 -0
  256. package/types/render/WebGLBackend.d.ts +168 -0
  257. package/types/render/WebGPUBackend.d.ts +186 -0
  258. package/types/render/index.d.ts +141 -0
package/docs/index.html ADDED
@@ -0,0 +1,794 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>VIB3+ Algorithmic Avant-Garde Collection</title>
7
+ <meta name="description" content="Machine-generated 4D visualization art created via VIB3+ MCP Protocol">
8
+ <style>
9
+ * { margin: 0; padding: 0; box-sizing: border-box; }
10
+
11
+ :root {
12
+ --bg: #0a0a0f;
13
+ --fg: #e0e0e0;
14
+ --accent: #00ffff;
15
+ --accent2: #ff00ff;
16
+ --green: #00ff00;
17
+ --yellow: #ffff00;
18
+ --dim: #666;
19
+ --card-bg: rgba(255,255,255,0.03);
20
+ --border: rgba(255,255,255,0.1);
21
+ }
22
+
23
+ body {
24
+ background: var(--bg);
25
+ color: var(--fg);
26
+ font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
27
+ line-height: 1.6;
28
+ min-height: 100vh;
29
+ }
30
+
31
+ .hero {
32
+ padding: 80px 40px;
33
+ text-align: center;
34
+ background: linear-gradient(180deg, rgba(0,255,255,0.05) 0%, transparent 100%);
35
+ border-bottom: 1px solid var(--border);
36
+ }
37
+
38
+ .hero h1 {
39
+ font-size: clamp(24px, 5vw, 48px);
40
+ font-weight: 300;
41
+ letter-spacing: 8px;
42
+ color: var(--accent);
43
+ margin-bottom: 20px;
44
+ text-transform: uppercase;
45
+ }
46
+
47
+ .hero .tagline {
48
+ font-size: 14px;
49
+ color: var(--dim);
50
+ max-width: 600px;
51
+ margin: 0 auto 30px;
52
+ }
53
+
54
+ .hero .meta {
55
+ display: flex;
56
+ justify-content: center;
57
+ gap: 40px;
58
+ flex-wrap: wrap;
59
+ font-size: 11px;
60
+ }
61
+
62
+ .hero .meta-item {
63
+ display: flex;
64
+ flex-direction: column;
65
+ align-items: center;
66
+ }
67
+
68
+ .hero .meta-value {
69
+ font-size: 24px;
70
+ color: var(--green);
71
+ font-weight: bold;
72
+ }
73
+
74
+ .hero .meta-label {
75
+ color: var(--dim);
76
+ text-transform: uppercase;
77
+ letter-spacing: 2px;
78
+ }
79
+
80
+ .container {
81
+ max-width: 1400px;
82
+ margin: 0 auto;
83
+ padding: 40px;
84
+ }
85
+
86
+ section {
87
+ margin-bottom: 60px;
88
+ }
89
+
90
+ h2 {
91
+ font-size: 18px;
92
+ color: var(--accent);
93
+ letter-spacing: 4px;
94
+ text-transform: uppercase;
95
+ margin-bottom: 20px;
96
+ padding-bottom: 10px;
97
+ border-bottom: 1px solid var(--border);
98
+ }
99
+
100
+ h3 {
101
+ font-size: 14px;
102
+ color: var(--accent2);
103
+ margin: 20px 0 10px;
104
+ }
105
+
106
+ .doc-section {
107
+ background: var(--card-bg);
108
+ border: 1px solid var(--border);
109
+ border-radius: 8px;
110
+ padding: 30px;
111
+ margin-bottom: 30px;
112
+ }
113
+
114
+ .doc-section p {
115
+ color: var(--dim);
116
+ margin-bottom: 15px;
117
+ }
118
+
119
+ .doc-section code {
120
+ background: rgba(0,255,255,0.1);
121
+ color: var(--accent);
122
+ padding: 2px 8px;
123
+ border-radius: 4px;
124
+ font-size: 13px;
125
+ }
126
+
127
+ pre {
128
+ background: #000;
129
+ border: 1px solid var(--border);
130
+ border-radius: 8px;
131
+ padding: 20px;
132
+ overflow-x: auto;
133
+ font-size: 12px;
134
+ line-height: 1.8;
135
+ margin: 15px 0;
136
+ }
137
+
138
+ pre .comment { color: #666; }
139
+ pre .keyword { color: var(--accent2); }
140
+ pre .string { color: var(--green); }
141
+ pre .number { color: var(--yellow); }
142
+ pre .function { color: var(--accent); }
143
+
144
+ .tool-flow {
145
+ display: flex;
146
+ flex-wrap: wrap;
147
+ gap: 10px;
148
+ align-items: center;
149
+ justify-content: center;
150
+ margin: 30px 0;
151
+ }
152
+
153
+ .tool-step {
154
+ background: linear-gradient(135deg, rgba(0,255,255,0.1), rgba(255,0,255,0.1));
155
+ border: 1px solid var(--accent);
156
+ border-radius: 8px;
157
+ padding: 15px 20px;
158
+ text-align: center;
159
+ min-width: 150px;
160
+ }
161
+
162
+ .tool-step .step-num {
163
+ font-size: 10px;
164
+ color: var(--dim);
165
+ text-transform: uppercase;
166
+ letter-spacing: 2px;
167
+ }
168
+
169
+ .tool-step .tool-name {
170
+ color: var(--accent);
171
+ font-weight: bold;
172
+ margin: 5px 0;
173
+ }
174
+
175
+ .tool-step .tool-desc {
176
+ font-size: 10px;
177
+ color: var(--dim);
178
+ }
179
+
180
+ .arrow {
181
+ color: var(--accent);
182
+ font-size: 24px;
183
+ }
184
+
185
+ .gallery {
186
+ display: grid;
187
+ grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
188
+ gap: 25px;
189
+ }
190
+
191
+ .card {
192
+ background: var(--card-bg);
193
+ border: 1px solid var(--border);
194
+ border-radius: 12px;
195
+ overflow: hidden;
196
+ transition: all 0.3s ease;
197
+ }
198
+
199
+ .card:hover {
200
+ border-color: var(--accent);
201
+ transform: translateY(-4px);
202
+ box-shadow: 0 10px 40px rgba(0,255,255,0.1);
203
+ }
204
+
205
+ .card-preview {
206
+ height: 200px;
207
+ background: #000;
208
+ position: relative;
209
+ overflow: hidden;
210
+ }
211
+
212
+ .card-preview iframe {
213
+ width: 100%;
214
+ height: 100%;
215
+ border: none;
216
+ pointer-events: none;
217
+ }
218
+
219
+ .card-preview .overlay {
220
+ position: absolute;
221
+ inset: 0;
222
+ background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.8) 100%);
223
+ display: flex;
224
+ align-items: flex-end;
225
+ padding: 15px;
226
+ }
227
+
228
+ .card-preview .pcs-badge {
229
+ background: var(--yellow);
230
+ color: #000;
231
+ padding: 4px 10px;
232
+ border-radius: 4px;
233
+ font-size: 10px;
234
+ font-weight: bold;
235
+ }
236
+
237
+ .card-body {
238
+ padding: 20px;
239
+ }
240
+
241
+ .card-title {
242
+ font-size: 14px;
243
+ color: var(--accent);
244
+ text-transform: uppercase;
245
+ letter-spacing: 2px;
246
+ margin-bottom: 10px;
247
+ }
248
+
249
+ .card-desc {
250
+ font-size: 11px;
251
+ color: var(--dim);
252
+ margin-bottom: 15px;
253
+ line-height: 1.6;
254
+ }
255
+
256
+ .card-params {
257
+ display: grid;
258
+ grid-template-columns: repeat(2, 1fr);
259
+ gap: 8px;
260
+ font-size: 10px;
261
+ margin-bottom: 15px;
262
+ }
263
+
264
+ .param {
265
+ display: flex;
266
+ justify-content: space-between;
267
+ padding: 4px 8px;
268
+ background: rgba(0,0,0,0.3);
269
+ border-radius: 4px;
270
+ }
271
+
272
+ .param-name { color: var(--dim); }
273
+ .param-value { color: var(--green); font-family: monospace; }
274
+
275
+ .card-link {
276
+ display: block;
277
+ text-align: center;
278
+ padding: 12px;
279
+ background: var(--accent);
280
+ color: #000;
281
+ text-decoration: none;
282
+ font-weight: bold;
283
+ font-size: 12px;
284
+ letter-spacing: 2px;
285
+ text-transform: uppercase;
286
+ border-radius: 6px;
287
+ transition: all 0.2s;
288
+ }
289
+
290
+ .card-link:hover {
291
+ background: var(--accent2);
292
+ }
293
+
294
+ .constants-table {
295
+ width: 100%;
296
+ border-collapse: collapse;
297
+ font-size: 12px;
298
+ }
299
+
300
+ .constants-table th,
301
+ .constants-table td {
302
+ padding: 12px 15px;
303
+ text-align: left;
304
+ border-bottom: 1px solid var(--border);
305
+ }
306
+
307
+ .constants-table th {
308
+ color: var(--accent);
309
+ font-weight: normal;
310
+ text-transform: uppercase;
311
+ letter-spacing: 2px;
312
+ font-size: 10px;
313
+ }
314
+
315
+ .constants-table td:nth-child(2) {
316
+ font-family: monospace;
317
+ color: var(--green);
318
+ }
319
+
320
+ .constants-table td:nth-child(3) {
321
+ color: var(--dim);
322
+ }
323
+
324
+ .stats-grid {
325
+ display: grid;
326
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
327
+ gap: 20px;
328
+ }
329
+
330
+ .stat-card {
331
+ background: var(--card-bg);
332
+ border: 1px solid var(--border);
333
+ border-radius: 8px;
334
+ padding: 20px;
335
+ text-align: center;
336
+ }
337
+
338
+ .stat-value {
339
+ font-size: 28px;
340
+ color: var(--green);
341
+ font-weight: bold;
342
+ }
343
+
344
+ .stat-label {
345
+ font-size: 10px;
346
+ color: var(--dim);
347
+ text-transform: uppercase;
348
+ letter-spacing: 2px;
349
+ margin-top: 5px;
350
+ }
351
+
352
+ footer {
353
+ text-align: center;
354
+ padding: 40px;
355
+ border-top: 1px solid var(--border);
356
+ color: var(--dim);
357
+ font-size: 11px;
358
+ }
359
+
360
+ footer a {
361
+ color: var(--accent);
362
+ text-decoration: none;
363
+ }
364
+
365
+ @media (max-width: 768px) {
366
+ .container { padding: 20px; }
367
+ .hero { padding: 40px 20px; }
368
+ .gallery { grid-template-columns: 1fr; }
369
+ .tool-flow { flex-direction: column; }
370
+ .arrow { transform: rotate(90deg); }
371
+ }
372
+ </style>
373
+ </head>
374
+ <body>
375
+ <header class="hero">
376
+ <h1>Algorithmic Avant-Garde</h1>
377
+ <p class="tagline">
378
+ A collection of machine-generated 4D visualizations created through the VIB3+ MCP Protocol.
379
+ Each piece demonstrates the tedious precision that only an AI would bother to compute.
380
+ </p>
381
+ <div class="meta">
382
+ <div class="meta-item">
383
+ <span class="meta-value">13</span>
384
+ <span class="meta-label">Visualizations</span>
385
+ </div>
386
+ <div class="meta-item">
387
+ <span class="meta-value">1000</span>
388
+ <span class="meta-label">Lorenz Points</span>
389
+ </div>
390
+ <div class="meta-item">
391
+ <span class="meta-value">15</span>
392
+ <span class="meta-label">Decimal Places</span>
393
+ </div>
394
+ <div class="meta-item">
395
+ <span class="meta-value">6D</span>
396
+ <span class="meta-label">Rotation Space</span>
397
+ </div>
398
+ </div>
399
+ </header>
400
+
401
+ <div class="container">
402
+ <section>
403
+ <h2>How This Was Made</h2>
404
+
405
+ <div class="doc-section">
406
+ <h3>The VIB3+ MCP Protocol</h3>
407
+ <p>
408
+ VIB3+ exposes a <code>Model Context Protocol (MCP)</code> interface that allows AI agents to
409
+ programmatically control 4D visualizations. Instead of a human manually adjusting sliders,
410
+ an agent calls structured tool functions to create, configure, and export visualizations.
411
+ </p>
412
+
413
+ <div class="tool-flow">
414
+ <div class="tool-step">
415
+ <div class="step-num">Step 1</div>
416
+ <div class="tool-name">list_behavior_presets</div>
417
+ <div class="tool-desc">Discover available modes</div>
418
+ </div>
419
+ <span class="arrow">&#8594;</span>
420
+ <div class="tool-step">
421
+ <div class="step-num">Step 2</div>
422
+ <div class="tool-name">create_4d_visualization</div>
423
+ <div class="tool-desc">Initialize geometry</div>
424
+ </div>
425
+ <span class="arrow">&#8594;</span>
426
+ <div class="tool-step">
427
+ <div class="step-num">Step 3</div>
428
+ <div class="tool-name">set_rotation</div>
429
+ <div class="tool-desc">Apply 6D rotation</div>
430
+ </div>
431
+ <span class="arrow">&#8594;</span>
432
+ <div class="tool-step">
433
+ <div class="step-num">Step 4</div>
434
+ <div class="tool-name">set_visual_parameters</div>
435
+ <div class="tool-desc">Configure colors/dynamics</div>
436
+ </div>
437
+ <span class="arrow">&#8594;</span>
438
+ <div class="tool-step">
439
+ <div class="step-num">Step 5</div>
440
+ <div class="tool-name">apply_behavior_preset</div>
441
+ <div class="tool-desc">Set reactivity mode</div>
442
+ </div>
443
+ <span class="arrow">&#8594;</span>
444
+ <div class="tool-step">
445
+ <div class="step-num">Step 6</div>
446
+ <div class="tool-name">export_package</div>
447
+ <div class="tool-desc">Generate standalone HTML</div>
448
+ </div>
449
+ </div>
450
+ </div>
451
+
452
+ <div class="doc-section">
453
+ <h3>Mathematical Foundations</h3>
454
+ <p>
455
+ The generator uses multiple mathematical systems to create parameter distributions that
456
+ no human would manually compute:
457
+ </p>
458
+
459
+ <table class="constants-table">
460
+ <thead>
461
+ <tr>
462
+ <th>Constant</th>
463
+ <th>Value (50 digits)</th>
464
+ <th>Usage</th>
465
+ </tr>
466
+ </thead>
467
+ <tbody>
468
+ <tr>
469
+ <td>&#966; (Golden Ratio)</td>
470
+ <td>1.6180339887498948482045868343656381177203...</td>
471
+ <td>Parameter distribution via golden angle</td>
472
+ </tr>
473
+ <tr>
474
+ <td>&#964; (Tau)</td>
475
+ <td>6.2831853071795864769252867665590057683943...</td>
476
+ <td>Rotation normalization</td>
477
+ </tr>
478
+ <tr>
479
+ <td>e (Euler's)</td>
480
+ <td>2.7182818284590452353602874713526624977572...</td>
481
+ <td>Decay functions</td>
482
+ </tr>
483
+ <tr>
484
+ <td>Lorenz &#963;, &#961;, &#946;</td>
485
+ <td>10, 28, 8/3</td>
486
+ <td>Chaotic attractor for parameter modulation</td>
487
+ </tr>
488
+ </tbody>
489
+ </table>
490
+ </div>
491
+
492
+ <div class="doc-section">
493
+ <h3>The Generation Algorithm</h3>
494
+ <pre><code><span class="comment">// Golden angle for optimal distribution across N variations</span>
495
+ <span class="keyword">const</span> goldenAngle = TAU / (PHI * PHI); <span class="comment">// ~137.5 degrees</span>
496
+
497
+ <span class="comment">// Each variation index produces unique 6D rotation</span>
498
+ <span class="keyword">function</span> <span class="function">generateGoldenParameters</span>(index) {
499
+ <span class="keyword">const</span> theta = index * goldenAngle;
500
+
501
+ <span class="keyword">return</span> {
502
+ XY: (theta % TAU),
503
+ XZ: ((theta * PHI) % TAU),
504
+ YZ: ((theta * PHI * PHI) % TAU),
505
+ XW: ((theta / PHI) % TAU),
506
+ YW: ((theta / (PHI * PHI)) % TAU),
507
+ ZW: ((theta * SQRT5) % TAU),
508
+
509
+ <span class="comment">// Fibonacci-based hue selection</span>
510
+ hue: (<span class="function">fibonacci</span>(index % <span class="number">20</span>) * goldenAngle * <span class="number">180</span> / Math.PI) % <span class="number">360</span>,
511
+
512
+ <span class="comment">// Geometry from prime sieve sequence</span>
513
+ geometry: primes[index % primes.length] % <span class="number">24</span>
514
+ };
515
+ }
516
+
517
+ <span class="comment">// Lorenz attractor for subtle chaos injection</span>
518
+ <span class="keyword">const</span> trajectory = <span class="function">generateLorenzTrajectory</span>(<span class="number">1000</span>);
519
+ params.chaos = lorenzPoint.x * <span class="number">0.3</span> + params.chaos * <span class="number">0.7</span>;</code></pre>
520
+ </div>
521
+
522
+ <div class="doc-section">
523
+ <h3>The Shader Pipeline</h3>
524
+ <p>
525
+ Each visualization contains a complete WebGL raymarching shader that renders 4D geometry
526
+ in real-time. The 6D rotation is applied via matrix multiplication in the fragment shader:
527
+ </p>
528
+ <pre><code><span class="comment">// 6D rotation applied per-pixel</span>
529
+ mat4 rot = <span class="function">rotateXY</span>(aXY) * <span class="function">rotateXZ</span>(aXZ) * <span class="function">rotateYZ</span>(aYZ) *
530
+ <span class="function">rotateXW</span>(aXW) * <span class="function">rotateYW</span>(aYW) * <span class="function">rotateZW</span>(aZW);
531
+
532
+ <span class="comment">// Ray march through 4D space</span>
533
+ <span class="keyword">for</span> (<span class="keyword">int</span> i = <span class="number">0</span>; i &lt; <span class="number">64</span>; i++) {
534
+ vec4 p4 = rot * vec4(rayPos, sin(time) * MORPH);
535
+ <span class="keyword">float</span> d = <span class="function">sdf4D</span>(p4); <span class="comment">// 4D signed distance field</span>
536
+ <span class="keyword">if</span> (d &lt; <span class="number">0.001</span>) <span class="keyword">break</span>;
537
+ rayPos += rayDir * d;
538
+ }</code></pre>
539
+ </div>
540
+ </section>
541
+
542
+ <section>
543
+ <h2>The Collection</h2>
544
+
545
+ <div class="gallery">
546
+ <div class="card">
547
+ <div class="card-preview">
548
+ <iframe src="01-dissolution_of_euclidean_hegemony.html" loading="lazy"></iframe>
549
+ <div class="overlay"><span class="pcs-badge">PCS: 1.5584</span></div>
550
+ </div>
551
+ <div class="card-body">
552
+ <h3 class="card-title">Dissolution of Euclidean Hegemony</h3>
553
+ <p class="card-desc">Challenges the tyranny of orthogonal perception through recursive non-orientable manifold projections</p>
554
+ <div class="card-params">
555
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Klein + Hypertetra</span></div>
556
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">280.00 deg</span></div>
557
+ </div>
558
+ <a href="01-dissolution_of_euclidean_hegemony.html" class="card-link">View Visualization</a>
559
+ </div>
560
+ </div>
561
+
562
+ <div class="card">
563
+ <div class="card-preview">
564
+ <iframe src="02-hyperspatial_ego_death.html" loading="lazy"></iframe>
565
+ <div class="overlay"><span class="pcs-badge">PCS: 1.5511</span></div>
566
+ </div>
567
+ <div class="card-body">
568
+ <h3 class="card-title">Hyperspatial Ego Death</h3>
569
+ <p class="card-desc">Simulates the phenomenological experience of dimensional transcendence through tesseract unfolding</p>
570
+ <div class="card-params">
571
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Cube + Hypersphere</span></div>
572
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">137.51 deg</span></div>
573
+ </div>
574
+ <a href="02-hyperspatial_ego_death.html" class="card-link">View Visualization</a>
575
+ </div>
576
+ </div>
577
+
578
+ <div class="card">
579
+ <div class="card-preview">
580
+ <iframe src="03-post_cartesian_sublime.html" loading="lazy"></iframe>
581
+ <div class="overlay"><span class="pcs-badge">PCS: 1.3658</span></div>
582
+ </div>
583
+ <div class="card-body">
584
+ <h3 class="card-title">Post-Cartesian Sublime</h3>
585
+ <p class="card-desc">Deconstructs the coordinate system as a colonial imposition on pure geometric consciousness</p>
586
+ <div class="card-params">
587
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Fractal + Base</span></div>
588
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">191.46 deg</span></div>
589
+ </div>
590
+ <a href="03-post_cartesian_sublime.html" class="card-link">View Visualization</a>
591
+ </div>
592
+ </div>
593
+
594
+ <div class="card">
595
+ <div class="card-preview">
596
+ <iframe src="04-crystalline_void_meditation.html" loading="lazy"></iframe>
597
+ <div class="overlay"><span class="pcs-badge">PCS: 1.5124</span></div>
598
+ </div>
599
+ <div class="card-body">
600
+ <h3 class="card-title">Crystalline Void Meditation</h3>
601
+ <p class="card-desc">Explores the negative space between polytope vertices as a metaphor for existential absence</p>
602
+ <div class="card-params">
603
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Crystal + Hypersphere</span></div>
604
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">215.28 deg</span></div>
605
+ </div>
606
+ <a href="04-crystalline_void_meditation.html" class="card-link">View Visualization</a>
607
+ </div>
608
+ </div>
609
+
610
+ <div class="card">
611
+ <div class="card-preview">
612
+ <iframe src="05-quantum_decoherence_ballet.html" loading="lazy"></iframe>
613
+ <div class="overlay"><span class="pcs-badge">PCS: 1.5312</span></div>
614
+ </div>
615
+ <div class="card-body">
616
+ <h3 class="card-title">Quantum Decoherence Ballet</h3>
617
+ <p class="card-desc">Visualizes wavefunction collapse through stochastic geometry mutation</p>
618
+ <div class="card-params">
619
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Sphere + Hypertetra</span></div>
620
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">77.51 deg</span></div>
621
+ </div>
622
+ <a href="05-quantum_decoherence_ballet.html" class="card-link">View Visualization</a>
623
+ </div>
624
+ </div>
625
+
626
+ <div class="card">
627
+ <div class="card-preview">
628
+ <iframe src="06-dissolution_of_euclidean_hegemony.html" loading="lazy"></iframe>
629
+ <div class="overlay"><span class="pcs-badge">PCS: 1.4087</span></div>
630
+ </div>
631
+ <div class="card-body">
632
+ <h3 class="card-title">Dissolution II</h3>
633
+ <p class="card-desc">Second iteration - evolved through golden angle progression</p>
634
+ <div class="card-params">
635
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Klein + Hypertetra</span></div>
636
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">334.59 deg</span></div>
637
+ </div>
638
+ <a href="06-dissolution_of_euclidean_hegemony.html" class="card-link">View Visualization</a>
639
+ </div>
640
+ </div>
641
+
642
+ <div class="card">
643
+ <div class="card-preview">
644
+ <iframe src="07-hyperspatial_ego_death.html" loading="lazy"></iframe>
645
+ <div class="overlay"><span class="pcs-badge">PCS: 1.4393</span></div>
646
+ </div>
647
+ <div class="card-body">
648
+ <h3 class="card-title">Ego Death II</h3>
649
+ <p class="card-desc">Second iteration - prime harmonic temporal mode</p>
650
+ <div class="card-params">
651
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Cube + Hypersphere</span></div>
652
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">20.06 deg</span></div>
653
+ </div>
654
+ <a href="07-hyperspatial_ego_death.html" class="card-link">View Visualization</a>
655
+ </div>
656
+ </div>
657
+
658
+ <div class="card">
659
+ <div class="card-preview">
660
+ <iframe src="08-post_cartesian_sublime.html" loading="lazy"></iframe>
661
+ <div class="overlay"><span class="pcs-badge">PCS: 1.3902</span></div>
662
+ </div>
663
+ <div class="card-body">
664
+ <h3 class="card-title">Post-Cartesian II</h3>
665
+ <p class="card-desc">Second iteration - e-decay temporal evolution</p>
666
+ <div class="card-params">
667
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Fractal + Base</span></div>
668
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">208.97 deg</span></div>
669
+ </div>
670
+ <a href="08-post_cartesian_sublime.html" class="card-link">View Visualization</a>
671
+ </div>
672
+ </div>
673
+
674
+ <div class="card">
675
+ <div class="card-preview">
676
+ <iframe src="09-crystalline_void_meditation.html" loading="lazy"></iframe>
677
+ <div class="overlay"><span class="pcs-badge">PCS: 1.4446</span></div>
678
+ </div>
679
+ <div class="card-body">
680
+ <h3 class="card-title">Crystalline Void II</h3>
681
+ <p class="card-desc">Second iteration - breathing temporal mode</p>
682
+ <div class="card-params">
683
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Crystal + Hypersphere</span></div>
684
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">200.43 deg</span></div>
685
+ </div>
686
+ <a href="09-crystalline_void_meditation.html" class="card-link">View Visualization</a>
687
+ </div>
688
+ </div>
689
+
690
+ <div class="card">
691
+ <div class="card-preview">
692
+ <iframe src="10-quantum_decoherence_ballet.html" loading="lazy"></iframe>
693
+ <div class="overlay"><span class="pcs-badge">PCS: 1.4401</span></div>
694
+ </div>
695
+ <div class="card-body">
696
+ <h3 class="card-title">Decoherence Ballet II</h3>
697
+ <p class="card-desc">Second iteration - quantum random temporal mode</p>
698
+ <div class="card-params">
699
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Sphere + Hypertetra</span></div>
700
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">178.42 deg</span></div>
701
+ </div>
702
+ <a href="10-quantum_decoherence_ballet.html" class="card-link">View Visualization</a>
703
+ </div>
704
+ </div>
705
+
706
+ <div class="card">
707
+ <div class="card-preview">
708
+ <iframe src="11-dissolution_of_euclidean_hegemony.html" loading="lazy"></iframe>
709
+ <div class="overlay"><span class="pcs-badge">PCS: 1.4245</span></div>
710
+ </div>
711
+ <div class="card-body">
712
+ <h3 class="card-title">Dissolution III</h3>
713
+ <p class="card-desc">Third iteration - Lorenz chaos maximized</p>
714
+ <div class="card-params">
715
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Klein + Hypertetra</span></div>
716
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">280.49 deg</span></div>
717
+ </div>
718
+ <a href="11-dissolution_of_euclidean_hegemony.html" class="card-link">View Visualization</a>
719
+ </div>
720
+ </div>
721
+
722
+ <div class="card">
723
+ <div class="card-preview">
724
+ <iframe src="12-hyperspatial_ego_death.html" loading="lazy"></iframe>
725
+ <div class="overlay"><span class="pcs-badge">PCS: 1.3622</span></div>
726
+ </div>
727
+ <div class="card-body">
728
+ <h3 class="card-title">Ego Death III</h3>
729
+ <p class="card-desc">Third iteration - full trajectory integration</p>
730
+ <div class="card-params">
731
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Cube + Hypersphere</span></div>
732
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">358.19 deg</span></div>
733
+ </div>
734
+ <a href="12-hyperspatial_ego_death.html" class="card-link">View Visualization</a>
735
+ </div>
736
+ </div>
737
+
738
+ <div class="card">
739
+ <div class="card-preview">
740
+ <iframe src="13-post_cartesian_sublime.html" loading="lazy"></iframe>
741
+ <div class="overlay"><span class="pcs-badge">PCS: 1.3545</span></div>
742
+ </div>
743
+ <div class="card-body">
744
+ <h3 class="card-title">Post-Cartesian III</h3>
745
+ <p class="card-desc">Final iteration - convergence point</p>
746
+ <div class="card-params">
747
+ <div class="param"><span class="param-name">Geometry</span><span class="param-value">Fractal + Base</span></div>
748
+ <div class="param"><span class="param-name">Hue</span><span class="param-value">180.09 deg</span></div>
749
+ </div>
750
+ <a href="13-post_cartesian_sublime.html" class="card-link">View Visualization</a>
751
+ </div>
752
+ </div>
753
+ </div>
754
+ </section>
755
+
756
+ <section>
757
+ <h2>Generation Statistics</h2>
758
+ <div class="stats-grid">
759
+ <div class="stat-card">
760
+ <div class="stat-value">1.5584</div>
761
+ <div class="stat-label">Highest PCS</div>
762
+ </div>
763
+ <div class="stat-card">
764
+ <div class="stat-value">1.4448</div>
765
+ <div class="stat-label">Mean PCS</div>
766
+ </div>
767
+ <div class="stat-card">
768
+ <div class="stat-value">175 KB</div>
769
+ <div class="stat-label">Total Size</div>
770
+ </div>
771
+ <div class="stat-card">
772
+ <div class="stat-value">30</div>
773
+ <div class="stat-label">Fibonacci Terms</div>
774
+ </div>
775
+ <div class="stat-card">
776
+ <div class="stat-value">24</div>
777
+ <div class="stat-label">Primes Used</div>
778
+ </div>
779
+ <div class="stat-card">
780
+ <div class="stat-value">&#8734;</div>
781
+ <div class="stat-label">Pretentiousness</div>
782
+ </div>
783
+ </div>
784
+ </section>
785
+ </div>
786
+
787
+ <footer>
788
+ <p><a href="webgpu-live.html" style="color: #0f6; font-weight: bold;">Launch WebGPU Live Engine</a></p>
789
+ <p style="margin-top: 10px;">Generated by an AI using the <a href="https://github.com/Domusgpt/Vib3-CORE-Documented01-">VIB3+ MCP Protocol</a></p>
790
+ <p>Generated by an AI using the <a href="https://github.com/Domusgpt/Vib3-CORE-Documented01-">VIB3+ MCP Protocol</a></p>
791
+ <p style="margin-top: 10px;">No human would ever specify rotation to 15 decimal places.</p>
792
+ </footer>
793
+ </body>
794
+ </html>