Permalink
Find file
427 lines (414 sloc) 20.1 KB
<!DOCTYPE html>
<html lang="en">
<head>
<title>WebGL Report</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=725, user-scalable=yes">
<link rel="stylesheet" type="text/css" href="black.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.1/underscore-min.js"></script>
<script type="text/javascript" src="webglreport.js"></script>
<script src="//cdn.webglstats.com/stat.js" defer="defer" async="async"></script>
</head>
<body>
<script type="text/template" id="reportTemplate">
<div class="report"><table>
<tr>
<th class="main-left-column">Platform:</th>
<td><%= report.platform %></td>
</tr>
<tr>
<th>Browser User Agent:</th>
<td><%= report.userAgent %></td>
</tr>
<% if (typeof report.contextName !== 'undefined') { %>
<tr>
<th>Context Name:</th>
<td><%= report.contextName %></td>
</tr>
<tr>
<th>GL Version:</th>
<td><%= report.glVersion %></td>
</tr>
<tr>
<th>Shading Language Version:</th>
<td><%= report.shadingLanguageVersion %></td>
</tr>
<tr>
<th>Vendor:</th>
<td><%= report.vendor %></td>
</tr>
<tr>
<th>Renderer:</th>
<td><%= report.renderer %></td>
</tr>
<% if (report.unMaskedVendor !== '') { %>
<tr>
<th>Unmasked Vendor:</th>
<td><%= report.unMaskedVendor %></td>
</tr>
<% } %>
<% if (report.unMaskedRenderer !== '') { %>
<tr>
<th>Unmasked Renderer:</th>
<td><%= report.unMaskedRenderer %></td>
</tr>
<% } %>
<tr>
<th>Antialiasing:</th>
<td><%= report.antialias %></td>
</tr>
<tr>
<th>ANGLE:</th>
<td><%= report.angle %></td>
</tr>
<tr>
<th>Major Performance Caveat:</th>
<td><%= report.majorPerformanceCaveat %></td>
</tr>
<tr>
<td colspan="2">
<div class="pipeline">
<canvas class="background"></canvas>
<div class="vertexShader">
<h1>Vertex Shader</h1>
<table>
<tr title="Minimum: 8">
<th>Max Vertex Attributes:</th>
<td><%= report.maxVertexAttributes %></td>
</tr>
<tr title="Minimum: 128">
<th>Max Vertex Uniform Vectors:</th>
<td><%= report.maxVertexUniformVectors %></td>
</tr>
<tr title="Minimum: 0">
<th>Max Vertex Texture Image Units:</th>
<td><%= report.maxVertexTextureImageUnits %></td>
</tr>
<tr title="Minimum: 8">
<th>Max Varying Vectors:</th>
<td><%= report.maxVaryingVectors %></td>
</tr>
<tr>
<th>Best float precision:</th>
<td><%= report.vertexShaderBestPrecision %></td>
</tr>
<% if (report.webglVersion > 1) { %>
<tr>
<th>Max Vertex Uniform Components:</th>
<td><%= report.maxVertexUniformComponents %></td>
</tr>
<tr>
<th>Max Vertex Uniform Blocks:</th>
<td><%= report.maxVertexUniformBlocks %></td>
</tr>
<tr>
<th>Max Vertex Output Components:</th>
<td><%= report.maxVertexOutputComponents %></td>
</tr>
<tr>
<th>Max Varying Components:</th>
<td><%= report.maxVaryingComponents %></td>
</tr>
<% } %>
</table>
</div>
<div class="transformFeedback">
<h1>Transform Feedback</h1>
<% if (report.webglVersion < 2) { %>
<div class="comingSoon">
Coming in <a href="https://www.khronos.org/registry/webgl/specs/latest/2.0/">WebGL 2</a>
</div>
<% } else { %>
<table>
<tr>
<th>Max Interleaved Components:</th>
<td><%= report.maxTransformFeedbackInterleavedComponents %></td>
</tr>
<tr>
<th>Max Separate Attribs:</th>
<td><%= report.maxTransformFeedbackSeparateAttribs %></td>
</tr>
<tr>
<th>Max Separate Components:</th>
<td><%= report.maxTransformFeedbackSeparateComponents %></td>
</tr>
</table>
<% } %>
</div>
<div class="rasterizer">
<h1>Rasterizer</h1>
<table>
<tr title="Minimum: [1, 1]">
<th>Aliased Line Width Range:</th>
<td><%= report.aliasedLineWidthRange %></td>
</tr>
<tr title="Minimum: [1, 1]">
<th>Aliased Point Size Range:</th>
<td><%= report.aliasedPointSizeRange %></td>
</tr>
</table>
</div>
<div class="fragmentShader">
<h1>Fragment Shader</h1>
<table>
<tr title="Minimum: 16">
<th>Max Fragment Uniform Vectors:</th>
<td><%= report.maxFragmentUniformVectors %></td>
</tr>
<tr title="Minimum: 8">
<th>Max Texture Image Units:</th>
<td><%= report.maxTextureImageUnits %></td>
</tr>
<tr>
<th>float/int precision:</th>
<td><%= report.fragmentShaderFloatIntPrecision %></td>
</tr>
<tr>
<th>Best float precision:</th>
<td><%= report.fragmentShaderBestPrecision %></td>
</tr>
<% if (report.webglVersion > 1) { %>
<tr>
<th>Max Fragment Uniform Components:</th>
<td><%= report.maxFragmentUniformComponents %></td>
</tr>
<tr>
<th>Max Fragment Uniform Blocks:</th>
<td><%= report.maxFragmentUniformBlocks %></td>
</tr>
<tr>
<th>Max Fragment Input Components:</th>
<td><%= report.maxFragmentInputComponents %></td>
</tr>
<tr>
<th>Min Program Texel Offset:</th>
<td><%= report.minProgramTexelOffset %></td>
</tr>
<tr>
<th>Max Program Texel Offset:</th>
<td><%= report.maxProgramTexelOffset %></td>
</tr>
<% } %>
</table>
</div>
<div class="framebuffer">
<h1>Framebuffer</h1>
<table>
<% if (report.webglVersion > 1) { %>
<tr>
<th>Max Draw Buffers:</th>
<td><%= report.maxDrawBuffers %></td>
</tr>
<tr>
<th>Max Color Attachments:</th>
<td><%= report.maxColorAttachments %></td>
</tr>
<tr>
<th>Max Samples:</th>
<td><%= report.maxSamples %></td>
</tr>
<% } else { %>
<tr>
<th>Max Color Buffers:</th>
<td><%= report.maxColorBuffers %></td>
</tr>
<% } %>
<tr>
<th>RGBA Bits:</th>
<td>[<%= report.redBits %>, <%= report.greenBits %>, <%= report.blueBits %>, <%= report.alphaBits %>]</td>
</tr>
<tr>
<th>Depth / Stencil Bits:</th>
<td>[<%= report.depthBits %>, <%= report.stencilBits %>]</td>
</tr>
<tr>
<th>Max Render Buffer Size:</th>
<td><%= report.maxRenderBufferSize %></td>
</tr>
<tr>
<th>Max Viewport Dimensions:</th>
<td><%= report.maxViewportDimensions %></td>
</tr>
</table>
</div>
<div class="textures">
<h1>Textures</h1>
<table>
<tr title="Minimum: 64">
<th>Max Texture Size:</th>
<td><%= report.maxTextureSize %></td>
</tr>
<tr title="Minimum: 16">
<th>Max Cube Map Texture Size:</th>
<td><%= report.maxCubeMapTextureSize %></td>
</tr>
<tr title="Minimum: 8">
<th>Max Combined Texture Image Units:</th>
<td><%= report.maxCombinedTextureImageUnits %></td>
</tr>
<tr title="Minimum: 2">
<th>Max Anisotropy:</th>
<td><%= report.maxAnisotropy %></td>
</tr>
<% if (report.webglVersion > 1) { %>
<tr>
<th>Max 3D Texture Size:</th>
<td><%= report.max3dTextureSize %></td>
</tr>
<tr>
<th>Max Array Texture Layers:</th>
<td><%= report.maxArrayTextureLayers %></td>
</tr>
<tr>
<th>Max Texture LOD Bias:</th>
<td><%= report.maxTextureLodBias %></td>
</tr>
<% } %>
</table>
</div>
<div class="uniformBuffers">
<h1>Uniform Buffers</h1>
<% if (report.webglVersion < 2) { %>
<div class="comingSoon">
Coming in <a href="https://www.khronos.org/registry/webgl/specs/latest/2.0/">WebGL 2</a>
</div>
<% } else { %>
<table>
<tr>
<th>Max Uniform Buffer Bindings:</th>
<td><%= report.maxUniformBufferBindings %></td>
</tr>
<tr>
<th>Max Uniform Block Size:</th>
<td><%= report.maxUniformBlockSize %></td>
</tr>
<tr>
<th>Uniform Buffer Offset Alignment:</th>
<td><%= report.uniformBufferOffsetAlignment %></td>
</tr>
<tr>
<th>Max Combined Uniform Blocks:</th>
<td><%= report.maxCombinedUniformBlocks %></td>
</tr>
<tr>
<th>Max Combined Vertex Uniform Components:</th>
<td><%= report.maxCombinedVertexUniformComponents %></td>
</tr>
<tr>
<th>Max Combined Fragment Uniform Components:</th>
<td><%= report.maxCombinedFragmentUniformComponents %></td>
</tr>
</table>
<% } %>
</div>
</div>
</td>
</tr>
<tr>
<th colspan="2">Supported Extensions:</th>
</tr>
<% _.each(report.extensions, function(e) { %>
<tr>
<td></td>
<td>
<a class="extension" href="<%= getExtensionUrl(e) %>"><%= e %></a>
</td>
</tr>
<% }) %>
<tr>
<td colspan="2">
<br />
<%= report.draftExtensionsInstructions %>
</td>
</tr>
<% if (report.webglVersion === 2) { %>
<tr>
<th colspan="2"><br /><a href="https://www.khronos.org/registry/webgl/specs/latest/2.0/">WebGL 2</a> Functions Implementation Status:</th>
</tr>
<tr>
<td></td>
<td>
<p><%= report.webgl2Status %></p>
</td>
</tr>
<% _.each(report.webgl2Functions, function(e) { %>
<tr>
<td></td>
<td>
<a class="<%= e.className %>" href="<%= getWebGL2ExtensionUrl(e.name) %>"><%= e.name %></a>
</td>
</tr>
<% }); %>
<% } %>
<% } %>
</table></div>
</script>
<script type="text/template" id="webglSupportedTemplate">
<div class="header">
<p>&#x2713; This browser supports WebGL <%= report.webglVersion %></p>
</div>
</script>
<script type="text/template" id="webglSupportedChromeFrameTemplate">
<div class="header">
<p>&#x2713; This browser supports WebGL <%= report.webglVersion %> with Chrome Frame.</p>
</div>
</script>
<script type="text/template" id="webglNotSupportedTemplate">
<div class="header">
<p>&times; This browser does not support WebGL <%= report.webglVersion %></p>
<% if (report.webglVersion === 2 && report.userAgent.indexOf('Firefox') !== -1) { %>
<p>
To enable WebGL 2 in Firefox, see <a href="https://wiki.mozilla.org/Platform/GFX/WebGL2">https://wiki.mozilla.org/Platform/GFX/WebGL2</a>.
</p>
<% } else { %>
<p>
Check out <a href="http://get.webgl.org/">Get WebGL</a>,
or try installing the latest version of
<a href="https://www.google.com/chrome">Chrome</a>, or
<a href="https://www.mozilla.org/en-US/firefox/">Firefox</a>.
</p>
<% } %>
</div>
</script>
<script type="text/template" id="webglNotEnabledTemplate">
<div class="header">
<p>&times; This browser supports WebGL <%= report.webglVersion %>, but it is disabled or unavailable.</p>
<p>Sometimes this is the result of older video drivers being rejected by the browser. Try updating your video drivers if possible.</p>
<p>
Also check out <a href="http://get.webgl.org/">Get WebGL</a>,
or try installing the latest version of
<a href="https://www.google.com/chrome">Chrome</a>, or
<a href="https://www.mozilla.org/en-US/firefox/">Firefox</a>.
</p>
</div>
</script>
<script type="text/template" id="webglVersionTabs">
<div class="webglVersionTabs">
<a href="?v=1" class="<%= report.webglVersion === 1 ? 'active' : '' %>">WebGL 1</a>
<a href="?v=2" class="<%= report.webglVersion === 2 ? 'active' : '' %>">WebGL 2</a>
</div>
</script>
<a href="https://github.com/AnalyticalGraphicsInc/webglreport" target="_blank"><img style="position: absolute; top: 0; right: 0; border: 0;" src="images/ForkMe_Ribbons/ForkMe_Blk.png" alt="Fork me on GitHub"></a>
<h1>WebGL Report</h1>
<p id="javascript_disabled" class="align-center">You need to enable JavaScript to see WebGL.</p>
<div class="main-output" id="output">
</div>
<script type="text/javascript">
var _noJS = document.getElementById('javascript_disabled');
_noJS.parentNode.removeChild(_noJS);
</script>
<!-- Google Analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-30040272-2']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>