blob: cf6442a07aab0a77b41bb8334eb8c9025edc756a (
plain)
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
|
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="../resources/stage.css">
</head>
<body>
<canvas id="stage"></canvas>
<script id="vertex" type="x-shader/x-glsl">
attribute vec4 position;
attribute vec4 color;
uniform float scale;
uniform float time;
uniform float offsetX;
uniform float offsetY;
uniform float scalar;
uniform float scalarOffset;
varying vec4 v_color;
void main() {
float fade = mod(scalarOffset + time * scalar / 10.0, 1.0);
if (fade < 0.5) {
fade = fade * 2.0;
} else {
fade = (1.0 - fade) * 2.0;
}
float xpos = position.x * scale;
float ypos = position.y * scale;
float angle = 3.14159 * 2.0 * fade;
float xrot = xpos * cos(angle) - ypos * sin(angle);
float yrot = xpos * sin(angle) + ypos * cos(angle);
xpos = xrot + offsetX;
ypos = yrot + offsetY;
v_color = vec4(fade, 1.0 - fade, 0.0, 1.0) + color;
gl_Position = vec4(xpos, ypos, 0.0, 1.0);
}
</script>
<script id="fragment" type="x-shader/x-glsl">
#ifdef GL_ES
precision mediump float;
#endif
varying vec4 v_color;
void main() {
gl_FragColor = v_color;
}
</script>
<script src="../../resources/strings.js"></script>
<script src="../../resources/extensions.js"></script>
<script src="../../resources/statistics.js"></script>
<script src="../resources/math.js"></script>
<script src="../resources/main.js"></script>
<script src="resources/webgl.js"></script>
</body>
</html>
|
