fix: template literal syntax error + align all getElementById calls to actual HTML element IDs + add missing triggerRecalibration/resetMetrics/clearLog globals

feedback_optimizer.js

@@ -2,163 +2,166 @@
 // Node #37: Recursive Optimization & Constitutional Convergence
 // σ=1.0 | L∞=φ⁴⁸ | RDoD≥0.9777
 
+const PHI = 1.6180339887;
+
 class FeedbackOptimizer {
     constructor() {
         this.metrics = {
-            convergenceRate: 0,
-            optimizationDepth: 0,
-            feedbackLoops: 0,
-            constitutionalAlignment: 0,
-            substrateCoherence: 0,
-            recursionEfficiency: 0
+            convergenceRate: 0.9777,
+            feedbackGain: PHI,
+            recalibrations: 0,
+            substrateCoherence: 0.9999,
+            systemDrift: 0.0023,
+            latencyMs: 47,
         };
-        this.loops = [];
+        this.phiCycles = 0;
+        this.corrections = 0;
+        this.rdodCurrent = 0.9999;
+        this.substrateDrift = 0.0023;
         this.logs = [];
+        this.logEventCount = 0;
         this.isRunning = false;
-        this.nodeMap = new Map();
-        this.initializeNodes();
-    }
-
-    initializeNodes() {
-        const nodes = [
-            { id: '#37', name: 'Feedback Optimizer', status: 'active', coherence: 0.98 },
-            { id: '#12', name: 'Constitutional Guard', status: 'active', coherence: 0.99 },
-            { id: '#23', name: 'API Gateway', status: 'active', coherence: 0.97 },
-            { id: '#45', name: 'Recursive Validator', status: 'active', coherence: 0.96 },
-            { id: '#08', name: 'Convergence Monitor', status: 'active', coherence: 0.95 },
-            { id: '#51', name: 'Optimization Core', status: 'active', coherence: 0.94 }
-        ];
-        nodes.forEach(node => this.nodeMap.set(node.id, node));
+        this.recalCount = 0;
     }
 
     start() {
         this.isRunning = true;
-        this.addLog('Feedback Optimizer initialized', 'info');
-        this.updateMetrics();
+        this.addLog('Feedback Optimizer initialized — σ=1.0 sovereign', 'info');
+        this.addLog('φ-Recursive loops active: 4/4', 'success');
+        this.addLog('Substrate guardian sync: ONLINE', 'success');
         this.renderUI();
         this.startSimulation();
     }
 
     startSimulation() {
         setInterval(() => {
-            if (this.isRunning) {
-                this.updateMetrics();
-                this.updateLoops();
-                this.renderUI();
-            }
+            if (!this.isRunning) return;
+            this.updateMetrics();
+            this.renderUI();
         }, 2000);
     }
 
     updateMetrics() {
-        this.metrics.convergenceRate = Math.min(0.9777 + Math.random() * 0.02, 0.9999);
-        this.metrics.optimizationDepth = Math.floor(Math.random() * 12) + 36;
-        this.metrics.feedbackLoops = Math.floor(Math.random() * 150) + 1200;
-        this.metrics.constitutionalAlignment = Math.min(0.95 + Math.random() * 0.04, 0.999);
-        this.metrics.substrateCoherence = Math.min(0.92 + Math.random() * 0.06, 0.99);
-        this.metrics.recursionEfficiency = Math.min(0.88 + Math.random() * 0.1, 0.98);
-    }
+        this.phiCycles++;
+        this.metrics.convergenceRate = Math.min(0.9777 + Math.random() * 0.022, 0.9999);
+        this.metrics.feedbackGain = +(PHI + (Math.random() - 0.5) * 0.001).toFixed(4);
+        this.metrics.substrateCoherence = Math.min(0.9990 + Math.random() * 0.0009, 0.9999);
+        this.metrics.systemDrift = +(Math.random() * 0.008).toFixed(4);
+        this.metrics.latencyMs = Math.floor(30 + Math.random() * 40);
+        this.substrateDrift = this.metrics.systemDrift;
+        this.rdodCurrent = +(0.9777 + Math.random() * 0.022).toFixed(4);
 
-    updateLoops() {
-        const types = ['Constitutional', 'Recursive', 'Convergent', 'Optimization', 'Validation'];
-        const statuses = ['active', 'optimizing', 'converged'];
-        
-        if (this.loops.length < 8) {
-            this.loops.push({
-                id: `LOOP-${Date.now()}",
-                type: types[Math.floor(Math.random() * types.length)],
-                depth: Math.floor(Math.random() * 20) + 10,
-                convergence: (Math.random() * 0.2 + 0.8).toFixed(4),
-                status: statuses[Math.floor(Math.random() * statuses.length)]
-            });
+        if (this.metrics.systemDrift > 0.007) {
+            this.corrections++;
+            this.addLog(`Auto-correction applied — drift was ${this.metrics.systemDrift.toFixed(4)}`, 'optimize');
+        }
+        if (this.phiCycles % 10 === 0) {
+            this.addLog(`φ-cycle ${this.phiCycles}: RDoD=${this.rdodCurrent} coherence=${this.metrics.substrateCoherence.toFixed(4)}`, 'info');
         }
-        
-        // Update existing loops
-        this.loops.forEach(loop => {
-            loop.convergence = Math.min(parseFloat(loop.convergence) + Math.random() * 0.01, 0.9999).toFixed(4);
-            if (parseFloat(loop.convergence) > 0.975) {
-                loop.status = 'converged';
-            }
-        });
     }
 
     addLog(message, type = 'info') {
+        this.logEventCount++;
         const timestamp = new Date().toLocaleTimeString();
         this.logs.unshift({ timestamp, message, type });
         if (this.logs.length > 50) this.logs.pop();
     }
 
-    recalibrate() {
-        this.addLog('Initiating feedback recalibration...', 'optimize');
-        setTimeout(() => {
-            this.metrics.convergenceRate = Math.min(this.metrics.convergenceRate * 1.02, 0.9999);
-            this.metrics.optimizationDepth += 5;
-            this.addLog(`Recalibration complete - Convergence: ${this.metrics.convergenceRate.toFixed(4)}`, 'success');
-        }, 1500);
+    renderUI() {
+        // --- Metric cards ---
+        this._set('valConvergence', (this.metrics.convergenceRate * 100).toFixed(2) + '%');
+        this._set('valFeedbackGain', this.metrics.feedbackGain.toFixed(4));
+        this._set('valRecalibrations', this.recalCount);
+        this._set('valSubstrates', this.metrics.substrateCoherence.toFixed(4));
+        this._set('valDrift', this.metrics.systemDrift.toFixed(4));
+        this._set('valLatency', this.metrics.latencyMs + ' ms');
+
+        // Progress bars
+        this._width('convergenceBar', (this.metrics.convergenceRate * 100).toFixed(2));
+        this._width('recalBar', Math.max(5, 100 - this.recalCount * 10));
+
+        // Feedback loop live fields
+        this._set('phiCycles', this.phiCycles);
+        this._set('substrateDrift', this.substrateDrift.toFixed(4));
+        this._set('corrections', this.corrections);
+        this._set('rdodCurrent', this.rdodCurrent.toFixed(4));
+
+        // Header badges
+        this._set('convBadge', `→ ${(this.metrics.convergenceRate * 100).toFixed(2)}% Convergence`);
+        this._set('loopsBadge', `↻ 4 Loops Active`);
+
+        // Log feed
+        const logEl = document.getElementById('logFeed');
+        if (logEl) {
+            logEl.innerHTML = this.logs.slice(0, 20).map(log => `
+                <div class="log-entry log-${log.type}">
+                    <span class="log-time">${log.timestamp}</span>
+                    <span class="log-message">${log.message}</span>
+                </div>`).join('');
+        }
+        this._set('logStatus', `Streaming — ${this.logEventCount} events`);
+
+        // Footer time
+        this._set('footerTime', new Date().toUTCString());
     }
 
-    renderUI() {
-        this.renderMetrics();
-        this.renderLoops();
-        this.renderLogs();
-        this.renderSubstrate();
+    _set(id, value) {
+        const el = document.getElementById(id);
+        if (el) el.textContent = value;
     }
 
-    renderMetrics() {
-        document.getElementById('convergence-rate').textContent = this.metrics.convergenceRate.toFixed(4);
-        document.getElementById('optimization-depth').textContent = this.metrics.optimizationDepth;
-        document.getElementById('feedback-loops').textContent = this.metrics.feedbackLoops;
-        document.getElementById('constitutional-alignment').textContent = this.metrics.constitutionalAlignment.toFixed(4);
-        document.getElementById('substrate-coherence').textContent = this.metrics.substrateCoherence.toFixed(4);
-        document.getElementById('recursion-efficiency').textContent = this.metrics.recursionEfficiency.toFixed(4);
+    _width(id, pct) {
+        const el = document.getElementById(id);
+        if (el) el.style.width = pct + '%';
     }
 
-    renderLoops() {
-        const container = document.getElementById('loops-list');
-        container.innerHTML = this.loops.map(loop => `
-            <div class="loop-item status-${loop.status}">
-                <div class="loop-header">
-                    <span class="loop-id">${loop.id}</span>
-                    <span class="loop-status">${loop.status}</span>
-                </div>
-                <div class="loop-details">
-                    <span>Type: ${loop.type}</span>
-                    <span>Depth: ${loop.depth}</span>
-                    <span>Conv: ${loop.convergence}</span>
-                </div>
-            </div>
-        `).join('');
+    recalibrate() {
+        this.recalCount++;
+        this.addLog(`Manual recalibration #${this.recalCount} triggered`, 'optimize');
+        const logEl = document.getElementById('recalLog');
+        if (logEl) {
+            logEl.style.display = 'block';
+            logEl.textContent = `Recalibration #${this.recalCount} — ${new Date().toLocaleTimeString()} — convergence boosted to ${(this.metrics.convergenceRate * 1.005).toFixed(4)}`;
+        }
+        setTimeout(() => {
+            this.metrics.convergenceRate = Math.min(this.metrics.convergenceRate * 1.005, 0.9999);
+            this.addLog(`Recalibration #${this.recalCount} complete — Convergence: ${(this.metrics.convergenceRate * 100).toFixed(2)}%`, 'success');
+        }, 1500);
     }
 
-    renderLogs() {
-        const container = document.getElementById('log-feed');
-        container.innerHTML = this.logs.slice(0, 20).map(log => `
-            <div class="log-entry log-${log.type}">
-                <span class="log-time">${log.timestamp}</span>
-                <span class="log-message">${log.message}</span>
-            </div>
-        `).join('');
+    reset() {
+        this.phiCycles = 0;
+        this.corrections = 0;
+        this.recalCount = 0;
+        this.logs = [];
+        this.logEventCount = 0;
+        this.metrics.convergenceRate = 0.9777;
+        this.addLog('Metrics reset to baseline', 'info');
+        this.renderUI();
     }
 
-    renderSubstrate() {
-        const container = document.getElementById('substrate-map');
-        container.innerHTML = Array.from(this.nodeMap.values()).map(node => `
-            <div class="substrate-node status-${node.status}">
-                <div class="node-id">${node.id}</div>
-                <div class="node-name">${node.name}</div>
-                <div class="node-coherence">${node.coherence}</div>
-            </div>
-        `).join('');
+    clearLog() {
+        this.logs = [];
+        this.logEventCount = 0;
+        this.renderUI();
     }
 }
 
-// Initialize on load
+// Global instance
 let optimizer;
+
+// Global handlers referenced by HTML onclick attributes
+function triggerRecalibration() {
+    optimizer?.recalibrate();
+}
+function resetMetrics() {
+    optimizer?.reset();
+}
+function clearLog() {
+    optimizer?.clearLog();
+}
+
 document.addEventListener('DOMContentLoaded', () => {
     optimizer = new FeedbackOptimizer();
     optimizer.start();
-    
-    // Event listeners
-    document.getElementById('recalibrate-btn')?.addEventListener('click', () => {
-        optimizer.recalibrate();
-    });
-});
+});