-
Notifications
You must be signed in to change notification settings - Fork 0
/
index2.html
247 lines (209 loc) · 10.7 KB
/
index2.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.6.0/p5.js"></script>
<script type="module" src="./js/observable.js"></script>
<link
href="https://cdn.jsdelivr.net/npm/daisyui@2.6.0/dist/full.css"
rel="stylesheet"
type="text/css"
/>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.4.24/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@observablehq/inspector@5/dist/inspector.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans&display=swap" rel="stylesheet">
<!-- D3.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
<script type="module" src="https://haawkeneuraltech.com/src/ai.js"></script>
<script type="module">
import { Ai } from "https://haawkeneuraltech.com/src/ai.js";
export default {
async fetch(request, env) {
const ai = new Ai(env.AI);
const button = document.getElementById('submit')
button.addEventListener('click', submitFetch)
const input = document.querySelector("input");
const log = document.getElementById("values");
input.addEventListener("input", updateValue);
function updateValue(e) {
log.textContent = e.target.value;
}
const data = { "prompt": log.textContent }
const response = await ai.submitFetch(
'@cf/stabilityai/stable-diffusion-xl-base-1.0',
data
);
return new Response(response, {
headers: {
'content-type': 'image/png'
}
});
}
};
</script>
<style>
html, body {
text-align: center;
font-family: 'Josefin Sans', sans-serif;
color:white;
margin:0;
}
text, h3, h2 {
font-family: 'Josefin Sans', sans-serif;
color:white;
}
.btn {
margin: 5;
}
#observablehq-svg-a1463b06 {
box-shadow: rgba(64, 12, 119, 0.16) 0px 1px 4px;
}
.controls {
margin-left: 2%;
margin-right: 2%;
position: relative;
}
.svg {
height:40%;
width:100%;
}
#logo {
margin-left:30%;
}
#container {
width: 100%;
height: 45%;
}
</style>
</head>
<body>
<div class="navbar bg-base-300">
<button class="btn btn-ghost text-xl" href="https://haawkeneuraltech.com/">Haawke Neural Technology</button>
<div class="controls" id="observablehq-viewof-gradientEffect2-3b95f26a"></div>
<div class="controls" id="observablehq-viewof-filterEffect-3b95f26a"></div>
<div class="controls" id="observablehq-viewof-colorBlendEffect-3b95f26a"></div>
<div class="controls" id="observablehq-viewof-colorBlendEffect2-3b95f26a"></div>
<a><button class="btn btn-active btn-neutral" href="https://dev-hxoz48d37guyzgvs.us.auth0.com/u/login?state=hKFo2SBHMkNvRFBMYUZkWGxwejlTNlhFMDBlb2xheUQ0VENISKFur3VuaXZlcnNhbC1sb2dpbqN0aWTZIDNxdnFSc3hMUHRzUGpqSGJqTnRnUEJ4V3RiQWNLb1plo2NpZNkgeVFXUlA5U1pUZHhEYmVVM3hDTk4wVFpkQ3RQUDRPYnA" >Login</button></a>
<button class="btn btn-active btn-primary">Register</button>
</div>
<div class="hero min-h-screen ">
<div class="hero-content text-center">
<div class="max-w-md">
<div id="container">
<main id="main">
</main>
<div>
</div>
<input id="input" placeholder="Text-to-image prompt" type="text"></input>
<button id="submit">Submit</button>
</div> </div>
</div>
</div>
<p id="values"></p>
<footer class="footer p-10 bg-base-200 text-base-content">
<aside>
<svg id="logo" version="1.0" xmlns="http://www.w3.org/2000/svg"
width="60pt" height="60pt" viewBox="0 0 962.000000 947.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,947.000000) scale(0.100000,-0.100000)"
fill="#838591" stroke="none">
<path d="M4550 9314 c-496 -43 -868 -119 -1240 -253 -47 -16 -105 -37 -130
-46 -25 -9 -61 -23 -80 -32 -19 -8 -44 -19 -55 -23 -836 -354 -1556 -956
-2050 -1714 -121 -186 -276 -470 -355 -651 -12 -27 -27 -63 -35 -80 -66 -150
-165 -446 -214 -643 -206 -818 -185 -1683 60 -2477 50 -162 111 -330 161 -445
43 -100 53 -121 124 -262 320 -637 758 -1166 1324 -1597 218 -167 449 -310
718 -445 128 -64 181 -89 267 -126 11 -4 36 -15 55 -23 19 -9 55 -23 80 -32
25 -9 83 -30 130 -46 304 -109 648 -188 1005 -231 275 -32 755 -32 1030 0 353
42 687 118 990 226 173 61 188 67 242 92 30 13 56 24 59 24 22 0 353 167 509
258 677 393 1256 974 1648 1655 59 101 189 355 227 442 12 28 27 64 35 80 94
213 204 572 260 845 68 334 89 551 89 925 0 382 -21 603 -89 935 -56 273 -169
639 -265 856 -12 27 -28 65 -37 84 -35 79 -167 337 -220 427 -391 679 -970
1261 -1642 1652 -161 93 -387 208 -536 271 -11 4 -36 15 -55 23 -36 16 -49 21
-225 83 -296 106 -641 185 -980 225 -133 15 -256 21 -470 24 -159 1 -310 1
-335 -1z m700 -410 c315 -26 545 -73 860 -175 620 -201 1182 -541 1654 -999
507 -492 861 -1068 1074 -1745 202 -640 235 -1417 91 -2130 -86 -428 -244
-840 -478 -1242 -506 -873 -1390 -1577 -2350 -1872 -151 -46 -440 -115 -571
-135 -231 -36 -416 -49 -700 -49 -658 0 -1158 101 -1735 353 -327 143 -599
305 -920 549 -162 123 -436 385 -592 566 -467 543 -807 1263 -923 1950 -40
235 -51 357 -57 636 -14 621 62 1094 259 1609 162 426 436 888 717 1210 104
120 357 374 471 474 433 379 992 684 1551 846 290 84 448 117 698 145 316 36
594 38 951 9z"/>
<path d="M4665 8674 c-256 -13 -508 -44 -720 -90 -798 -172 -1574 -626 -2108
-1234 -557 -635 -897 -1403 -966 -2185 -97 -1103 186 -2087 834 -2895 105
-130 341 -374 489 -504 489 -429 1168 -760 1818 -886 184 -35 375 -59 584 -72
329 -20 738 11 1087 83 602 123 1210 422 1701 837 129 109 387 368 489 492
345 414 606 918 751 1447 137 501 171 1091 96 1658 -99 747 -414 1437 -920
2010 -590 670 -1401 1131 -2247 1279 -243 43 -662 71 -888 60z m655 -308 c676
-89 1317 -378 1886 -851 573 -476 986 -1139 1164 -1870 236 -967 83 -1967
-429 -2814 -157 -258 -281 -419 -481 -624 -426 -438 -930 -750 -1510 -936
-238 -76 -477 -126 -735 -152 -153 -15 -612 -15 -775 0 -628 59 -1213 273
-1750 639 -564 385 -1050 992 -1293 1612 -153 392 -223 723 -248 1170 -34 614
56 1135 291 1675 344 794 971 1434 1788 1825 377 181 806 301 1217 339 158 15
727 6 875 -13z"/>
<path d="M4545 8314 c-490 -39 -895 -151 -1340 -369 -503 -248 -910 -575
-1255 -1009 -8 -10 -27 -33 -41 -50 -42 -51 -161 -233 -229 -351 -185 -321
-343 -740 -409 -1085 -75 -393 -71 -996 10 -1435 66 -359 218 -764 404 -1080
57 -97 160 -252 188 -282 l20 -23 769 0 768 0 0 -35 0 -35 -567 -1 c-313 -1
-646 -4 -741 -8 l-173 -6 79 -95 c89 -108 320 -338 432 -431 359 -299 741
-510 1202 -663 398 -133 682 -176 1164 -176 474 0 738 40 1141 175 443 148
774 329 1143 624 132 106 334 304 456 446 l103 120 -197 6 c-108 4 -463 7
-788 8 l-592 1 -5 27 c-3 16 -3 31 0 35 2 5 372 8 822 8 l818 0 80 123 c322
490 517 1032 579 1612 21 190 23 591 5 765 -73 702 -356 1379 -795 1900 -97
115 -321 340 -431 431 -426 356 -935 623 -1440 754 -276 72 -474 95 -850 100
-154 1 -302 1 -330 -1z m2025 -2254 l0 -1210 745 0 745 0 0 125 0 125 -610 0
-610 0 0 40 0 40 650 0 650 0 0 -289 c0 -159 3 -296 6 -305 6 -15 -68 -16
-785 -16 l-791 0 0 -790 0 -790 -165 0 -165 0 0 1960 0 1960 -27 0 c-16 0 -73
2 -128 5 -55 3 -113 2 -129 -1 l-29 -6 4 -612 4 -611 -872 -3 -873 -2 0 -155
0 -155 870 0 870 0 0 -987 c0 -544 3 -1079 7 -1190 l6 -203 -170 0 -170 0 -6
152 c-4 83 -7 546 -7 1030 l0 878 -705 0 -705 0 0 -1030 0 -1030 -170 0 -170
0 0 1960 0 1960 -27 0 c-16 0 -82 1 -148 2 l-120 2 -3 -1962 -2 -1962 -170 0
-170 0 0 790 0 790 -767 1 c-423 1 -811 2 -863 3 l-95 1 0 300 0 300 733 3
732 2 0 -40 0 -40 -692 -2 -693 -3 -3 -122 -3 -123 826 0 825 0 0 1210 0 1210
1685 0 1685 0 0 -1210z m-2850 -3825 l0 -315 -427 2 -428 3 0 35 0 35 388 3
387 2 0 120 0 120 -605 0 -605 0 0 35 0 35 605 0 605 0 0 120 0 120 40 0 40 0
0 -315z m2230 195 l0 -120 620 0 620 0 0 -35 0 -35 -620 0 -620 0 0 -120 0
-120 394 0 c217 0 401 -3 410 -6 10 -4 16 -18 16 -40 l0 -34 -450 0 -450 0 0
315 0 315 40 0 40 0 0 -120z m-1042 -34 c109 -29 202 -107 255 -216 29 -58 32
-74 32 -155 0 -77 -4 -98 -27 -147 -96 -205 -367 -289 -560 -174 -64 38 -135
113 -165 175 -25 49 -28 67 -28 151 0 83 3 102 27 151 52 104 160 193 265 218
58 14 142 12 201 -3z"/>
<path d="M4203 6913 l-23 -4 0 -460 0 -459 705 0 705 0 0 465 0 465 -682 -1
c-376 -1 -693 -4 -705 -6z"/>
<path d="M1550 4715 l0 -55 826 0 825 0 -3 53 -3 52 -822 3 -823 2 0 -55z"/>
<path d="M6570 4715 l0 -55 745 0 745 0 0 55 0 55 -745 0 -745 0 0 -55z"/>
<path d="M4740 2326 c-72 -16 -113 -38 -164 -89 -49 -50 -73 -96 -87 -172 -24
-131 61 -261 209 -318 51 -20 162 -22 215 -3 87 31 170 116 197 200 70 216
-141 434 -370 382z"/>
</g>
</svg>
<p>Haawke Neural Technology <br/>Providing reliable tech since 1992</p>
</aside>
<nav>
<header class="footer-title">Services</header>
<a class="link link-hover">AR/VR</a>
<a class="link link-hover">App Development</a>
<a class="link link-hover">Video Projection Mapping</a>
<a class="link link-hover">Print/web - 2d and 3d Design</a>
<a class="link link-hover">Ai and machine learning models and integrations</a>
</nav>
<nav>
<header class="footer-title">Company</header>
<a class="link link-hover">About us</a>
<a class="link link-hover">Contact</a>
<a class="link link-hover">Jobs</a>
<a class="link link-hover">Press kit</a>
</nav>
<nav>
<header class="footer-title">Legal</header>
<a class="link link-hover">Terms of use</a>
<a class="link link-hover" href="https:inoculate.media/privacy.html">Privacy policy</a>
</nav>
</footer>
<script src="./sketch.js"></script>
</body>
</html>