Skip to content

Commit 2c11718

Browse files
authored
Merge pull request #1 from nouman1741/main
Add support for different type of arrays
2 parents 8b54466 + e36fca2 commit 2c11718

File tree

7 files changed

+63
-16
lines changed

7 files changed

+63
-16
lines changed

bubble.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,9 @@ const bubbleSort = async function () {
3232
}
3333
barsEl.children[sz - i - 1].style.backgroundColor = "green";
3434
}
35-
document.getElementById("new-array").classList.remove("disabled");
35+
document.getElementById("random-array").classList.remove("disabled");
36+
document.getElementById("reversed-array").classList.remove("disabled");
37+
document.getElementById("sorted-array").classList.remove("disabled");
3638
document.getElementById("size").classList.remove("disabled");
3739
document.getElementById("bubble").classList.toggle("active-btn");
3840
};

index.html

+13-3
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ <h1 class="h1" style="color: #183024;">Rotate Your Phone </h1>
3737
<input
3838
type="range"
3939
min="10"
40-
max="200"
40+
max="100"
4141
value="20"
4242
step="10"
4343
name="size"
@@ -64,8 +64,18 @@ <h1 class="h1" style="color: #183024;">Rotate Your Phone </h1>
6464
<label for="speed" style="color: #395144;">Speed</label>
6565
</div>
6666
<div>
67-
<button class="btn btn-sm btn-clr" id="new-array" type="button">
68-
New Array
67+
<button class="btn btn-sm btn-clr" id="random-array" type="button">
68+
Random Array
69+
</button>
70+
</div>
71+
<div>
72+
<button class="btn btn-sm btn-clr" id="reversed-array" type="button">
73+
Reversed Array
74+
</button>
75+
</div>
76+
<div>
77+
<button class="btn btn-sm btn-clr" id="sorted-array" type="button">
78+
Sorted Array
6979
</button>
7080
</div>
7181
<div>

insertion.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,9 @@ const insertionSort = async function () {
3636
barsEl.children[j + 1].style.backgroundColor = "green";
3737
barsEl.children[i].style.removeProperty("border-color");
3838
}
39-
document.getElementById("new-array").classList.remove("disabled");
39+
document.getElementById("random-array").classList.remove("disabled");
40+
document.getElementById("reversed-array").classList.remove("disabled");
41+
document.getElementById("sorted-array").classList.remove("disabled");
4042
document.getElementById("size").classList.remove("disabled");
4143
document.getElementById("insertion").classList.toggle("active-btn");
4244
};

merge.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,9 @@ const mergeSort = async function () {
8282
const sz = Number(barsEl.childElementCount);
8383

8484
await mergeS(0, Number(sz - 1)).then(() => doGreen(sz));
85-
document.getElementById("new-array").classList.remove("disabled");
85+
document.getElementById("random-array").classList.remove("disabled");
86+
document.getElementById("reversed-array").classList.remove("disabled");
87+
document.getElementById("sorted-array").classList.remove("disabled");
8688
document.getElementById("size").classList.remove("disabled");
8789
document.getElementById("merge").classList.toggle("active-btn");
8890
};

quick.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,9 @@ const quickSort = async function () {
9090
const sz = Number(barsEl.childElementCount);
9191

9292
await quickS(0, Number(sz - 1)).then(() => doGreen(sz));
93-
document.getElementById("new-array").classList.remove("disabled");
93+
document.getElementById("random-array").classList.remove("disabled");
94+
document.getElementById("reversed-array").classList.remove("disabled");
95+
document.getElementById("sorted-array").classList.remove("disabled");
9496
document.getElementById("size").classList.remove("disabled");
9597
document.getElementById("quick").classList.toggle("active-btn");
9698
};

selection.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,9 @@ const selectionSort = async function () {
6666
);
6767
barsEl.children[mxInd].style.borderColor = barDefaultBorderColor;
6868
}
69-
document.getElementById("new-array").classList.remove("disabled");
69+
document.getElementById("random-array").classList.remove("disabled");
70+
document.getElementById("reversed-array").classList.remove("disabled");
71+
document.getElementById("sorted-array").classList.remove("disabled");
7072
document.getElementById("size").classList.remove("disabled");
7173
document.getElementById("selection").classList.toggle("active-btn");
7274
};

sorting.js

+35-8
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
const barsEl = document.getElementById("bars");
44
const sizeSlider = document.getElementById("size");
55
// const barsRect = barsEl.getBoundingClientRect();
6-
const btnNewArray = document.getElementById("new-array");
6+
const btnRandomArray = document.getElementById("random-array");
7+
const btnReversedArray = document.getElementById("reversed-array");
8+
const btnSortedArray = document.getElementById("sorted-array");
79
const btnReload = document.getElementById("reload");
810
// const barsWidth = barsRect.width;
911
// const barsHeight = barsRect.height;
@@ -13,14 +15,33 @@ const barsHeight = barsEl.offsetHeight;
1315
barsEl.innerHTML = "";
1416
let bars = [];
1517

16-
const newArray = function () {
17-
tempEnable();
18-
barsEl.innerHTML = "";
18+
const sortedArray = function () {
1919
bars = [];
20+
for (let i = 1; i <= sizeSlider.value; ++i) {
21+
bars.push(i);
22+
}
23+
plantArray()
24+
}
25+
26+
const reversedArray = function () {
27+
bars = [];
28+
for (let i = sizeSlider.value; i > 0; --i) {
29+
bars.push(i);
30+
}
31+
plantArray()
32+
}
2033

21-
for (let i = 0; i < Number(sizeSlider.value); ++i)
34+
const randomArray = function () {
35+
bars = [];
36+
for (let i = 0; i < Number(sizeSlider.value); ++i) {
2237
bars.push(Math.floor(Math.random() * 99) + 1);
38+
}
39+
plantArray()
40+
}
2341

42+
const plantArray = function () {
43+
tempEnable();
44+
barsEl.innerHTML = "";
2445
const newWidth = (Number(barsWidth) * 0.96) / Number(sizeSlider.value);
2546

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

6788
const tempDisable = function () {
68-
document.getElementById("new-array").classList.add("disabled");
89+
document.getElementById("random-array").classList.add("disabled");
90+
document.getElementById("reversed-array").classList.add("disabled");
91+
document.getElementById("sorted-array").classList.add("disabled");
6992
document.getElementById("size").classList.add("disabled");
7093
document.getElementById("bubble").classList.add("disabled");
7194
document.getElementById("merge").classList.add("disabled");
@@ -75,7 +98,9 @@ const tempDisable = function () {
7598
};
7699

77100
const tempEnable = function () {
78-
document.getElementById("new-array").classList.remove("disabled");
101+
document.getElementById("random-array").classList.remove("disabled");
102+
document.getElementById("reversed-array").classList.remove("disabled");
103+
document.getElementById("sorted-array").classList.remove("disabled");
79104
document.getElementById("size").classList.remove("disabled");
80105
document.getElementById("bubble").classList.remove("disabled");
81106
document.getElementById("merge").classList.remove("disabled");
@@ -84,5 +109,7 @@ const tempEnable = function () {
84109
document.getElementById("selection").classList.remove("disabled");
85110
};
86111

87-
btnNewArray.addEventListener("click", newArray);
112+
btnRandomArray.addEventListener("click", randomArray);
113+
btnReversedArray.addEventListener("click", reversedArray);
114+
btnSortedArray.addEventListener("click", sortedArray);
88115
btnReload.addEventListener("click", () => location.reload());

0 commit comments

Comments
 (0)