browser/devtools/shadereditor/test/doc_shader-order.html@6474c204b198
browser/devtools/shadereditor/test/doc_shader-order.html
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
1 <!-- Any copyright is dedicated to the Public Domain.
2 http://creativecommons.org/publicdomain/zero/1.0/ -->
3 <!doctype html>
5 <html>
6 <head>
7 <meta charset="utf-8"/>
8 <title>WebGL editor test page</title>
10 <script id="shader-vs" type="x-shader/x-vertex">
11 precision lowp float;
13 void main(void) {
14 gl_Position = vec4(0, 0, 0, 1); // I'm a vertex shader!
15 }
16 </script>
18 <script id="shader-fs" type="x-shader/x-fragment">
19 precision lowp float;
20 varying vec3 vFragmentColor;
22 void main(void) {
23 gl_FragColor = vec4(1, 0, 0, 1); // I'm a fragment shader!
24 }
25 </script>
26 </head>
28 <body>
29 <canvas width="512" height="512"></canvas>
31 <script type="text/javascript;version=1.8">
32 "use strict";
34 let canvas, gl;
36 window.onload = function() {
37 canvas = document.querySelector("canvas");
38 gl = canvas.getContext("webgl", { preserveDrawingBuffer: true });
40 let shaderProgram = gl.createProgram();
41 let vertexShader, fragmentShader;
43 // Compile and attach the shaders in a random order. The test will
44 // ensure that the correct vertex and fragment source is retrieved
45 // regardless of this crazyness.
46 if (Math.random() > 0.5) {
47 vertexShader = getShader(gl, "shader-vs");
48 fragmentShader = getShader(gl, "shader-fs");
49 } else {
50 fragmentShader = getShader(gl, "shader-fs");
51 vertexShader = getShader(gl, "shader-vs");
52 }
53 if (Math.random() > 0.5) {
54 gl.attachShader(shaderProgram, vertexShader);
55 gl.attachShader(shaderProgram, fragmentShader);
56 } else {
57 gl.attachShader(shaderProgram, fragmentShader);
58 gl.attachShader(shaderProgram, vertexShader);
59 }
61 gl.linkProgram(shaderProgram);
62 }
64 function getShader(gl, id) {
65 let script = document.getElementById(id);
66 let source = script.textContent;
67 let shader;
69 if (script.type == "x-shader/x-fragment") {
70 shader = gl.createShader(gl.FRAGMENT_SHADER);
71 } else if (script.type == "x-shader/x-vertex") {
72 shader = gl.createShader(gl.VERTEX_SHADER);
73 }
75 gl.shaderSource(shader, source);
76 gl.compileShader(shader);
78 return shader;
79 }
80 </script>
81 </body>
83 </html>
