Prime number

Prime number.markdown

Prime number

A Pen by Yukulélé on CodePen.

License.

script.js

{
  let
    canvas = document.createElement('canvas'),
    ctx = canvas.getContext('2d'),
    w, //wiewport width
    h, //wiewport height
    max,
    init = Date.now(),
    lineWidth,
    hue,
    pr,
    p,
    j, i=1,
    pix = 20;

  var t = 2;
  var raf;

  function loop() {
    calc();
    raf = window.requestAnimationFrame(loop);
  }

  function calc() {
    for (let r = 0; r < 30000/pix/pix/i; r++) {
      p = pr.next();
      if (p.done) {
        window.cancelAnimationFrame(raf);
        return;
      }
      [j, i] = p.value;
      draw();
    }
  }

  function draw() {
    let x = j % w;
    let y = (j - x) / w;
    ctx.fillStyle = "hsla("+Math.floor(i*33)+",100%,50%,.3)";
    ctx.fillRect(x * pix, y * pix, pix, pix);
  }

  function* preums(max) {
    for (let i = 2; i < max/2; i++) {
      for (let j = i * 2; j < max; j += i) {
        yield [j, i];
      }
    }
  }

  function resize() {
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    w = Math.floor(window.innerWidth / pix);
    h = Math.floor(window.innerHeight / pix);
    max = w * h;
    ctx.globalCompositeOperation = "screen";
    pr = preums(max);
    ctx.fillStyle = '#fff';
    ctx.textBaseline = "middle";
    ctx.textAlign = "center";
    for(let i = 0; i<max;i++){
      let x = i % w;
      let y = (i - x) / w;
      ctx.fillText(i,(x+.5)*pix,(y+.5)*pix,pix-4);
    }
    ctx.fillStyle = "hsla(0,100%,100%,0.5)";
    ctx.fillRect(0, 0, pix, pix);
    ctx.fillRect(pix, 0, pix, pix);
    calc();
  }

  window.addEventListener('resize', function() {
    resize();
  });
  resize();
  loop();

  document.body.appendChild(canvas);
}

scripts

<script src="https://rawgit.com/facebook/regenerator/master/runtime.js"></script>

style.css

body,html{
  padding: 0;
  margin: 0;
  background:black;
  overflow: hidden;
}
canvas{
  vertical-align: top;
}