Create ex.txt
Browse files
ex.txt
ADDED
@@ -0,0 +1,227 @@
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
1 |
+
import streamlit as st
|
2 |
+
import time
|
3 |
+
from PIL import Image
|
4 |
+
|
5 |
+
# Inject Custom CSS for Aesthetic Enhancements
|
6 |
+
def inject_custom_css():
|
7 |
+
st.markdown("""
|
8 |
+
<style>
|
9 |
+
/* Overall page styling */
|
10 |
+
body {
|
11 |
+
background-color: #f4f7fa;
|
12 |
+
font-family: 'Arial', sans-serif;
|
13 |
+
}
|
14 |
+
|
15 |
+
/* Sidebar styling */
|
16 |
+
.css-1d391kg {
|
17 |
+
background-color: #ffffff;
|
18 |
+
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
|
19 |
+
border-radius: 12px;
|
20 |
+
}
|
21 |
+
.css-1d391kg .sidebar-content {
|
22 |
+
padding: 2rem;
|
23 |
+
}
|
24 |
+
/* Title and Headers */
|
25 |
+
h1 {
|
26 |
+
font-size: 2.5rem;
|
27 |
+
color: #333333;
|
28 |
+
font-weight: 600;
|
29 |
+
}
|
30 |
+
h2, h3 {
|
31 |
+
color: #4c4c4c;
|
32 |
+
font-weight: 500;
|
33 |
+
}
|
34 |
+
|
35 |
+
/* Button styling */
|
36 |
+
.css-1emrehy {
|
37 |
+
background-color: #ff4c4c;
|
38 |
+
color: white;
|
39 |
+
padding: 10px 24px;
|
40 |
+
border-radius: 6px;
|
41 |
+
font-size: 1rem;
|
42 |
+
border: none;
|
43 |
+
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
|
44 |
+
cursor: pointer;
|
45 |
+
}
|
46 |
+
.css-1emrehy:hover {
|
47 |
+
background-color: #ff7b7b;
|
48 |
+
}
|
49 |
+
/* Text input styling */
|
50 |
+
.css-1bppn4z input {
|
51 |
+
border: 2px solid #ddd;
|
52 |
+
border-radius: 8px;
|
53 |
+
padding: 12px;
|
54 |
+
font-size: 1rem;
|
55 |
+
}
|
56 |
+
|
57 |
+
/* Code blocks (steps) */
|
58 |
+
pre {
|
59 |
+
background-color: #f4f4f4;
|
60 |
+
padding: 1rem;
|
61 |
+
border-radius: 8px;
|
62 |
+
font-family: 'Courier New', monospace;
|
63 |
+
color: #333333;
|
64 |
+
}
|
65 |
+
/* Image styling */
|
66 |
+
img {
|
67 |
+
border-radius: 8px;
|
68 |
+
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
|
69 |
+
}
|
70 |
+
|
71 |
+
</style>
|
72 |
+
""", unsafe_allow_html=True)
|
73 |
+
|
74 |
+
# Bubble Sort Algorithm with animation
|
75 |
+
def bubble_sort(arr):
|
76 |
+
steps = []
|
77 |
+
n = len(arr)
|
78 |
+
for i in range(n):
|
79 |
+
for j in range(0, n - i - 1):
|
80 |
+
if arr[j] > arr[j + 1]:
|
81 |
+
arr[j], arr[j + 1] = arr[j + 1], arr[j]
|
82 |
+
steps.append(list(arr)) # Record the state of the array after each step
|
83 |
+
return steps
|
84 |
+
|
85 |
+
# Insertion Sort Algorithm with animation
|
86 |
+
def insertion_sort(arr):
|
87 |
+
steps = []
|
88 |
+
for i in range(1, len(arr)):
|
89 |
+
key = arr[i]
|
90 |
+
j = i - 1
|
91 |
+
while j >= 0 and key < arr[j]:
|
92 |
+
arr[j + 1] = arr[j]
|
93 |
+
j -= 1
|
94 |
+
steps.append(list(arr)) # Record the state of the array after each step
|
95 |
+
arr[j + 1] = key
|
96 |
+
steps.append(list(arr)) # Record the state after inserting the key
|
97 |
+
return steps
|
98 |
+
|
99 |
+
# Selection Sort Algorithm with animation
|
100 |
+
def selection_sort(arr):
|
101 |
+
steps = []
|
102 |
+
n = len(arr)
|
103 |
+
for i in range(n):
|
104 |
+
min_index = i
|
105 |
+
for j in range(i + 1, n):
|
106 |
+
if arr[j] < arr[min_index]:
|
107 |
+
min_index = j
|
108 |
+
arr[i], arr[min_index] = arr[min_index], arr[i]
|
109 |
+
steps.append(list(arr)) # Record the state after each swap
|
110 |
+
return steps
|
111 |
+
|
112 |
+
# Function to handle animation in the streamlit app
|
113 |
+
def animate_sorting(steps):
|
114 |
+
for step in steps:
|
115 |
+
st.write(step)
|
116 |
+
time.sleep(0.5) # Adjust sleep time to control animation speed
|
117 |
+
|
118 |
+
# Streamlit App Interface
|
119 |
+
def main():
|
120 |
+
# Inject custom CSS for aesthetics
|
121 |
+
inject_custom_css()
|
122 |
+
|
123 |
+
# Sidebar with two options: "Try Simulation" and "Detailed Explanation"
|
124 |
+
st.sidebar.title("Sorting Algorithm Options")
|
125 |
+
option = st.sidebar.radio("Choose an option:", ("Detailed Explanation", "Try Simulation"))
|
126 |
+
|
127 |
+
# Sidebar image
|
128 |
+
st.sidebar.image("sort.png", use_container_width=True) # Replace with your image path
|
129 |
+
|
130 |
+
if option == "Try Simulation":
|
131 |
+
st.title("Sorting Algorithms Visualization")
|
132 |
+
|
133 |
+
# Input array from user
|
134 |
+
user_input = st.text_input("Enter a list of numbers (comma separated):", "64, 34, 25, 12, 22, 11, 90")
|
135 |
+
|
136 |
+
# Convert the input into a list of integers
|
137 |
+
if user_input:
|
138 |
+
try:
|
139 |
+
arr = [int(x) for x in user_input.split(',')]
|
140 |
+
except ValueError:
|
141 |
+
st.error("Please enter a valid list of integers.")
|
142 |
+
return
|
143 |
+
|
144 |
+
# Select the sorting algorithm
|
145 |
+
algorithm = st.selectbox("Select sorting algorithm:", ("Bubble Sort", "Insertion Sort", "Selection Sort"))
|
146 |
+
|
147 |
+
# Start the animation on button press
|
148 |
+
if st.button('Sort'):
|
149 |
+
steps = []
|
150 |
+
if algorithm == "Bubble Sort":
|
151 |
+
steps = bubble_sort(arr)
|
152 |
+
elif algorithm == "Insertion Sort":
|
153 |
+
steps = insertion_sort(arr)
|
154 |
+
elif algorithm == "Selection Sort":
|
155 |
+
steps = selection_sort(arr)
|
156 |
+
|
157 |
+
# Animate the sorting process
|
158 |
+
animate_sorting(steps)
|
159 |
+
|
160 |
+
# Display the final sorted array
|
161 |
+
st.write("Sorted Array:", arr)
|
162 |
+
|
163 |
+
elif option == "Detailed Explanation":
|
164 |
+
st.title("Detailed Explanation of Sorting Algorithms")
|
165 |
+
|
166 |
+
# Show explanations for each algorithm
|
167 |
+
algorithm = st.selectbox("Select an algorithm to see the explanation:",
|
168 |
+
("Bubble Sort", "Insertion Sort", "Selection Sort"))
|
169 |
+
|
170 |
+
if algorithm == "Bubble Sort":
|
171 |
+
st.subheader("Bubble Sort Explanation")
|
172 |
+
st.write("""
|
173 |
+
Bubble Sort is a simple sorting algorithm that works by repeatedly stepping through the list,
|
174 |
+
comparing adjacent elements and swapping them if they are in the wrong order. The pass through the
|
175 |
+
list is repeated until the list is sorted. It gets its name because the largest unsorted element
|
176 |
+
"bubbles" to its correct position in each pass.
|
177 |
+
""")
|
178 |
+
st.write("""
|
179 |
+
**Steps**:
|
180 |
+
1. Compare adjacent elements.
|
181 |
+
2. Swap them if they are in the wrong order.
|
182 |
+
3. Repeat this for each pair of adjacent elements in the array.
|
183 |
+
4. Continue until no more swaps are needed.
|
184 |
+
""")
|
185 |
+
|
186 |
+
image = Image.open("bubble-short.png") # Path to your image file
|
187 |
+
st.image(image, use_container_width=True)
|
188 |
+
|
189 |
+
elif algorithm == "Insertion Sort":
|
190 |
+
st.subheader("Insertion Sort Explanation")
|
191 |
+
st.write("""
|
192 |
+
Insertion Sort is a simple comparison-based algorithm. It builds the sorted array one item at a time.
|
193 |
+
It works by picking the next item from the unsorted part of the array and inserting it into its correct position
|
194 |
+
in the sorted part of the array. The process is repeated until the whole array is sorted.
|
195 |
+
""")
|
196 |
+
st.write("""
|
197 |
+
**Steps**:
|
198 |
+
1. Start with the second element.
|
199 |
+
2. Compare it with the elements before it, and move those elements one position to the right if necessary.
|
200 |
+
3. Insert the element at the correct position.
|
201 |
+
4. Continue this process until all elements are inserted in the correct order.
|
202 |
+
""")
|
203 |
+
|
204 |
+
image = Image.open("insertion-sort.png") # Path to your image file
|
205 |
+
st.image(image, use_container_width=True)
|
206 |
+
|
207 |
+
elif algorithm == "Selection Sort":
|
208 |
+
st.subheader("Selection Sort Explanation")
|
209 |
+
st.write("""
|
210 |
+
Selection Sort is a simple comparison-based algorithm that divides the array into two parts: the sorted part and
|
211 |
+
the unsorted part. In each pass, it selects the smallest (or largest, depending on the sorting order) element from
|
212 |
+
the unsorted part and swaps it with the first element of the unsorted part. This process is repeated until the array is sorted.
|
213 |
+
""")
|
214 |
+
st.write("""
|
215 |
+
**Steps**:
|
216 |
+
1. Find the smallest element in the unsorted part of the array.
|
217 |
+
2. Swap it with the first unsorted element.
|
218 |
+
3. Move the boundary of the sorted part one element forward.
|
219 |
+
4. Repeat this process for all elements.
|
220 |
+
""")
|
221 |
+
|
222 |
+
image = Image.open("selection-short.png") # Path to your image file
|
223 |
+
st.image(image, use_container_width=True)
|
224 |
+
|
225 |
+
# Run the app
|
226 |
+
if __name__ == "__main__":
|
227 |
+
main()
|