Hugging Face's logo

Spaces:
LordXido
/
CodexWebVM
Sleeping

App Files Community
LordXido commited on
Commit
8aab958
·
verified ·
1 Parent(s): 79c7375

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +161 -22
index.html CHANGED
@@ -1,29 +1,168 @@
1
  <!DOCTYPE html>
2
  <html lang="en">
3
  <head>
4
- <meta charset="UTF-8">
5
- <title>CodexWebVM — Self-Hosting Cognitive Engine</title>
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
7
- <link rel="stylesheet" href="style.css">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
  </head>
9
  <body>
10
- <header>
11
- <h1>🚀 CodexWebVM — Interactive SVG Cognitive Engine</h1>
12
- <p class="equation">dΞ/dt = −Λ ∇Ξ (Θ + Φ − Ψ + Ω)</p>
13
- </header>
14
-
15
- <main class="container">
16
- <!-- Live SVG Engine -->
17
- <svg id="svgEngine" viewBox="-250 -250 500 500"></svg>
18
-
19
- <!-- Control Panel -->
20
- <section class="panel">
21
- <label for="psiInput">Ψ(t) — Intent Vector</label>
22
- <input id="psiInput" placeholder="Type intent & press Enter">
23
- <div id="log" class="log"></div>
24
- </section>
25
- </main>
26
-
27
- <script src="engine.js"></script>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
28
  </body>
29
  </html>
 
1
  <!DOCTYPE html>
2
  <html lang="en">
3
  <head>
4
+ <meta charset="UTF-8" />
5
+ <title>Codex Autonomous Cognitive Engine</title>
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <style>
8
+ html, body {
9
+ margin: 0;
10
+ padding: 0;
11
+ background: #000;
12
+ color: #eaeaea;
13
+ height: 100%;
14
+ overflow: hidden;
15
+ font-family: system-ui, -apple-system, Segoe UI, Roboto, monospace;
16
+ }
17
+ .wrap {
18
+ display: grid;
19
+ place-items: center;
20
+ height: 100%;
21
+ }
22
+ .caption {
23
+ position: fixed;
24
+ bottom: 12px;
25
+ width: 100%;
26
+ text-align: center;
27
+ font-size: 12px;
28
+ opacity: 0.6;
29
+ pointer-events: none;
30
+ }
31
+ </style>
32
  </head>
33
  <body>
34
+ <div class="wrap">
35
+ <!-- ========================= -->
36
+ <!-- AUTONOMOUS SVG RUNTIME -->
37
+ <!-- ========================= -->
38
+ <svg
39
+ xmlns="http://www.w3.org/2000/svg"
40
+ viewBox="-200 -200 400 400"
41
+ width="70vmin"
42
+ height="70vmin"
43
+ style="background:black">
44
+
45
+ <!-- DEFINITIONS -->
46
+ <defs>
47
+ <filter id="glow">
48
+ <feGaussianBlur stdDeviation="3" result="blur"/>
49
+ <feMerge>
50
+ <feMergeNode in="blur"/>
51
+ <feMergeNode in="SourceGraphic"/>
52
+ </feMerge>
53
+ </filter>
54
+ </defs>
55
+
56
+ <!-- Λ : CONSTRAINT BOUNDARY -->
57
+ <circle
58
+ cx="0" cy="0" r="160"
59
+ fill="none"
60
+ stroke="#444"
61
+ stroke-width="2"
62
+ stroke-dasharray="6 10"/>
63
+
64
+ <!-- AUTONOMOUS RECURRENCE LOOP -->
65
+ <circle
66
+ cx="0" cy="0" r="120"
67
+ fill="none"
68
+ stroke="#00ffee"
69
+ stroke-width="3"
70
+ filter="url(#glow)">
71
+ <animateTransform
72
+ attributeName="transform"
73
+ type="rotate"
74
+ from="0 0 0"
75
+ to="360 0 0"
76
+ dur="30s"
77
+ repeatCount="indefinite"/>
78
+ </circle>
79
+
80
+ <!-- Ξ : COGNITIVE STATE CORE -->
81
+ <circle
82
+ cx="0" cy="0" r="18"
83
+ fill="#ffffff"
84
+ filter="url(#glow)">
85
+ <animate
86
+ attributeName="r"
87
+ values="16;22;16"
88
+ dur="4s"
89
+ repeatCount="indefinite"/>
90
+ </circle>
91
+
92
+ <!-- Ω : MEMORY PHASE RING -->
93
+ <circle
94
+ cx="0" cy="0" r="50"
95
+ fill="none"
96
+ stroke="#ffaa00"
97
+ stroke-width="2"
98
+ opacity="0.6">
99
+ <animateTransform
100
+ attributeName="transform"
101
+ type="rotate"
102
+ from="360 0 0"
103
+ to="0 0 0"
104
+ dur="18s"
105
+ repeatCount="indefinite"/>
106
+ </circle>
107
+
108
+ <!-- Φ : STRUCTURAL NODES -->
109
+ <g>
110
+ <circle cx="0" cy="-90" r="6" fill="#00ff88">
111
+ <animate
112
+ attributeName="cy"
113
+ values="-80;-100;-80"
114
+ dur="6s"
115
+ repeatCount="indefinite"/>
116
+ </circle>
117
+
118
+ <g transform="rotate(60)">
119
+ <circle cx="0" cy="-90" r="6" fill="#00ff88"/>
120
+ </g>
121
+ <g transform="rotate(120)">
122
+ <circle cx="0" cy="-90" r="6" fill="#00ff88"/>
123
+ </g>
124
+ <g transform="rotate(180)">
125
+ <circle cx="0" cy="-90" r="6" fill="#00ff88"/>
126
+ </g>
127
+ <g transform="rotate(240)">
128
+ <circle cx="0" cy="-90" r="6" fill="#00ff88"/>
129
+ </g>
130
+ <g transform="rotate(300)">
131
+ <circle cx="0" cy="-90" r="6" fill="#00ff88"/>
132
+ </g>
133
+ </g>
134
+
135
+ <!-- Ψ : INTENT PERTURBATION -->
136
+ <circle
137
+ cx="0" cy="0" r="90"
138
+ fill="none"
139
+ stroke="#ffffff"
140
+ stroke-width="1"
141
+ opacity="0.25">
142
+ <animate
143
+ attributeName="opacity"
144
+ values="0.1;0.4;0.1"
145
+ dur="7s"
146
+ repeatCount="indefinite"/>
147
+ </circle>
148
+
149
+ <!-- TIME DIRECTION INDICATOR -->
150
+ <path
151
+ d="M 120 0 L 140 -6 L 140 6 Z"
152
+ fill="#00ffee">
153
+ <animateTransform
154
+ attributeName="transform"
155
+ type="rotate"
156
+ from="0 0 0"
157
+ to="360 0 0"
158
+ dur="30s"
159
+ repeatCount="indefinite"/>
160
+ </path>
161
+ </svg>
162
+ </div>
163
+
164
+ <div class="caption">
165
+ Autonomous Cognitive Engine · Geometry = State · Motion = Computation
166
+ </div>
167
  </body>
168
  </html>