/* Concept Realized & Created by Louis, Bell added an experiment with perlin noise Kode Krasher added carved effect and audio. */ let c, ctx, w, h, t; let step = 17; // Change pattern size (Initially: 10) let L = [[0,0,3,0],[0,6,0,0],[0,0,3,0],[1,0,0,0],[0,0,0,2],[1,0,0,0]]; let R = [[0,0,6,0],[0,3,0,0],[0,0,0,1],[2,0,0,0],[0,0,0,1],[0,3,0,0]]; var PERLIN_YWRAPB = 4; var PERLIN_YWRAP = 1 << PERLIN_YWRAPB; //16 var PERLIN_ZWRAPB = 8; var PERLIN_ZWRAP = 1 << PERLIN_ZWRAPB; //256 var PERLIN_SIZE = 4095; var perlin_octaves = 4; // default to medium smooth var perlin_amp_falloff = 0.5; // 50% reduction/octave const scaled_cosine= (a) => (0.5 * (2.0 - Math.cos(a * Math.PI))); var perlin; window.onload = () => { c = document.querySelector("canvas"); ctx = c.getContext("2d"); w = c.width = window.innerWidth; h = c.height = window.innerHeight; ctx.canvas.width = w; ctx.canvas.height = h; t=0; for(let i=0; i<=2*Math.max(w,h); i+=(step*8)){ draw(i,L,t); draw(i+step,R,t); } }; draw = (p,ar,t) => { let xl=p-1, yl=-2*step; ctx.beginPath(); ctx.moveTo(xl, yl); while(xl>0){ for(i=0; i= 1.0) { xi++; xf--; } if (yf >= 1.0) { yi++; yf--; } if (zf >= 1.0) { zi++; zf--; } } return r; } /* initializing variables and checking user-agents for touch capabilities... */ const startEvent = navigator.userAgent.match(/ipod|ipad|iphone/i) ? 'touchstart' : 'click'; var audio; function initAudio(){ /* initialize audio */ audio = new Audio("https://www.proudmusiclibrary.com/en/file/stream/b59b3d25df0a891501082f4e0b1aaea7/0/136723.mp3"); /* Creative Commons Licensed music from https://www.proudmusiclibrary.com Audio file is large, so it takes awhile to load */ audio.load(); audio.loop = true; audio.addEventListener('canplaythrough', function() { /* attempting to wait until song can play through before removing 'Initializing Audio' text and displaying Speaker */ document.getElementById('pause').innerText='🔇'; /* AutoPlay does not work in several browsers, so a click event must occur */ var pause = document.getElementById('pause'); pause.addEventListener(startEvent, pauseAudio); } ); } function pauseAudio() { /* play or pause audio based on Speaker click */ audio.paused ? audio.play() : audio.pause(); audio.paused ? document.getElementById('pause').innerText='🔇' : document.getElementById('pause').innerText='🔊'; } /* create an EventListener to initialize the Audio */ window.addEventListener('load', initAudio);

Louis / Bell - Caveman Pattern 🎧