chrome/test/data/third_party/spaceport/js/sprites/webGL.js

   1 define([ ], function () {
   2     var WIDTH = 512, HEIGHT = 512;
   3
   4     function makeShaderFactory(vertexLines, fragmentLines, callback) {
   5         return function makeShader(gl) {
   6             var prog = createProgram(
   7                 gl,
   8                 vertexLines.join('\n'),
   9                 fragmentLines.join('\n')
  10             );
  11             return callback(gl, prog);
  12         };
  13     }
  14
  15     var shaders = {
  16         sprite: makeShaderFactory([
  17             '#define WIDTH ' + WIDTH.toFixed(1),
  18             '#define HEIGHT ' + HEIGHT.toFixed(1),
  19
  20             'attribute vec2 aCoord;',
  21
  22             'uniform vec2 uSize;',
  23             'uniform mat3 uMatrix;',
  24
  25             'varying vec2 vTextureCoord;',
  26
  27             'mat4 projection = mat4(',
  28                 '2.0 / WIDTH, 0.0, 0.0, -1.0,',
  29                 '0.0, -2.0 / HEIGHT, 0.0, 1.0,',
  30                 '0.0, 0.0,-2.0,-0.0,',
  31                 '0.0, 0.0, 0.0, 1.0',
  32             ');',
  33
  34             // TODO Turn * mul + translate into one matrix multiply.
  35             'mat2 mul = mat2(',
  36                 'uMatrix[0][0], uMatrix[1][0],',
  37                 'uMatrix[0][1], uMatrix[1][1]',
  38             ');',
  39
  40             'vec2 translate = vec2(uMatrix[0][2], uMatrix[1][2]);',
  41
  42             'void main(void) {',
  43                 'vec4 p = vec4(aCoord * uSize * mul + translate, 0.0, 1.0);',
  44                 'gl_Position = p * projection;',
  45                 'vTextureCoord = aCoord;',
  46             '}'
  47         ], [
  48             'varying vec2 vTextureCoord;',
  49
  50             'uniform sampler2D uSampler;',
  51
  52             'void main(void) {',
  53                 'gl_FragColor = texture2D(uSampler, vTextureCoord.st);',
  54             '}'
  55         ], function (gl, prog) {
  56             prog.attr = {
  57                 coord: gl.getAttribLocation(prog, 'aCoord')
  58             };
  59             prog.uni = {
  60                 sampler: gl.getUniformLocation(prog, 'uSampler'),
  61                 size: gl.getUniformLocation(prog, 'uSize'),
  62                 matrix: gl.getUniformLocation(prog, 'uMatrix')
  63             };
  64             return prog;
  65         }),
  66
  67         batchSprite: makeShaderFactory([
  68             '#define WIDTH ' + WIDTH.toFixed(1),
  69             '#define HEIGHT ' + HEIGHT.toFixed(1),
  70
  71             'attribute vec2 aCoord;',
  72             'attribute vec2 aTexCoord;',
  73
  74             'varying vec2 vTextureCoord;',
  75
  76             'mat4 projection = mat4(',
  77                 '2.0 / WIDTH, 0.0, 0.0, -1.0,',
  78                 '0.0, -2.0 / HEIGHT, 0.0, 1.0,',
  79                 '0.0, 0.0,-2.0,-0.0,',
  80                 '0.0, 0.0, 0.0, 1.0',
  81             ');',
  82
  83             'void main(void) {',
  84                 'vec4 p = vec4(aCoord, 0.0, 1.0);',
  85                 'gl_Position = p * projection;',
  86                 'vTextureCoord = aTexCoord;',
  87             '}'
  88         ], [
  89             'varying vec2 vTextureCoord;',
  90
  91             'uniform sampler2D uSampler;',
  92
  93             'void main(void) {',
  94                 'gl_FragColor = texture2D(uSampler, vTextureCoord.st);',
  95             '}'
  96         ], function (gl, prog) {
  97             prog.attr = {
  98                 coord: gl.getAttribLocation(prog, 'aCoord'),
  99                 texCoord: gl.getAttribLocation(prog, 'aTexCoord')
 100             };
 101             prog.uni = {
 102                 sampler: gl.getUniformLocation(prog, 'uSampler')
 103             };
 104             return prog;
 105         })
 106     };
 107
 108     function reportGLError(gl, error) {
 109         // Find the error name
 110         for (var key in gl) {
 111             // Include properties of prototype
 112             if (gl[key] === error) {
 113                 throw new Error("GL error " + key + " (code " + error + ")");
 114             }
 115         }
 116
 117         // Couldn't find it; whatever
 118         throw new Error("GL error code " + error);
 119     }
 120
 121     function checkGLError(gl) {
 122         var error = gl.getError();
 123         if (error !== 0) {
 124             reportGLError(gl, error);
 125         }
 126     }
 127
 128     function wrapGL(gl) {
 129         if (gl.orig) {
 130             return gl;
 131         }
 132
 133         var wrapped = {
 134             orig: gl
 135         };
 136
 137         function wrap(key) {
 138             return function () {
 139                 var ret = gl[key].apply(gl, arguments);
 140                 checkGLError(gl);
 141                 return ret;
 142             };
 143         }
 144
 145         for (var key in gl) {
 146             // Include properties of prototype
 147             if (typeof gl[key] === 'function') {
 148                 wrapped[key] = wrap(key);
 149             } else {
 150                 wrapped[key] = gl[key];
 151             }
 152         }
 153
 154         return wrapped;
 155     }
 156
 157     function makeTexture(gl, image) {
 158         var texture = gl.createTexture();
 159
 160         gl.bindTexture(gl.TEXTURE_2D, texture);
 161         gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);
 162         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
 163         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
 164         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
 165         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
 166
 167         gl.bindTexture(gl.TEXTURE_2D, null);
 168
 169         return texture;
 170     }
 171
 172     var createProgram;
 173     (function () {
 174         /*jshint white: false, eqeqeq: false, eqnull: true */
 175
 176         // Taken from owp
 177         // https://github.com/strager/owp/
 178         //
 179         // which took from webgl-boilerplate
 180         // https://github.com/jaredwilli/webgl-boilerplate/
 181
 182         function createShader( gl, src, type ) {
 183
 184             var shader = gl.createShader( type );
 185
 186             gl.shaderSource( shader, src );
 187             gl.compileShader( shader );
 188
 189             if ( !gl.getShaderParameter( shader, gl.COMPILE_STATUS ) ) {
 190
 191                 throw new Error( ( type == gl.VERTEX_SHADER ? "VERTEX" : "FRAGMENT" ) + " SHADER:\n" + gl.getShaderInfoLog( shader ) + "\nSOURCE:\n" + src );
 192
 193             }
 194
 195             return shader;
 196
 197         }
 198
 199         createProgram = function createProgram( gl, vertex, fragment ) {
 200
 201             var program = gl.createProgram();
 202
 203             var vs = createShader( gl, vertex, gl.VERTEX_SHADER );
 204             var fs = createShader( gl, '#version 100\n#ifdef GL_ES\nprecision highp float;\n#endif\n\n' + fragment, gl.FRAGMENT_SHADER );
 205
 206             if ( vs == null || fs == null ) return null;
 207
 208             gl.attachShader( program, vs );
 209             gl.attachShader( program, fs );
 210
 211             gl.deleteShader( vs );
 212             gl.deleteShader( fs );
 213
 214             gl.linkProgram( program );
 215
 216             if ( !gl.getProgramParameter( program, gl.LINK_STATUS ) ) {
 217
 218                 throw new Error( "ERROR:\n" +
 219                 "VALIDATE_STATUS: " + gl.getProgramParameter( program, gl.VALIDATE_STATUS ) + "\n" +
 220                 "ERROR: " + gl.getError() + "\n\n" +
 221                 "- Vertex Shader -\n" + vertex + "\n\n" +
 222                 "- Fragment Shader -\n" + fragment );
 223
 224             }
 225
 226             return program;
 227
 228         };
 229     }());
 230
 231     function getContext(canvas, options) {
 232         var context;
 233         try {
 234             context = canvas.getContext('webgl', options);
 235             if (!context) {
 236                 throw new Error();
 237             }
 238         } catch (e) {
 239             try {
 240                 context = canvas.getContext('experimental-webgl', options);
 241                 if (!context) {
 242                     throw new Error();
 243                 }
 244             } catch (e) {
 245                 throw new Error("WebGL not supported");
 246             }
 247         }
 248
 249         if (false) {  // DEBUG
 250             context = wrapGL(context);
 251         }
 252
 253         return context;
 254     }
 255
 256     return {
 257         shaders: shaders,
 258         wrapGL: wrapGL,
 259         makeTexture: makeTexture,
 260         createProgram: createProgram,
 261         getContext: getContext
 262     };
 263 });