-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfirst.html
executable file
·80 lines (61 loc) · 1.63 KB
/
first.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="./style.css">
<script src ="js/three.js"></script>
<title>WebGL</title>
<script id="cubeVertexShader" type="x-shader/x-vertex">
uniform float time;
uniform int freqSamp[1024];//array of vals
varying vec2 vUv;
varying float terpo;
const float uSize = 10.;
void main() {
vUv = uv;
float extrude = 0.0;
float s = 2. * uv.s;
float t = 1. - uv.t;
/*Deprecated s-t coord examination
int checker = int(s*uSize) + int(t*uSize);
float tmp = mod(float(checker), 2.);
if(int(tmp) == 0 ){
extrude = .2;//zSpot;
}
*/
vec3 n_Pos = position;//default behavior, can be removed
float zSpot = float(freqSamp[int(t * 700.)])/255.;
//key off of t coords for clearer extrudes
extrude = zSpot;
n_Pos = (1. + extrude)*position;
gl_Position = projectionMatrix * modelViewMatrix * vec4(n_Pos, 1.0);
terpo = extrude ;
}
</script>
<script id="cubeFragmentShader" type="x-shader/x-fragment">
uniform float time;
varying vec2 vUv;
varying float terpo;//varies from 0 to 1
void main() {
vec2 position = -1.0 + 2.0 * vUv;
float red = 1.0;
float green = 1.0;
float blue = 1.0;
if(terpo < .5){
blue = abs(1. - (terpo * 2.));
red = 0.0;
}
else{
blue = 0.0;
red = abs((terpo*2.) - 1.);
}
green = 1. - abs(terpo - .5);
gl_FragColor = vec4(red, green, blue, 1.0);
}
</script>
</head>
<body>
<audio id="myAudio" src="./sounds/mama.mp3"></audio>
<script src="./main.js"></script>
</body>
</html>