From c9ea9c9922ca327f8bdc494308d7485d836b1733 Mon Sep 17 00:00:00 2001
From: RezHackXYZ <rhythmupa@gmail.com>
Date: Tue, 10 Jun 2025 13:11:50 +0530
Subject: [PATCH] addded proper funtionalty of the flashcard app working, now
 you can slect if you know the awnser, if you dont then it will re ask you
 until you know all. its still bugy will work on more fetures and making it
 less bugy soon!

---
 src/routes/flashcards/+page.svelte           | 25 ++++--
 src/routes/flashcards/StatsAndButtons.svelte | 10 ++-
 src/routes/flashcards/logic.svelte.js        | 81 +++++++++++++++++++-
 3 files changed, 104 insertions(+), 12 deletions(-)

diff --git a/src/routes/flashcards/+page.svelte b/src/routes/flashcards/+page.svelte
index f63ee10..67f8d97 100644
--- a/src/routes/flashcards/+page.svelte
+++ b/src/routes/flashcards/+page.svelte
@@ -2,16 +2,25 @@
 	import Buttons from "./buttons.svelte";
 	import Card from "./card.svelte";
 	import StatsAndButtons from "./StatsAndButtons.svelte";
+
+	import { stats, resetDeck } from "./logic.svelte.js";
 </script>
 
 <div class="flex h-full flex-col overflow-hidden">
-	<div class="flex flex-1 flex-col items-center justify-center gap-5">
-		<div class="flex flex-col text-center gap-1"><Card /></div>
-		<div class="flex gap-4">
-			<Buttons />
+	{#if stats.isDeckEmpty}
+		<div class="flex flex-1 flex-col items-center justify-center gap-3">
+			<h1 class="text-4xl">Hey, You learned everything!</h1>
+			<button onclick={() => resetDeck()} class="big btn green">Reset Deck</button>
 		</div>
-	</div>
-	<div class="flex items-center justify-between p-2 text-gray-700">
-		<StatsAndButtons />
-	</div>
+	{:else}
+		<div class="flex flex-1 flex-col items-center justify-center gap-5">
+			<div class="flex flex-col gap-1 text-center"><Card /></div>
+			<div class="flex gap-4">
+				<Buttons />
+			</div>
+		</div>
+		<div class="flex items-center justify-between p-2 text-gray-700">
+			<StatsAndButtons />
+		</div>
+	{/if}
 </div>
diff --git a/src/routes/flashcards/StatsAndButtons.svelte b/src/routes/flashcards/StatsAndButtons.svelte
index 6cb69f0..63a3456 100644
--- a/src/routes/flashcards/StatsAndButtons.svelte
+++ b/src/routes/flashcards/StatsAndButtons.svelte
@@ -1,10 +1,14 @@
+<script>
+	import { stats} from "./logic.svelte.js";
+</script>
+
 <div class="invisible">
 	<button class="btn mini"> Reset Deck </button>
 </div>
 <div class="flex gap-5">
-	<span class="text-green-500"><i class="nf nf-md-check"></i>: 20</span>
-	<span class="text-red-500"><i class="nf nf-md-close"></i>: 20</span>
-	<span class="text-blue-500"><i class="nf nf-md-help"></i>: 20</span>
+	<span class="text-green-500"><i class="nf nf-md-check"></i>: {stats.AnswerKnown}</span>
+	<span class="text-red-500"><i class="nf nf-md-close"></i>: {stats.AnswerNotKnown}</span>
+	<span class="text-blue-500"><i class="nf nf-md-help"></i>: {stats.AnswerNotChecked}</span>
 </div>
 <div>
 	<button class="btn mini"> Reset Deck </button>
diff --git a/src/routes/flashcards/logic.svelte.js b/src/routes/flashcards/logic.svelte.js
index 0376367..daab9ce 100644
--- a/src/routes/flashcards/logic.svelte.js
+++ b/src/routes/flashcards/logic.svelte.js
@@ -1,4 +1,4 @@
-export let card = $state({ Q: "What is the capital of France?", a: "Paris" });
+export let card = $state({ Q: "", a: "" });
 
 export let statusOfCard = $state({
 	currentlyAnswered: false,
@@ -8,12 +8,80 @@ export let statusOfCard = $state({
 	entering: false,
 });
 
+let deck = [
+	{ Q: "Best programer in the world?", a: "RezHackXYZ" },
+	{ Q: "Best coding community?", a: "HackClub" },
+	{ Q: "Will @Shub go totally bankrupt?", a: "yes!" },
+];
+
+export let stats = $state({
+	isDeckEmpty: false,
+	AnswerKnown: 0,
+	AnswerNotKnown: 0,
+	AnswerNotChecked: deck.length,
+});
+
+let CurrentDeck = {
+	AnswersKnown: [],
+	AnswersNotKnown: [],
+	AnswersNotChecked: $state.snapshot(deck),
+};
+
+export function resetDeck() {
+	CurrentDeck.AnswersKnown = [];
+	CurrentDeck.AnswersNotKnown = [];
+	CurrentDeck.AnswersNotChecked = $state.snapshot(deck);
+	stats.AnswerKnown = 0;
+	stats.AnswerNotKnown = 0;
+	stats.AnswerNotChecked = deck.length;
+	stats.isDeckEmpty = false;
+	SetNewCard();
+}
+
+function SetNewCard() {
+	// Check if deck is complete
+	if (CurrentDeck.AnswersNotChecked.length === 0 && CurrentDeck.AnswersNotKnown.length === 0) {
+		stats.isDeckEmpty = true;
+		return;
+	}
+
+	let sourceArray;
+
+	// First go through unchecked cards, then cycle through unknown cards
+	if (CurrentDeck.AnswersNotChecked.length > 0) {
+		sourceArray = CurrentDeck.AnswersNotChecked;
+	} else {
+		sourceArray = CurrentDeck.AnswersNotKnown;
+	}
+
+	let randomIndex = Math.floor(Math.random() * sourceArray.length);
+	let selectedCard = sourceArray[randomIndex];
+
+	card.Q = selectedCard.Q;
+	card.a = selectedCard.a;
+
+	// Remove from source array
+	sourceArray.splice(randomIndex, 1);
+
+	// Update stats
+	updateStats();
+}
+
+function updateStats() {
+	stats.AnswerKnown = CurrentDeck.AnswersKnown.length;
+	stats.AnswerNotKnown = CurrentDeck.AnswersNotKnown.length;
+	stats.AnswerNotChecked = CurrentDeck.AnswersNotChecked.length;
+}
+
+SetNewCard();
+
 function AnimateCard() {
 	statusOfCard.exiting = true;
 
 	setTimeout(() => {
 		statusOfCard.exiting = false;
 		statusOfCard.entering = true;
+		SetNewCard();
 
 		setTimeout(() => {
 			statusOfCard.entering = false;
@@ -30,6 +98,17 @@ export function nextCard(side) {
 		return;
 	}
 
+	// Create a copy of current card before moving to next
+	let currentCard = { Q: card.Q, a: card.a };
+
+	if (side == "right") {
+		// User knows this card
+		CurrentDeck.AnswersKnown.push(currentCard);
+	} else {
+		// User doesn't know this card - add to unknown pile for re-asking
+		CurrentDeck.AnswersNotKnown.push(currentCard);
+	}
+
 	statusOfCard.currentlyAnswered = true;
 
 	if (side == "right") {