<!--
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 out of bounds uniform array access.</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>
<div id="description"></div>
<canvas id="example" width="128" height="128" style="background: black;">
</canvas>
<div id="console"></div>
<script id="vshader" type="x-shader/x-vertex">
attribute vec4 vPosition;
varying vec4 v_color;
uniform float lineWidth;
uniform int elemMult;
uniform vec4 colorArray[6];
void main()
{
    vec2 texcoord = vec2(vPosition.xy * 0.5 + vec2(0.5, 0.5));
    int index = int(texcoord.x + texcoord.y * lineWidth) * elemMult;
    v_color = colorArray[index];
    gl_Position = vPosition;
    gl_PointSize = 1.0;
}
</script>

<script id="fshader" type="x-shader/x-fragment">
precision mediump float;
varying vec4 v_color;
void main()
{
  gl_FragColor = v_color;
}
</script>
<script>
"use strict";
debug("Tests a WebGL program that accesses out of bounds uniform array elements");

var gl;
var gridRes = 127;
var lineWidthLoc;
var elemMultLoc;
var width = 128;
var height = 128;
var pixels = new Uint8Array(width * height * 4);

var lineWidth = 0;
var elemMult = 0;

var knownColors = [
  1.0, 0.0, 0.0, 1.0,  // Red
  0.0, 1.0, 0.0, 1.0,  // Green
  0.0, 0.0, 1.0, 1.0,  // Blue
  0.0, 1.0, 1.0, 1.0,  // Cyan
  1.0, 0.0, 1.0, 1.0,  // Magenta
  1.0, 1.0, 0.0, 1.0   // Yellow
];

function main() {
  var wtu = WebGLTestUtils;
  gl = wtu.create3DContext("example");
  var program = wtu.setupProgram(
      gl,
      ['vshader', 'fshader'],
      ['vPosition'], [0]);

  // setupQuad produces the geometry we want for a gridRes x gridRes grid
  // of points. No interpolation will be performed across the points, so
  // according to the WebGL specification for out-of-bounds array accesses,
  // we will get exactly the input colors from the uniform colorArray, or
  // zero, for each pixel on the canvas.
  wtu.setupIndexedQuad(gl, gridRes, 0);
  var colorArrayLoc = gl.getUniformLocation(program, "colorArray[0]");
  assertMsg(colorArrayLoc != null, "color array uniform should be found");
  var colors = new Float32Array(knownColors);
  gl.uniform4fv(colorArrayLoc, colors);
  lineWidthLoc = gl.getUniformLocation(program, "lineWidth");
  elemMultLoc = gl.getUniformLocation(program, "elemMult");
  assertMsg(gl.getError() == gl.NO_ERROR, "Should be no errors from setup.");
  runOneIteration();
}

function withinEpsilon(val1, val2) {
  return Math.abs(val1 - val2) < 0.0001;
}

function isKnownColor(r, g, b) {
  if (r == 0 && g == 0 && b == 0)
    return true;
  for (var ii = 0; ii < knownColors.length; ii += 4) {
    if (withinEpsilon(r / 255.0, knownColors[ii + 0]) &&
        withinEpsilon(g / 255.0, knownColors[ii + 1]) &&
        withinEpsilon(b / 255.0, knownColors[ii + 2]))
      return true;
  }
  return false;
}

function runOneIteration() {
  if (elemMult < 2048) {
    var ok = true;
    var startingLineWidth = lineWidth;
    var firstFailingPixel = null;
    var firstFailingValue = null;
    for (; lineWidth < 2540; lineWidth += 31) {
      // Draw
      gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
      gl.uniform1f(lineWidthLoc, lineWidth);
      gl.uniform1i(elemMultLoc, elemMult);
      gl.drawArrays(gl.POINTS, 0, gridRes * gridRes);

      // Read back
      gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);

      // Verify
      for (var y = 0; y < height; ++y) {
        for (var x = 0; x < width; ++x) {
          if (!isKnownColor(pixels[4 * (width * y + x) + 0],
                            pixels[4 * (width * y + x) + 1],
                            pixels[4 * (width * y + x) + 2])) {
            ok = false;
            if (firstFailingPixel == null) {
              firstFailingPixel = [x, y];
              firstFailingValue = [pixels[4 * (width * y + x) + 0],
                                   pixels[4 * (width * y + x) + 1],
                                   pixels[4 * (width * y + x) + 2]];
            }
          }
        }
      }
    }
    var endingLineWidth = lineWidth - 31;
    lineWidth -= 2540;
    if (ok) {
      testPassed("Good rendering results for lineWidths " +
                 startingLineWidth + "..." + endingLineWidth +
                 " at elemMult=" + elemMult);
    } else {
      testFailed("for lineWidth=" + lineWidth + ", elemMult=" + elemMult +
                 ": first failing pixel (" + firstFailingPixel[0] + ", " + firstFailingPixel[1] + ") was (" +
                 firstFailingValue[0] + ", " +
                 firstFailingValue[1] + ", " +
                 firstFailingValue[2] + "), should be (0, 0, 0) or one of known colors");
    }
    elemMult += 73;
    setTimeout(runOneIteration, 0);
  } else {
    finishTest();
  }
}

main();

var successfullyParsed = true;

</script>
</body>
</html>
