sketch.min.js

const canvasWidth=Math.min(600,window.innerWidth-100),canvasHeight=Math.min(250,window.innerHeight/5),numOfColors=50,sketchFrameRate=30,roundness=canvasWidth/1.5,arcThickness=3,backgroundColorRGB=20;let globalHues=new Array(50);const generateRainbowHues=e=>{for(let t=0;t<e.length;t++)e[t]=Math.ceil(310*Math.random()),e[t]>90&&e[t]<150&&(e[t]+=20)};generateRainbowHues(globalHues);const bubbleSketch=e=>{const t=[...globalHues];e.setup=()=>{e.createCanvas(canvasWidth,canvasHeight),e.frameRate(30)},e.draw=()=>{e.background(20),bubbleSort(t),drawRainbow(e,t)}},quickSketch=e=>{const t=[...globalHues];e.setup=()=>{e.createCanvas(canvasWidth,canvasHeight),e.frameRate(30)},e.draw=()=>{e.background(20),quickSort(t,0,t.length-1),drawRainbow(e,t)}},insertionSketch=e=>{const t=[...globalHues];e.setup=()=>{e.createCanvas(canvasWidth,canvasHeight),e.frameRate(30)},e.draw=()=>{e.background(20),insertionSort(t),drawRainbow(e,t)}},selectionSketch=e=>{const t=[...globalHues];e.setup=()=>{e.createCanvas(canvasWidth,canvasHeight),e.frameRate(30)},e.draw=()=>{e.background(20),selectionSort(t),drawRainbow(e,t)}},drawRainbow=(e,t)=>{for(let a=0;a<t.length;a++)e.strokeWeight(3),e.stroke(e.color(`hsl(${t[a]}, 90%, 60%)`)),e.translate(0,-.09),e.noFill(),e.arc(canvasWidth/2,canvasHeight+100,roundness+4*a,roundness+4*a,e.PI,0)},swap=async(e,t,a)=>{await sleep();let n=e[t];e[t]=e[a],e[a]=n},bubbleSort=async e=>{let t=0;if(t<e.length)for(let a=0;a<e.length-t-1;a++){e[a]<e[a+1]&&await swap(e,a,a+1)}else this.p.noLoop();t++},partition=async(e,t,a)=>{let n=e[Math.floor((a+t)/2)],o=t,r=a;for(;o<=r;){for(;e[o]>n;)o++;for(;e[r]<n;)r--;o<=r&&(await swap(e,o,r),o++,r--)}return o},sleep=async(e=20)=>new Promise((t=>setTimeout(t,e))),quickSort=async(e,t,a)=>{let n;return e.length>1&&(n=await partition(e,t,a),t<n-1&&await quickSort(e,t,n-1),n<a&&await quickSort(e,n,a)),e},insertionSort=async e=>{for(let t=1;t<e.length;t++){let a=e[t],n=t-1;for(;n>-1&&a>e[n];)await sleep(),e[n+1]=e[n],n--;e[n+1]=a}return e},selectionSort=async e=>{for(let t=0;t<e.length;t++){let a=t;for(let n=t+1;n<e.length;n++)e[n]>e[a]&&(a=n);a!=t&&await swap(e,t,a)}return e},bubbleSortSketch=new p5(bubbleSketch,"bubblesort-container"),insertionSortSketch=new p5(insertionSketch,"insertionsort-container"),quickSortSketch=new p5(quickSketch,"quicksort-container"),selectionSortSketch=new p5(selectionSketch,"selectionsort-container");