Skip to content

Commit 4c45c1f

Browse files
SyedaRaviaEjazSyedaRaviaEjaz
authored
Add files via upload
1 parent 28e546e commit 4c45c1f

34 files changed

+3760
-0
lines changed

‎Codes/742.js

+209
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,209 @@
1+
// insertion sort
2+
const container = document.querySelector(".data-container");
3+
function generatebars(num = 100) {
4+
for (let i = 0; i < num; i += 1) {
5+
const value = Math.ceil(Math.random() * 1000) + 1;
6+
7+
const bar = document.createElement("div");
8+
9+
bar.classList.add("bar");
10+
11+
bar.style.height = `${value / 2}px`;
12+
bar.style.transform = `translateX(${i * 30}px)`;
13+
14+
const barLabel = document.createElement("label");
15+
16+
barLabel.classList.add("bar__id");
17+
18+
barLabel.innerHTML = value;
19+
20+
bar.appendChild(barLabel);
21+
22+
container.appendChild(bar);
23+
}
24+
}
25+
async function InsertionSort(delay = 300) {
26+
var startTime = new Date().getTime();
27+
let bars = document.querySelectorAll(".bar");
28+
29+
bars[0].style.backgroundColor = " rgb(49, 226, 13)";
30+
for (var i = 1; i < bars.length; i += 1) {
31+
var j = i - 1;
32+
33+
var key = parseInt(bars[i].childNodes[0].innerHTML);
34+
35+
var height = bars[i].style.height;
36+
37+
var barval = document.getElementById("ele");
38+
39+
barval.innerHTML = `<h3>Element Selected is :${key}</h3>`;
40+
41+
bars[i].style.backgroundColor = "darkblue";
42+
43+
await new Promise((resolve) =>
44+
setTimeout(() => {
45+
resolve();
46+
}, 600)
47+
);
48+
49+
while (j >= 0 && parseInt(bars[j].childNodes[0].innerHTML) > key) {
50+
bars[j].style.backgroundColor = "darkblue";
51+
52+
bars[j + 1].style.height = bars[j].style.height;
53+
bars[j + 1].childNodes[0].innerText = bars[j].childNodes[0].innerText;
54+
55+
j = j - 1;
56+
57+
await new Promise((resolve) =>
58+
setTimeout(() => {
59+
resolve();
60+
}, 600)
61+
);
62+
63+
for (var k = i; k >= 0; k--) {
64+
bars[k].style.backgroundColor = " rgb(49, 226, 13)";
65+
}
66+
}
67+
68+
bars[j + 1].style.height = height;
69+
bars[j + 1].childNodes[0].innerHTML = key;
70+
71+
await new Promise((resolve) =>
72+
setTimeout(() => {
73+
resolve();
74+
}, 600)
75+
);
76+
77+
bars[i].style.backgroundColor = " rgb(49, 226, 13)";
78+
}
79+
80+
barval.innerHTML = "<h3>Sorted!!!</h3>";
81+
82+
document.getElementById("Button1").disabled = false;
83+
document.getElementById("Button1").style.backgroundColor = "#6f459e";
84+
85+
document.getElementById("Button2").disabled = false;
86+
document.getElementById("Button2").style.backgroundColor = "#6f459e";
87+
var endTime = new Date().getTime();
88+
window.alert("Press Ok to see the running Time in milliseconds");
89+
window.alert(endTime - startTime);
90+
}
91+
92+
generatebars();
93+
function generate() {
94+
window.location.reload();
95+
}
96+
97+
function disable() {
98+
document.getElementById("Button1").disabled = true;
99+
document.getElementById("Button1").style.backgroundColor = "#d8b6ff";
100+
101+
document.getElementById("Button2").disabled = true;
102+
document.getElementById("Button2").style.backgroundColor = "#d8b6ff";
103+
}
104+
// Partition function for quicksort
105+
var count_container = document.getElementById("count");
106+
function generate_idx() {
107+
for (var i = 0; i < 50; i++) {
108+
var array_ele2 = document.createElement("div");
109+
110+
array_ele2.classList.add("block2");
111+
112+
array_ele2.style.height = `${20}px`;
113+
array_ele2.style.transform = `translate(${i * 30}px)`;
114+
115+
var array_ele_label2 = document.createElement("label");
116+
array_ele_label2.classList.add("block_id3");
117+
array_ele_label2.innerText = i;
118+
119+
array_ele2.appendChild(array_ele_label2);
120+
count_container.appendChild(array_ele2);
121+
}
122+
}
123+
124+
async function quick(l, r, delay = 100) {
125+
var blocks = document.querySelectorAll(".block");
126+
127+
var pivot = Number(blocks[r].childNodes[0].innerHTML);
128+
var i = l - 1;
129+
blocks[r].style.backgroundColor = "red";
130+
document.getElementsByClassName("range")[0].innerText = `[${l},${r}]`;
131+
132+
for (var j = l; j <= r - 1; j++) {
133+
blocks[j].style.backgroundColor = "yellow";
134+
await new Promise((resolve) =>
135+
setTimeout(() => {
136+
resolve();
137+
}, delay)
138+
);
139+
var value = Number(blocks[j].childNodes[0].innerHTML);
140+
141+
if (value < pivot) {
142+
i++;
143+
var temp1 = blocks[i].style.height;
144+
var temp2 = blocks[i].childNodes[0].innerText;
145+
blocks[i].style.height = blocks[j].style.height;
146+
blocks[j].style.height = temp1;
147+
blocks[i].childNodes[0].innerText = blocks[j].childNodes[0].innerText;
148+
blocks[j].childNodes[0].innerText = temp2;
149+
blocks[i].style.backgroundColor = "orange";
150+
if (i != j) blocks[j].style.backgroundColor = "pink";
151+
await new Promise((resolve) =>
152+
setTimeout(() => {
153+
resolve();
154+
}, delay)
155+
);
156+
} else blocks[j].style.backgroundColor = "pink";
157+
}
158+
i++;
159+
var temp1 = blocks[i].style.height;
160+
var temp2 = blocks[i].childNodes[0].innerText;
161+
blocks[i].style.height = blocks[r].style.height;
162+
blocks[r].style.height = temp1;
163+
blocks[i].childNodes[0].innerText = blocks[r].childNodes[0].innerText;
164+
blocks[r].childNodes[0].innerText = temp2;
165+
blocks[r].style.backgroundColor = "pink";
166+
blocks[i].style.backgroundColor = "green";
167+
168+
await new Promise((resolve) =>
169+
setTimeout(() => {
170+
resolve();
171+
}, delay * 3)
172+
);
173+
document.getElementsByClassName("range")[0].innerText = "";
174+
for (var k = 0; k < 50; k++) blocks[k].style.backgroundColor = "#6b5b95";
175+
return i;
176+
}
177+
178+
async function QuickSort(l, r, delay = 100) {
179+
if (l < r) {
180+
var pivot_idx = await quick(l, r);
181+
await QuickSort(l, pivot_idx - 1);
182+
await QuickSort(pivot_idx + 1, r);
183+
}
184+
}
185+
// Hybrid function -> Quick + Insertion sort
186+
187+
async function hybrid_quick_sort(l, r, delay = 100) {
188+
if (l < r) {
189+
if (r - l + 1 < 10) {
190+
insertion_sort((delay = 100));
191+
}
192+
} else {
193+
var pivot_idx = await quick(l, r);
194+
if (pivot_idx - l < r - pivot_idx) {
195+
hybrid_quick_sort(r, l, (delay = 100));
196+
l = pivot_idx + 1;
197+
} else {
198+
hybrid_quick_sort(r, l, (delay = 100));
199+
r = pivot_idx - 1;
200+
}
201+
}
202+
}
203+
var startTime = new Date().getTime();
204+
generatearray();
205+
generate_idx();
206+
hybrid_quick_sort(0, 49, (delay = 100));
207+
var endTime = new Date().getTime();
208+
window.alert("Press Ok to see the running Time in milliseconds");
209+
window.alert(endTime - startTime);

‎Codes/Radix/index.html

+80
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,80 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<link rel="icon" type="image/x-icon" sizes="16x16" />
7+
<link
8+
rel="stylesheet"
9+
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
10+
/>
11+
<link rel="stylesheet" type="text/css" href="style.css" />
12+
<title>Radix Sort</title>
13+
</head>
14+
<body>
15+
<div class="nav">
16+
<p
17+
onclick="arraySizeSilder(document.getElementsByClassName('slider')[0].value)"
18+
>
19+
Generate New Array
20+
</p>
21+
22+
<p onclick="changeAlgorithm(4)" class="order active">RadixSort</p>
23+
</div>
24+
<button id="myBtn" style="font-size: larger; background-color: #6cc983;">Complexity</button>
25+
<div id="myModal" class="modal">
26+
<div class="modal-content">
27+
<span class="close">&times;</span>
28+
<p>Worst Case Time Complexity = O(N*K)</p>
29+
<p>Average Case Time Complexity = O(N*K)</p>
30+
<p>Best Case Time Complexity = O(N*K)</p>
31+
<p>Space Complexity = O(N+K)</p>
32+
</div>
33+
</div>
34+
<script>
35+
var modal = document.getElementById("myModal");
36+
var btn = document.getElementById("myBtn");
37+
var span = document.getElementsByClassName("close")[0];
38+
btn.onclick = function() {
39+
modal.style.display = "block";
40+
}
41+
span.onclick = function() {
42+
modal.style.display = "none";
43+
}
44+
window.onclick = function(event) {
45+
if (event.target == modal) {
46+
modal.style.display = "none";
47+
}
48+
}
49+
</script>
50+
<div class="content">
51+
<canvas id="can0" width="1080" height="520"></canvas>
52+
<p class="sizeNspeed">Size:</p>
53+
<input
54+
autocomplete="off"
55+
type="range"
56+
min="2"
57+
max="7"
58+
value="4"
59+
class="slider"
60+
oninput="arraySizeSilder(this.value)"
61+
/>
62+
<p onclick="turnOnOff(true)" class="btn" id="btn1">
63+
<i class="fa fa-play" id="playToggler"></i>
64+
</p>
65+
66+
<p class="sizeNspeed">Speed:</p>
67+
<input
68+
autocomplete="off"
69+
type="range"
70+
min="1"
71+
max="4"
72+
value="1"
73+
class="slider"
74+
oninput="frameRateSilder(this.value)"
75+
/>
76+
</div>
77+
<script src="script.js"></script>
78+
<script src="mainScript.js"></script>
79+
</body>
80+
</html>

0 commit comments

Comments
 (0)