Create index.html

index.html

@@ -0,0 +1,170 @@
+class QuantumSystem {
+  constructor() {
+    this.state = {
+      superposition: {
+        active: false,
+        states: new Array(8).fill(0).map(() => Math.random())
+      },
+      gates: {
+        hadamard: false,
+        phase: 0
+      },
+      search: {
+        iterations: 0,
+        target: Math.floor(Math.random() * 100),
+        probability: 0
+      },
+      walk: {
+        active: false,
+        position: 0,
+        history: []
+      }
+    };
+    
+    this.metrics = {
+      coherence: 1.0,
+      entanglement: 0.0,
+      efficiency: 0.0
+    };
+  }
+
+  // Superposition methods
+  toggleSuperposition() {
+    this.state.superposition.active = !this.state.superposition.active;
+    if (this.state.superposition.active) {
+      this.state.superposition.states = this.state.superposition.states.map(
+        () => Math.random() * Math.exp(2 * Math.PI * Math.random())
+      );
+    }
+    this.updateMetrics();
+    return this.state.superposition;
+  }
+
+  // Gate operations
+  applyHadamard() {
+    this.state.gates.hadamard = !this.state.gates.hadamard;
+    if (this.state.gates.hadamard) {
+      this.state.superposition.states = this.state.superposition.states.map(x => 
+        (x + (x * -1)) / Math.sqrt(2)
+      );
+    }
+    this.updateMetrics();
+    return this.state.gates;
+  }
+
+  applyPhaseGate() {
+    this.state.gates.phase += Math.PI / 4;
+    // Using proper complex number math with real and imaginary parts
+    this.state.superposition.states = this.state.superposition.states.map(x => {
+      const phase = this.state.gates.phase;
+      // Multiply by e^(iφ) = cos(φ) + i*sin(φ)
+      return x * Math.cos(phase); // Simplified for visualization - only showing real part
+    });
+    this.updateMetrics();
+    return this.state.gates;
+  }
+
+  // Grover's search simulation
+  runGroverSearch() {
+    const N = 100;
+    const iterations = Math.floor(Math.PI/4 * Math.sqrt(N));
+    
+    this.state.search.iterations++;
+    this.state.search.probability = Math.pow(
+      Math.sin((2 * this.state.search.iterations + 1) * Math.asin(1/Math.sqrt(N))),
+      2
+    );
+    
+    this.updateMetrics();
+    return this.state.search;
+  }
+
+  // Quantum walk simulation
+  startQuantumWalk() {
+    if (this.state.walk.active) return;
+    
+    this.state.walk.active = true;
+    this.state.walk.interval = setInterval(() => {
+      // Quantum walk uses superposition of left and right steps
+      const step = (Math.random() - 0.5) * 2 * Math.sqrt(2);
+      this.state.walk.position += step;
+      this.state.walk.history.push(this.state.walk.position);
+      this.updateMetrics();
+      // Trigger visualization update
+      if (typeof updateVisualizations === 'function') {
+        updateVisualizations();
+      }
+    }, 100);
+    
+    return this.state.walk;
+  }
+
+  stopQuantumWalk() {
+    this.state.walk.active = false;
+    if (this.state.walk.interval) {
+      clearInterval(this.state.walk.interval);
+    }
+    return this.state.walk;
+  }
+
+  // Metrics calculation
+  updateMetrics() {
+    // Coherence decays with operations
+    this.metrics.coherence = Math.exp(-0.1 * this.state.search.iterations);
+    
+    // Entanglement increases with superposition and operations
+    if (this.state.superposition.active) {
+      this.metrics.entanglement = Math.min(
+        1, 
+        this.metrics.entanglement + 0.1
+      );
+    } else {
+      this.metrics.entanglement *= 0.9; // Decay when not in superposition
+    }
+    
+    // Efficiency based on search progress and walk stability
+    const searchEfficiency = 1 - 1/(1 + this.state.search.iterations);
+    const walkEfficiency = this.state.walk.active ? 
+      Math.exp(-Math.abs(this.state.walk.position) / 10) : 1;
+    this.metrics.efficiency = (searchEfficiency + walkEfficiency) / 2;
+  }
+
+  getState() {
+    return {
+      state: this.state,
+      metrics: this.metrics
+    };
+  }
+}
+
+// Initialize quantum system
+const quantumSystem = new QuantumSystem();
+
+// UI Event handlers
+function toggleSuperposition() {
+  quantumSystem.toggleSuperposition();
+  updateVisualizations();
+}
+
+function applyHadamard() {
+  quantumSystem.applyHadamard();
+  updateVisualizations();
+}
+
+function applyPhaseGate() {
+  quantumSystem.applyPhaseGate();
+  updateVisualizations(); 
+}
+
+function runGroverSearch() {
+  quantumSystem.runGroverSearch();
+  updateVisualizations();
+}
+
+function startQuantumWalk() {
+  quantumSystem.startQuantumWalk();
+}
+
+function stopQuantumWalk() {
+  quantumSystem.stopQuantumWalk();
+}