Etusivu Tutki Apua
Kirjaudu sisään
lu
/
lp
peilaus alkaen git://github.com/heyLu/lp
Tarkkaile 1
Äänestä 0
Fork 0
Koodi Ongelmat 0 Commitit 69 Julkaisut 1 Wiki
Selaa lähdekoodia

hello, trixl.

let's see if we get along this time around.
Lucas Stadler 12 vuotta sitten
vanhempi
e5775b46e0
commit
02f6d7e3fb
1 muutettua tiedostoa jossa 81 lisäystä ja 0 poistoa
Jaettu näkymä Näytä diff tilastot
  1. 81 0
      js/pixl/public/trixl.html

+ 81 - 0
js/pixl/public/trixl.html
Näytä tiedosto 

@ -0,0 +1,81 @@
1 
<!doctype html>
2 
<html>
3 
<head>
4 
	<title>.trixl</title>
5 
	<meta charset="utf-8" />
6 
	<style>
7 
		#stage {
8 
			position: absolute;
9 
			top: 0;
10 
			left: 0;
11 
		}
12 
	</style>
13 
</head>
14
15 
<body>
16 
	<canvas id="stage">
17 
		sorry. your browser is from the dark ages. please initiate
18 
		temporal leap to a minimally brighter future where browsers can
19 
		investigate the third dimension.
20 
	</canvas>
21 
	<script type="gl/vertex-shader">
22 
		attribute vec2 pos;
23
24 
		void main() {
25 
			gl_Position = vec4(pos, 0, 1);
26 
		}
27 
	</script>
28 
	<script type="gl/fragment-shader">
29 
		precision mediump float;
30
31 
		void main() {
32 
			gl_FragColor = vec4(0.2, 0.2, 0.2, 1);
33 
		}
34 
	</script>
35 
	<script>
36 
		window.trixl = {};
37 
		trixl.stage = document.querySelector("#stage");
38 
		trixl.window = {w: window.innerWidth, h: window.innerHeight};
39 
		trixl.stage.width = trixl.window.w;
40 
		trixl.stage.height = trixl.window.h;
41 
		var gl = trixl.gl = trixl.stage.getContext("webgl");
42
43 
		var vertexPosBuffer = gl.createBuffer();
44 
		gl.bindBuffer(gl.ARRAY_BUFFER, vertexPosBuffer);
45 
		var vertices = [-0.5, -0.5, 0.5, -0.5, 0.0, 0.5];
46 
		gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
47
48 
		var createShader = function(src, type) {
49 
			var shader = gl.createShader(type);
50 
			gl.shaderSource(shader, src);
51 
			gl.compileShader(shader);
52 
			if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
53 
				throw gl.getShaderInfoLog(shader);
54 
			}
55 
			return shader;
56 
		}
57
58 
		var createProgram = function(vs, fs) {
59 
			var program = gl.createProgram();
60 
			var vs = createShader(vs, gl.VERTEX_SHADER);
61 
			var fs = createShader(fs, gl.FRAGMENT_SHADER);
62 
			gl.attachShader(program, vs);
63 
			gl.attachShader(program, fs);
64 
			gl.linkProgram(program);
65 
			if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
66 
				throw gl.getProgramInfoLog(program);
67 
			}
68 
			return program;
69 
		}
70
71 
		var vs = document.querySelector("script[type='gl/vertex-shader']").textContent;
72 
		var fs = document.querySelector("script[type='gl/fragment-shader']").textContent;
73 
		var program = createProgram(vs, fs);
74 
		gl.useProgram(program);
75 
		program.vertexPosAttrib = gl.getAttribLocation(program, 'pos');
76 
		gl.enableVertexAttribArray(program.vertexPosAttrib);
77 
		gl.vertexAttribPointer(program.vertexPosBuffer, 2, gl.FLOAT, false, 0, 0);
78 
		gl.drawArrays(gl.TRIANGLES, 0, 3);
79 
	</script>
80 
</body>
81 
</html>