framebuffer-texture-changing-base-level.html

Enable keyboard shortcuts

<!--

Copyright (c) 2019 The Khronos Group Inc.

Use of this source code is governed by an MIT-style license that can be

found in the LICENSE.txt file.

-->

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>WebGL framebuffer using a non-square texture with a changing base level</title>

<link rel="stylesheet" href="../../resources/js-test-style.css"/>

<script src="../../js/js-test-pre.js"></script>

<script src="../../js/webgl-test-utils.js"></script>

</head>

<body>

<canvas id="canvas" width="16" height="16"> </canvas>

<div id="description"></div>

<div id="console"></div>

<script>

"use strict";

// http://anglebug.com/2291

var wtu = WebGLTestUtils;

var gl;

function testNonSquareFramebufferTextureWithChangingBaseLevel() {

  var program = wtu.setupSimpleTextureProgram(gl);

  wtu.setupUnitQuad(gl);

  var width = 8;

  var height = 4;

  debug("");

  debug("Text texture width " + width + " x height " + height);

  var texture = gl.createTexture();

  gl.bindTexture(gl.TEXTURE_2D, texture);

  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);

  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);

  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);

  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);

  // Create all mipmap levels for the texture from level 0 to the 1x1 pixel level.

  var level = 0;

  var levelW = width;

  var levelH = height;

  gl.texImage2D(gl.TEXTURE_2D, level, gl.RGBA, levelW, levelH, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);

  while (levelW > 1 || levelH > 1)

      ++level;

      levelW = Math.max(1, Math.floor(width / Math.pow(2, level)));

      levelH = Math.max(1, Math.floor(height / Math.pow(2, level)));

      gl.texImage2D(gl.TEXTURE_2D, level, gl.RGBA, levelW, levelH, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);

  // Clear each level of the texture using an FBO. Change the base level to match the level used for the FBO on each iteration.

  var fbo = gl.createFramebuffer();

  gl.bindFramebuffer(gl.FRAMEBUFFER, fbo);

  level = 0;

  levelW = width;

  levelH = height;

  while (levelW > 1 || levelH > 1)

    var levelW = Math.floor(width / Math.pow(2, level));

    var levelH = Math.floor(height / Math.pow(2, level));

    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_BASE_LEVEL, level);

    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, texture, level);

    shouldBe("gl.checkFramebufferStatus(gl.FRAMEBUFFER)", "gl.FRAMEBUFFER_COMPLETE");

    wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Setup framebuffer with texture should succeed.");

    gl.clearColor(0, 1, 0, 1);

    gl.clear(gl.COLOR_BUFFER_BIT);

    wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Clearing the texture level " + level + " to green should succeed.");

    wtu.checkCanvasRect(gl, 0, 0, 1, 1, [0, 255, 0, 255], "should be green");

    ++level;

  debug("");

  gl.bindFramebuffer(gl.FRAMEBUFFER, null);

  gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);

  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_BASE_LEVEL, 0);

  wtu.clearAndDrawUnitQuad(gl, [0, 0, 0, 255]);

  wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Drawing the texture to default framebuffer with base level 0 should succeed.");

  wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green");

  gl.deleteTexture(texture);

  gl.deleteFramebuffer(fbo);

description();

var canvas = document.getElementById("canvas");

shouldBeNonNull("gl = wtu.create3DContext(canvas, undefined, 2)");

testNonSquareFramebufferTextureWithChangingBaseLevel();

debug("");

var successfullyParsed = true;

</script>

<script src="../../js/js-test-post.js"></script>

</body>

</html>