Function CountingSort

assets/js/bucketsort.js:117–246

(delay = 250)

// Asynchronous CountingSort function
async function CountingSort(delay = 250) {
var blocks = document.querySelectorAll(".block");

var block1 = 0,
	block2 = 0,
	block3 = 0,
	block4 = 0;

// CountingSort Algorithm
for (var i = 0; i < blocks.length; i += 1) {
	blocks[i].style.backgroundColor = "#FF4949";
	var value =
	Number(blocks[i].childNodes[0].innerHTML);

	// Creating element div
	var array_ele = document.createElement("div");

	// Adding style to div
	array_ele.style.height = `${value * 11}px`;

	// Creating label element for displaying
	// size of particular block
	var array_ele_label = document.createElement("label");
	array_ele_label.classList.add("block_id");
	array_ele_label.innerText = value;

	array_ele.appendChild(array_ele_label);

	// Addding block to first bucket
	if (value >= 1 && value <= 5) {
	array_ele.classList.add("firstbucket");
	var container = document.getElementById("one");
	array_ele.style.transform =
	`translate(${block1 * 30}px)`;
	container.appendChild(array_ele);
	block1++;
	}

	// Addding block to second bucket
	if (value >= 6 && value <= 10) {
	array_ele.classList.add("secondbucket");
	var container = document.getElementById("two");
	array_ele.style.transform =
	`translate(${block2 * 30}px)`;
	container.appendChild(array_ele);
	block2++;
	}

	// Addding block to third bucket
	if (value >= 11 && value <= 15) {
	array_ele.classList.add("thirdbucket");
	var container = document.getElementById("three");
	array_ele.style.transform = `translate(${block3 * 30}px)`;
	container.appendChild(array_ele);
	block3++;
	}

	// Addding block to fourth bucket