var canvas=document.getElementById("c");
var ctx=canvas.getContext("2d");
var W, H;
var colors=[
  "#2e942a",
  "#e0d041",
  "#31a194",
  "#ae2c2b",
  "#3f4187"
];
var background="#fbf4e4";
var limit=5;
function choose(array){
  var random=Math.floor(array.length*Math.random());
  return array[random];
}

function generateNoise(opacity) {
  var noiseCanvas=document.getElementById("noise");
  noiseCanvas.width=window.innerWidth;
  noiseCanvas.height=window.innerHeight;
  noiseCtx=noiseCanvas.getContext("2d");
  var x, y;
  var number;
  for (x=0; x<noiseCanvas.width; x++) {
    for (y=0; y<noiseCanvas.height; y++) {
      number = Math.floor(Math.random()*60 + 180);
      noiseCtx.fillStyle = "rgba(" + number + "," + number + "," + number + "," + opacity + ")";
      noiseCtx.fillRect(x, y, 1, 1);
    }
  }
}



function resizeCanvas(){
  W = window.innerWidth;
  H = 0.9*window.innerHeight;
  canvas.width = W;
  canvas.height = H;
}
function drawBackground(){
  document.body.style.background = background;
  ctx.beginPath();
  ctx.rect(0, 0, W, H);
  ctx.fillStyle = background;
  ctx.fill();
}

function sqrt(x){
  return Math.pow(x, 0.5);
}


function triangle(xTop, yTop, length){
  var color=choose(colors);

  ctx.fillStyle=color;
  ctx.beginPath();
  ctx.moveTo(xTop, yTop);
  ctx.lineTo(xTop + 0.5*length, yTop + length*sqrt(3)/2);
  ctx.lineTo(xTop - 0.5*length, yTop + length*sqrt(3)/2);
  ctx.lineTo(xTop, yTop);
  ctx.closePath();
  ctx.fill();
}

function triangles(xTop, yTop, length, i){
  if(i==limit){
    triangle(xTop, yTop, length/2);
    triangle(xTop + 0.5*length/2, yTop + length*sqrt(3)/4, length/2);
    triangle(xTop - 0.5*length/2, yTop + length*sqrt(3)/4, length/2);
  }else if(i<limit){
    i+=1;
    triangles(xTop, yTop, length/2, i);
    triangles(xTop + 0.5*length/2, yTop + length*sqrt(3)/4, length/2, i);
    triangles(xTop - 0.5*length/2, yTop + length*sqrt(3)/4, length/2, i);
  }
}

function draw(){
  resizeCanvas();
  drawBackground();
  triangles(W/2,0, H*1.1, 0);
}
window.onresize=draw;


generateNoise(0.1)
draw();