let canvas, image;
function initiate() {
  let element = document.getElementById("canvas");
  canvas = element.getContext("2d");
  image = document.createElement("img");
  image.src = "images/bricks.jpg";
  image.addEventListener("load", modimage);
}
function modimage() {
  let pattern = canvas.createPattern(image, "repeat");
  canvas.fillStyle = pattern;
  canvas.fillRect(0, 0, 500, 300);
}
window.addEventListener("DOMContentLoaded", initiate);