How to use getGl method in wpt

Best JavaScript code snippet using wpt

EffectTool.ts

Source:EffectTool.ts Github

copy

Full Screen

1import { GlCanvas } from "../../Base/Canvas/GlCanvas";2import { LayerManager } from "../LayerManager/LayerManager";3import { SepiaShader } from "../../Base/Shader/SepiaShader";4import { GrayscaleShader } from "../../Base/Shader/GrayscaleShader";5import { InvertShader } from "../../Base/Shader/InvertShader";6import { PosterizationShader } from "../../Base/Shader/PosterizationShader";7import { ForestedGlassShader } from "../../Base/Shader/FrostedGlassShader";8import { ThresholdShader } from "../../Base/Shader/ThresholdShader";9import { TranspalentColorShader } from "../../Base/Shader/TranspalentColorShader";10import { ZoomBlurShader } from "../../Base/Shader/ZoomBlurShader";11import { BrightnessContrastShader } from "../../Base/Shader/BrightnessContrastShader";12import { HueSaturationShader } from "../../Base/Shader/HueSaturationShader";13import { PixelateShader } from "../../Base/Shader/PixelateShader";14import { ExpansionShader } from "../../Base/Shader/ExpansionShader";15// エフェクトのタイプ16export enum EffectType {17 EffectTypeNone,18 EffectTypeSepia,19 EffectTypeGrayscale,20 EffectTypeInvert,21 EffectTypePosterization,22 EffectTypefrostedGlass,23 EffectTypeThreshold,24 EffectTypeTranspalent,25 EffectTypeZoomBlur,26 EffectTypeBrightnessContrast,27 EffectTypeHueSarturation,28 EffectTypePixelate,29 EffectTypeExpansion,30}31// エフェクトを行うクラス32export class EffectTool {33 private canvas: GlCanvas; // キャンバス34 private layerManager: LayerManager; // レイヤー35 private currentEffectType: EffectType; // エフェクトのタイプ36 // コンストラクタ37 constructor(cnvs: GlCanvas, manager: LayerManager) {38 this.canvas = cnvs;39 this.layerManager = manager;40 this.currentEffectType = EffectType.EffectTypeNone;41 }42 // エフェクトタイプを取得する43 public getEffectType(): EffectType {44 return this.currentEffectType;45 }46 // エフェクトタイプを設定する47 public setEffectType(type: EffectType): void {48 this.currentEffectType = type;49 }50 // 描画する51 public draw(value1: number, value2 = 0, value3 = 0, value4 = 0): void {52 switch (this.currentEffectType) {53 case EffectType.EffectTypeSepia:54 let sepiaShader = new SepiaShader();55 sepiaShader.draw(this.canvas.getGL(),56 this.layerManager.getCanvasLayer().getTexture(),57 this.canvas.getMatrix());58 break;59 case EffectType.EffectTypeGrayscale:60 let gsShader = new GrayscaleShader();61 gsShader.draw(this.canvas.getGL(),62 this.layerManager.getCanvasLayer().getTexture(),63 this.canvas.getMatrix()); 64 break;65 case EffectType.EffectTypeInvert:66 let invertShader = new InvertShader();67 invertShader.draw(this.canvas.getGL(),68 this.layerManager.getCanvasLayer().getTexture(),69 this.canvas.getMatrix()); 70 break;71 case EffectType.EffectTypePosterization:72 let posShader = new PosterizationShader();73 posShader.draw(this.canvas.getGL(),74 this.layerManager.getCanvasLayer().getTexture(),75 this.canvas.getMatrix(), value1); 76 break;77 case EffectType.EffectTypefrostedGlass:78 let fgShader = new ForestedGlassShader();79 fgShader.draw(this.canvas.getGL(),80 this.layerManager.getCanvasLayer().getTexture(),81 this.canvas.getMatrix(), value1); 82 break;83 case EffectType.EffectTypeThreshold:84 let thShader = new ThresholdShader();85 thShader.draw(this.canvas.getGL(),86 this.layerManager.getCanvasLayer().getTexture(),87 this.canvas.getMatrix(), value1); 88 break;89 case EffectType.EffectTypeTranspalent:90 let tpShader = new TranspalentColorShader();91 tpShader.draw(this.canvas.getGL(),92 this.layerManager.getCanvasLayer().getTexture(),93 this.canvas.getMatrix(), value1); 94 break;95 case EffectType.EffectTypeZoomBlur:96 let zbShader = new ZoomBlurShader();97 zbShader.draw(this.canvas.getGL(),98 this.layerManager.getCanvasLayer().getTexture(),99 this.canvas.getMatrix(), value3, value4, value1);100 break;101 case EffectType.EffectTypeBrightnessContrast:102 let bcShader = new BrightnessContrastShader();103 bcShader.draw(this.canvas.getGL(),104 this.layerManager.getCanvasLayer().getTexture(),105 this.canvas.getMatrix(), value1, value2);106 break;107 case EffectType.EffectTypeHueSarturation:108 let hsShader = new HueSaturationShader();109 hsShader.draw(this.canvas.getGL(),110 this.layerManager.getCanvasLayer().getTexture(),111 this.canvas.getMatrix(), value1, value2);112 break;113 case EffectType.EffectTypePixelate:114 let pxShader = new PixelateShader();115 pxShader.draw(this.canvas.getGL(),116 this.layerManager.getCanvasLayer().getTexture(),117 this.canvas.getMatrix(), value2, value3, value1);118 break;119 case EffectType.EffectTypeExpansion:120 let exShader = new ExpansionShader();121 exShader.draw(this.canvas.getGL(),122 this.layerManager.getCanvasLayer().getTexture(),123 this.canvas.getMatrix(), value3, value4, value1, value2);124 break;125 }126 }...

Full Screen

Full Screen

GLObject.js

Source:GLObject.js Github

copy

Full Screen

1import Primitives from './Primitives'2class GLObject {3 constructor(renderer, texturePath) {4 this.renderer = renderer5 this.verticesBuffer = null6 this.uvsBuffer = null7 this.indicesBuffer = null8 this.normalsBuffer = null9 this.texture = null10 this.translation = { x: 0, y: 0, z: -3 }11 this.rotation = { x: 0, y: 0, z: 0 }12 this.addTexture(texturePath)13 this.fillVertices()14 this.fillUVS()15 this.fillIndices()16 this.fillNormals()17 }18 addTexture(url) {19 const texture = this.renderer.getGL().createTexture()20 this.renderer.getGL().bindTexture(this.renderer.getGL().TEXTURE_2D, texture)21 this.renderer.getGL().texImage2D(this.renderer.getGL().TEXTURE_2D, 0, this.renderer.getGL().RGBA, 1, 1, 0, this.renderer.getGL().RGBA, this.renderer.getGL().UNSIGNED_BYTE, new Uint8Array([0, 0, 255, 255]))22 const image = new Image()23 const r = this.renderer24 image.onload = function() {25 r.getGL().bindTexture(r.getGL().TEXTURE_2D, texture);26 r.getGL().texImage2D(r.getGL().TEXTURE_2D, 0, r.getGL().RGBA, r.getGL().RGBA, r.getGL().UNSIGNED_BYTE, image)27 if (((image.width & (image.width - 1)) == 0) && ((image.height & (image.height - 1)) == 0)) {28 r.getGL().generateMipmap(r.getGL().TEXTURE_2D)29 } else {30 r.getGL().texParameteri(r.getGL().TEXTURE_2D, r.getGL().TEXTURE_WRAP_S, r.getGL().CLAMP_TO_EDGE)31 r.getGL().texParameteri(r.getGL().TEXTURE_2D, r.getGL().TEXTURE_WRAP_T, r.getGL().CLAMP_TO_EDGE)32 r.getGL().texParameteri(r.getGL().TEXTURE_2D, r.getGL().TEXTURE_MIN_FILTER, r.getGL().LINEAR)33 }34 }35 image.src = url;36 this.texture = texture;37 }38 fillVertices() {39 const positions = Primitives.createCube({40 x: 0, y: 0, z: 041 }, {42 x: 1, y: 1, z: 143 })44 this.verticesBuffer = this.renderer.getGL().createBuffer()45 this.renderer.getGL().bindBuffer(this.renderer.getGL().ARRAY_BUFFER, this.verticesBuffer)46 this.renderer.getGL().bufferData(this.renderer.getGL().ARRAY_BUFFER, new Float32Array(positions), this.renderer.getGL().STATIC_DRAW)47 }48 fillUVS() {49 const textureCoordinates = [50 // Front51 0.0, 0.0,52 1.0, 0.0,53 1.0, 1.0,54 0.0, 1.0,55 // Back56 0.0, 0.0,57 1.0, 0.0,58 1.0, 1.0,59 0.0, 1.0,60 // Top61 0.0, 0.0,62 1.0, 0.0,63 1.0, 1.0,64 0.0, 1.0,65 // Bottom66 0.0, 0.0,67 1.0, 0.0,68 1.0, 1.0,69 0.0, 1.0,70 // Right71 0.0, 0.0,72 1.0, 0.0,73 1.0, 1.0,74 0.0, 1.0,75 // Left76 0.0, 0.0,77 1.0, 0.0,78 1.0, 1.0,79 0.0, 1.0,80 ];81 this.uvsBuffer = this.renderer.getGL().createBuffer()82 this.renderer.getGL().bindBuffer(this.renderer.getGL().ARRAY_BUFFER, this.uvsBuffer)83 this.renderer.getGL().bufferData(this.renderer.getGL().ARRAY_BUFFER, new Float32Array(textureCoordinates), this.renderer.getGL().STATIC_DRAW)84 }85 fillIndices() {86 const indices = [87 0, 1, 2, 0, 2, 3, // avant88 4, 5, 6, 4, 6, 7, // arrière89 8, 9, 10, 8, 10, 11, // haut90 12, 13, 14, 12, 14, 15, // bas91 16, 17, 18, 16, 18, 19, // droite92 20, 21, 22, 20, 22, 23, // gauche93 ]94 this.indicesBuffer = this.renderer.getGL().createBuffer()95 this.renderer.getGL().bindBuffer(this.renderer.getGL().ELEMENT_ARRAY_BUFFER, this.indicesBuffer)96 this.renderer.getGL().bufferData(this.renderer.getGL().ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this.renderer.getGL().STATIC_DRAW)97 }98 fillNormals() {99 const normals = [100 // Front101 0.0, 0.0, 1.0,102 0.0, 0.0, 1.0,103 0.0, 0.0, 1.0,104 0.0, 0.0, 1.0,105 // Back106 0.0, 0.0, -1.0,107 0.0, 0.0, -1.0,108 0.0, 0.0, -1.0,109 0.0, 0.0, -1.0,110 // Top111 0.0, 1.0, 0.0,112 0.0, 1.0, 0.0,113 0.0, 1.0, 0.0,114 0.0, 1.0, 0.0,115 // Bottom116 0.0, -1.0, 0.0,117 0.0, -1.0, 0.0,118 0.0, -1.0, 0.0,119 0.0, -1.0, 0.0,120 // Right121 1.0, 0.0, 0.0,122 1.0, 0.0, 0.0,123 1.0, 0.0, 0.0,124 1.0, 0.0, 0.0,125 // Left126 -1.0, 0.0, 0.0,127 -1.0, 0.0, 0.0,128 -1.0, 0.0, 0.0,129 -1.0, 0.0, 0.0130 ]131 this.normalsBuffer = this.renderer.getGL().createBuffer();132 this.renderer.getGL().bindBuffer(this.renderer.getGL().ARRAY_BUFFER, this.normalsBuffer);133 this.renderer.getGL().bufferData(this.renderer.getGL().ARRAY_BUFFER, new Float32Array(normals), this.renderer.getGL().STATIC_DRAW);134 }135 getObject() {136 return {137 verticesBuffer: this.verticesBuffer,138 uvsBuffer: this.uvsBuffer,139 indicesBuffer: this.indicesBuffer,140 normalsBuffer: this.normalsBuffer,141 texture: this.texture,142 translation: this.translation,143 rotation: this.rotation144 }145 }146}...

Full Screen

Full Screen

ShaderProgram.ts

Source:ShaderProgram.ts Github

copy

Full Screen

1import GL from "./GL";2type ShaderArray = {3 vertex: WebGLShader;4 fragment: WebGLShader;5};6class ShaderProgram {7 private shaderProgram: WebGLProgram;8 private shaders: ShaderArray;9 private uniforms: Map<string, WebGLUniformLocation> = new Map();10 private attributes: Map<string, number> = new Map();11 constructor() {12 const gl = GL.getGL();13 this.shaderProgram = <WebGLProgram>gl.createProgram();14 this.shaders = {15 vertex: <WebGLShader>gl.createShader(gl.VERTEX_SHADER),16 fragment: <WebGLShader>gl.createShader(gl.FRAGMENT_SHADER)17 }18 }19 /*20 Initialize vertex or fragment shader21 @param type - means the type of the creating shader ("vertex" or "fragment")22 @param sourceDom - means the script tag selector which contains shader's code23 @return true - if the shader was initialized successefuly24 false - otherwise25 */26 public initShader(type: "vertex" | "fragment", sourceDom: String): Boolean {27 const gl = GL.getGL();28 if (type === "vertex") {29 this.shaders[type] = <WebGLShader>(30 gl?.createShader(gl.VERTEX_SHADER)31 );32 } else {33 this.shaders[type] = <WebGLShader>(34 gl?.createShader(gl.FRAGMENT_SHADER)35 );36 }37 gl?.shaderSource(38 this.shaders[type],39 document.querySelector(`${sourceDom}`)?.textContent || ""40 );41 gl.compileShader(this.shaders[type]);42 if (43 gl.getShaderParameter(this.shaders[type], gl.COMPILE_STATUS)44 ) {45 return true;46 }47 console.log(gl.getShaderInfoLog(this.shaders[type]));48 return false;49 }50 public initShaderProgram(): Boolean {51 const gl = GL.getGL();52 this.shaderProgram = <WebGLProgram>gl.createProgram();53 gl.attachShader(this.shaderProgram, this.shaders.vertex);54 gl.attachShader(this.shaderProgram, this.shaders.fragment);55 gl.linkProgram(this.shaderProgram);56 if (gl.getProgramParameter(this.shaderProgram, gl.LINK_STATUS)) {57 gl.useProgram(this.shaderProgram); 58 return true;59 }60 console.log(gl.getProgramInfoLog(this.shaderProgram));61 return false;62 }63 public initUniform(name: string): void {64 const gl = GL.getGL();65 if (!this.uniforms.has(name)) {66 const uniform = <WebGLUniformLocation>gl.getUniformLocation(this.shaderProgram, name);67 this.uniforms.set(name, uniform);68 }69 }70 public initAttr(name: string): void {71 const gl = GL.getGL();72 if (!this.attributes.has(name)) {73 const attribute = <number>gl.getAttribLocation(this.shaderProgram, name);74 gl.enableVertexAttribArray(attribute);75 this.attributes.set(name, attribute);76 }77 }78 public setUniform3fv(name: string, value: number[]): void {79 const gl = GL.getGL();80 gl.uniform3fv(<WebGLUniformLocation>this.uniforms.get(name), value);81 }82 public setUniformMatrix4fv(name: string, value: number[]): void {83 const gl = GL.getGL();84 gl.uniformMatrix4fv(<WebGLUniformLocation>this.uniforms.get(name), false, value);85 }86 public setUniform1i(name: string, value: number): void {87 GL.getGL().uniform1i(<WebGLUniformLocation>this.uniforms.get(name), value);88 }89 public apply(): void {90 const gl = GL.getGL();91 gl.useProgram(this.shaderProgram);92 }93 public getVertexAttr(name: string): number {94 return <number>this.attributes.get(name);95 }96}...

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var gl = wpt.getGl();2gl.clearColor(0, 0, 0, 0);3gl.clear(gl.COLOR_BUFFER_BIT);4var tex = gl.createTexture();5gl.bindTexture(gl.TEXTURE_2D, tex);6gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array([0, 0, 255, 255]));7gl.clearColor(0, 0, 0, 0);8gl.clear(gl.COLOR_BUFFER_BIT);9gl.bindTexture(gl.TEXTURE_2D, tex);10gl.drawArrays(gl.TRIANGLES, 0, 3);11test(function() {12 var gl = wpt.getGl();13 var pixels = new Uint8Array(4);14 gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, pixels);15 assert_array_equals(pixels, [0, 0, 255, 255]);16}, "Test that texImage2D can be called after a context is lost");

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var wpt = require('webpagetest');2var wpt = new WebPageTest('www.webpagetest.org');3wpt.getGl(function(err, data) {4 if (err) return console.error(err);5 console.log(data);6});7var wpt = require('webpagetest');8var wpt = new WebPageTest('www.webpagetest.org');9wpt.getLocations(function(err, data) {10 if (err) return console.error(err);11 console.log(data);12});13var wpt = require('webpagetest');14var wpt = new WebPageTest('www.webpagetest.org');15wpt.getLocations(function(err, data) {16 if (err) return console.error(err);17 console.log(data);18});19var wpt = require('webpagetest');20var wpt = new WebPageTest('www.webpagetest.org');21wpt.getLocations(function(err, data) {22 if (err) return console.error(err);23 console.log(data);24});25var wpt = require('webpagetest');26var wpt = new WebPageTest('www.webpagetest.org');27wpt.getLocations(function(err, data) {28 if (err) return console.error(err);29 console.log(data);30});31var wpt = require('webpagetest');32var wpt = new WebPageTest('www.webpagetest.org');33wpt.getLocations(function(err, data) {34 if (err) return console.error(err);35 console.log(data);36});37var wpt = require('webpagetest');38var wpt = new WebPageTest('www.webpagetest.org');39wpt.getLocations(function(err, data) {40 if (err) return console.error(err);41 console.log(data);42});43var wpt = require('webpagetest');

Full Screen

Full Screen

Using AI Code Generation

copy

Full Screen

1var gl = getGl();2var gl = getWebGLContext();3var gl = getWebGL2Context();4var gl = getWebGLContext({ alpha: false });5var gl = getWebGL2Context({ alpha: false });6var gl = getWebGLContext({ alpha: false }, canvas);7var gl = getWebGL2Context({ alpha: false }, canvas);8var gl = getWebGLContext({ alpha: false }, canvas, { majorVersion: 1 });9var gl = getWebGL2Context({ alpha: false }, canvas, { majorVersion: 2 });10var gl = getWebGLContext({ alpha: false }, canvas, { majorVersion: 1, minorVersion: 0 });11var gl = getWebGL2Context({ alpha: false }, canvas, { majorVersion: 2, minorVersion: 0 });12var gl = getWebGLContext({ alpha: false }, canvas, { majorVersion: 1, minorVersion: 0, antialias: true });13var gl = getWebGL2Context({ alpha: false }, canvas, { major

Full Screen

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.

... View sample repo... View DocumentationSign up Free
›
_

Try LambdaTest Now !!

Get 100 minutes of automation test minutes FREE!!

...
Sign up with GoogleSign up with Email
Next-Gen App & Browser Testing Cloud

Was this article helpful?

Helpful

NotHelpful