Skip to content

Add support for different type of arrays #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Aug 18, 2023
Merged

Add support for different type of arrays #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
72abf97
change new-array to random-array
nouman1741 Aug 15, 2023
2201be4
refactor: normalize generation of random array
nouman1741 Aug 15, 2023
d237710
fix: set slider limit to 100
nouman1741 Aug 15, 2023
01a7f47
feat: add reversed array
nouman1741 Aug 15, 2023
e36fca2
feat: support for already sorted arrays
nouman1741 Aug 15, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion bubble.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,9 @@ const bubbleSort = async function () {
}
barsEl.children[sz - i - 1].style.backgroundColor = "green";
}
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("bubble").classList.toggle("active-btn");
};
Expand Down
16 changes: 13 additions & 3 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ <h1 class="h1" style="color: #183024;">Rotate Your Phone </h1>
<input
type="range"
min="10"
max="200"
max="100"
value="20"
step="10"
name="size"
Expand All @@ -64,8 +64,18 @@ <h1 class="h1" style="color: #183024;">Rotate Your Phone </h1>
<label for="speed" style="color: #395144;">Speed</label>
</div>
<div>
<button class="btn btn-sm btn-clr" id="new-array" type="button">
New Array
<button class="btn btn-sm btn-clr" id="random-array" type="button">
Random Array
</button>
</div>
<div>
<button class="btn btn-sm btn-clr" id="reversed-array" type="button">
Reversed Array
</button>
</div>
<div>
<button class="btn btn-sm btn-clr" id="sorted-array" type="button">
Sorted Array
</button>
</div>
<div>
Expand Down
4 changes: 3 additions & 1 deletion insertion.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,9 @@ const insertionSort = async function () {
barsEl.children[j + 1].style.backgroundColor = "green";
barsEl.children[i].style.removeProperty("border-color");
}
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("insertion").classList.toggle("active-btn");
};
Expand Down
4 changes: 3 additions & 1 deletion merge.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,9 @@ const mergeSort = async function () {
const sz = Number(barsEl.childElementCount);

await mergeS(0, Number(sz - 1)).then(() => doGreen(sz));
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("merge").classList.toggle("active-btn");
};
Expand Down
4 changes: 3 additions & 1 deletion quick.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,7 +90,9 @@ const quickSort = async function () {
const sz = Number(barsEl.childElementCount);

await quickS(0, Number(sz - 1)).then(() => doGreen(sz));
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("quick").classList.toggle("active-btn");
};
Expand Down
4 changes: 3 additions & 1 deletion selection.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,9 @@ const selectionSort = async function () {
);
barsEl.children[mxInd].style.borderColor = barDefaultBorderColor;
}
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("selection").classList.toggle("active-btn");
};
Expand Down
43 changes: 35 additions & 8 deletions sorting.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@
const barsEl = document.getElementById("bars");
const sizeSlider = document.getElementById("size");
// const barsRect = barsEl.getBoundingClientRect();
const btnNewArray = document.getElementById("new-array");
const btnRandomArray = document.getElementById("random-array");
const btnReversedArray = document.getElementById("reversed-array");
const btnSortedArray = document.getElementById("sorted-array");
const btnReload = document.getElementById("reload");
// const barsWidth = barsRect.width;
// const barsHeight = barsRect.height;
Expand All @@ -13,14 +15,33 @@ const barsHeight = barsEl.offsetHeight;
barsEl.innerHTML = "";
let bars = [];

const newArray = function () {
tempEnable();
barsEl.innerHTML = "";
const sortedArray = function () {
bars = [];
for (let i = 1; i <= sizeSlider.value; ++i) {
bars.push(i);
}
plantArray()
}

const reversedArray = function () {
bars = [];
for (let i = sizeSlider.value; i > 0; --i) {
bars.push(i);
}
plantArray()
}

for (let i = 0; i < Number(sizeSlider.value); ++i)
const randomArray = function () {
bars = [];
for (let i = 0; i < Number(sizeSlider.value); ++i) {
bars.push(Math.floor(Math.random() * 99) + 1);
}
plantArray()
}

const plantArray = function () {
tempEnable();
barsEl.innerHTML = "";
const newWidth = (Number(barsWidth) * 0.96) / Number(sizeSlider.value);

for (let i = 0; i < Number(sizeSlider.value); ++i) {
Expand Down Expand Up @@ -65,7 +86,9 @@ const swap = function (bar1, bar2) {
};

const tempDisable = function () {
document.getElementById("new-array").classList.add("disabled");
document.getElementById("random-array").classList.add("disabled");
document.getElementById("reversed-array").classList.add("disabled");
document.getElementById("sorted-array").classList.add("disabled");
document.getElementById("size").classList.add("disabled");
document.getElementById("bubble").classList.add("disabled");
document.getElementById("merge").classList.add("disabled");
Expand All @@ -75,7 +98,9 @@ const tempDisable = function () {
};

const tempEnable = function () {
document.getElementById("new-array").classList.remove("disabled");
document.getElementById("random-array").classList.remove("disabled");
document.getElementById("reversed-array").classList.remove("disabled");
document.getElementById("sorted-array").classList.remove("disabled");
document.getElementById("size").classList.remove("disabled");
document.getElementById("bubble").classList.remove("disabled");
document.getElementById("merge").classList.remove("disabled");
Expand All @@ -84,5 +109,7 @@ const tempEnable = function () {
document.getElementById("selection").classList.remove("disabled");
};

btnNewArray.addEventListener("click", newArray);
btnRandomArray.addEventListener("click", randomArray);
btnReversedArray.addEventListener("click", reversedArray);
btnSortedArray.addEventListener("click", sortedArray);
btnReload.addEventListener("click", () => location.reload());