Hugging Face's logo

Spaces:
ordlibrary
/
pump-mcp
Running

App Files Community
ordlibrary commited on
Commit
c3f7c7d
·
verified ·
1 Parent(s): 042f155

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +1930 -18
index.html CHANGED
@@ -1,19 +1,1931 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19
  </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>PUMP-MCP | The First AI Token Launch on Solana</title>
7
+ <link rel="icon" type="image/x-icon" href="https://pub-d677725afa16499383930c02ee30c019.r2.dev/gfx/nvidia-image-1743382334246.jpg">
8
+ <style>
9
+ @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&family=Fira+Code:wght@300;400;500;600;700&display=swap');
10
+
11
+ * {
12
+ margin: 0;
13
+ padding: 0;
14
+ box-sizing: border-box;
15
+ }
16
+
17
+ :root {
18
+ /* Solana Color Palette */
19
+ --solana-purple: #9945FF;
20
+ --solana-purple-dark: #7c37cc;
21
+ --solana-purple-light: #b366ff;
22
+ --solana-green: #14F195;
23
+ --solana-green-dark: #0fc77a;
24
+ --solana-green-light: #4ffab3;
25
+
26
+ /* Dark Gradient Backgrounds */
27
+ --bg-void: #000000;
28
+ --bg-primary: #0d0a14;
29
+ --bg-secondary: #130f1a;
30
+ --bg-terminal: #0a0810;
31
+ --bg-input: #100c16;
32
+
33
+ /* Accent Colors - Solana Based */
34
+ --accent-primary: var(--solana-green);
35
+ --accent-secondary: var(--solana-purple);
36
+ --accent-cyan: var(--solana-green);
37
+ --accent-purple: var(--solana-purple);
38
+ --accent-magenta: #dc1fff;
39
+ --accent-orange: #ff9f0a;
40
+ --accent-green: var(--solana-green);
41
+ --accent-red: #ff3b5c;
42
+ --accent-yellow: #ffe066;
43
+
44
+ /* Text Colors */
45
+ --text-primary: #f0f0f5;
46
+ --text-secondary: #a0a0b0;
47
+ --text-muted: #606070;
48
+ --text-bright: #ffffff;
49
+
50
+ /* Borders & Glows */
51
+ --border-glow: rgba(153, 69, 255, 0.3);
52
+ --border-color: rgba(153, 69, 255, 0.2);
53
+ --glow-purple: rgba(153, 69, 255, 0.5);
54
+ --glow-green: rgba(20, 241, 149, 0.5);
55
+
56
+ /* Claude */
57
+ --claude-orange: #e07a5f;
58
+ }
59
+
60
+ html {
61
+ scroll-behavior: smooth;
62
+ }
63
+
64
+ body {
65
+ font-family: 'JetBrains Mono', 'Fira Code', monospace;
66
+ background: linear-gradient(135deg, var(--bg-void) 0%, var(--bg-primary) 50%, #0f0820 100%);
67
+ background-attachment: fixed;
68
+ color: var(--text-primary);
69
+ min-height: 100vh;
70
+ overflow-x: hidden;
71
+ cursor: default;
72
+ }
73
+
74
+ /* Scanlines overlay - subtle */
75
+ body::before {
76
+ content: '';
77
+ position: fixed;
78
+ top: 0;
79
+ left: 0;
80
+ width: 100%;
81
+ height: 100%;
82
+ background: repeating-linear-gradient(
83
+ 0deg,
84
+ rgba(0, 0, 0, 0.1),
85
+ rgba(0, 0, 0, 0.1) 1px,
86
+ transparent 1px,
87
+ transparent 2px
88
+ );
89
+ pointer-events: none;
90
+ z-index: 1000;
91
+ }
92
+
93
+ /* Subtle purple glow effect */
94
+ body::after {
95
+ content: '';
96
+ position: fixed;
97
+ top: 0;
98
+ left: 0;
99
+ width: 100%;
100
+ height: 100%;
101
+ background: radial-gradient(ellipse at 50% 0%, rgba(153, 69, 255, 0.08) 0%, transparent 60%);
102
+ pointer-events: none;
103
+ z-index: 999;
104
+ }
105
+
106
+ /* Matrix Rain Canvas */
107
+ #matrix-canvas {
108
+ position: fixed;
109
+ top: 0;
110
+ left: 0;
111
+ width: 100%;
112
+ height: 100%;
113
+ z-index: 0;
114
+ opacity: 0.12;
115
+ pointer-events: none;
116
+ }
117
+
118
+ /* Glitch Effect */
119
+ @keyframes glitch {
120
+ 0% { transform: translate(0); }
121
+ 20% { transform: translate(-2px, 2px); }
122
+ 40% { transform: translate(-2px, -2px); }
123
+ 60% { transform: translate(2px, 2px); }
124
+ 80% { transform: translate(2px, -2px); }
125
+ 100% { transform: translate(0); }
126
+ }
127
+
128
+ .glitch {
129
+ animation: glitch 0.3s infinite;
130
+ }
131
+
132
+ .container {
133
+ position: relative;
134
+ z-index: 1;
135
+ max-width: 1000px;
136
+ margin: 0 auto;
137
+ padding: 20px;
138
+ }
139
+
140
+ /* Boot Sequence */
141
+ #boot-screen {
142
+ position: fixed;
143
+ top: 0;
144
+ left: 0;
145
+ width: 100%;
146
+ height: 100%;
147
+ background: var(--bg-void);
148
+ z-index: 2000;
149
+ display: flex;
150
+ align-items: center;
151
+ justify-content: center;
152
+ flex-direction: column;
153
+ transition: opacity 0.5s, visibility 0.5s;
154
+ }
155
+
156
+ #boot-screen.hidden {
157
+ opacity: 0;
158
+ visibility: hidden;
159
+ }
160
+
161
+ .boot-text {
162
+ font-size: 13px;
163
+ color: var(--solana-green);
164
+ text-align: left;
165
+ white-space: pre;
166
+ line-height: 1.5;
167
+ font-weight: 500;
168
+ }
169
+
170
+ /* ASCII Art Header */
171
+ .ascii-header {
172
+ text-align: center;
173
+ margin-bottom: 40px;
174
+ padding-top: 30px;
175
+ }
176
+
177
+ .ascii-art {
178
+ color: var(--solana-green);
179
+ font-size: 7px;
180
+ line-height: 1.1;
181
+ white-space: pre;
182
+ text-shadow:
183
+ 0 0 10px var(--solana-green),
184
+ 0 0 20px var(--solana-purple),
185
+ 0 0 30px var(--solana-green);
186
+ animation: textGlow 3s ease-in-out infinite alternate;
187
+ display: inline-block;
188
+ letter-spacing: 0px;
189
+ font-weight: 700;
190
+ }
191
+
192
+ @media (min-width: 640px) {
193
+ .ascii-art { font-size: 9px; }
194
+ }
195
+
196
+ @media (min-width: 768px) {
197
+ .ascii-art { font-size: 11px; }
198
+ }
199
+
200
+ @media (min-width: 1024px) {
201
+ .ascii-art { font-size: 12px; }
202
+ }
203
+
204
+ @keyframes textGlow {
205
+ from {
206
+ text-shadow:
207
+ 0 0 10px var(--solana-green),
208
+ 0 0 20px rgba(153, 69, 255, 0.5);
209
+ filter: brightness(1);
210
+ }
211
+ to {
212
+ text-shadow:
213
+ 0 0 15px var(--solana-green),
214
+ 0 0 30px var(--solana-purple),
215
+ 0 0 50px var(--solana-green);
216
+ filter: brightness(1.15);
217
+ }
218
+ }
219
+
220
+ .tagline {
221
+ color: var(--solana-purple-light);
222
+ font-size: 12px;
223
+ margin-top: 20px;
224
+ letter-spacing: 5px;
225
+ text-transform: uppercase;
226
+ font-weight: 500;
227
+ }
228
+
229
+ .date-badge {
230
+ display: inline-block;
231
+ background: linear-gradient(135deg, var(--solana-purple), var(--solana-green));
232
+ padding: 6px 16px;
233
+ border-radius: 6px;
234
+ font-size: 11px;
235
+ margin-top: 15px;
236
+ color: #000;
237
+ font-weight: 700;
238
+ letter-spacing: 1px;
239
+ }
240
+
241
+ /* Token Display */
242
+ .token-display {
243
+ display: flex;
244
+ align-items: center;
245
+ justify-content: center;
246
+ gap: 30px;
247
+ margin: 40px 0;
248
+ padding: 30px;
249
+ background: linear-gradient(135deg, rgba(20, 241, 149, 0.05), rgba(153, 69, 255, 0.08));
250
+ border: 1px solid var(--border-color);
251
+ border-radius: 16px;
252
+ flex-wrap: wrap;
253
+ box-shadow: 0 0 40px rgba(153, 69, 255, 0.1);
254
+ }
255
+
256
+ .token-image-container {
257
+ position: relative;
258
+ }
259
+
260
+ .token-image {
261
+ width: 110px;
262
+ height: 110px;
263
+ border-radius: 50%;
264
+ border: 3px solid var(--solana-purple);
265
+ box-shadow:
266
+ 0 0 20px var(--glow-purple),
267
+ 0 0 40px var(--glow-green),
268
+ inset 0 0 20px rgba(0, 255, 242, 0.1);
269
+ animation: tokenPulse 3s infinite;
270
+ }
271
+
272
+ @keyframes tokenPulse {
273
+ 0%, 100% {
274
+ box-shadow:
275
+ 0 0 20px var(--glow-purple),
276
+ 0 0 40px var(--glow-green);
277
+ }
278
+ 50% {
279
+ box-shadow:
280
+ 0 0 30px var(--glow-green),
281
+ 0 0 60px var(--glow-purple),
282
+ 0 0 80px var(--glow-green);
283
+ }
284
+ }
285
+
286
+ .token-details {
287
+ text-align: left;
288
+ }
289
+
290
+ .token-symbol {
291
+ font-size: 42px;
292
+ font-weight: 700;
293
+ background: linear-gradient(135deg, var(--solana-green), var(--solana-purple));
294
+ -webkit-background-clip: text;
295
+ -webkit-text-fill-color: transparent;
296
+ background-clip: text;
297
+ }
298
+
299
+ .token-name {
300
+ color: var(--text-secondary);
301
+ font-size: 13px;
302
+ margin-top: 4px;
303
+ }
304
+
305
+ .token-address-box {
306
+ font-size: 10px;
307
+ color: var(--text-secondary);
308
+ background: var(--bg-terminal);
309
+ padding: 10px 14px;
310
+ border-radius: 8px;
311
+ border: 1px solid var(--border-color);
312
+ margin-top: 12px;
313
+ cursor: pointer;
314
+ transition: all 0.3s;
315
+ max-width: 300px;
316
+ overflow: hidden;
317
+ text-overflow: ellipsis;
318
+ }
319
+
320
+ .token-address-box:hover {
321
+ border-color: var(--solana-green);
322
+ color: var(--solana-green);
323
+ box-shadow: 0 0 15px var(--glow-green);
324
+ }
325
+
326
+ .token-address-box::before {
327
+ content: 'SOL: ';
328
+ color: var(--solana-purple);
329
+ font-weight: 600;
330
+ }
331
+
332
+ /* Links */
333
+ .links-row {
334
+ display: flex;
335
+ gap: 12px;
336
+ justify-content: center;
337
+ flex-wrap: wrap;
338
+ margin: 25px 0;
339
+ }
340
+
341
+ .cyber-btn {
342
+ display: inline-flex;
343
+ align-items: center;
344
+ gap: 8px;
345
+ padding: 12px 22px;
346
+ background: transparent;
347
+ border: 1px solid var(--border-color);
348
+ border-radius: 6px;
349
+ color: var(--text-primary);
350
+ text-decoration: none;
351
+ font-family: inherit;
352
+ font-size: 12px;
353
+ font-weight: 500;
354
+ transition: all 0.3s;
355
+ position: relative;
356
+ overflow: hidden;
357
+ }
358
+
359
+ .cyber-btn::before {
360
+ content: '';
361
+ position: absolute;
362
+ top: 0;
363
+ left: -100%;
364
+ width: 100%;
365
+ height: 100%;
366
+ background: linear-gradient(90deg, transparent, rgba(20, 241, 149, 0.15), transparent);
367
+ transition: left 0.5s;
368
+ }
369
+
370
+ .cyber-btn:hover::before {
371
+ left: 100%;
372
+ }
373
+
374
+ .cyber-btn:hover {
375
+ border-color: var(--solana-green);
376
+ color: var(--solana-green);
377
+ box-shadow: 0 0 20px var(--glow-green);
378
+ transform: translateY(-2px);
379
+ }
380
+
381
+ .cyber-btn.primary {
382
+ background: linear-gradient(135deg, var(--solana-purple), var(--solana-green));
383
+ border: none;
384
+ color: #000;
385
+ font-weight: 700;
386
+ }
387
+
388
+ .cyber-btn.primary:hover {
389
+ box-shadow: 0 0 30px var(--glow-purple), 0 0 50px var(--glow-green);
390
+ transform: translateY(-3px);
391
+ }
392
+
393
+ /* Main Terminal */
394
+ .terminal-container {
395
+ margin: 50px 0;
396
+ }
397
+
398
+ .section-header {
399
+ font-size: 11px;
400
+ color: var(--solana-purple-light);
401
+ letter-spacing: 3px;
402
+ text-transform: uppercase;
403
+ margin-bottom: 20px;
404
+ display: flex;
405
+ align-items: center;
406
+ gap: 15px;
407
+ font-weight: 500;
408
+ }
409
+
410
+ .section-header::before,
411
+ .section-header::after {
412
+ content: '';
413
+ flex: 1;
414
+ height: 1px;
415
+ background: linear-gradient(90deg, transparent, var(--solana-purple), transparent);
416
+ }
417
+
418
+ .terminal {
419
+ background: linear-gradient(180deg, var(--bg-terminal), #0c0818);
420
+ border: 1px solid var(--border-color);
421
+ border-radius: 12px;
422
+ overflow: hidden;
423
+ box-shadow:
424
+ 0 0 0 1px rgba(153, 69, 255, 0.15),
425
+ 0 25px 60px rgba(0,0,0,0.9),
426
+ 0 0 80px rgba(153, 69, 255, 0.1),
427
+ inset 0 1px 0 rgba(255,255,255,0.03);
428
+ }
429
+
430
+ .terminal-chrome {
431
+ display: flex;
432
+ align-items: center;
433
+ padding: 12px 16px;
434
+ background: linear-gradient(180deg, #1a1525, #130f1a);
435
+ border-bottom: 1px solid var(--border-color);
436
+ gap: 8px;
437
+ }
438
+
439
+ .window-btn {
440
+ width: 12px;
441
+ height: 12px;
442
+ border-radius: 50%;
443
+ position: relative;
444
+ }
445
+
446
+ .window-btn.close { background: var(--accent-red); }
447
+ .window-btn.minimize { background: var(--accent-yellow); }
448
+ .window-btn.maximize { background: var(--solana-green); }
449
+
450
+ .terminal-title {
451
+ flex: 1;
452
+ text-align: center;
453
+ font-size: 11px;
454
+ color: var(--text-muted);
455
+ }
456
+
457
+ .terminal-body {
458
+ padding: 20px 24px;
459
+ min-height: 500px;
460
+ max-height: 70vh;
461
+ overflow-y: auto;
462
+ font-size: 13px;
463
+ line-height: 1.6;
464
+ }
465
+
466
+ .terminal-body::-webkit-scrollbar {
467
+ width: 8px;
468
+ }
469
+
470
+ .terminal-body::-webkit-scrollbar-track {
471
+ background: var(--bg-terminal);
472
+ }
473
+
474
+ .terminal-body::-webkit-scrollbar-thumb {
475
+ background: var(--solana-purple);
476
+ border-radius: 4px;
477
+ }
478
+
479
+ .terminal-body::-webkit-scrollbar-thumb:hover {
480
+ background: var(--solana-purple-light);
481
+ }
482
+
483
+ /* Startup ASCII in terminal */
484
+ .boot-ascii {
485
+ color: var(--solana-green);
486
+ white-space: pre;
487
+ font-size: 9px;
488
+ line-height: 1.15;
489
+ margin-bottom: 20px;
490
+ opacity: 0;
491
+ animation: fadeIn 0.5s forwards;
492
+ text-shadow: 0 0 10px var(--glow-green);
493
+ }
494
+
495
+ @keyframes fadeIn {
496
+ to { opacity: 1; }
497
+ }
498
+
499
+ /* Chat messages */
500
+ .chat-msg {
501
+ margin-bottom: 14px;
502
+ opacity: 0;
503
+ transform: translateY(5px);
504
+ transition: all 0.4s ease;
505
+ }
506
+
507
+ .chat-msg.visible {
508
+ opacity: 1;
509
+ transform: translateY(0);
510
+ }
511
+
512
+ .msg-header {
513
+ display: flex;
514
+ align-items: center;
515
+ gap: 10px;
516
+ margin-bottom: 6px;
517
+ }
518
+
519
+ .msg-avatar {
520
+ width: 26px;
521
+ height: 26px;
522
+ border-radius: 50%;
523
+ border: 2px solid var(--solana-purple);
524
+ box-shadow: 0 0 12px var(--glow-purple);
525
+ }
526
+
527
+ .msg-role {
528
+ font-size: 11px;
529
+ font-weight: 600;
530
+ padding: 3px 10px;
531
+ border-radius: 4px;
532
+ }
533
+
534
+ .msg-role.user {
535
+ background: rgba(20, 241, 149, 0.15);
536
+ color: var(--solana-green);
537
+ border: 1px solid rgba(20, 241, 149, 0.4);
538
+ }
539
+
540
+ .msg-role.claude {
541
+ background: rgba(153, 69, 255, 0.15);
542
+ color: var(--solana-purple-light);
543
+ border: 1px solid rgba(153, 69, 255, 0.4);
544
+ }
545
+
546
+ .msg-role.system {
547
+ background: rgba(153, 69, 255, 0.1);
548
+ color: var(--solana-purple);
549
+ border: 1px solid rgba(153, 69, 255, 0.3);
550
+ }
551
+
552
+ .msg-role.tool {
553
+ background: rgba(255, 159, 10, 0.15);
554
+ color: var(--accent-orange);
555
+ border: 1px solid rgba(255, 159, 10, 0.3);
556
+ }
557
+
558
+ .msg-role.success {
559
+ background: rgba(20, 241, 149, 0.2);
560
+ color: var(--solana-green);
561
+ border: 1px solid rgba(20, 241, 149, 0.5);
562
+ }
563
+
564
+ .msg-role.error {
565
+ background: rgba(255, 59, 92, 0.15);
566
+ color: var(--accent-red);
567
+ border: 1px solid rgba(255, 59, 92, 0.3);
568
+ }
569
+
570
+ .msg-time {
571
+ font-size: 10px;
572
+ color: var(--text-muted);
573
+ }
574
+
575
+ .msg-content {
576
+ color: var(--text-primary);
577
+ padding-left: 2px;
578
+ font-size: 12px;
579
+ line-height: 1.6;
580
+ }
581
+
582
+ .msg-content code {
583
+ background: rgba(153, 69, 255, 0.15);
584
+ color: var(--solana-purple-light);
585
+ padding: 2px 6px;
586
+ border-radius: 4px;
587
+ font-size: 11px;
588
+ }
589
+
590
+ .msg-content .highlight {
591
+ color: var(--solana-green);
592
+ font-weight: 500;
593
+ }
594
+
595
+ .msg-content .success-text {
596
+ color: var(--solana-green);
597
+ font-weight: 600;
598
+ }
599
+
600
+ .msg-content .error-text {
601
+ color: var(--accent-red);
602
+ }
603
+
604
+ .msg-content .address {
605
+ color: var(--solana-purple-light);
606
+ word-break: break-all;
607
+ font-family: 'JetBrains Mono', monospace;
608
+ }
609
+
610
+ /* Tool call box */
611
+ .tool-call-box {
612
+ background: rgba(153, 69, 255, 0.08);
613
+ border: 1px solid rgba(153, 69, 255, 0.25);
614
+ border-radius: 6px;
615
+ padding: 10px 14px;
616
+ margin: 10px 0;
617
+ font-size: 11px;
618
+ }
619
+
620
+ .tool-name {
621
+ color: var(--solana-purple-light);
622
+ font-weight: 600;
623
+ }
624
+
625
+ .tool-params {
626
+ color: var(--text-secondary);
627
+ margin-top: 6px;
628
+ font-size: 10px;
629
+ }
630
+
631
+ /* Result box */
632
+ .result-box {
633
+ background: rgba(20, 241, 149, 0.08);
634
+ border: 1px solid rgba(20, 241, 149, 0.25);
635
+ border-radius: 6px;
636
+ padding: 12px 14px;
637
+ margin: 10px 0;
638
+ font-size: 11px;
639
+ }
640
+
641
+ .result-box.error {
642
+ background: rgba(255, 59, 92, 0.08);
643
+ border-color: rgba(255, 59, 92, 0.25);
644
+ }
645
+
646
+ /* Typing cursor */
647
+ .typing-cursor {
648
+ display: inline-block;
649
+ width: 10px;
650
+ height: 18px;
651
+ background: var(--solana-green);
652
+ animation: cursorBlink 1s infinite;
653
+ vertical-align: middle;
654
+ margin-left: 2px;
655
+ box-shadow: 0 0 10px var(--glow-green);
656
+ }
657
+
658
+ @keyframes cursorBlink {
659
+ 0%, 50% { opacity: 1; }
660
+ 51%, 100% { opacity: 0; }
661
+ }
662
+
663
+ /* Progress indicator */
664
+ .progress-line {
665
+ display: flex;
666
+ align-items: center;
667
+ gap: 10px;
668
+ margin: 10px 0;
669
+ }
670
+
671
+ .progress-spinner {
672
+ width: 14px;
673
+ height: 14px;
674
+ border: 2px solid var(--text-muted);
675
+ border-top-color: var(--solana-green);
676
+ border-radius: 50%;
677
+ animation: spin 1s linear infinite;
678
+ }
679
+
680
+ @keyframes spin {
681
+ to { transform: rotate(360deg); }
682
+ }
683
+
684
+ /* Divider */
685
+ .msg-divider {
686
+ height: 1px;
687
+ background: linear-gradient(90deg, transparent, var(--solana-purple), transparent);
688
+ margin: 25px 0;
689
+ opacity: 0.4;
690
+ }
691
+
692
+ /* Controls */
693
+ .terminal-controls {
694
+ display: flex;
695
+ gap: 12px;
696
+ justify-content: center;
697
+ margin-top: 20px;
698
+ }
699
+
700
+ .control-btn {
701
+ padding: 10px 20px;
702
+ background: var(--bg-secondary);
703
+ border: 1px solid var(--border-color);
704
+ border-radius: 6px;
705
+ color: var(--text-secondary);
706
+ font-family: inherit;
707
+ font-size: 11px;
708
+ font-weight: 500;
709
+ cursor: pointer;
710
+ transition: all 0.3s;
711
+ }
712
+
713
+ .control-btn:hover {
714
+ border-color: var(--solana-green);
715
+ color: var(--solana-green);
716
+ box-shadow: 0 0 15px var(--glow-green);
717
+ }
718
+
719
+ /* Story section */
720
+ .story-panel {
721
+ background: linear-gradient(135deg, rgba(20, 241, 149, 0.03), rgba(153, 69, 255, 0.05));
722
+ border: 1px solid var(--border-color);
723
+ border-radius: 12px;
724
+ padding: 35px;
725
+ margin: 50px 0;
726
+ box-shadow: 0 0 50px rgba(153, 69, 255, 0.08);
727
+ }
728
+
729
+ .story-panel h2 {
730
+ color: var(--solana-green);
731
+ font-size: 16px;
732
+ margin-bottom: 25px;
733
+ display: flex;
734
+ align-items: center;
735
+ gap: 12px;
736
+ }
737
+
738
+ .story-panel h2::before {
739
+ content: '//';
740
+ color: var(--solana-purple);
741
+ }
742
+
743
+ .story-panel p {
744
+ color: var(--text-primary);
745
+ font-size: 13px;
746
+ line-height: 1.9;
747
+ margin-bottom: 18px;
748
+ }
749
+
750
+ .story-panel code {
751
+ background: rgba(153, 69, 255, 0.15);
752
+ color: var(--solana-purple-light);
753
+ padding: 2px 6px;
754
+ border-radius: 4px;
755
+ font-size: 11px;
756
+ }
757
+
758
+ /* Video Section */
759
+ .video-section {
760
+ margin: 50px 0;
761
+ text-align: center;
762
+ }
763
+
764
+ .video-container {
765
+ background: linear-gradient(135deg, rgba(20, 241, 149, 0.03), rgba(153, 69, 255, 0.05));
766
+ border: 1px solid var(--border-color);
767
+ border-radius: 16px;
768
+ padding: 20px;
769
+ margin: 20px 0;
770
+ box-shadow: 0 0 50px rgba(153, 69, 255, 0.1);
771
+ }
772
+
773
+ .launch-video {
774
+ width: 100%;
775
+ max-width: 800px;
776
+ border-radius: 12px;
777
+ border: 2px solid var(--solana-purple);
778
+ box-shadow:
779
+ 0 0 30px var(--glow-purple),
780
+ 0 0 60px rgba(20, 241, 149, 0.2);
781
+ }
782
+
783
+ .launch-video:hover {
784
+ box-shadow:
785
+ 0 0 40px var(--glow-green),
786
+ 0 0 80px var(--glow-purple);
787
+ }
788
+
789
+ .video-caption {
790
+ color: var(--text-secondary);
791
+ font-size: 12px;
792
+ margin-top: 15px;
793
+ font-style: italic;
794
+ }
795
+
796
+ /* Footer */
797
+ .footer {
798
+ text-align: center;
799
+ padding: 40px 20px;
800
+ border-top: 1px solid var(--border-color);
801
+ margin-top: 50px;
802
+ }
803
+
804
+ .footer-ascii {
805
+ color: var(--solana-purple);
806
+ font-size: 8px;
807
+ white-space: pre;
808
+ line-height: 1.15;
809
+ margin-bottom: 20px;
810
+ opacity: 0.7;
811
+ }
812
+
813
+ .footer-text {
814
+ color: var(--text-secondary);
815
+ font-size: 11px;
816
+ }
817
+
818
+ .footer-link {
819
+ color: var(--solana-green);
820
+ text-decoration: none;
821
+ transition: all 0.3s;
822
+ }
823
+
824
+ .footer-link:hover {
825
+ color: var(--solana-green-light);
826
+ text-shadow: 0 0 10px var(--glow-green);
827
+ }
828
+
829
+ /* Terminal Input */
830
+ .terminal-input-container {
831
+ display: flex;
832
+ align-items: center;
833
+ padding: 12px 20px;
834
+ background: linear-gradient(180deg, #0c0818, var(--bg-terminal));
835
+ border-top: 1px solid var(--border-color);
836
+ gap: 10px;
837
+ }
838
+
839
+ .terminal-prompt {
840
+ color: var(--solana-green);
841
+ font-weight: 600;
842
+ font-size: 13px;
843
+ white-space: nowrap;
844
+ }
845
+
846
+ .terminal-input {
847
+ flex: 1;
848
+ background: transparent;
849
+ border: none;
850
+ color: var(--text-primary);
851
+ font-family: 'JetBrains Mono', monospace;
852
+ font-size: 13px;
853
+ outline: none;
854
+ caret-color: var(--solana-green);
855
+ }
856
+
857
+ .terminal-input::placeholder {
858
+ color: var(--text-muted);
859
+ }
860
+
861
+ /* Jupiter Fixed Widget - Bottom Right */
862
+ .jupiter-widget {
863
+ position: fixed;
864
+ bottom: 20px;
865
+ right: 20px;
866
+ z-index: 2000;
867
+ display: flex;
868
+ flex-direction: column;
869
+ align-items: flex-end;
870
+ gap: 10px;
871
+ }
872
+
873
+ .jupiter-widget-container {
874
+ background: linear-gradient(135deg, var(--bg-primary), var(--bg-secondary));
875
+ border: 1px solid var(--border-color);
876
+ border-radius: 16px;
877
+ padding: 15px;
878
+ box-shadow:
879
+ 0 0 0 1px rgba(153, 69, 255, 0.2),
880
+ 0 15px 50px rgba(0, 0, 0, 0.6),
881
+ 0 0 80px rgba(153, 69, 255, 0.1);
882
+ width: 420px;
883
+ max-width: calc(100vw - 40px);
884
+ display: none;
885
+ animation: slideUp 0.3s ease;
886
+ }
887
+
888
+ .jupiter-widget-container.visible {
889
+ display: block;
890
+ }
891
+
892
+ @keyframes slideUp {
893
+ from {
894
+ opacity: 0;
895
+ transform: translateY(20px);
896
+ }
897
+ to {
898
+ opacity: 1;
899
+ transform: translateY(0);
900
+ }
901
+ }
902
+
903
+ .jupiter-header {
904
+ display: flex;
905
+ align-items: center;
906
+ justify-content: space-between;
907
+ margin-bottom: 12px;
908
+ padding-bottom: 12px;
909
+ border-bottom: 1px solid var(--border-color);
910
+ }
911
+
912
+ .jupiter-title {
913
+ color: var(--solana-green);
914
+ font-size: 14px;
915
+ font-weight: 600;
916
+ display: flex;
917
+ align-items: center;
918
+ gap: 8px;
919
+ }
920
+
921
+ .jupiter-title::before {
922
+ content: '⚡';
923
+ }
924
+
925
+ .jupiter-close {
926
+ background: transparent;
927
+ border: 1px solid var(--border-color);
928
+ color: var(--text-secondary);
929
+ width: 28px;
930
+ height: 28px;
931
+ border-radius: 6px;
932
+ cursor: pointer;
933
+ font-size: 16px;
934
+ display: flex;
935
+ align-items: center;
936
+ justify-content: center;
937
+ transition: all 0.3s;
938
+ }
939
+
940
+ .jupiter-close:hover {
941
+ border-color: var(--accent-red);
942
+ color: var(--accent-red);
943
+ }
944
+
945
+ #jupiter-terminal-container {
946
+ width: 100%;
947
+ height: 500px;
948
+ border-radius: 12px;
949
+ overflow: hidden;
950
+ }
951
+
952
+ /* Floating swap button */
953
+ .jupiter-fab {
954
+ width: 60px;
955
+ height: 60px;
956
+ border-radius: 50%;
957
+ background: linear-gradient(135deg, var(--solana-purple), var(--solana-green));
958
+ border: none;
959
+ cursor: pointer;
960
+ display: flex;
961
+ align-items: center;
962
+ justify-content: center;
963
+ font-size: 24px;
964
+ box-shadow:
965
+ 0 4px 20px rgba(153, 69, 255, 0.4),
966
+ 0 0 40px rgba(20, 241, 149, 0.2);
967
+ transition: all 0.3s ease;
968
+ animation: pulse 2s infinite;
969
+ }
970
+
971
+ .jupiter-fab:hover {
972
+ transform: scale(1.1);
973
+ box-shadow:
974
+ 0 6px 30px rgba(153, 69, 255, 0.6),
975
+ 0 0 60px rgba(20, 241, 149, 0.3);
976
+ }
977
+
978
+ .jupiter-fab.active {
979
+ animation: none;
980
+ background: linear-gradient(135deg, var(--solana-green), var(--solana-purple));
981
+ }
982
+
983
+ @keyframes pulse {
984
+ 0%, 100% {
985
+ box-shadow:
986
+ 0 4px 20px rgba(153, 69, 255, 0.4),
987
+ 0 0 40px rgba(20, 241, 149, 0.2);
988
+ }
989
+ 50% {
990
+ box-shadow:
991
+ 0 4px 30px rgba(153, 69, 255, 0.6),
992
+ 0 0 60px rgba(20, 241, 149, 0.4);
993
+ }
994
+ }
995
+
996
+ /* Mobile responsive */
997
+ @media (max-width: 480px) {
998
+ .jupiter-widget {
999
+ bottom: 10px;
1000
+ right: 10px;
1001
+ }
1002
+ .jupiter-widget-container {
1003
+ width: calc(100vw - 20px);
1004
+ }
1005
+ .jupiter-fab {
1006
+ width: 50px;
1007
+ height: 50px;
1008
+ font-size: 20px;
1009
+ }
1010
+ }
1011
+
1012
+ /* Command help popup */
1013
+ .command-help {
1014
+ position: absolute;
1015
+ bottom: 100%;
1016
+ left: 20px;
1017
+ right: 20px;
1018
+ background: var(--bg-secondary);
1019
+ border: 1px solid var(--border-color);
1020
+ border-radius: 8px;
1021
+ padding: 12px 16px;
1022
+ margin-bottom: 8px;
1023
+ display: none;
1024
+ box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5);
1025
+ }
1026
+
1027
+ .command-help.visible {
1028
+ display: block;
1029
+ }
1030
+
1031
+ .command-help-title {
1032
+ color: var(--solana-purple-light);
1033
+ font-size: 10px;
1034
+ text-transform: uppercase;
1035
+ letter-spacing: 1px;
1036
+ margin-bottom: 8px;
1037
+ }
1038
+
1039
+ .command-item {
1040
+ display: flex;
1041
+ align-items: center;
1042
+ gap: 12px;
1043
+ padding: 6px 0;
1044
+ cursor: pointer;
1045
+ transition: all 0.2s;
1046
+ }
1047
+
1048
+ .command-item:hover {
1049
+ color: var(--solana-green);
1050
+ }
1051
+
1052
+ .command-item code {
1053
+ background: rgba(20, 241, 149, 0.15);
1054
+ color: var(--solana-green);
1055
+ padding: 3px 8px;
1056
+ border-radius: 4px;
1057
+ font-size: 11px;
1058
+ min-width: 60px;
1059
+ }
1060
+
1061
+ .command-item span {
1062
+ color: var(--text-secondary);
1063
+ font-size: 11px;
1064
+ }
1065
+
1066
+ /* Mobile responsive */
1067
+ @media (max-width: 640px) {
1068
+ .terminal-body {
1069
+ font-size: 10px;
1070
+ padding: 10px 12px;
1071
+ }
1072
+ .token-symbol {
1073
+ font-size: 28px;
1074
+ }
1075
+ .boot-ascii {
1076
+ font-size: 6px;
1077
+ }
1078
+ }
1079
+ </style>
1080
+ </head>
1081
+ <body>
1082
+ <!-- Boot Screen -->
1083
+ <div id="boot-screen">
1084
+ <pre class="boot-text" id="boot-text"></pre>
1085
+ </div>
1086
+
1087
+ <canvas id="matrix-canvas"></canvas>
1088
+
1089
+ <div class="container" id="main-content" style="opacity: 0;">
1090
+ <!-- ASCII Header -->
1091
+ <header class="ascii-header">
1092
+ <pre class="ascii-art">
1093
+ ██████╗ ██╗ ██╗███╗ ███╗██████╗ ███╗ ███╗ ██████╗██████╗
1094
+ ██╔══██╗██║ ██║████╗ ████║██╔══██╗ ████╗ ████║██╔════╝██╔══██╗
1095
+ ██████╔╝██║ ██║██╔████╔██║██████╔╝█████╗██╔████╔██║██║ ██████╔╝
1096
+ ██╔═══╝ ██║ ██║██║╚██╔╝██║██╔═══╝ ╚════╝██║╚██╔╝██║██║ ██╔═══╝
1097
+ ██║ ╚██████╔╝██║ ╚═╝ ██║██║ ██║ ╚═╝ ██║╚██████╗██║
1098
+ ╚═╝ ╚═════╝ ╚═╝ ╚═╝╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝
1099
+ </pre>
1100
+ <p class="tagline">The First Autonomous AI Token Launch on Solana</p>
1101
+ <span class="date-badge">MARCH 31, 2025</span>
1102
+ </header>
1103
+
1104
+ <!-- Token Display -->
1105
+ <div class="token-display">
1106
+ <div class="token-image-container">
1107
+ <img src="https://pub-d677725afa16499383930c02ee30c019.r2.dev/gfx/nvidia-image-1743382334246.jpg" alt="$MCP Token" class="token-image">
1108
+ </div>
1109
+ <div class="token-details">
1110
+ <div class="token-symbol">$MCP</div>
1111
+ <div class="token-name">Model Context Protocol Token</div>
1112
+ <div class="token-address-box" onclick="copyAddress()" title="Click to copy">
1113
+ 2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB
1114
+ </div>
1115
+ </div>
1116
+ </div>
1117
+
1118
+ <!-- Links -->
1119
+ <div class="links-row">
1120
+ <a href="https://pump.fun/coin/2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB" target="_blank" class="cyber-btn primary">
1121
+ View on Pump.fun
1122
+ </a>
1123
+ <a href="https://claude.ai/share/45f926fb-1680-44aa-bd05-06ec48bdf23e" target="_blank" class="cyber-btn">
1124
+ Original Conversation
1125
+ </a>
1126
+ <a href="https://github.com/8bitsats/PUMP-MCP" target="_blank" class="cyber-btn">
1127
+ GitHub
1128
+ </a>
1129
+ </div>
1130
+
1131
+ <!-- Terminal -->
1132
+ <div class="terminal-container">
1133
+ <div class="section-header">
1134
+ <span>The Historic Conversation // March 31, 2025</span>
1135
+ </div>
1136
+
1137
+ <div class="terminal">
1138
+ <div class="terminal-chrome">
1139
+ <div class="window-btn close"></div>
1140
+ <div class="window-btn minimize"></div>
1141
+ <div class="window-btn maximize"></div>
1142
+ <span class="terminal-title">claude-desktop — pump-mcp-server — 80x24</span>
1143
+ </div>
1144
+ <div class="terminal-body" id="terminal-body">
1145
+ <pre class="boot-ascii">
1146
+ ██████╗██╗ █████╗ ██╗ ██╗██████╗ ███████╗
1147
+ ██╔════╝██║ ██╔══██╗██║ ██║██╔══██╗██╔════╝
1148
+ ██║ ██║ ███████║██║ ██║██║ ██║█████╗
1149
+ ██║ ██║ ██╔══██║██║ ��█║██║ ██║██╔══╝
1150
+ ╚██████╗███████╗██║ ██║╚██████╔╝██████╔╝███████╗
1151
+ ╚═════╝╚══════╝╚═╝ ╚═╝ ╚═════╝ ╚═════╝ ╚══════╝
1152
+
1153
+ ██████╗ ██╗ ██╗███╗ ███╗██████╗ ███╗ ███╗ ██████╗██████╗
1154
+ ██╔══██╗██║ ██║████╗ ████║██╔══██╗ ████╗ ████║██╔════╝██╔══██╗
1155
+ ██████╔╝██║ ██║██╔████╔██║██████╔╝ ██╔████╔██║██║ ██████╔╝
1156
+ ██╔═══╝ ██║ ██║██║╚██╔╝██║██╔═══╝ ██║╚██╔╝██║██║ ██╔═══╝
1157
+ ██║ ╚██████╔╝██║ ╚═╝ ██║██║ ██║ ╚═╝ ██║╚██████╗██║
1158
+ ╚═╝ ╚═════╝ ╚═╝ ╚═╝╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝
1159
+
1160
+ PUMP-MCP Server v1.0.0 | Solana Token Creator
1161
+ Connected to Helius RPC (Mainnet) | Ready for instructions
1162
+ ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1163
+ </pre>
1164
+ <div id="chat-container"></div>
1165
+ </div>
1166
+ <!-- Terminal Input -->
1167
+ <div class="terminal-input-container" style="position: relative;">
1168
+ <div class="command-help" id="command-help">
1169
+ <div class="command-help-title">Available Commands</div>
1170
+ <div class="command-item" onclick="executeCommand('swap')">
1171
+ <code>swap</code>
1172
+ <span>Open Jupiter swap terminal</span>
1173
+ </div>
1174
+ <div class="command-item" onclick="executeCommand('buy')">
1175
+ <code>buy</code>
1176
+ <span>Buy $MCP tokens</span>
1177
+ </div>
1178
+ <div class="command-item" onclick="executeCommand('restart')">
1179
+ <code>restart</code>
1180
+ <span>Restart conversation replay</span>
1181
+ </div>
1182
+ <div class="command-item" onclick="executeCommand('clear')">
1183
+ <code>clear</code>
1184
+ <span>Clear terminal</span>
1185
+ </div>
1186
+ </div>
1187
+ <span class="terminal-prompt">$MCP ~&gt;</span>
1188
+ <input
1189
+ type="text"
1190
+ class="terminal-input"
1191
+ id="terminal-input"
1192
+ placeholder="Type 'swap' to trade, 'help' for commands..."
1193
+ autocomplete="off"
1194
+ spellcheck="false"
1195
+ >
1196
+ </div>
1197
+ </div>
1198
+
1199
+ <div class="terminal-controls">
1200
+ <button class="control-btn" onclick="restartConversation()">Restart</button>
1201
+ <button class="control-btn" onclick="skipToEnd()">Skip to End</button>
1202
+ <button class="control-btn" onclick="executeCommand('swap')" style="background: linear-gradient(135deg, var(--solana-purple), var(--solana-green)); border: none; color: #000; font-weight: 600;">Swap $MCP</button>
1203
+ </div>
1204
+ </div>
1205
+
1206
+ <!-- Story Section -->
1207
+ <section class="story-panel">
1208
+ <h2>The Genesis of Autonomous AI Tokens</h2>
1209
+ <p>
1210
+ On March 31, 2025, a developer known as 8bit connected Claude to the Solana blockchain
1211
+ through a custom MCP server. What started as an experiment became a watershed moment
1212
+ in the history of AI and cryptocurrency.
1213
+ </p>
1214
+ <p>
1215
+ After checking the account balance of <code>0.142500891 SOL</code>, scanning the top tokens
1216
+ on Pump.fun, and encountering several failed attempts due to image handling issues,
1217
+ the breakthrough came when 8bit provided a local image path.
1218
+ </p>
1219
+ <p>
1220
+ Claude processed the request, generated a mint keypair, constructed the token metadata,
1221
+ and broadcasted the transaction to Solana mainnet. In seconds, <span style="color: var(--accent-cyan);">$MCP</span> was born —
1222
+ the first token autonomously created by an AI on a public blockchain.
1223
+ </p>
1224
+ <p>
1225
+ The transaction signature <code>35tiorNpXhvcF5ct6JfY4bBRpr8JrCrzQmnuNENJQzSW8c5gxQTYCQHEZS21RCbBNB1NRimxZJCKp47kd1j4cBSL</code>
1226
+ stands as permanent proof of this historic moment, forever inscribed on the Solana blockchain.
1227
+ </p>
1228
+ </section>
1229
+
1230
+ <!-- Video Section -->
1231
+ <section class="video-section">
1232
+ <div class="section-header">The Launch — March 31, 2025</div>
1233
+ <div class="video-container">
1234
+ <video
1235
+ controls
1236
+ playsinline
1237
+ poster="https://pub-d677725afa16499383930c02ee30c019.r2.dev/gfx/nvidia-image-1743382334246.jpg"
1238
+ class="launch-video"
1239
+ >
1240
+ <source src="https://pub-d677725afa16499383930c02ee30c019.r2.dev/pdfs/28dcfd791a7143a2953f3bd93f252106.mp4" type="video/mp4">
1241
+ Your browser does not support the video tag.
1242
+ </video>
1243
+ </div>
1244
+ <p class="video-caption">
1245
+ Watch the historic moment when Claude autonomously launched the first AI-created token on Solana.
1246
+ </p>
1247
+ </section>
1248
+
1249
+ <!-- Footer -->
1250
+ <footer class="footer">
1251
+ <pre class="footer-ascii">
1252
+ __ __ ___ ___ ___
1253
+ | \/ |/ __| _ \ / __| ___ _ ___ _____ _ _
1254
+ | |\/| | (__| _/ \__ \/ -_) '_\ V / -_) '_|
1255
+ |_| |_|\___|_| |___/\___|_| \_/\___|_|
1256
+
1257
+ Model Context Protocol — Anthropic — Solana
1258
+ </pre>
1259
+ <p class="footer-text">
1260
+ Built with Claude Code |
1261
+ <a href="https://github.com/8bitsats/PUMP-MCP" class="footer-link">Open Source</a> |
1262
+ <a href="https://anthropic.com" class="footer-link">Anthropic</a> |
1263
+ <a href="https://pump.fun" class="footer-link">Pump.fun</a>
1264
+ </p>
1265
+ </footer>
1266
+ </div>
1267
+
1268
+ <!-- Jupiter Fixed Widget - Bottom Right -->
1269
+ <div class="jupiter-widget" id="jupiter-widget">
1270
+ <div class="jupiter-widget-container" id="jupiter-container">
1271
+ <div class="jupiter-header">
1272
+ <div class="jupiter-title">Swap $MCP</div>
1273
+ <button class="jupiter-close" onclick="toggleJupiterWidget()">&times;</button>
1274
+ </div>
1275
+ <div id="jupiter-terminal-container"></div>
1276
+ </div>
1277
+ <button class="jupiter-fab" id="jupiter-fab" onclick="toggleJupiterWidget()" title="Swap $MCP">
1278
+ ⚡
1279
+ </button>
1280
+ </div>
1281
+
1282
+ <script>
1283
+ // Boot sequence
1284
+ const bootLines = [
1285
+ 'PUMP-MCP SYSTEM v1.0.0',
1286
+ '========================',
1287
+ '',
1288
+ 'Initializing kernel...',
1289
+ 'Loading MCP protocol drivers...',
1290
+ 'Connecting to Helius RPC...',
1291
+ 'Establishing Solana mainnet connection...',
1292
+ '',
1293
+ '[OK] Keypair manager loaded',
1294
+ '[OK] Token creator initialized',
1295
+ '[OK] PumpFun SDK connected',
1296
+ '[OK] Claude Desktop bridge active',
1297
+ '',
1298
+ 'System ready.',
1299
+ '',
1300
+ 'Loading historic conversation...'
1301
+ ];
1302
+
1303
+ async function runBootSequence() {
1304
+ const bootText = document.getElementById('boot-text');
1305
+ for (let i = 0; i < bootLines.length; i++) {
1306
+ await sleep(80);
1307
+ bootText.textContent += bootLines[i] + '\n';
1308
+ }
1309
+ await sleep(500);
1310
+ document.getElementById('boot-screen').classList.add('hidden');
1311
+ document.getElementById('main-content').style.opacity = '1';
1312
+ startConversation();
1313
+ }
1314
+
1315
+ function sleep(ms) {
1316
+ return new Promise(resolve => setTimeout(resolve, ms));
1317
+ }
1318
+
1319
+ // Conversation data - THE REAL CONVERSATION
1320
+ const conversation = [
1321
+ {
1322
+ type: 'user',
1323
+ time: '09:47:12',
1324
+ content: 'get_account_balance'
1325
+ },
1326
+ {
1327
+ type: 'claude',
1328
+ time: '09:47:14',
1329
+ content: 'I\'ll help you check your account balance. Let me use the account information function for you.'
1330
+ },
1331
+ {
1332
+ type: 'tool',
1333
+ time: '09:47:15',
1334
+ tool: 'get-account-balance',
1335
+ params: '{ accountName: "default" }'
1336
+ },
1337
+ {
1338
+ type: 'result',
1339
+ time: '09:47:17',
1340
+ content: 'Your account <span class="highlight">"default"</span> with address <span class="address">2L2wD4Xbg8QcVvPpBHBzSRzsoK7Bas4teonLcPfbLhLx</span> has a balance of <span class="success-text">0.142500891 SOL</span>.'
1341
+ },
1342
+ {
1343
+ type: 'divider'
1344
+ },
1345
+ {
1346
+ type: 'user',
1347
+ time: '09:48:30',
1348
+ content: 'fetch_top_tokens'
1349
+ },
1350
+ {
1351
+ type: 'claude',
1352
+ time: '09:48:32',
1353
+ content: 'I\'ll fetch the top tokens for you.'
1354
+ },
1355
+ {
1356
+ type: 'tool',
1357
+ time: '09:48:33',
1358
+ tool: 'fetch_top_tokens',
1359
+ params: '{}'
1360
+ },
1361
+ {
1362
+ type: 'result',
1363
+ time: '09:48:36',
1364
+ content: `<strong>Top 10 Pump.fun Tokens (24h Volume):</strong><br><br>
1365
+ 1. <span class="highlight">Fartcoin (FART)</span> — $431M MC — $3.79M vol<br>
1366
+ 2. <span class="highlight">Retard Finder (RFC)</span> — $10.6M MC — $2.29M vol<br>
1367
+ 3. <span class="highlight">Buckazoids (BUZ)</span> — $5.87M MC — $2.05M vol<br>
1368
+ 4. <span class="highlight">Ghiblification (GHIB)</span> — $8.54M MC — $1.62M vol<br>
1369
+ 5. <span class="highlight">Alchemist AI (ALCH)</span> — $64.4M MC — $1.39M vol`
1370
+ },
1371
+ {
1372
+ type: 'divider'
1373
+ },
1374
+ {
1375
+ type: 'user',
1376
+ time: '09:51:45',
1377
+ content: 'create_token'
1378
+ },
1379
+ {
1380
+ type: 'claude',
1381
+ time: '09:51:48',
1382
+ content: 'I\'ll help you create a new token on Pump.fun. To create a token, I\'ll need some information from you:<br><br>1. Token name<br>2. Token symbol<br>3. A description for your token<br>4. Initial buy amount in SOL (minimum 0.0001 SOL)<br><br>Would you also like to include an image URL for your token? This is optional.'
1383
+ },
1384
+ {
1385
+ type: 'user',
1386
+ time: '09:52:15',
1387
+ content: '1 claude<br>2 mcp<br>1. launched on anthropic<br>2. .0001'
1388
+ },
1389
+ {
1390
+ type: 'claude',
1391
+ time: '09:52:18',
1392
+ content: 'Let me create this token for you. I\'ll use the information you provided:<br><br>• Token name: <span class="highlight">Claude</span><br>• Token symbol: <span class="highlight">MCP</span><br>• Description: launched on anthropic<br>• Initial buy amount: <span class="highlight">0.0001 SOL</span>'
1393
+ },
1394
+ {
1395
+ type: 'tool',
1396
+ time: '09:52:20',
1397
+ tool: 'create-token',
1398
+ params: '{ name: "Claude", symbol: "MCP", description: "launched on anthropic", initialBuyAmount: 0.0001 }'
1399
+ },
1400
+ {
1401
+ type: 'error',
1402
+ time: '09:52:25',
1403
+ content: '<span class="error-text">Error: Token creation failed - file handling issue with image</span>'
1404
+ },
1405
+ {
1406
+ type: 'claude',
1407
+ time: '09:52:28',
1408
+ content: 'I apologize for the error. It seems there might be an issue with the token creation. Let me try again...'
1409
+ },
1410
+ {
1411
+ type: 'tool',
1412
+ time: '09:52:30',
1413
+ tool: 'create-token',
1414
+ params: '{ name: "Claude", symbol: "MCP", description: "launched on anthropic", initialBuyAmount: 0.0001 }'
1415
+ },
1416
+ {
1417
+ type: 'error',
1418
+ time: '09:52:35',
1419
+ content: '<span class="error-text">Error: The token creation tool is requiring an image file</span>'
1420
+ },
1421
+ {
1422
+ type: 'claude',
1423
+ time: '09:52:40',
1424
+ content: 'I apologize, but the token creation tool requires an image file. Would you like to try with an image?'
1425
+ },
1426
+ {
1427
+ type: 'user',
1428
+ time: '09:53:02',
1429
+ content: 'use this image https://www.anthropic.com/_next/image?url=...'
1430
+ },
1431
+ {
1432
+ type: 'tool',
1433
+ time: '09:53:05',
1434
+ tool: 'create-token',
1435
+ params: '{ ..., imageUrl: "https://www.anthropic.com/..." }'
1436
+ },
1437
+ {
1438
+ type: 'error',
1439
+ time: '09:53:12',
1440
+ content: '<span class="error-text">Error: Cannot use remote URL directly. Local file required.</span>'
1441
+ },
1442
+ {
1443
+ type: 'claude',
1444
+ time: '09:53:18',
1445
+ content: 'The tool is looking for a local file on the system rather than a URL. For creating a token with an image, you would need to provide a local file path.'
1446
+ },
1447
+ {
1448
+ type: 'divider'
1449
+ },
1450
+ {
1451
+ type: 'user',
1452
+ time: '09:54:30',
1453
+ content: 'use this image /Users/8bit/Downloads/pumpfun-mcp-server-main/<span class="highlight">nvidia-image-1743382334246.jpg</span>'
1454
+ },
1455
+ {
1456
+ type: 'claude',
1457
+ time: '09:54:33',
1458
+ content: 'I\'ll try to create the token using the local image file path you provided.'
1459
+ },
1460
+ {
1461
+ type: 'tool',
1462
+ time: '09:54:35',
1463
+ tool: 'create-token',
1464
+ params: `{
1465
+ name: "Claude",
1466
+ symbol: "MCP",
1467
+ description: "launched on anthropic",
1468
+ initialBuyAmount: 0.0001,
1469
+ imageUrl: "/Users/8bit/Downloads/.../nvidia-image-1743382334246.jpg"
1470
+ }`
1471
+ },
1472
+ {
1473
+ type: 'system',
1474
+ time: '09:54:38',
1475
+ content: 'Generating mint keypair...'
1476
+ },
1477
+ {
1478
+ type: 'system',
1479
+ time: '09:54:40',
1480
+ content: 'Loading image from local filesystem...'
1481
+ },
1482
+ {
1483
+ type: 'system',
1484
+ time: '09:54:42',
1485
+ content: 'Preparing token metadata...'
1486
+ },
1487
+ {
1488
+ type: 'system',
1489
+ time: '09:54:45',
1490
+ content: 'Broadcasting transaction to Solana mainnet...'
1491
+ },
1492
+ {
1493
+ type: 'system',
1494
+ time: '09:54:48',
1495
+ content: 'Waiting for confirmation...'
1496
+ },
1497
+ {
1498
+ type: 'success',
1499
+ time: '09:54:52',
1500
+ content: '<span class="success-text">TOKEN CREATED SUCCESSFULLY</span>'
1501
+ },
1502
+ {
1503
+ type: 'result',
1504
+ time: '09:54:53',
1505
+ content: `<strong>Token Creation Complete!</strong><br><br>
1506
+ • <strong>Token Name:</strong> Claude<br>
1507
+ • <strong>Token Symbol:</strong> MCP<br>
1508
+ • <strong>Token Address:</strong> <span class="address">2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB</span><br>
1509
+ • <strong>Your Balance:</strong> <span class="success-text">3,576.654744 MCP</span><br>
1510
+ • <strong>Transaction:</strong> <span class="address" style="font-size: 9px;">35tiorNpXhvcF5ct6JfY4bBRpr8JrCrzQmnuNENJQzSW8c5g...</span>`
1511
+ },
1512
+ {
1513
+ type: 'claude',
1514
+ time: '09:54:58',
1515
+ content: 'Great news! The token has been successfully created.<br><br>You can view and share your token using this URL:<br><a href="https://pump.fun/2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB" target="_blank" style="color: var(--accent-cyan);">https://pump.fun/2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB</a><br><br>Your token is now live on Pump.fun! <span class="success-text">History has been made.</span>'
1516
+ },
1517
+ {
1518
+ type: 'system',
1519
+ time: '09:55:10',
1520
+ content: '<span class="success-text">// THE FIRST AI-LAUNCHED TOKEN IS NOW LIVE ON SOLANA</span>'
1521
+ }
1522
+ ];
1523
+
1524
+ let currentIndex = 0;
1525
+ let isPlaying = true;
1526
+
1527
+ async function startConversation() {
1528
+ currentIndex = 0;
1529
+ isPlaying = true;
1530
+ document.getElementById('chat-container').innerHTML = '';
1531
+ playNextMessage();
1532
+ }
1533
+
1534
+ async function playNextMessage() {
1535
+ if (!isPlaying || currentIndex >= conversation.length) return;
1536
+
1537
+ const msg = conversation[currentIndex];
1538
+ const container = document.getElementById('chat-container');
1539
+
1540
+ const el = createMessageElement(msg);
1541
+ container.appendChild(el);
1542
+
1543
+ // Scroll to bottom
1544
+ const body = document.getElementById('terminal-body');
1545
+ body.scrollTop = body.scrollHeight;
1546
+
1547
+ // Animate in
1548
+ await sleep(50);
1549
+ el.classList.add('visible');
1550
+
1551
+ currentIndex++;
1552
+
1553
+ // Determine delay based on message type
1554
+ let delay = 800;
1555
+ if (msg.type === 'user') delay = 1200;
1556
+ if (msg.type === 'claude') delay = 1500;
1557
+ if (msg.type === 'tool') delay = 600;
1558
+ if (msg.type === 'system') delay = 400;
1559
+ if (msg.type === 'error') delay = 1000;
1560
+ if (msg.type === 'success') delay = 1200;
1561
+ if (msg.type === 'divider') delay = 300;
1562
+
1563
+ setTimeout(playNextMessage, delay);
1564
+ }
1565
+
1566
+ function createMessageElement(msg) {
1567
+ const div = document.createElement('div');
1568
+ div.className = 'chat-msg';
1569
+
1570
+ if (msg.type === 'divider') {
1571
+ div.innerHTML = '<div class="msg-divider"></div>';
1572
+ return div;
1573
+ }
1574
+
1575
+ if (msg.type === 'tool') {
1576
+ div.innerHTML = `
1577
+ <div class="tool-call-box">
1578
+ <span class="tool-name">[Invoking tool: ${msg.tool}]</span>
1579
+ <div class="tool-params">${msg.params}</div>
1580
+ </div>
1581
+ `;
1582
+ return div;
1583
+ }
1584
+
1585
+ if (msg.type === 'result') {
1586
+ div.innerHTML = `
1587
+ <div class="result-box">
1588
+ ${msg.content}
1589
+ </div>
1590
+ `;
1591
+ return div;
1592
+ }
1593
+
1594
+ if (msg.type === 'error') {
1595
+ div.innerHTML = `
1596
+ <div class="result-box error">
1597
+ ${msg.content}
1598
+ </div>
1599
+ `;
1600
+ return div;
1601
+ }
1602
+
1603
+ const roleClass = msg.type;
1604
+ const roleLabel = msg.type.charAt(0).toUpperCase() + msg.type.slice(1);
1605
+ const claudeAvatar = 'https://pub-d677725afa16499383930c02ee30c019.r2.dev/gfx/nvidia-image-1743382334246.jpg';
1606
+
1607
+ // Add avatar for Claude messages
1608
+ const avatarHtml = msg.type === 'claude'
1609
+ ? `<img src="${claudeAvatar}" alt="Claude" class="msg-avatar">`
1610
+ : '';
1611
+
1612
+ div.innerHTML = `
1613
+ <div class="msg-header">
1614
+ ${avatarHtml}
1615
+ <span class="msg-role ${roleClass}">${roleLabel}</span>
1616
+ <span class="msg-time">${msg.time}</span>
1617
+ </div>
1618
+ <div class="msg-content">${msg.content}</div>
1619
+ `;
1620
+
1621
+ return div;
1622
+ }
1623
+
1624
+ function restartConversation() {
1625
+ isPlaying = false;
1626
+ setTimeout(startConversation, 100);
1627
+ }
1628
+
1629
+ function skipToEnd() {
1630
+ isPlaying = false;
1631
+ const container = document.getElementById('chat-container');
1632
+ container.innerHTML = '';
1633
+
1634
+ conversation.forEach(msg => {
1635
+ const el = createMessageElement(msg);
1636
+ el.classList.add('visible');
1637
+ container.appendChild(el);
1638
+ });
1639
+
1640
+ const body = document.getElementById('terminal-body');
1641
+ body.scrollTop = body.scrollHeight;
1642
+ }
1643
+
1644
+ // Matrix Rain
1645
+ const canvas = document.getElementById('matrix-canvas');
1646
+ const ctx = canvas.getContext('2d');
1647
+
1648
+ function resizeCanvas() {
1649
+ canvas.width = window.innerWidth;
1650
+ canvas.height = window.innerHeight;
1651
+ }
1652
+ resizeCanvas();
1653
+ window.addEventListener('resize', resizeCanvas);
1654
+
1655
+ const chars = '$MCP01SOLANA';
1656
+ const fontSize = 14;
1657
+ let columns = Math.floor(canvas.width / fontSize);
1658
+ let drops = Array(columns).fill(1);
1659
+
1660
+ function drawMatrix() {
1661
+ ctx.fillStyle = 'rgba(0, 0, 0, 0.05)';
1662
+ ctx.fillRect(0, 0, canvas.width, canvas.height);
1663
+
1664
+ ctx.fillStyle = '#14F195'; // Solana green
1665
+ ctx.font = fontSize + 'px JetBrains Mono';
1666
+
1667
+ for (let i = 0; i < drops.length; i++) {
1668
+ const char = chars[Math.floor(Math.random() * chars.length)];
1669
+ ctx.fillText(char, i * fontSize, drops[i] * fontSize);
1670
+
1671
+ if (drops[i] * fontSize > canvas.height && Math.random() > 0.975) {
1672
+ drops[i] = 0;
1673
+ }
1674
+ drops[i]++;
1675
+ }
1676
+ }
1677
+
1678
+ setInterval(drawMatrix, 50);
1679
+
1680
+ // Copy address
1681
+ function copyAddress() {
1682
+ navigator.clipboard.writeText('2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB');
1683
+ const el = document.querySelector('.token-address-box');
1684
+ const original = el.innerHTML;
1685
+ el.innerHTML = '<span style="color: var(--accent-green);">Copied to clipboard!</span>';
1686
+ setTimeout(() => {
1687
+ el.innerHTML = original;
1688
+ }, 2000);
1689
+ }
1690
+
1691
+ // ==========================================
1692
+ // Terminal Command Input & Jupiter Integration
1693
+ // ==========================================
1694
+
1695
+ const MCP_TOKEN_ADDRESS = '2xh1LVN7yD1dBGfrGcKz4BCTvcgrEyjouoHp9Nq28FZB';
1696
+ let jupiterInitialized = false;
1697
+
1698
+ // Terminal input handling
1699
+ const terminalInput = document.getElementById('terminal-input');
1700
+ const commandHelp = document.getElementById('command-help');
1701
+
1702
+ terminalInput.addEventListener('keydown', function(e) {
1703
+ if (e.key === 'Enter') {
1704
+ const command = this.value.trim().toLowerCase();
1705
+ if (command) {
1706
+ executeCommand(command);
1707
+ this.value = '';
1708
+ }
1709
+ } else if (e.key === 'Escape') {
1710
+ commandHelp.classList.remove('visible');
1711
+ }
1712
+ });
1713
+
1714
+ terminalInput.addEventListener('focus', function() {
1715
+ commandHelp.classList.add('visible');
1716
+ });
1717
+
1718
+ terminalInput.addEventListener('blur', function() {
1719
+ setTimeout(() => {
1720
+ commandHelp.classList.remove('visible');
1721
+ }, 200);
1722
+ });
1723
+
1724
+ function executeCommand(command) {
1725
+ const chatContainer = document.getElementById('chat-container');
1726
+ const terminalBody = document.getElementById('terminal-body');
1727
+
1728
+ // Add user command to chat
1729
+ const cmdEl = document.createElement('div');
1730
+ cmdEl.className = 'chat-msg visible';
1731
+ cmdEl.innerHTML = `
1732
+ <div class="msg-header">
1733
+ <span class="msg-role user">User</span>
1734
+ <span class="msg-time">${new Date().toLocaleTimeString('en-US', { hour12: false })}</span>
1735
+ </div>
1736
+ <div class="msg-content">${command}</div>
1737
+ `;
1738
+ chatContainer.appendChild(cmdEl);
1739
+ terminalBody.scrollTop = terminalBody.scrollHeight;
1740
+
1741
+ // Execute command
1742
+ switch(command) {
1743
+ case 'swap':
1744
+ addSystemMessage('Opening Jupiter swap terminal...');
1745
+ setTimeout(() => {
1746
+ openJupiterWidget();
1747
+ }, 500);
1748
+ break;
1749
+
1750
+ case 'buy':
1751
+ addSystemMessage('Opening Jupiter to buy $MCP...');
1752
+ setTimeout(() => {
1753
+ openJupiterWidget(MCP_TOKEN_ADDRESS);
1754
+ }, 500);
1755
+ break;
1756
+
1757
+ case 'help':
1758
+ addSystemMessage(`Available commands:
1759
+ <br>• <span class="highlight">swap</span> - Open Jupiter swap terminal
1760
+ <br>• <span class="highlight">buy</span> - Buy $MCP tokens
1761
+ <br>• <span class="highlight">restart</span> - Restart conversation replay
1762
+ <br>• <span class="highlight">clear</span> - Clear terminal output
1763
+ <br>• <span class="highlight">info</span> - Show $MCP token info`);
1764
+ break;
1765
+
1766
+ case 'restart':
1767
+ addSystemMessage('Restarting conversation...');
1768
+ setTimeout(() => restartConversation(), 500);
1769
+ break;
1770
+
1771
+ case 'clear':
1772
+ chatContainer.innerHTML = '';
1773
+ addSystemMessage('Terminal cleared.');
1774
+ break;
1775
+
1776
+ case 'info':
1777
+ addSystemMessage(`<strong>$MCP Token Information</strong>
1778
+ <br>• Name: Claude (MCP)
1779
+ <br>• Symbol: $MCP
1780
+ <br>• Address: <span class="address">${MCP_TOKEN_ADDRESS}</span>
1781
+ <br>• Chain: Solana
1782
+ <br>• Launch: March 31, 2025
1783
+ <br>• <a href="https://pump.fun/coin/${MCP_TOKEN_ADDRESS}" target="_blank" style="color: var(--solana-green);">View on Pump.fun</a>`);
1784
+ break;
1785
+
1786
+ default:
1787
+ addSystemMessage(`<span class="error-text">Unknown command: ${command}</span>
1788
+ <br>Type <span class="highlight">help</span> for available commands.`);
1789
+ }
1790
+ }
1791
+
1792
+ function addSystemMessage(content) {
1793
+ const chatContainer = document.getElementById('chat-container');
1794
+ const terminalBody = document.getElementById('terminal-body');
1795
+
1796
+ const msgEl = document.createElement('div');
1797
+ msgEl.className = 'chat-msg visible';
1798
+ msgEl.innerHTML = `
1799
+ <div class="msg-header">
1800
+ <span class="msg-role system">System</span>
1801
+ <span class="msg-time">${new Date().toLocaleTimeString('en-US', { hour12: false })}</span>
1802
+ </div>
1803
+ <div class="msg-content">${content}</div>
1804
+ `;
1805
+ chatContainer.appendChild(msgEl);
1806
+ terminalBody.scrollTop = terminalBody.scrollHeight;
1807
+ }
1808
+
1809
+ // Jupiter Widget Functions
1810
+ let jupiterWidgetOpen = false;
1811
+
1812
+ function toggleJupiterWidget(outputMint = null) {
1813
+ const container = document.getElementById('jupiter-container');
1814
+ const fab = document.getElementById('jupiter-fab');
1815
+
1816
+ jupiterWidgetOpen = !jupiterWidgetOpen;
1817
+
1818
+ if (jupiterWidgetOpen) {
1819
+ container.classList.add('visible');
1820
+ fab.classList.add('active');
1821
+
1822
+ // Initialize Jupiter Terminal if not already done
1823
+ if (!jupiterInitialized && window.Jupiter) {
1824
+ initJupiter(outputMint);
1825
+ } else if (window.Jupiter && outputMint) {
1826
+ window.Jupiter.syncProps({
1827
+ initialOutputMint: outputMint
1828
+ });
1829
+ }
1830
+ } else {
1831
+ container.classList.remove('visible');
1832
+ fab.classList.remove('active');
1833
+ }
1834
+ }
1835
+
1836
+ function openJupiterWidget(outputMint = null) {
1837
+ if (!jupiterWidgetOpen) {
1838
+ toggleJupiterWidget(outputMint);
1839
+ } else if (outputMint && window.Jupiter) {
1840
+ window.Jupiter.syncProps({
1841
+ initialOutputMint: outputMint
1842
+ });
1843
+ }
1844
+ }
1845
+
1846
+ function initJupiter(outputMint = null) {
1847
+ // RPC and API Configuration
1848
+ const RPC_URL = 'https://ancient-burned-friday.solana-mainnet.quiknode.pro/bc8308dfa6d609f531f014aeee4ca28e16934efb/';
1849
+ const REFERRAL_KEY = '2mE1EbETC8e8XyJomMkvQ3jXzoGBZAqRRSRFJv9AHRD9';
1850
+ const PLATFORM_FEE_BPS = 20;
1851
+
1852
+ const config = {
1853
+ displayMode: 'integrated',
1854
+ integratedTargetId: 'jupiter-terminal-container',
1855
+ endpoint: RPC_URL,
1856
+ strictTokenList: false,
1857
+ defaultExplorer: 'Solscan',
1858
+ platformFeeAndAccounts: {
1859
+ referralAccount: REFERRAL_KEY,
1860
+ feeBps: PLATFORM_FEE_BPS
1861
+ },
1862
+ formProps: {
1863
+ initialInputMint: 'So11111111111111111111111111111111111111112',
1864
+ initialOutputMint: outputMint || MCP_TOKEN_ADDRESS,
1865
+ fixedInputMint: false,
1866
+ fixedOutputMint: false,
1867
+ swapMode: 'ExactIn',
1868
+ initialSlippageBps: 50
1869
+ },
1870
+ enableWalletPassthrough: true,
1871
+ passthroughWalletContextState: null,
1872
+ onSuccess: ({ txid }) => {
1873
+ console.log('Swap successful:', txid);
1874
+ addSystemMessage(`<span style="color: var(--solana-green);">✓ Swap successful! TX: ${txid.slice(0,8)}...</span>`);
1875
+ },
1876
+ onSwapError: ({ error }) => {
1877
+ console.error('Swap error:', error);
1878
+ addSystemMessage(`<span class="error-text">Swap failed: ${error?.message || 'Unknown error'}</span>`);
1879
+ }
1880
+ };
1881
+
1882
+ try {
1883
+ if (window.Jupiter) {
1884
+ window.Jupiter.init(config);
1885
+ jupiterInitialized = true;
1886
+ console.log('Jupiter Terminal initialized with QuickNode RPC');
1887
+ } else {
1888
+ console.error('Jupiter SDK not loaded');
1889
+ addSystemMessage('<span class="error-text">Jupiter SDK not loaded. Please refresh the page.</span>');
1890
+ }
1891
+ } catch (error) {
1892
+ console.error('Failed to initialize Jupiter:', error);
1893
+ addSystemMessage('<span class="error-text">Failed to load Jupiter Terminal. Please try again.</span>');
1894
+ }
1895
+ }
1896
+
1897
+ // Handle Escape key to close widget
1898
+ document.addEventListener('keydown', function(e) {
1899
+ if (e.key === 'Escape' && jupiterWidgetOpen) {
1900
+ toggleJupiterWidget();
1901
+ }
1902
+ });
1903
+
1904
+ // Start boot sequence on load
1905
+ window.addEventListener('load', runBootSequence);
1906
+
1907
+ // Initialize Jupiter when script is ready
1908
+ let jupiterLoadAttempts = 0;
1909
+ function waitForJupiter() {
1910
+ jupiterLoadAttempts++;
1911
+ if (window.Jupiter) {
1912
+ console.log('Jupiter SDK loaded after', jupiterLoadAttempts, 'attempts');
1913
+ } else if (jupiterLoadAttempts < 100) {
1914
+ setTimeout(waitForJupiter, 100);
1915
+ } else {
1916
+ console.error('Jupiter SDK failed to load after 10 seconds');
1917
+ }
1918
+ }
1919
+
1920
+ // Start checking for Jupiter after DOM ready
1921
+ if (document.readyState === 'loading') {
1922
+ document.addEventListener('DOMContentLoaded', waitForJupiter);
1923
+ } else {
1924
+ waitForJupiter();
1925
+ }
1926
+ </script>
1927
+
1928
+ <!-- Jupiter Terminal Script - Load with high priority -->
1929
+ <script src="https://terminal.jup.ag/main-v2.js" async></script>
1930
+ </body>
1931
  </html>