-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path2022-05-12.html
97 lines (80 loc) · 2.42 KB
/
2022-05-12.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
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>shader</title>
<link rel="stylesheet" href="style.css">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>
<body>
<canvas></canvas>
<script type="x-shader/x-fragment">
precision mediump float;
uniform vec2 resolution;
uniform float time;
const float PI = 3.14159;
const int MAX_MARCHING_STEPS = 255;
const float MIN_DIST = 0.;
const float MAX_DIST = 100.;
const float EPSILON = 0.0001;
vec3 pos1(float i) {
return vec3(
(sin(time + i*2.)*i*3. + cos(time - i/2.)*cos(time*i*2.)*i) * .1,
-.4 + sin(i),
sin(time + i));
}
float sphere(vec3 p, float r) {
return length(p) - r;
}
// from https://iquilezles.org/www/articles/distfunctions/distfunctions.htm
float opSmoothUnion( float d1, float d2, float k ) {
float h = clamp( 0.5 + 0.5*(d2-d1)/k, 0.0, 1.0 );
return mix( d2, d1, h ) - k*h*(1.0-h); }
float scene(vec3 p) {
float d = MAX_DIST;
for (float i = 0.; i < 5.; i++) {
vec3 p1 = pos1(i);
d = opSmoothUnion(d, sphere(p+p1, .3), .8);
}
return d;
}
float shortestDistanceToSurface(vec3 eye, vec3 marchingDirection, float start, float end) {
float depth = start;
for (int i = 0; i < MAX_MARCHING_STEPS; i++) {
float dist = scene(eye + depth * marchingDirection);
if (dist < EPSILON) {
return depth;
}
depth += dist;
if (depth >= end) {
return end;
}
}
return end;
}
vec3 rayDirection(float fieldOfView, vec2 size, vec2 fragCoord) {
vec2 xy = fragCoord - size / 2.0;
float z = size.y / tan(radians(fieldOfView) / 2.0);
return normalize(vec3(xy, -z));
}
void main() {
vec3 dir = rayDirection(45.0, resolution.xy, gl_FragCoord.xy);
vec3 eye = vec3(0., 0., 5.0);
float dist = shortestDistanceToSurface(eye, dir, MIN_DIST, MAX_DIST);
if (dist > MAX_DIST - EPSILON) {
gl_FragColor = vec4(0.);
return;
}
float c = 0.;
if (dist < 4.3) {
c = .9;
} else if (dist < 4.9) {
c = .2;
}
gl_FragColor = vec4(vec3(c), 1.);
}
</script>
<script src="veda.js"></script>
</body>
</html>