Rexton Itsiah Ответов: 0

Как добавить 8 для случайных цветов и 9 для остановки случайных цветов на холсте


<script type="text/javascript">
    // Enforcing all JS to be executed in "strict mode"
    'use strict';

    // Global variable to access throughout the application
    let gl;

    function updateClearColor(...color) {
      // The ES6 spread operator (...) allows for us to
      // use elements of an array as arguments to a function
      gl.clearColor(...color);
      gl.clear(gl.COLOR_BUFFER_BIT);
      gl.viewport(0, 0, 0, 0);

    }
    function checkKey(event) {
      switch (event.keyCode) {
        // number 1 => green
        case 49: {
          updateClearColor(0.2, 0.8, 0.2, 1.0);
          break;
        }
        // number 2 => blue
        case 50: {
          updateClearColor(0.2, 0.2, 0.8, 1.0);
          break;
        }
        // number 3 => random color
        case 8: {
          updateClearColor(Math.random(), Math.random(), Math.random(), 1.0);
          break;
        }

        // number 4 => get color
        case 52: {
          const color = gl.getParameter(gl.COLOR_CLEAR_VALUE);
          alert(`clearColor = (
            ${color[0].toFixed(1)},
            ${color[1].toFixed(1)},
            ${color[2].toFixed(1)},
            ${color[2].toFixed(1)},
            ${color[2].toFixed(1)}
          )`);
          window.focus();
          break;
        }
      }
    }

    function init() {
      const canvas = document.getElementById('webgl-canvas');

      if (!canvas) {
        console.error('Sorry! No HTML5 Canvas was found on this page');
        return;
      }

      gl = canvas.getContext('webgl2');

      const message = gl
        ? 'Hooray! You got a WebGL2 context'
        : 'Sorry! WebGL is not available';

      alert(message);

      // Call checkKey whenever a key is pressed
      window.onkeydown = checkKey;
    }

    window.onload = init;
  </script>
 <script>
  function main(bckColor) {
var canvas = document.getElementsByTagName("canvas")[0],
  ctx = canvas.getContext("2d");
if (canvas.height) {
  canvas.height = 0;
}
canvas.width = window.innerWidth;
canvas.height = document.documentElement.scrollHeight;
var cW = canvas.width,
  cH = canvas.height;

ctx.fillStyle = bckColor || "#000";

ctx.fillRect(0, 0, cW, cH);
ctx.fill();

ctx.beginPath();

ctx.shadowBlur = 5;

ctx.arc(cW / 2, cH / 2, 50, 0, 2 * Math.PI, false);
ctx.fill();
ctx.closePath();
}
var colorArray = ['red', 'green', 'yellow', 'blue', 'pink', 'brown', 'orange']
var changeColor = setInterval(function() {

let bckColor = colorArray[Math.floor(Math.random() * 7 + 1)];

main(bckColor)

}, 2000)
window.addEventListener("load", main);


Что я уже пробовал:

как решить эту проблему, добавив два, 8 для случайных цветов и 9 для остановки случайных цветов

0 Ответов