summaryrefslogtreecommitdiffstats
path: root/dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html
diff options
context:
space:
mode:
Diffstat (limited to 'dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html')
-rw-r--r--dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html171
1 files changed, 171 insertions, 0 deletions
diff --git a/dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html b/dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html
new file mode 100644
index 000000000..2cccd47ea
--- /dev/null
+++ b/dom/canvas/test/webgl-conf/checkout/extra/webgl-translate-shader.html
@@ -0,0 +1,171 @@
+<!--
+
+/*
+** Copyright (c) 2014 The Khronos Group Inc.
+**
+** Permission is hereby granted, free of charge, to any person obtaining a
+** copy of this software and/or associated documentation files (the
+** "Materials"), to deal in the Materials without restriction, including
+** without limitation the rights to use, copy, modify, merge, publish,
+** distribute, sublicense, and/or sell copies of the Materials, and to
+** permit persons to whom the Materials are furnished to do so, subject to
+** the following conditions:
+**
+** The above copyright notice and this permission notice shall be included
+** in all copies or substantial portions of the Materials.
+**
+** THE MATERIALS ARE PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+** EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+** MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+** IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+** CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+** TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+** MATERIALS OR THE USE OR OTHER DEALINGS IN THE MATERIALS.
+*/
+
+-->
+
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>WebGL Shader Translator</title>
+<style>
+textarea {
+ min-width: 70%;
+ min-height: 200px;
+ font-family: monospace;
+ background: #def;
+}
+#disabled {
+ color: red;
+ font-weight: bold;
+}
+</style>
+<script>
+// Needed by wtu.create3DContext():
+var testFailed = function() {};
+</script>
+<script src="../js/webgl-test-utils.js"> </script>
+<script>
+"use strict";
+window.onload = main;
+
+var gl;
+var debugShaders;
+var enabledExtensions = [];
+
+var translateButton;
+var extButton;
+
+function main() {
+ translateButton = document.getElementById('translate');
+ extButton = document.getElementById('getExts');
+
+ var canvas = document.getElementById("example");
+ var wtu = WebGLTestUtils;
+ gl = wtu.create3DContext(canvas);
+ if (!gl) {
+ disable();
+ return;
+ }
+
+ debugShaders = gl.getExtension('WEBGL_debug_shaders');
+ if (!debugShaders) {
+ disable();
+ }
+}
+
+function disable() {
+ translateButton.disabled = true;
+ extButton.disabled = true;
+ document.getElementById('disabled').style.display = 'block';
+}
+
+function getExtensions() {
+ getExtensionSet([
+ 'EXT_frag_depth',
+ 'EXT_shader_texture_lod',
+ 'OES_standard_derivatives',
+ 'WEBGL_draw_buffers'
+ ]);
+}
+
+function getExtensionSet(shaderExtensions) {
+ for (var i = 0; i < shaderExtensions.length; ++i) {
+ if (enabledExtensions.indexOf(shaderExtensions[i]) < 0) {
+ var ext = gl.getExtension(shaderExtensions[i]);
+ if (ext) {
+ enabledExtensions.push(shaderExtensions[i]);
+ }
+ }
+ }
+ if (enabledExtensions.length > 0) {
+ document.getElementById('enabled-extensions').textContent = enabledExtensions.join(', ');
+ }
+}
+
+function translateShader() {
+ var sourceElement = document.getElementById('original-shader');
+ var source = sourceElement.value;
+
+ var output = document.getElementById('translated-shader');
+ var infoLog = document.getElementById('info-log');
+ var shaderType = document.getElementById('shader-type');
+ infoLog.value = '';
+
+ // Try compiling the source as both vertex and fragment shader and see if either one works
+ var tryCompile = function(type) {
+ var shader = gl.createShader(type);
+ gl.shaderSource(shader, source);
+ gl.compileShader(shader);
+ var shaderTypeStr;
+ if (type == gl.FRAGMENT_SHADER) {
+ shaderTypeStr = 'Fragment shader';
+ } else {
+ shaderTypeStr = 'Vertex shader';
+ }
+ if (gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+ shaderType.textContent = shaderTypeStr;
+ var translatedSource = debugShaders.getTranslatedShaderSource(shader);
+ output.value = translatedSource;
+ infoLog.value = gl.getShaderInfoLog(shader);
+ return true;
+ } else {
+ infoLog.value += 'Info log when compiling as ' + shaderTypeStr + ':\n' + gl.getShaderInfoLog(shader) + '\n';
+ return false;
+ }
+ }
+
+ if (!tryCompile(gl.FRAGMENT_SHADER) && !tryCompile(gl.VERTEX_SHADER)) {
+ output.value = 'Invalid shader, compilation failed as both fragment and vertex shader.';
+ shaderType.textContent = 'Shader not';
+ }
+}
+</script>
+</head>
+<body>
+<h1>WebGL Shader Translator</h1>
+<p>This page uses the browser's built-in shader translation facilities to show how a shader
+is changed before being passed on to the underlying platform's graphics driver.</p>
+<p id="disabled" style="display: none;">
+ WebGL or WEBGL_debug_shaders extension is not available on this browser configuration.
+ Use a different browser or look for other alternatives to enable the extension to be able to use this page.
+ The extension might be behind a runtime flag for privacy considerations.
+</p>
+<h2>WebGL GLSL shader</h2>
+<textarea id="original-shader"></textarea>
+<p>
+<input type="button" id="translate" value="Translate" onclick="translateShader()"></input>
+<input type="button" id="getExts" value="Enable supported GLSL extensions" onclick="getExtensions()"></input>
+</p>
+<h2><span id="shader-type">Shader</span> translated for graphics driver</h2>
+<textarea id="translated-shader"></textarea>
+<h2>Enabled shader extensions</h2>
+<p id="enabled-extensions">None</p>
+<h2>Shader info log</h2>
+<textarea id="info-log"></textarea>
+<canvas id="example" width="256" height="16" style="width: 256px; height: 48px;"></canvas>
+</body>
+</html>
+