-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmodel.html
77 lines (77 loc) · 4.01 KB
/
model.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Virtual Quantum Chatbot</title>
<style>
body, input, h1 { font-family: 'Times New Roman', serif; }
body { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100vh; background-color: #fff; margin: 0; }
#container { text-align: center; margin-bottom: 2rem; }
#user_input { width: 80%; padding: 0.5rem; font-size: 1rem; border: 1px solid #ccc; border-radius: 4px; }
#quantumFieldContainer { position: relative; width: 400px; height: 400px; border-radius: 50%; border: 1px solid #000; margin-top: 2rem; animation: spin 10s linear infinite; transform-style: preserve-3d; }
.innerSphere { position: absolute; width: 50px; height: 50px; border-radius: 50%; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #000; animation: glow 3s infinite; }
.quantumBit { position: absolute; width: 60px; height: 60px; transform-origin: 200px 200px; text-align: center; line-height: 60px; font-size: 30px; color: #ff0000; text-shadow: 0 0 10px #ff0000; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes glow { 0%, 100% { box-shadow: 0 0 5px #000, 0 0 10px #000, 0 0 20px #000, 0 0 30px #000; } 50% { box-shadow: 0 0 10px #ff0000, 0 0 20px #ff0000, 0 0 30px #ff0000, 0 0 40px #ff0000; } }
</style>
</head>
<body>
<div id="container">
<h1>Virtual Quantum Chatbot</h1>
<input type="text" id="user_input" placeholder="Type your query and hit Enter..." onkeypress="handleKeyPress(event)">
</div>
<div id="quantumFieldContainer">
<div class="innerSphere" id="innerSphere"></div>
</div>
<script>
const audioContext = new AudioContext();
const charToNote = { 'O': 261.63, '1': 293.66, '2': 329.63, 'H': 349.23, '𝕏': 392.00, '+': 440.00, '0': 493.88 };
const rollQuantumDie = () => ['H', '𝕏', '+'][Math.floor(Math.random() * 3)];
const virtualSchrodingersCat = () => Math.random() < 0.5 ? '0' : '1';
const virtualHamzatsCat = () => ['O', '1', '2'][Math.floor(Math.random() * 3)];
function playNote(frequency, delay) {
const oscillator = audioContext.createOscillator();
oscillator.type = 'sine';
oscillator.frequency.setValueAtTime(frequency, audioContext.currentTime + delay);
oscillator.connect(audioContext.destination);
oscillator.start(audioContext.currentTime + delay);
oscillator.stop(audioContext.currentTime + delay + 0.5);
}
function fusionProcessor(quantumBit, schrodingersCat, hamzatsCat) {
const fusionState = `${quantumBit}${schrodingersCat}${hamzatsCat}`;
const innerSphere = document.getElementById('innerSphere');
let color = '#ff0000';
switch (fusionState) {
case 'H11':
case '𝕏00':
color = '#00ff00';
break;
case 'H00':
case '𝕏11':
color = '#0000ff';
break;
case '𝕏10':
case 'H01':
color = '#ffff00';
break;
default:
const sum = fusionState.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0);
color = (sum % 2 === 0) ? '#ff00ff' : '#00ffff';
break;
}
innerSphere.style.backgroundColor = color;
const lastBit = document.querySelector('.quantumBit:last-child');
if (lastBit) {
lastBit.innerText = `${fusionState} -> ${color}`;
}
}
function handleKeyPress(event) {
if (event.key === 'Enter') {
getResponse();
event.preventDefault();
}
}
</script>
</body>
</html>