Hugging Face's logo

Spaces:
TheWheke
/
Sentinel
Running

App Files Community
TheWheke commited on
Commit
e4d7238
·
verified ·
1 Parent(s): 411a15a

create index.html for sentinel

Browse files
Files changed (1) hide show
  1. index.html +186 -17
index.html CHANGED
@@ -1,19 +1,188 @@
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>
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width,initial-scale=1" />
6
+ <title>Red Halo — Editor Safe</title>
7
+
8
+ <style>
9
+ html, body{
10
+ margin:0;
11
+ padding:0;
12
+ height:100%;
13
+ background:#000;
14
+ overflow:hidden;
15
+ }
16
+
17
+ canvas{
18
+ width:100%;
19
+ height:100%;
20
+ display:block;
21
+ background:#000;
22
+ }
23
+ </style>
24
+ </head>
25
+
26
+ <body>
27
+ <canvas id="gl"></canvas>
28
+
29
+ <script>
30
+ (() => {
31
+
32
+ const canvas = document.getElementById("gl");
33
+ const gl = canvas.getContext("webgl", {antialias:true}) ||
34
+ canvas.getContext("experimental-webgl");
35
+
36
+ if(!gl){
37
+ document.body.innerHTML = "WebGL not supported";
38
+ return;
39
+ }
40
+
41
+ /* ======================
42
+ Utility
43
+ ====================== */
44
+ function compile(type,src){
45
+ const s = gl.createShader(type);
46
+ gl.shaderSource(s,src);
47
+ gl.compileShader(s);
48
+ if(!gl.getShaderParameter(s,gl.COMPILE_STATUS))
49
+ throw gl.getShaderInfoLog(s);
50
+ return s;
51
+ }
52
+
53
+ function program(v,f){
54
+ const p = gl.createProgram();
55
+ gl.attachShader(p,compile(gl.VERTEX_SHADER,v));
56
+ gl.attachShader(p,compile(gl.FRAGMENT_SHADER,f));
57
+ gl.linkProgram(p);
58
+ if(!gl.getProgramParameter(p,gl.LINK_STATUS))
59
+ throw gl.getProgramInfoLog(p);
60
+ return p;
61
+ }
62
+
63
+ function createTex(w,h){
64
+ const t = gl.createTexture();
65
+ gl.bindTexture(gl.TEXTURE_2D,t);
66
+ gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MIN_FILTER,gl.LINEAR);
67
+ gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_MAG_FILTER,gl.LINEAR);
68
+ gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_S,gl.CLAMP_TO_EDGE);
69
+ gl.texParameteri(gl.TEXTURE_2D,gl.TEXTURE_WRAP_T,gl.CLAMP_TO_EDGE);
70
+ gl.texImage2D(gl.TEXTURE_2D,0,gl.RGBA,w,h,0,gl.RGBA,gl.UNSIGNED_BYTE,null);
71
+ return t;
72
+ }
73
+
74
+ function createFbo(t){
75
+ const f = gl.createFramebuffer();
76
+ gl.bindFramebuffer(gl.FRAMEBUFFER,f);
77
+ gl.framebufferTexture2D(gl.FRAMEBUFFER,gl.COLOR_ATTACHMENT0,gl.TEXTURE_2D,t,0);
78
+ gl.bindFramebuffer(gl.FRAMEBUFFER,null);
79
+ return f;
80
+ }
81
+
82
+ /* ======================
83
+ Quad
84
+ ====================== */
85
+ const quad = gl.createBuffer();
86
+ gl.bindBuffer(gl.ARRAY_BUFFER,quad);
87
+ gl.bufferData(gl.ARRAY_BUFFER,new Float32Array([
88
+ -1,-1, 1,-1, -1,1,
89
+ -1,1, 1,-1, 1,1
90
+ ]),gl.STATIC_DRAW);
91
+
92
+ const VS = `
93
+ attribute vec2 a;
94
+ varying vec2 v;
95
+ void main(){
96
+ v = a*0.5+0.5;
97
+ gl_Position = vec4(a,0,1);
98
+ }
99
+ `;
100
+
101
+ const FS = `
102
+ precision highp float;
103
+ varying vec2 v;
104
+ uniform vec2 r;
105
+ uniform float t;
106
+
107
+ float ring(vec2 p, float rad){
108
+ float d = length(p);
109
+ return smoothstep(0.02,0.0,abs(d-rad));
110
+ }
111
+
112
+ void main(){
113
+ vec2 uv = v*2.0-1.0;
114
+ uv.x *= r.x/r.y;
115
+
116
+ float time = t*0.8;
117
+ float R = 0.35 + sin(time)*0.01;
118
+
119
+ float base = ring(uv,R);
120
+ float glow = exp(-8.0*abs(length(uv)-R));
121
+
122
+ vec3 c = vec3(1.0,0.1,0.15)*(base*1.2 + glow*0.6);
123
+ gl_FragColor = vec4(c,1.0);
124
+ }
125
+ `;
126
+
127
+ const prog = program(VS,FS);
128
+
129
+ const uRes = gl.getUniformLocation(prog,"r");
130
+ const uTime = gl.getUniformLocation(prog,"t");
131
+
132
+ function bind(){
133
+ gl.useProgram(prog);
134
+ gl.bindBuffer(gl.ARRAY_BUFFER,quad);
135
+ const a = gl.getAttribLocation(prog,"a");
136
+ gl.enableVertexAttribArray(a);
137
+ gl.vertexAttribPointer(a,2,gl.FLOAT,false,0,0);
138
+ }
139
+
140
+ /* ======================
141
+ Resize (Editor Safe)
142
+ ====================== */
143
+ let W=0,H=0;
144
+
145
+ function resize(){
146
+ const rect = canvas.getBoundingClientRect();
147
+ const dpr = Math.max(1,window.devicePixelRatio||1);
148
+ const w = Math.floor(rect.width*dpr);
149
+ const h = Math.floor(rect.height*dpr);
150
+
151
+ if(w!==W || h!==H){
152
+ W=w; H=h;
153
+ canvas.width=W;
154
+ canvas.height=H;
155
+ gl.viewport(0,0,W,H);
156
+ }
157
+ }
158
+
159
+ setInterval(resize,100);
160
+
161
+ /* ======================
162
+ Render
163
+ ====================== */
164
+ const start = performance.now();
165
+
166
+ function draw(){
167
+ resize();
168
+
169
+ const time = (performance.now()-start)/1000;
170
+
171
+ gl.clearColor(0,0,0,1);
172
+ gl.clear(gl.COLOR_BUFFER_BIT);
173
+
174
+ bind();
175
+ gl.uniform2f(uRes,W,H);
176
+ gl.uniform1f(uTime,time);
177
+
178
+ gl.drawArrays(gl.TRIANGLES,0,6);
179
+
180
+ requestAnimationFrame(draw);
181
+ }
182
+
183
+ draw();
184
+
185
+ })();
186
+ </script>
187
+ </body>
188
+ </html>