-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy patharchitecture.html
More file actions
397 lines (377 loc) · 18.8 KB
/
architecture.html
File metadata and controls
397 lines (377 loc) · 18.8 KB
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
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>qFoldIT — Architecture Overview</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
} ::-webkit-scrollbar{width:0px}
body {
font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
background: #ffffff;
color: #1a1a1a;
display: flex;
flex-direction: column;
height: 100vh;
padding: 12px 16px;
line-height: 1.3;
}
h1 {
font-weight: 400;
font-size: 1.3rem;
letter-spacing: 0.5px;
color: #2d2d2d;
margin-bottom: 8px;
text-align: center;
border-bottom: 1px solid #d0d0d0;
padding-bottom: 6px;
}
.diagram {
display: flex;
flex-direction: column;
flex: 1;
gap: 6px;
min-height: 0;
}
.row {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 8px;
padding: 4px 0;
}
.cluster {
background: #fafafa;
border: 1px solid #bfbfbf;
border-radius: 4px;
padding: 6px 10px;
transition: 0.15s;
min-width: 150px;
}
.cluster:hover {
border-color: #595959;
background: #f0f0f0;
}
.cluster.core {
background: #e8e8e8;
border-color: #7a7a7a;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
padding: 8px 12px;
}
.cluster-title {
display: flex;
align-items: center;
gap: 5px;
font-weight: 500;
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.4px;
color: #4a4a4a;
margin-bottom: 6px;
border-bottom: 1px solid #dedede;
padding-bottom: 4px;
}
.cluster-title .icon {
width: 16px;
height: 16px;
border-radius: 2px;
background: #888;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 0.6rem;
color: white;
}
.nodes {
display: flex;
flex-wrap: wrap;
gap: 5px;
}
.node {
background: #ffffff;
border: 1px solid #d4d4d4;
border-left-width: 4px;
border-radius: 3px;
padding: 4px 8px;
display: flex;
align-items: center;
gap: 5px;
font-size: 0.7rem;
color: #2b2b2b;
transition: 0.15s;
white-space: nowrap;
}
.node:hover {
background: #f4f4f4;
border-color: #7a7a7a;
}
.node.aws {
border-left-color: #d97706;
}
.node.docker {
border-left-color: #2563eb;
}
.node.external {
border-left-color: #059669;
}
.node.user {
border-left-color: #7c3aed;
}
.node img {
width: 14px;
height: 14px;
object-fit: contain;
}
.node i {
font-size: 14px;
width: 14px;
text-align: center;
color: inherit;
}
.node i.fa-aws { color: #d97706; }
.node i.fa-docker { color: #2563eb; }
.node i.fa-plug { color: #059669; }
.node i.fa-user { color: #7c3aed; }
/* Colored icons in legend */
.legend-item i.fa-aws { color: #d97706; }
.legend-item i.fa-docker { color: #2563eb; }
.legend-item i.fa-plug { color: #059669; }
.legend-item i.fa-user { color: #7c3aed; }
/* Connection lines */
.connection-lines {
text-align: center;
margin: 6px 0;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}
.connection-lines::before,
.connection-lines::after {
content: "";
flex: 1;
border-top: 2px solid #b0b0b0;
}
.connection-lines span {
font-size: 0.65rem;
color: #6f6f6f;
white-space: nowrap;
padding: 0 6px;
}
.connection-lines.main::before,
.connection-lines.main::after {
border-top-width: 3px;
border-color: #333;
}
.connection-lines.main span {
font-weight: 600;
color: #1a1a1a;
}
.connection-lines.secondary::before,
.connection-lines.secondary::after {
border-top: 1px dashed #aaa;
}
.connection-lines.secondary span {
color: #999;
font-style: italic;
}
.legend {
display: flex;
justify-content: center;
align-items: center;
gap: 0;
font-size: 0.65rem;
color: #6f6f6f;
margin-bottom: 6px;
}
.legend-item {
display: flex;
align-items: center;
gap: 4px;
padding: 0 10px;
position: relative;
}
.legend-item:not(:last-child)::after {
content: "|";
position: absolute;
right: -2px;
color: #b0b0b0;
font-weight: 300;
}
.legend-item i {
font-size: 12px;
width: 14px;
text-align: center;
}
@media (max-width: 700px) {
body {
padding: 8px;
height: auto;
overflow: auto;
}
.node {
font-size: 0.65rem;
padding: 3px 6px;
}
}
</style>
</head>
<body>
<h1>qFoldIT Architecture Overview</h1>
<!-- Legend with colored icons -->
<div class="legend">
<div class="legend-item"><i class="fab fa-aws"></i> Managed Services</div>
<div class="legend-item"><i class="fab fa-docker"></i> Docker Microservices</div>
<div class="legend-item"><i class="fas fa-plug"></i> External API's / Quantum Backends</div>
<div class="legend-item"><i class="fas fa-user"></i> Users</div>
</div>
<div class="diagram">
<!-- Users -->
<div class="row">
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#555;">U</span> Users</div>
<div class="nodes">
<div class="node user">
<img src="https://refoldit.github.io/img/logo/vk_play_logo.png" alt="VK Play">
VK Play
</div>
<div class="node user">
<i class="fab fa-apple" style="color:#000;"></i>
Apple Vision Pro
</div>
<div class="node user">
<i class="fab fa-steam" style="color:#000;"></i>
Steam
</div>
<div class="node user">
<img src="https://qfoldit.github.io/assets/Ps-Logo.svg" alt="PS5">
PS5
</div>
<div class="node user">
<img src="https://qfoldit.github.io/assets/Xbox_one.svg" alt="Xbox">
Xbox
</div>
<div class="node user"><i class="fas fa-vr-cardboard"></i> VR (Meta Quest)</div>
<div class="node user"><i class="fas fa-globe"></i> Web / Smart TV</div>
</div>
</div>
</div>
<div class="connection-lines main"><span>HTTPS / WebSocket / WebRTC</span></div>
<!-- Gateway & Security -->
<div class="row">
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#666;">G</span> Gateway & Security</div>
<div class="nodes">
<div class="node aws"><i class="fab fa-aws"></i> AWS WAF & Shield</div>
<div class="node docker"><i class="fab fa-docker"></i> api-gateway (Envoy)</div>
<div class="node docker"><i class="fab fa-docker"></i> auth-service</div>
</div>
</div>
</div>
<div class="connection-lines main"><span>gRPC / REST</span></div>
<!-- Core compute (highlighted) -->
<div class="row">
<div class="cluster core">
<div class="cluster-title"><span class="icon" style="background:#4a4a4a;">C</span> Quantum-Classical Computing</div>
<div class="nodes">
<div class="node docker"><i class="fab fa-docker"></i> rosetta</div>
<div class="node docker"><i class="fab fa-docker"></i> quantum-folding</div>
<div class="node docker"><i class="fab fa-docker"></i> fold-core</div>
<div class="node docker"><i class="fab fa-docker"></i> quantum-adapter</div>
<div class="node external">
<img src="https://qfoldit.github.io/img/1/logo/amazon-braket.svg" alt="Braket">
Amazon Braket
</div>
<div class="node external">
<img src="https://refoldit.github.io/img/logo/rosatom_logo.png" alt="Rosatom">
Rosatom API (70 qubits)
</div>
</div>
</div>
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#5a5a5a;">AI</span> AI & AutoResearch</div>
<div class="nodes">
<div class="node docker"><i class="fab fa-docker"></i> bio-ml (Triton)</div>
<div class="node docker"><i class="fab fa-docker"></i> autoresearch</div>
<div class="node docker"><i class="fab fa-docker"></i> ai-preprocessor</div>
<div class="node docker"><i class="fab fa-docker"></i> ai-result-cache</div>
<div class="node aws">
<img src="https://qfoldit.github.io/img/1/logo/SageMaker.svg" alt="SageMaker">
SageMaker
</div>
<div class="node docker"><i class="fab fa-docker"></i> bionemo:2.7.1</div>
</div>
</div>
</div>
<div class="connection-lines main"><span>Video Stream / WebSocket</span></div>
<!-- Game Rendering & VR -->
<div class="row">
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#707070;">R</span> Game Rendering & VR</div>
<div class="nodes">
<div class="node docker"><i class="fab fa-docker"></i> unigine-renderer</div>
<div class="node docker"><i class="fab fa-docker"></i> animation</div>
<div class="node docker"><i class="fab fa-docker"></i> nanover-server</div>
</div>
</div>
</div>
<div class="connection-lines main"><span>gRPC / REST</span></div>
<!-- Applied modules -->
<div class="row">
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#808080;">I</span> Applied Modules (B2B)</div>
<div class="nodes">
<div class="node docker"><i class="fab fa-docker"></i> oilgas-dnatracer</div>
<div class="node docker"><i class="fab fa-docker"></i> oilgas-corrosion</div>
<div class="node docker"><i class="fab fa-docker"></i> oilgas-meor</div>
<div class="node docker"><i class="fab fa-docker"></i> mining-bioox</div>
<div class="node docker"><i class="fab fa-docker"></i> mining-biosorption</div>
<div class="node docker"><i class="fab fa-docker"></i> mining-prospecting</div>
<div class="node docker"><i class="fab fa-docker"></i> plant</div>
</div>
</div>
</div>
<div class="connection-lines secondary"><span>Data & Logs</span></div>
<!-- Persistence & Observability + Economy -->
<div class="row">
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#8c8c8c;">D</span> Persistence & Observability</div>
<div class="nodes">
<div class="node aws"><i class="fab fa-aws"></i> RDS PostgreSQL</div>
<div class="node aws"><i class="fab fa-aws"></i> ElastiCache (Redis)</div>
<div class="node aws"><i class="fab fa-aws"></i> Amazon MQ (RabbitMQ)</div>
<div class="node aws"><i class="fab fa-aws"></i> S3</div>
<div class="node docker"><i class="fab fa-docker"></i> log-aggregator (OpenSearch)</div>
<div class="node docker"><i class="fab fa-docker"></i> monitoring-hub</div>
</div>
</div>
<div class="cluster">
<div class="cluster-title"><span class="icon" style="background:#999;">E</span> Economy & Web3</div>
<div class="nodes">
<div class="node docker"><i class="fab fa-docker"></i> economy-service</div>
<div class="node docker"><i class="fab fa-docker"></i> blockchain-writer</div>
<div class="node docker"><i class="fab fa-docker"></i> webhook-processor</div>
<div class="node external"><i class="fas fa-university"></i> Bank of Ghana (eCedi)</div>
</div>
</div>
</div>
</div>
<svg width="100%" height="30" viewBox="0 0 190 18" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M58.2709 3.27878V14.6683H61.5251V3.27878H58.2709ZM32.6694 3.26315V14.6682H35.9526V5.81835L38.5141 5.82702C39.1876 5.76592 39.855 5.99486 40.3453 6.45519C40.8597 6.99747 41.0704 7.87118 41.0704 9.4711V14.6726H44.2517V8.36834C44.2517 3.87138 41.3548 3.2649 38.5141 3.2649L32.6694 3.26316V3.26315ZM63.5116 3.27878V14.6683H68.7901C71.5992 14.6683 72.5201 14.2058 73.5129 13.1698C74.3551 11.9821 74.7625 10.5462 74.6682 9.09888C74.731 7.71702 74.3633 6.34938 73.6148 5.18062C72.4095 3.59025 70.6722 3.27964 68.0791 3.27964L63.5116 3.27878ZM66.7395 5.75849H68.1387C70.1683 5.75849 71.4816 6.65996 71.4816 8.99738C71.4816 11.3348 70.1648 12.2371 68.1387 12.2371H66.7395V5.75849ZM53.5788 3.27878L50.8628 12.3022L48.26 3.27878H44.7486L48.4654 14.6683H53.1557L56.9015 3.27878H53.5788H53.5788ZM76.1824 14.6683H79.4375V3.27964H76.1816L76.1824 14.6683H76.1824ZM85.3085 3.28311L80.7639 14.6639H83.9733L84.6923 12.6527H90.07L90.7503 14.6639H94.2345L89.6556 3.28224L85.3085 3.2831V3.28311ZM87.4215 5.35937L89.3932 10.691H85.3884L87.4215 5.35937Z" fill="black"></path>
<path d="M9.79534 5.31093V3.70317C13.839 3.10878 17.5269 7.45469 17.3659 7.457C17.4065 7.63929 13.2055 12.8441 9.79534 11.5767V6.70148C11.4661 6.90826 11.802 7.66442 12.8068 9.37989L15.0409 7.45001C15.0365 7.18791 12.4148 4.93506 9.79534 5.31093ZM9.79534 0V2.40149C15.4866 1.72074 20.2935 7.4054 20.1152 7.38817C20.2415 7.48 14.2092 14.0948 9.79534 12.8441V14.3286C14.4012 14.8263 18.0854 12.3236 21.2889 9.44804C21.7912 9.86048 23.8495 10.8637 24.2728 11.3035C20.995 13.9746 14.0423 16.0668 9.79534 15.7124V17.7986H26.2529V0L9.79534 0ZM9.79534 11.5767V12.8441C5.79044 12.1126 4.32025 7.81787 4.32025 7.81787C4.32025 7.81787 6.56323 5.59204 9.79534 5.31093V6.70148C8.12332 6.48878 6.24693 8.17117 6.24693 8.17117C6.24693 8.17117 6.90118 10.7496 9.79534 11.5767ZM2.68227 7.66254C2.68227 7.66254 5.05584 4.07418 9.79534 3.70317V2.40149C4.54589 2.8331 0 7.38817 0 7.38817C0 7.38817 2.57452 15.0143 9.79534 15.7124V14.3286C4.49657 13.6455 2.68227 7.66254 2.68227 7.66254Z" fill="#74B71B"></path>
<path d="M109.905 8.85135C109.905 7.14156 110.035 5.57557 108.727 4.29722C107.959 3.54619 106.864 3.21062 105.654 3.21062H101.452V14.588H105.654C106.864 14.588 107.959 14.2524 108.727 13.5014C110.035 12.223 109.905 10.5611 109.905 8.85135ZM107.632 8.85135C107.632 10.5771 107.567 11.3921 107.142 11.9034C106.749 12.3668 106.226 12.6065 105.441 12.6065H103.725V5.19207H105.441C106.226 5.19207 106.749 5.43176 107.142 5.89516C107.567 6.4065 107.632 7.12558 107.632 8.85135Z" fill="black"></path>
<path d="M119.897 14.588V12.6065H114.502V9.84207H119.096V7.86063H114.502V5.19207H119.897V3.21062H112.229V14.588H119.897Z" fill="black"></path>
<path d="M130.221 3.21062H127.851L125.513 10.6251L123.175 3.21062H120.82L124.662 14.588H126.363L130.221 3.21062Z" fill="black"></path>
<path d="M139.296 14.588V12.6065H133.901V9.84207H138.495V7.86063H133.901V5.19207H139.296V3.21062H131.628V14.588H139.296Z" fill="black"></path>
<path d="M149.081 14.588V12.6065H143.8V3.21062H141.527V14.588H149.081Z" fill="black"></path>
<path d="M158.708 8.89929C158.708 6.93382 158.724 5.51166 157.547 4.36114C156.73 3.56217 155.732 3.11475 154.408 3.11475C153.084 3.11475 152.07 3.56217 151.252 4.36114C150.075 5.51166 150.108 6.93382 150.108 8.89929C150.108 10.8648 150.075 12.2869 151.252 13.4374C152.07 14.2364 153.084 14.6838 154.408 14.6838C155.732 14.6838 156.73 14.2364 157.547 13.4374C158.724 12.2869 158.708 10.8648 158.708 8.89929ZM156.435 8.89929C156.435 11.0885 156.304 11.6158 155.863 12.0952C155.536 12.4627 155.029 12.7024 154.408 12.7024C153.787 12.7024 153.263 12.4627 152.936 12.0952C152.495 11.6158 152.381 11.0885 152.381 8.89929C152.381 6.71011 152.495 6.18279 152.936 5.70341C153.263 5.33588 153.787 5.09619 154.408 5.09619C155.029 5.09619 155.536 5.33588 155.863 5.70341C156.304 6.18279 156.435 6.71011 156.435 8.89929Z" fill="black"></path>
<path d="M169.377 6.75805C169.377 4.82454 167.938 3.21062 165.535 3.21062H161.022V14.588H163.295V10.3055H165.535C167.938 10.3055 169.377 8.69156 169.377 6.75805ZM167.104 6.75805C167.104 7.68486 166.45 8.30805 165.42 8.30805H163.295V5.19207H165.42C166.45 5.19207 167.104 5.83124 167.104 6.75805Z" fill="black"></path>
<path d="M178.956 14.588V12.6065H173.561V9.84207H178.155V7.86063H173.561V5.19207H178.956V3.21062H171.289V14.588H178.956Z" fill="black"></path>
<path d="M190 14.588L187.4 9.68228C188.529 9.2828 189.526 8.29207 189.526 6.69413C189.526 4.79258 188.12 3.21062 185.749 3.21062H181.188V14.588H183.46V10.0498H185.095L187.368 14.588H190ZM187.253 6.69413C187.253 7.573 186.599 8.1962 185.602 8.1962H183.46V5.19207H185.602C186.599 5.19207 187.253 5.81527 187.253 6.69413Z" fill="black"></path></svg>
</body>
</html>