import { TilerTheCreator } from 'https://codepen.io/bryanrasmussen/pen/xxwRKOK.js';

const setCanvas = () => {
      
  const canvas = document.getElementById('roughcanvas');
  const canvasW = canvas.width;
  const canvasH = canvas.height;
  const roughCanvas = rough.canvas(canvas);

  const roughJSTiling = new TilerTheCreator({width: window.innerWidth, height: window.innerHeight, scale_factor: 50, type: 77});
    roughJSTiling.readyToTile();
   
  const polygons = roughJSTiling.getPolygonsFromRegion();
 
      
  polygons.forEach((polygon, index) => {
    const tilestep = ((index % 2 === 0)) ? "even" : ((index % 3 === 0)) ? "third" : "odd";
    const styling = {};
    styling.fill = (tilestep === "even") ? "#511845" : "#900c3f";
    styling.stroke = (tilestep === "even") ? "#900c3f" : "#511845";
    styling.hachureAngle = (tilestep === "third") ? 130 : 90;
    styling.hachureGap = (tilestep === "third") ? 6 : 5;

  roughCanvas.polygon(polygon, styling);
 });
 
 }
setCanvas();