How to use generateGL method in wpt

Best JavaScript code snippet using wpt

webgl.js

Source:webgl.js Github

copy

Full Screen

...61 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image);62 return texture;63 }64 var currentGL, currentCanvas;65 function generateGL() {66 if (currentGL) {67 return;68 }69 currentCanvas = document.createElement('canvas');70 currentGL = currentCanvas.getContext('webgl',71 { premultipliedalpha: false });72 }73 var smaskVertexShaderCode = '\74 attribute vec2 a_position; \75 attribute vec2 a_texCoord; \76 \77 uniform vec2 u_resolution; \78 \79 varying vec2 v_texCoord; \80 \81 void main() { \82 vec2 clipSpace = (a_position / u_resolution) * 2.0 - 1.0; \83 gl_Position = vec4(clipSpace * vec2(1, -1), 0, 1); \84 \85 v_texCoord = a_texCoord; \86 } ';87 var smaskFragmentShaderCode = '\88 precision mediump float; \89 \90 uniform vec4 u_backdrop; \91 uniform int u_subtype; \92 uniform sampler2D u_image; \93 uniform sampler2D u_mask; \94 \95 varying vec2 v_texCoord; \96 \97 void main() { \98 vec4 imageColor = texture2D(u_image, v_texCoord); \99 vec4 maskColor = texture2D(u_mask, v_texCoord); \100 if (u_backdrop.a > 0.0) { \101 maskColor.rgb = maskColor.rgb * maskColor.a + \102 u_backdrop.rgb * (1.0 - maskColor.a); \103 } \104 float lum; \105 if (u_subtype == 0) { \106 lum = maskColor.a; \107 } else { \108 lum = maskColor.r * 0.3 + maskColor.g * 0.59 + \109 maskColor.b * 0.11; \110 } \111 imageColor.a *= lum; \112 imageColor.rgb *= imageColor.a; \113 gl_FragColor = imageColor; \114 } ';115 var smaskCache = null;116 function initSmaskGL() {117 var canvas, gl;118 generateGL();119 canvas = currentCanvas;120 currentCanvas = null;121 gl = currentGL;122 currentGL = null;123 // setup a GLSL program124 var vertexShader = createVertexShader(gl, smaskVertexShaderCode);125 var fragmentShader = createFragmentShader(gl, smaskFragmentShaderCode);126 var program = createProgram(gl, [vertexShader, fragmentShader]);127 gl.useProgram(program);128 var cache = {};129 cache.gl = gl;130 cache.canvas = canvas;131 cache.resolutionLocation = gl.getUniformLocation(program, 'u_resolution');132 cache.positionLocation = gl.getAttribLocation(program, 'a_position');133 cache.backdropLocation = gl.getUniformLocation(program, 'u_backdrop');134 cache.subtypeLocation = gl.getUniformLocation(program, 'u_subtype');135 var texCoordLocation = gl.getAttribLocation(program, 'a_texCoord');136 var texLayerLocation = gl.getUniformLocation(program, 'u_image');137 var texMaskLocation = gl.getUniformLocation(program, 'u_mask');138 // provide texture coordinates for the rectangle.139 var texCoordBuffer = gl.createBuffer();140 gl.bindBuffer(gl.ARRAY_BUFFER, texCoordBuffer);141 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([142 0.0, 0.0,143 1.0, 0.0,144 0.0, 1.0,145 0.0, 1.0,146 1.0, 0.0,147 1.0, 1.0]), gl.STATIC_DRAW);148 gl.enableVertexAttribArray(texCoordLocation);149 gl.vertexAttribPointer(texCoordLocation, 2, gl.FLOAT, false, 0, 0);150 gl.uniform1i(texLayerLocation, 0);151 gl.uniform1i(texMaskLocation, 1);152 smaskCache = cache;153 }154 function composeSMask(layer, mask, properties) {155 var width = layer.width, height = layer.height;156 if (!smaskCache) {157 initSmaskGL();158 }159 var cache = smaskCache,canvas = cache.canvas, gl = cache.gl;160 canvas.width = width;161 canvas.height = height;162 gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);163 gl.uniform2f(cache.resolutionLocation, width, height);164 if (properties.backdrop) {165 gl.uniform4f(cache.resolutionLocation, properties.backdrop[0],166 properties.backdrop[1], properties.backdrop[2], 1);167 } else {168 gl.uniform4f(cache.resolutionLocation, 0, 0, 0, 0);169 }170 gl.uniform1i(cache.subtypeLocation,171 properties.subtype === 'Luminosity' ? 1 : 0);172 // Create a textures173 var texture = createTexture(gl, layer, gl.TEXTURE0);174 var maskTexture = createTexture(gl, mask, gl.TEXTURE1);175 // Create a buffer and put a single clipspace rectangle in176 // it (2 triangles)177 var buffer = gl.createBuffer();178 gl.bindBuffer(gl.ARRAY_BUFFER, buffer);179 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([180 0, 0,181 width, 0,182 0, height,183 0, height,184 width, 0,185 width, height]), gl.STATIC_DRAW);186 gl.enableVertexAttribArray(cache.positionLocation);187 gl.vertexAttribPointer(cache.positionLocation, 2, gl.FLOAT, false, 0, 0);188 // draw189 gl.clearColor(0, 0, 0, 0);190 gl.enable(gl.BLEND);191 gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);192 gl.clear(gl.COLOR_BUFFER_BIT);193 gl.drawArrays(gl.TRIANGLES, 0, 6);194 gl.flush();195 gl.deleteTexture(texture);196 gl.deleteTexture(maskTexture);197 gl.deleteBuffer(buffer);198 return canvas;199 }200 var figuresVertexShaderCode = '\201 attribute vec2 a_position; \202 attribute vec3 a_color; \203 \204 uniform vec2 u_resolution; \205 uniform vec2 u_scale; \206 uniform vec2 u_offset; \207 \208 varying vec4 v_color; \209 \210 void main() { \211 vec2 position = (a_position + u_offset) * u_scale; \212 vec2 clipSpace = (position / u_resolution) * 2.0 - 1.0; \213 gl_Position = vec4(clipSpace * vec2(1, -1), 0, 1); \214 \215 v_color = vec4(a_color / 255.0, 1.0); \216 } ';217 var figuresFragmentShaderCode = '\218 precision mediump float; \219 \220 varying vec4 v_color; \221 \222 void main() { \223 gl_FragColor = v_color; \224 } ';225 var figuresCache = null;226 function initFiguresGL() {227 var canvas, gl;228 generateGL();229 canvas = currentCanvas;230 currentCanvas = null;231 gl = currentGL;232 currentGL = null;233 // setup a GLSL program234 var vertexShader = createVertexShader(gl, figuresVertexShaderCode);235 var fragmentShader = createFragmentShader(gl, figuresFragmentShaderCode);236 var program = createProgram(gl, [vertexShader, fragmentShader]);237 gl.useProgram(program);238 var cache = {};239 cache.gl = gl;240 cache.canvas = canvas;241 cache.resolutionLocation = gl.getUniformLocation(program, 'u_resolution');242 cache.scaleLocation = gl.getUniformLocation(program, 'u_scale');243 cache.offsetLocation = gl.getUniformLocation(program, 'u_offset');244 cache.positionLocation = gl.getAttribLocation(program, 'a_position');245 cache.colorLocation = gl.getAttribLocation(program, 'a_color');246 figuresCache = cache;247 }248 function drawFigures(width, height, backgroundColor, figures, context) {249 if (!figuresCache) {250 initFiguresGL();251 }252 var cache = figuresCache, canvas = cache.canvas, gl = cache.gl;253 canvas.width = width;254 canvas.height = height;255 gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight);256 gl.uniform2f(cache.resolutionLocation, width, height);257 // count triangle points258 var count = 0;259 var i, ii, rows;260 for (i = 0, ii = figures.length; i < ii; i++) {261 switch (figures[i].type) {262 case 'lattice':263 rows = (figures[i].coords.length / figures[i].verticesPerRow) | 0;264 count += (rows - 1) * (figures[i].verticesPerRow - 1) * 6;265 break;266 case 'triangles':267 count += figures[i].coords.length;268 break;269 }270 }271 // transfer data272 var coords = new Float32Array(count * 2);273 var colors = new Uint8Array(count * 3);274 var coordsMap = context.coords, colorsMap = context.colors;275 var pIndex = 0, cIndex = 0;276 for (i = 0, ii = figures.length; i < ii; i++) {277 var figure = figures[i], ps = figure.coords, cs = figure.colors;278 switch (figure.type) {279 case 'lattice':280 var cols = figure.verticesPerRow;281 rows = (ps.length / cols) | 0;282 for (var row = 1; row < rows; row++) {283 var offset = row * cols + 1;284 for (var col = 1; col < cols; col++, offset++) {285 coords[pIndex] = coordsMap[ps[offset - cols - 1]];286 coords[pIndex + 1] = coordsMap[ps[offset - cols - 1] + 1];287 coords[pIndex + 2] = coordsMap[ps[offset - cols]];288 coords[pIndex + 3] = coordsMap[ps[offset - cols] + 1];289 coords[pIndex + 4] = coordsMap[ps[offset - 1]];290 coords[pIndex + 5] = coordsMap[ps[offset - 1] + 1];291 colors[cIndex] = colorsMap[cs[offset - cols - 1]];292 colors[cIndex + 1] = colorsMap[cs[offset - cols - 1] + 1];293 colors[cIndex + 2] = colorsMap[cs[offset - cols - 1] + 2];294 colors[cIndex + 3] = colorsMap[cs[offset - cols]];295 colors[cIndex + 4] = colorsMap[cs[offset - cols] + 1];296 colors[cIndex + 5] = colorsMap[cs[offset - cols] + 2];297 colors[cIndex + 6] = colorsMap[cs[offset - 1]];298 colors[cIndex + 7] = colorsMap[cs[offset - 1] + 1];299 colors[cIndex + 8] = colorsMap[cs[offset - 1] + 2];300 coords[pIndex + 6] = coords[pIndex + 2];301 coords[pIndex + 7] = coords[pIndex + 3];302 coords[pIndex + 8] = coords[pIndex + 4];303 coords[pIndex + 9] = coords[pIndex + 5];304 coords[pIndex + 10] = coordsMap[ps[offset]];305 coords[pIndex + 11] = coordsMap[ps[offset] + 1];306 colors[cIndex + 9] = colors[cIndex + 3];307 colors[cIndex + 10] = colors[cIndex + 4];308 colors[cIndex + 11] = colors[cIndex + 5];309 colors[cIndex + 12] = colors[cIndex + 6];310 colors[cIndex + 13] = colors[cIndex + 7];311 colors[cIndex + 14] = colors[cIndex + 8];312 colors[cIndex + 15] = colorsMap[cs[offset]];313 colors[cIndex + 16] = colorsMap[cs[offset] + 1];314 colors[cIndex + 17] = colorsMap[cs[offset] + 2];315 pIndex += 12;316 cIndex += 18;317 }318 }319 break;320 case 'triangles':321 for (var j = 0, jj = ps.length; j < jj; j++) {322 coords[pIndex] = coordsMap[ps[j]];323 coords[pIndex + 1] = coordsMap[ps[j] + 1];324 colors[cIndex] = colorsMap[cs[i]];325 colors[cIndex + 1] = colorsMap[cs[j] + 1];326 colors[cIndex + 2] = colorsMap[cs[j] + 2];327 pIndex += 2;328 cIndex += 3;329 }330 break;331 }332 }333 // draw334 if (backgroundColor) {335 gl.clearColor(backgroundColor[0] / 255, backgroundColor[1] / 255,336 backgroundColor[2] / 255, 1.0);337 } else {338 gl.clearColor(0, 0, 0, 0);339 }340 gl.clear(gl.COLOR_BUFFER_BIT);341 var coordsBuffer = gl.createBuffer();342 gl.bindBuffer(gl.ARRAY_BUFFER, coordsBuffer);343 gl.bufferData(gl.ARRAY_BUFFER, coords, gl.STATIC_DRAW);344 gl.enableVertexAttribArray(cache.positionLocation);345 gl.vertexAttribPointer(cache.positionLocation, 2, gl.FLOAT, false, 0, 0);346 var colorsBuffer = gl.createBuffer();347 gl.bindBuffer(gl.ARRAY_BUFFER, colorsBuffer);348 gl.bufferData(gl.ARRAY_BUFFER, colors, gl.STATIC_DRAW);349 gl.enableVertexAttribArray(cache.colorLocation);350 gl.vertexAttribPointer(cache.colorLocation, 3, gl.UNSIGNED_BYTE, false,351 0, 0);352 gl.uniform2f(cache.scaleLocation, context.scaleX, context.scaleY);353 gl.uniform2f(cache.offsetLocation, context.offsetX, context.offsetY);354 gl.drawArrays(gl.TRIANGLES, 0, count);355 gl.flush();356 gl.deleteBuffer(coordsBuffer);357 gl.deleteBuffer(colorsBuffer);358 return canvas;359 }360 function cleanup() {361 if (smaskCache && smaskCache.canvas) {362 smaskCache.canvas.width = 0;363 smaskCache.canvas.height = 0;364 }365 if (figuresCache && figuresCache.canvas) {366 figuresCache.canvas.width = 0;367 figuresCache.canvas.height = 0;368 }369 smaskCache = null;370 figuresCache = null;371 }372 return {373 get isEnabled() {374 if (PDFJS.disableWebGL) {375 return false;376 }377 var enabled = false;378 try {379 generateGL();380 enabled = !!currentGL;381 } catch (e) { }382 return shadow(this, 'isEnabled', enabled);383 },384 composeSMask: composeSMask,385 drawFigures: drawFigures,386 clear: cleanup387 };...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var wpt = require('./wpt.js');2var wpt2 = require('./wpt.js');3var wpt3 = require('./wpt.js');4var wpt4 = require('./wpt.js');5var wpt5 = require('./wpt.js');6var wpt6 = require('./wpt.js');7var wpt7 = require('./wpt.js');8var wpt8 = require('./wpt.js');9var wpt9 = require('./wpt.js');10var wpt10 = require('./wpt.js');11var wpt11 = require('./wpt.js');12var wpt12 = require('./wpt.js');13var wpt13 = require('./wpt.js');14var wpt14 = require('./wpt.js');15var wpt15 = require('./wpt.js');16var wpt16 = require('./wpt.js');17var wpt17 = require('./wpt.js');18var wpt18 = require('./wpt.js');19var wpt19 = require('./wpt.js');20var wpt20 = require('./wpt.js');21var wpt21 = require('./wpt.js');22var wpt22 = require('./wpt.js');23var wpt23 = require('./wpt.js');24var wpt24 = require('./wpt.js');25var wpt25 = require('./wpt.js');26var wpt26 = require('./wpt.js');27var wpt27 = require('./wpt.js');28var wpt28 = require('./wpt.js');29var wpt29 = require('./wpt.js');30var wpt30 = require('./wpt.js');31var wpt31 = require('./wpt.js');32var wpt32 = require('./wpt.js');33var wpt33 = require('./wpt.js');34var wpt34 = require('./wpt.js');35var wpt35 = require('./wpt.js');36var wpt36 = require('./wpt.js');37var wpt37 = require('./wpt.js');38var wpt38 = require('./wpt.js');39var wpt39 = require('./wpt.js');40var wpt40 = require('./wpt.js');41var wpt41 = require('./wpt.js');42var wpt42 = require('./wpt.js');43var wpt43 = require('./wpt.js');44var wpt44 = require('./wpt.js');

Full Screen

Using AI Code Generation

copy

Full Screen

1var wpt = require('webpagetest');2var wpt = new WebPageTest('www.webpagetest.org');3wpt.generateGL(function(err, data) {4 console.log(data);5});61. Fork it (

Full Screen

Using AI Code Generation

copy

Full Screen

1var wptools = require('wptools');2var wp = wptools.page('Barack Obama');3wp.generateGL(function(err, response){4 console.log(response);5});6var wptools = require('wptools');7var wp = wptools.page('Barack Obama');8wp.generateGL(function(err, response){9 console.log(response);10});11##### generateGL() - Example Output12var wptools = require('wptools');13var wp = wptools.page('Barack Obama');14wp.generateGL(function(err, response){15 console.log(response);16});17var wptools = require('wptools');18var wp = wptools.page('Barack Obama');19wp.generateGL(function(err, response){20 console.log(response);21});22#### generateGL() - Example Output23var wptools = require('wptools');24var wp = wptools.page('Barack Obama');25wp.generateGL(function(err, response){26 console.log(response);27});28var wptools = require('wptools');29var wp = wptools.page('Barack Obama');30wp.generateGL(function(err, response){31 console.log(response);32});

Full Screen

Using AI Code Generation

copy

Full Screen

1var wptoolkit = require('wptoolkit');2var fs = require('fs');3var path = require('path');4var gl = wptoolkit.generateGL({5 "layers": [{6 }]7});8fs.writeFileSync('test.png', gl);9output file (defaults to input file name)10width (required)11height (required)12backgroundColor (optional)13layers (required)14type (required)15text (required for text layers)16x (required for text layers)17y (required for text layers)18color (optional for text layers)

Full Screen

Using AI Code Generation

copy

Full Screen

1var test = new WebPageTest('www.webpagetest.org');2 console.log(gl);3});4var WebPageTest = function(server) {5 this.server = server;6 this.generateGL = function(url, callback) {7 };8};9var WebPageTest = function(server) {10 this.server = server;11 this.generateGL = function(url, callback) {12 };13};14var WebPageTest = function(server) {15 this.server = server;16 this.generateGL = function(url, callback) {17 };18};19var WebPageTest = function(server) {20 this.server = server;21 this.generateGL = function(url, callback) {22 };23};24var WebPageTest = function(server) {25 this.server = server;26 this.generateGL = function(url, callback) {27 };28};29var WebPageTest = function(server) {30 this.server = server;31 this.generateGL = function(url, callback) {32 };33};34var WebPageTest = function(server) {35 this.server = server;36 this.generateGL = function(url, callback) {37 };38};39var WebPageTest = function(server) {40 this.server = server;41 this.generateGL = function(url, callback) {42 };43};

Full Screen

Using AI Code Generation

copy

Full Screen

1var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');2var gl = wptoolkit.generateGL();3var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');4var gl = wptoolkit.generateGL();5var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');6var gl = wptoolkit.generateGL();7var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');8var gl = wptoolkit.generateGL();9var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');10var gl = wptoolkit.generateGL();11var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');12var gl = wptoolkit.generateGL();13var wptoolkit = require('/Users/ashishkumar/Documents/Projects/NodeJS/wptoolkit');14var gl = wptoolkit.generateGL();

Full Screen

Automation Testing Tutorials

Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.

LambdaTest Learning Hubs:

YouTube

You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.

Run wpt automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful