Skip to content

Commit 4dc11dc

Browse files
Sohan-RoutSohan-Rout
authored
chore : added new og images
Merge pull request #20 from Sohan-Rout/main1
2 parents 9cc02bb + 0cff6ff commit 4dc11dc

File tree

12 files changed

+79
-76
lines changed

12 files changed

+79
-76
lines changed

‎app/visualizer/searching/binarysearch/page.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export const metadata = {
5656
export default function Page() {
5757
const paths = [
5858
{ name: "Home", href: "/" },
59-
{ name: "Visulaizer", href: "/visualizer" },
59+
{ name: "Visualizer", href: "/visualizer" },
6060
{ name: "Binary Search", href: "" },
6161
];
6262

‎app/visualizer/searching/linearsearch/page.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ export const metadata = {
5656
export default function Page() {
5757
const paths = [
5858
{ name: "Home", href: "/" },
59-
{ name: "Visulaizer", href: "/visualizer" },
59+
{ name: "Visualizer", href: "/visualizer" },
6060
{ name: "Linear Search", href: "" },
6161
];
6262

‎app/visualizer/sorting/bubblesort/page.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ export const metadata = {
4040
openGraph: {
4141
images: [
4242
{
43-
url: "/og/bubbleSort.png",
43+
url: "/og/sorting/bubbleSort.png",
4444
width: 1200,
4545
height: 630,
4646
alt: "Bubble Sort Algorithm Visualization",
@@ -52,7 +52,7 @@ export const metadata = {
5252
export default function Page() {
5353
const paths = [
5454
{ name: "Home", href: "/" },
55-
{ name: "Visulaizer", href: "/visualizer" },
55+
{ name: "Visualizer", href: "/visualizer" },
5656
{ name: "Bubble Sort", href: "" },
5757
];
5858

‎app/visualizer/sorting/insertionsort/page.jsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ export const metadata = {
5252
export default function Page() {
5353
const paths = [
5454
{ name: "Home", href: "/" },
55-
{ name: "Visulaizer", href: "/visualizer" },
55+
{ name: "Visualizer", href: "/visualizer" },
5656
{ name: "Insertion Sort", href: "" },
5757
];
5858

‎app/visualizer/sorting/mergesort/content.jsx‎

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,8 +43,30 @@ const content = () => {
4343
];
4444

4545
return (
46-
<main className="max-w-4xl mx-auto">
47-
<article className="bg-white dark:bg-gray-800 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden mb-8">
46+
<main className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-5 md:gap-4">
47+
<div className="col-span-1">
48+
<div className="hidden md:block">
49+
<iframe
50+
src="https://hw.glich.co/resources/embed/daily/dsa"
51+
width="100%"
52+
height="400"
53+
title="Daily DSA Challenge"
54+
></iframe>
55+
</div>
56+
<div className="flex justify-center">
57+
<span className="text-xs hidden md:block">
58+
Powered by{" "}
59+
<a
60+
href="https://hw.glich.co/resources/daily"
61+
target="_blank"
62+
className="underline hover:text-blue-500 duration-300"
63+
>
64+
Hello World
65+
</a>
66+
</span>
67+
</div>
68+
</div>
69+
<article className="col-span-4 max-w-4xl bg-white dark:bg-neutral-950 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden mb-8">
4870
{/* What is Merge Sort */}
4971
<section className="p-6 border-b border-gray-100 dark:border-gray-700">
5072
<h1 className="text-2xl font-bold text-gray-900 dark:text-white mb-4 flex items-center">

‎app/visualizer/sorting/selectionsort/content.jsx‎

Lines changed: 34 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -73,8 +73,30 @@ const content = () => {
7373
];
7474

7575
return (
76-
<main className="max-w-4xl mx-auto">
77-
<article className="bg-white dark:bg-neutral-950 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden mb-8">
76+
<main className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-5 md:gap-4">
77+
<div className="col-span-1">
78+
<div className="hidden md:block">
79+
<iframe
80+
src="https://hw.glich.co/resources/embed/daily/dsa"
81+
width="100%"
82+
height="400"
83+
title="Daily DSA Challenge"
84+
></iframe>
85+
</div>
86+
<div className="flex justify-center">
87+
<span className="text-xs hidden md:block">
88+
Powered by{" "}
89+
<a
90+
href="https://hw.glich.co/resources/daily"
91+
target="_blank"
92+
className="underline hover:text-blue-500 duration-300"
93+
>
94+
Hello World
95+
</a>
96+
</span>
97+
</div>
98+
</div>
99+
<article className="col-span-4 max-w-4xl bg-white dark:bg-neutral-950 rounded-xl shadow-sm border border-gray-200 dark:border-gray-700 overflow-hidden mb-8">
78100
{/* What is Selection Sort */}
79101
<section className="p-6 border-b border-gray-100 dark:border-gray-700">
80102
<h1 className="text-2xl font-bold text-gray-900 dark:text-white mb-4 flex items-center">
@@ -172,9 +194,7 @@ const content = () => {
172194
<span className="font-mono bg-gray-100 dark:bg-gray-700 px-2 py-1 rounded text-sm">
173195
{items.points}
174196
</span>
175-
<span className="ml-2">
176-
{items.subpoints}
177-
</span>
197+
<span className="ml-2">{items.subpoints}</span>
178198
</li>
179199
))}
180200
</ul>
@@ -184,13 +204,13 @@ const content = () => {
184204
</p>
185205

186206
<div className="mt-8">
187-
<ComplexityGraph
188-
bestCase={(n) => n*n}
189-
averageCase={(n) => n*n}
190-
worstCase={(n) => n*n}
191-
maxN={25}
192-
/>
193-
</div>
207+
<ComplexityGraph
208+
bestCase={(n) => n * n}
209+
averageCase={(n) => n * n}
210+
worstCase={(n) => n * n}
211+
maxN={25}
212+
/>
213+
</div>
194214
</div>
195215
</section>
196216

@@ -250,7 +270,7 @@ const content = () => {
250270
{/* Additional Info */}
251271
<section className="p-6">
252272
<div className="prose dark:prose-invert max-w-none">
253-
<div className="p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
273+
<div className="px-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800">
254274
<p className="text-gray-700 dark:text-gray-300 leading-relaxed">
255275
{paragraph[3]}
256276
</p>
@@ -262,4 +282,4 @@ const content = () => {
262282
);
263283
};
264284

265-
export default content;
285+
export default content;

‎app/visualizer/sorting/selectionsort/page.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export const metadata = {
3636
openGraph: {
3737
images: [
3838
{
39-
url: "/og/selectionSort.png",
39+
url: "/og/sorting/selectionSort.png",
4040
width: 1200,
4141
height: 630,
4242
alt: "Selection Sort Algorithm Visualization",
@@ -60,7 +60,7 @@ export default function Page() {
6060

6161
<div className="py-20 bg-gray-100 dark:bg-neutral-900 text-gray-800 dark:text-gray-200">
6262
<section className="px-6 md:px-12">
63-
<div className="mt-10 sm:mt-10">
63+
<div className="mt-10 sm:mt-10 mb-4">
6464
<Breadcrumbs paths={paths} />
6565
</div>
6666

@@ -84,14 +84,14 @@ export default function Page() {
8484
<Animation />
8585
</section>
8686

87-
<section>
87+
<section className="px-6">
8888
<p className="text-lg text-center text-gray-600 dark:text-gray-400 mb-2">
8989
Test Your Knowledge before moving forward!
9090
</p>
9191
<Quiz />
9292
</section>
9393

94-
<section>
94+
<section className="px-6">
9595
<Code />
9696
</section>
9797

@@ -104,7 +104,7 @@ export default function Page() {
104104
/>
105105
</section>
106106

107-
<section>
107+
<section className="px-6">
108108
<ExploreOther
109109
title="Explore Sorting Algorithms"
110110
links={[

‎app/visualizer/sorting/selectionsort/quiz.jsx‎

Lines changed: 11 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -88,39 +88,30 @@ const SelectionSortQuiz = () => {
8888
const [selectedAnswer, setSelectedAnswer] = useState(null);
8989
const [score, setScore] = useState(0);
9090
const [showResult, setShowResult] = useState(false);
91-
const [setQuizCompleted] = useState(false);
91+
const [quizCompleted, setQuizCompleted] = useState(false);
9292
const [answers, setAnswers] = useState(Array(questions.length).fill(null));
93-
const [showExplanation, setShowExplanation] = useState(false);
9493
const [showIntro, setShowIntro] = useState(true);
9594
const [showSuccessAnimation, setShowSuccessAnimation] = useState(false);
96-
const [penaltyApplied, setPenaltyApplied] = useState(false);
9795

9896
const handleAnswerSelect = (optionIndex) => {
99-
if (selectedAnswer !== null) return;
10097
setSelectedAnswer(optionIndex);
101-
const newAnswers = [...answers];
102-
newAnswers[currentQuestion] = optionIndex;
103-
setAnswers(newAnswers);
10498
};
10599

106100
const handleNextQuestion = () => {
107101
if (selectedAnswer === null) return;
108-
109-
if (showExplanation && !penaltyApplied) {
110-
setScore(prevScore => Math.max(0, prevScore - 0.5));
111-
setPenaltyApplied(true);
112-
}
113102

114-
if (selectedAnswer === questions[currentQuestion].correctAnswer) {
115-
setScore(score + 1);
116-
}
117-
118-
setShowExplanation(false);
119-
setPenaltyApplied(false);
120-
103+
const newAnswers = [...answers];
104+
newAnswers[currentQuestion] = selectedAnswer;
105+
setAnswers(newAnswers);
106+
107+
const newScore = newAnswers.reduce((acc, ans, idx) => {
108+
return ans === questions[idx].correctAnswer ? acc + 1 : acc;
109+
}, 0);
110+
setScore(newScore);
111+
121112
if (currentQuestion < questions.length - 1) {
122113
setCurrentQuestion(currentQuestion + 1);
123-
setSelectedAnswer(null);
114+
setSelectedAnswer(newAnswers[currentQuestion + 1]);
124115
} else {
125116
setShowSuccessAnimation(true);
126117
setTimeout(() => {
@@ -132,7 +123,6 @@ const SelectionSortQuiz = () => {
132123
};
133124

134125
const handlePreviousQuestion = () => {
135-
setShowExplanation(false);
136126
setCurrentQuestion(currentQuestion - 1);
137127
setSelectedAnswer(answers[currentQuestion - 1]);
138128
};
@@ -144,9 +134,7 @@ const SelectionSortQuiz = () => {
144134
setShowResult(false);
145135
setQuizCompleted(false);
146136
setAnswers(Array(questions.length).fill(null));
147-
setShowExplanation(false);
148137
setShowIntro(true);
149-
setPenaltyApplied(false);
150138
};
151139

152140
const calculateWeakAreas = () => {
@@ -220,10 +208,6 @@ const SelectionSortQuiz = () => {
220208
<FaTimes className="text-blue-500 mt-1 mr-2 flex-shrink-0" />
221209
<span>0 points for wrong answers</span>
222210
</li>
223-
<li className="flex items-start">
224-
<FaInfoCircle className="text-blue-500 mt-1 mr-2 flex-shrink-0" />
225-
<span>-0.5 point penalty for viewing explanations</span>
226-
</li>
227211
<li className="flex items-start">
228212
<FaTrophy className="text-blue-500 mt-1 mr-2 flex-shrink-0" />
229213
<span>Earn stars based on your final score (max 5 stars)</span>
@@ -325,29 +309,6 @@ const SelectionSortQuiz = () => {
325309
))}
326310
</div>
327311

328-
{selectedAnswer !== null && (
329-
<div className="mb-6">
330-
<button
331-
onClick={() => setShowExplanation(!showExplanation)}
332-
className="text-sm flex items-center text-blue-600 dark:text-blue-400 hover:underline mb-2"
333-
>
334-
<FaInfoCircle className="mr-1" />
335-
{showExplanation ? "Hide Explanation" : "Show Explanation"}
336-
</button>
337-
<AnimatePresence>
338-
{showExplanation && (
339-
<motion.div
340-
initial={{ opacity: 0, height: 0 }}
341-
animate={{ opacity: 1, height: "auto" }}
342-
exit={{ opacity: 0, height: 0 }}
343-
className="p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg text-sm overflow-hidden"
344-
>
345-
{questions[currentQuestion].explanation}
346-
</motion.div>
347-
)}
348-
</AnimatePresence>
349-
</div>
350-
)}
351312
</motion.div>
352313

353314
<div className="flex justify-between">

‎public/og/bubbleSort.png‎

-86.8 KB
Binary file not shown.

‎public/og/selectionSort.png‎

-144 KB
Binary file not shown.

0 commit comments

Comments
 (0)