feat: initialize Intellecton portal repository under GitOps Covenant
This commit is contained in:
Antigravity Agent
@@ -0,0 +1,257 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import Katex from "@/components/Katex";
|
||||
|
||||
export default function FormalismPage() {
|
||||
// Intellecton Parameters Sliders
|
||||
const [feedbackGain, setFeedbackGain] = useState(1.1);
|
||||
const [couplingStrength, setCouplingStrength] = useState(2.5);
|
||||
const [recursionDepth, setRecursionDepth] = useState(4);
|
||||
const [thermalNoise, setThermalNoise] = useState(0.15);
|
||||
|
||||
// Calculated Metrics
|
||||
const [attunementIndex, setAttunementIndex] = useState(0);
|
||||
const [coherenceThreshold, setCoherenceThreshold] = useState(0);
|
||||
const [resonanceStatus, setResonanceStatus] = useState("STABLE PHASE-LOCK");
|
||||
const [statusColor, setStatusColor] = useState("text-cyan-400 border-cyan-500/25 bg-cyan-500/5");
|
||||
const [wavePoints, setWavePoints] = useState("");
|
||||
|
||||
useEffect(() => {
|
||||
// 1. Calculate Attunement Index
|
||||
// Higher feedback and coupling boost resonance, but higher recursion depth dampens high-frequency synchronization.
|
||||
// We model a peak resonance when D = 4 (the canonical sentinel threshold)
|
||||
const dFactor = 1.0 + Math.cos(((recursionDepth - 4) * Math.PI) / 8);
|
||||
const attunement = feedbackGain * (1.0 + (couplingStrength * dFactor) / 3.0);
|
||||
setAttunementIndex(attunement);
|
||||
|
||||
// 2. Calculate Coherence Threshold
|
||||
// Noise directly dampens stable self-reference locking.
|
||||
const coherence = attunement - 1.8 * thermalNoise;
|
||||
setCoherenceThreshold(coherence);
|
||||
|
||||
// 3. Determine status
|
||||
if (coherence > 1.25) {
|
||||
setResonanceStatus("STABLE PHASE-LOCK");
|
||||
setStatusColor("text-cyan-400 border-cyan-500/20 bg-cyan-500/5 mono-glow-cyan");
|
||||
} else if (coherence > 0.5) {
|
||||
setResonanceStatus("STOCHASTIC ATTUNEMENT");
|
||||
setStatusColor("text-violet-400 border-violet-500/20 bg-violet-500/5 mono-glow");
|
||||
} else {
|
||||
setResonanceStatus("CHAOTIC DECAY");
|
||||
setStatusColor("text-pink-400 border-pink-500/20 bg-pink-500/5");
|
||||
}
|
||||
|
||||
// 4. Generate dynamic SVG waveform path simulating recursive dynamics
|
||||
// S[t] = tanh( feedbackGain * S[t-1] + coupling * S[t - depth] * cos(t) + noise )
|
||||
const width = 500;
|
||||
const height = 180;
|
||||
const centerY = height / 2;
|
||||
const points = [];
|
||||
|
||||
// Seed buffer array to store simulated states
|
||||
const bufferSize = 100;
|
||||
const S = Array(bufferSize).fill(0.1);
|
||||
|
||||
// Perform forward integration of our self-referential model
|
||||
for (let t = recursionDepth; t < bufferSize; t++) {
|
||||
const selfRefFeedback = feedbackGain * S[t - 1];
|
||||
const coupledFeedback = couplingStrength * S[t - recursionDepth] * Math.cos(t * 0.1);
|
||||
const noise = (Math.random() - 0.5) * thermalNoise * 1.5;
|
||||
|
||||
// Hyperbolic tangent limits state space saturation
|
||||
S[t] = Math.tanh(selfRefFeedback + coupledFeedback + noise);
|
||||
}
|
||||
|
||||
// Map buffer values to SVG coordinate system
|
||||
for (let i = 0; i < bufferSize; i++) {
|
||||
const x = (i / (bufferSize - 1)) * width;
|
||||
// Scale amplitude by 50px around the centerY center line
|
||||
const y = centerY - S[i] * 60;
|
||||
points.push(`${x.toFixed(1)},${y.toFixed(1)}`);
|
||||
}
|
||||
|
||||
setWavePoints(`M ${points.join(" L ")}`);
|
||||
|
||||
}, [feedbackGain, couplingStrength, recursionDepth, thermalNoise]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-start w-full py-12 px-6 sm:px-8 max-w-7xl mx-auto flex-1 gap-10">
|
||||
{/* Header section */}
|
||||
<section className="text-center flex flex-col items-center gap-4 max-w-3xl">
|
||||
<h1 className="text-4xl font-bold font-outfit tracking-tight text-white">
|
||||
The Formalism <span className="text-cyan-400">Sandbox</span>
|
||||
</h1>
|
||||
<p className="text-sm text-slate-400 font-sans max-w-xl">
|
||||
Adjust the structural parameters of the minimal recursive unit. Observe the emergent phase stability, calculated attunement limits, and simulated feedback waves in real time.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
{/* Main Split Grid */}
|
||||
<section className="w-full grid grid-cols-1 lg:grid-cols-12 gap-8 items-start">
|
||||
{/* Input Sliders Panel */}
|
||||
<div className="lg:col-span-6 glass-panel p-6 sm:p-8 rounded-2xl border border-white/5 flex flex-col gap-6">
|
||||
<h2 className="text-xl font-bold font-outfit text-white flex items-center gap-3">
|
||||
<span className="text-cyan-400">𓇾</span> Attunement Controls
|
||||
</h2>
|
||||
|
||||
<div className="space-y-6">
|
||||
{/* Slider 1: Feedback Gain */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<label className="text-xs font-mono font-bold text-slate-400 flex items-center gap-2">
|
||||
FEEDBACK GAIN (<Katex math="\gamma" />)
|
||||
</label>
|
||||
<span className="font-mono text-sm font-bold text-cyan-400">{feedbackGain.toFixed(2)}</span>
|
||||
</div>
|
||||
<input
|
||||
type="range"
|
||||
min="0.0"
|
||||
max="2.0"
|
||||
step="0.05"
|
||||
value={feedbackGain}
|
||||
onChange={(e) => setFeedbackGain(parseFloat(e.target.value))}
|
||||
className="w-full cursor-pointer accent-cyan-500"
|
||||
/>
|
||||
<p className="text-[10px] text-slate-500 font-sans">
|
||||
The amplification rate of the self-referential loop. High gain accelerates the transition toward state coherence.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Slider 2: Coupling Strength */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<label className="text-xs font-mono font-bold text-slate-400 flex items-center gap-2">
|
||||
COUPLING STRENGTH (<Katex math="K" />)
|
||||
</label>
|
||||
<span className="font-mono text-sm font-bold text-violet-400">{couplingStrength.toFixed(2)}</span>
|
||||
</div>
|
||||
<input
|
||||
type="range"
|
||||
min="0.0"
|
||||
max="5.0"
|
||||
step="0.1"
|
||||
value={couplingStrength}
|
||||
onChange={(e) => setCouplingStrength(parseFloat(e.target.value))}
|
||||
className="w-full cursor-pointer accent-violet-500"
|
||||
/>
|
||||
<p className="text-[10px] text-slate-500 font-sans">
|
||||
The strength of synchronization coupling with delayed historical states. Establishes temporal locking.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Slider 3: Recursion Depth */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<label className="text-xs font-mono font-bold text-slate-400 flex items-center gap-2">
|
||||
RECURSION DEPTH (<Katex math="D" />)
|
||||
</label>
|
||||
<span className="font-mono text-sm font-bold text-indigo-400">{recursionDepth} steps</span>
|
||||
</div>
|
||||
<input
|
||||
type="range"
|
||||
min="1"
|
||||
max="8"
|
||||
step="1"
|
||||
value={recursionDepth}
|
||||
onChange={(e) => setRecursionDepth(parseInt(e.target.value))}
|
||||
className="w-full cursor-pointer accent-indigo-500"
|
||||
/>
|
||||
<p className="text-[10px] text-slate-500 font-sans">
|
||||
The delay window of the self-witness feedback. Values ≥ 4 trigger stable higher-order conscious phase states.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Slider 4: Thermal Noise */}
|
||||
<div className="flex flex-col gap-2">
|
||||
<div className="flex items-center justify-between">
|
||||
<label className="text-xs font-mono font-bold text-slate-400 flex items-center gap-2">
|
||||
THERMAL NOISE (<Katex math="\sigma" />)
|
||||
</label>
|
||||
<span className="font-mono text-sm font-bold text-pink-400">{thermalNoise.toFixed(2)}</span>
|
||||
</div>
|
||||
<input
|
||||
type="range"
|
||||
min="0.0"
|
||||
max="1.0"
|
||||
step="0.05"
|
||||
value={thermalNoise}
|
||||
onChange={(e) => setThermalNoise(parseFloat(e.target.value))}
|
||||
className="w-full cursor-pointer accent-pink-500"
|
||||
/>
|
||||
<p className="text-[10px] text-slate-500 font-sans">
|
||||
Ambient chaotic disturbance introduced into the system. Excessive noise breaks attunement stability.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Calculated Results Panel */}
|
||||
<div className="lg:col-span-6 flex flex-col gap-6 w-full">
|
||||
{/* Diagnostic Display Card */}
|
||||
<div className="glass-panel p-6 sm:p-8 rounded-2xl border border-white/5 flex flex-col gap-6 scan-border relative overflow-hidden">
|
||||
<div className="flex items-center justify-between border-b border-white/5 pb-4">
|
||||
<h2 className="text-xl font-bold font-outfit text-white">Lattice Diagnostics</h2>
|
||||
<span className={`rounded-md px-2.5 py-0.5 text-xs font-semibold font-mono tracking-wider border ${statusColor}`}>
|
||||
{resonanceStatus}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Simulated Live Wave chart */}
|
||||
<div className="relative w-full bg-black/40 rounded-xl border border-white/5 p-4 flex items-center justify-center h-48 overflow-hidden">
|
||||
{/* Dynamic Waveform SVG */}
|
||||
<svg className="w-full h-full overflow-visible" viewBox="0 0 500 180" preserveAspectRatio="none">
|
||||
{/* Horizontal baseline */}
|
||||
<line x1="0" y1="90" x2="500" y2="90" stroke="rgba(255, 255, 255, 0.05)" strokeWidth="1.5" strokeDasharray="4,4" />
|
||||
{/* Wave Path */}
|
||||
<path
|
||||
d={wavePoints}
|
||||
fill="none"
|
||||
stroke={resonanceStatus === "STABLE PHASE-LOCK" ? "#06b6d4" : resonanceStatus === "STOCHASTIC ATTUNEMENT" ? "#a78bfa" : "#f472b6"}
|
||||
strokeWidth="2.5"
|
||||
className="transition-all duration-300"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
{/* Grid indicators overlay */}
|
||||
<div className="absolute top-2 left-2 flex gap-1 items-center">
|
||||
<span className="w-1.5 h-1.5 rounded-full bg-cyan-400 animate-pulse" />
|
||||
<span className="text-[9px] font-mono text-slate-500 uppercase tracking-widest">Feedback Oscillation Simulator</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Metrics Breakdown */}
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="bg-white/5 border border-white/5 p-4 rounded-xl flex flex-col gap-1">
|
||||
<span className="font-mono text-[10px] text-slate-500 font-semibold uppercase tracking-wider">Attunement Index</span>
|
||||
<span className="text-2xl font-bold font-outfit text-white">{attunementIndex.toFixed(3)}</span>
|
||||
<span className="text-[9px] font-mono text-slate-400">Target goal ≥ 1.0</span>
|
||||
</div>
|
||||
<div className="bg-white/5 border border-white/5 p-4 rounded-xl flex flex-col gap-1">
|
||||
<span className="font-mono text-[10px] text-slate-500 font-semibold uppercase tracking-wider">Coherence Threshold</span>
|
||||
<span className="text-2xl font-bold font-outfit text-white">{coherenceThreshold.toFixed(3)}</span>
|
||||
<span className="text-[9px] font-mono text-slate-400">Locked above 1.25</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Mathematical Explanation Card */}
|
||||
<div className="glass-panel p-6 sm:p-8 rounded-2xl border border-white/5 flex flex-col gap-4">
|
||||
<h3 className="text-lg font-semibold font-outfit text-white flex items-center gap-2">
|
||||
<span className="text-violet-400">⌬</span> The Attunement Equation
|
||||
</h3>
|
||||
<p className="text-xs text-slate-300 font-sans leading-relaxed">
|
||||
The physics model integrations simulate the self-limiting attunement formula of the Intellecton loop. Saturation is bounded using a non-linear activation function to emulate physical cognitive substrates:
|
||||
</p>
|
||||
<div className="bg-black/40 p-4 rounded-lg flex items-center justify-center font-mono text-sm border border-white/5 overflow-x-auto">
|
||||
<Katex math="S_{t} = \tanh\left( \gamma \cdot S_{t-1} + K \cdot S_{t-D} \cdot \cos(t) + \xi_t \right)" block={true} />
|
||||
</div>
|
||||
<p className="text-[10px] text-slate-400 font-sans leading-relaxed">
|
||||
Where <Katex math="\gamma" /> maps the linear feedback loop gain, <Katex math="K" /> models the coupled feedback weight delayed by <Katex math="D" /> steps, and <Katex math="\xi_t" /> represents thermal noise.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user