webgl2opengl-es-3.0matrix-engine
Change camera view for RENDERBUFFER but not for main render view
I got nice working RENDERBUFFER buffer using example but i cant change camera view only for framebuffer render view.
I wanna make second camera with own camera params...
Creating framebuffer:
function makeFbo() {
//////////////////////////////////////////////////////
// TEST 2 Success for now just fbo
// gl.getParameter(gl.MAX_DRAW_BUFFERS)
//////////////////////////////////////////////////////
var framebuffer, texture, depthBuffer;
console.log('FBO MAKE FUNC !!!');
var error = function() {
console.log('Error in creating FBO!');
return null;
}
framebuffer = gl.createFramebuffer();
if(!framebuffer) {
console.log('Failed to create frame buffer object');
return error();
}
texture = gl.createTexture();
if(!texture) {
console.log('Failed to create texture object');
return error();
}
// local
var OFFSCREEN_WIDTH = 512;
var OFFSCREEN_HEIGHT = 512;
gl.bindTexture(gl.TEXTURE_2D, texture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, OFFSCREEN_WIDTH, OFFSCREEN_HEIGHT, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
framebuffer.texture = texture;
depthBuffer = gl.createRenderbuffer();
if(!depthBuffer) {
console.log('Failed to create renderbuffer object');
return error();
}
gl.bindRenderbuffer(gl.RENDERBUFFER, depthBuffer);
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, OFFSCREEN_WIDTH, OFFSCREEN_HEIGHT);
// Attach the texture and the renderbuffer object to the FBO
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, 0);
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthBuffer);
// Check if FBO is configured correctly
var e = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
if(gl.FRAMEBUFFER_COMPLETE !== e) {
console.log('Frame buffer object is incomplete: ' + e.toString());
return error();
}
// Unbind the buffer object
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
gl.bindTexture(gl.TEXTURE_2D, null);
gl.bindRenderbuffer(gl.RENDERBUFFER, null);
return framebuffer;
}
Render func:
App.operation.reDrawGlobal = function(time) {
modifyLooper(0);
if(App.offScreenCanvas == false) reDrawID = requestAnimationFrame(App.operation.reDrawGlobal);
world.renderPerspective();
for(var t = 0;t < App.updateBeforeDraw.length;t++) {
App.updateBeforeDraw[t].UPDATE();
}
// ....
// reset to zero
physicsLooper = 0;
// Must be override for performance
// - non FBO and FBO option draw coroutine
// hc 512
if(world.FBOS.length > 0) world.GL.gl.bindFramebuffer(world.GL.gl.FRAMEBUFFER, world.FBOS[0].FB);
world.GL.gl.viewport(0, 0, 512, 512);
world.GL.gl.clearColor(0.2, 0.2, 0.4, 1.0);
world.GL.gl.clear(world.GL.gl.COLOR_BUFFER_BIT | world.GL.gl.DEPTH_BUFFER_BIT);
world.GL.gl.enable(world.GL.gl.DEPTH_TEST);
world.GL.gl.disable(world.GL.gl.BLEND);
world.GL.gl.depthMask(true);
// big test !!
if(typeof matrixEngine.Events.camera.xPosMemo === 'undefined') {
matrixEngine.Events.camera.xPosMemo = matrixEngine.Events.camera.xPos;
matrixEngine.Events.camera.zPosMemo = matrixEngine.Events.camera.zPos;
matrixEngine.Events.camera.yPosMemo = matrixEngine.Events.camera.yPos;
matrixEngine.Events.camera.xPos += 5;
matrixEngine.Events.camera.zPos += 5;
matrixEngine.Events.camera.yPos += 5;
} else {
// bigtest !! NO special success !
// matrixEngine.Events.camera.xPos = matrixEngine.Events.camera.xPosMemo;
// matrixEngine.Events.camera.zPos =matrixEngine.Events.camera.zPosMemo;
// matrixEngine.Events.camera.yPos = matrixEngine.Events.camera.yPosMemo;
}
// - draw all `non fbo` and `no blend`
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
!world.contentList[looper].FBO &&
world.contentList[looper].glBlend.blendEnabled == false) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
// world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
// maybe no need here
world.GL.gl.enable(world.GL.gl.BLEND);
world.GL.gl.depthMask(false);
// all non FBO but blended
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
!world.contentList[looper].FBO &&
world.contentList[looper].glBlend.blendEnabled == true) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
// world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
world.GL.gl.depthMask(true);
// Back to drawing on the main color buffer!
world.GL.gl.bindFramebuffer(world.GL.gl.FRAMEBUFFER, null);
world.GL.gl.viewport(0, 0, world.GL.gl.canvas.width, world.GL.gl.canvas.height);
world.GL.gl.clearColor(0.0, 0.0, 0.0, 1.0);
world.GL.gl.clear(world.GL.gl.COLOR_BUFFER_BIT | world.GL.gl.DEPTH_BUFFER_BIT);
// Draw again all
world.GL.gl.enable(world.GL.gl.DEPTH_TEST);
world.GL.gl.disable(world.GL.gl.BLEND);
world.GL.gl.depthMask(true);
// all but no blend
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
world.contentList[looper].glBlend.blendEnabled == false) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
world.GL.gl.enable(world.GL.gl.BLEND);
world.GL.gl.depthMask(false);
modifyLooper(0);
// all but blend
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
world.contentList[looper].glBlend.blendEnabled == true) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
world.GL.gl.depthMask(true);
if(App.raycast) {
if(secondPass <= 2) {
raycaster.touchCoordinate.enabled = false;
secondPass = 0;
}
}
secondPass++;
physicsLooper = 0;
updateFPS(1);
if(App.offScreenCanvas == true) reDrawID = setTimeout(() => App.operation.reDrawGlobal(), App.redrawInterval);
if(world.animLine) {
// animatinLine
world.globalAnimCounter++;
if(world.globalAnimCounter >= world.globalAnimSequenceSize) {
world.globalAnimCounter = 0;
world.globalAnimCurSequence++;
document.getElementById('globalAnimCurSequence').innerText = world.globalAnimCurSequence;
}
document.getElementById('globalAnimCounter').innerText = world.globalAnimCounter;
document.getElementById('timeline').value = world.globalAnimCounter;
}
};
Here is example what i want. This is scene with +3 camera view with different view.
Maybe i need to setup for every framebuffer special draw then then redraw all. I have feeling i will stack with blinking screen...
Any suggestion ?
Solution
I get framebuffer view only camera manipulate option when i put
camera manipulation code before calling bindFramebuffer !
- // reset camera come before redraw all !
App.operation.reDrawGlobal = function(time) {
modifyLooper(0);
if(App.offScreenCanvas == false) reDrawID = requestAnimationFrame(App.operation.reDrawGlobal);
world.renderPerspective();
for(var t = 0;t < App.updateBeforeDraw.length;t++) {
App.updateBeforeDraw[t].UPDATE();
}
// ....
// reset to zero
physicsLooper = 0;
// Must be override for performance
// - non FBO and FBO option draw coroutine
// hc 512
if(world.FBOS.length > 0) {
// camera manipulation code must be before bindFramebuffer !!!
if(typeof matrixEngine.Events.camera.xPosMemo === 'undefined') {
matrixEngine.Events.camera.xPosMemo = matrixEngine.Events.camera.xPos;
matrixEngine.Events.camera.zPosMemo = matrixEngine.Events.camera.zPos;
matrixEngine.Events.camera.yPosMemo = matrixEngine.Events.camera.yPos;
matrixEngine.Events.camera.xPos += 5;
matrixEngine.Events.camera.zPos += 5;
matrixEngine.Events.camera.yPos += 5; // ......
}
world.GL.gl.bindFramebuffer(world.GL.gl.FRAMEBUFFER, world.FBOS[0].FB);
}
world.GL.gl.viewport(0, 0, 512, 512);
world.GL.gl.clearColor(0.2, 0.2, 0.4, 1.0);
world.GL.gl.clear(world.GL.gl.COLOR_BUFFER_BIT | world.GL.gl.DEPTH_BUFFER_BIT);
world.GL.gl.enable(world.GL.gl.DEPTH_TEST);
world.GL.gl.disable(world.GL.gl.BLEND);
world.GL.gl.depthMask(true);
// - draw all `non fbo` and `no blend`
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
!world.contentList[looper].FBO &&
world.contentList[looper].glBlend.blendEnabled == false) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
// world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
// maybe no need here
world.GL.gl.enable(world.GL.gl.BLEND);
world.GL.gl.depthMask(false);
// all non FBO but blended
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
!world.contentList[looper].FBO &&
world.contentList[looper].glBlend.blendEnabled == true) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
// world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
// world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
world.GL.gl.depthMask(true);
// Back to drawing on the main color buffer!
world.GL.gl.bindFramebuffer(world.GL.gl.FRAMEBUFFER, null);
world.GL.gl.viewport(0, 0, world.GL.gl.canvas.width, world.GL.gl.canvas.height);
world.GL.gl.clearColor(0.0, 0.0, 0.0, 1.0);
world.GL.gl.clear(world.GL.gl.COLOR_BUFFER_BIT | world.GL.gl.DEPTH_BUFFER_BIT);
// Draw again all
world.GL.gl.enable(world.GL.gl.DEPTH_TEST);
world.GL.gl.disable(world.GL.gl.BLEND);
world.GL.gl.depthMask(true);
// reset camera
if(typeof matrixEngine.Events.camera.zPosMemo !== 'undefined') {
matrixEngine.Events.camera.zPos = matrixEngine.Events.camera.zPosMemo;
matrixEngine.Events.camera.xPos = matrixEngine.Events.camera.xPosMemo;
matrixEngine.Events.camera.yPos = matrixEngine.Events.camera.yPosMemo;
}
// all but no blend
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
world.contentList[looper].glBlend.blendEnabled == false) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
world.GL.gl.enable(world.GL.gl.BLEND);
world.GL.gl.depthMask(false);
modifyLooper(0);
// all but blend
while(looper <= world.contentList.length - 1) {
if(world.contentList[looper].visible === true &&
world.contentList[looper].glBlend.blendEnabled == true) {
if('triangle' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawTriangle(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('square' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquare(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('cube' == world.contentList[looper].type ||
'cubeTex' == world.contentList[looper].type ||
'cubeLightTex' == world.contentList[looper].type ||
'cubeMap' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawCube(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('pyramid' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawPyramid(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('obj' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawObj(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('squareTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSquareTex(world.contentList[looper]);
world.animate(world.contentList[looper]);
} else if('sphereLightTex' == world.contentList[looper].type || 'sphere' == world.contentList[looper].type || 'generatorLightTex' == world.contentList[looper].type) {
world.GL.gl.useProgram(world.contentList[looper].shaderProgram);
world.drawSphere(world.contentList[looper]);
world.animate(world.contentList[looper]);
}
}
modifyLooper(looper + 1);
}
modifyLooper(0);
world.GL.gl.depthMask(true);
if(App.raycast) {
if(secondPass <= 2) {
raycaster.touchCoordinate.enabled = false;
secondPass = 0;
}
}
secondPass++;
physicsLooper = 0;
updateFPS(1);
};
- webgl2 Reading from a RGBA16UI framebuffer with readPixels
- Debugging in WebGL
- How can I send large arrays of objects to a fragment shader using WebGL2?
- WebGL 2.0 unsigned integer input variable
- Are there any major differences between webgl and webgl2 APIs?
- Is antialias possible in WebGL 2 if one of your fragment shader outputs is integer?
- Can't avoid interpolation of UV : " 'flat' : Illegal use of reserved word "
- TWGL Camera rotation not expected
- WebGL2 tells me, that while loops are not allowned
- Updating WebGL texture from color buffer during creation fails
- Change camera view for RENDERBUFFER but not for main render view
- How does this code work with multiple buffer bound to same target?
- webgl2 problem with rendering opaque and translucent triangles
- Are OpenGL vertices ordered as viewed by an internal or external viewer?
- How to create a 16 bit unsigned integer/unsigned short 2D texture in WebGL
- How stencil buffer and masking work?
- WebGL does not like Index 255 with indexed drawing
- WebGL 2.0: Draw call succeeds even VBO is deleted
- In webGL2 #330, Can I store the result of shaders in a texture?
- Error running a Bevy game in browser: "WebAssembly.instantiate(): Import #0 module="wbindgen_placeholder" error: module is not an object or function"
- Getting NS_ERROR_FAILURE when loading a large image in Firefox for WebGL2 3D texture
- In what way is WebGL2 immediate compared to retained mode OpenGL3?
- How do you implement a gamma correct workflow in WebGL2?
- Prevent loop unrolling in shader program when using ANGLE
- WebGL not displaying my triangle despite no errors or warnings
- WebGL - INVALID_OPERATION: texImage2D: ArrayBufferView not big enough for request
- flip OpenLayers WebGL swipe functionality
- Perspective projection (using gl-matrix) in Webgl 2 shows nothing, but without it shows fine
- How to move image processing code entirely to web-worker
- "GL_INVALID_OPERATION: Insufficient buffer size." after variable number of render calls