From 2ad497083e648f1281fb49789e129a23a54a01ff Mon Sep 17 00:00:00 2001
From: RezHackXYZ <rhythmupa@gmail.com>
Date: Sun, 4 May 2025 10:31:40 +0530
Subject: [PATCH] aded bases ui for selector of tools

---
 package-lock.json                      | 20 ++++++++++++++++++++
 package.json                           |  1 +
 src/SelectionMenue/TypeSelector.svelte |  1 +
 src/app.svelte                         | 26 +++++++++-----------------
 src/wordle/game.svelte                 | 16 ++++++++++++++--
 src/wordle/logic.svelte.js             |  2 +-
 6 files changed, 46 insertions(+), 20 deletions(-)
 create mode 100644 src/SelectionMenue/TypeSelector.svelte

diff --git a/package-lock.json b/package-lock.json
index cb21bc6..64c0d21 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,6 +10,7 @@
 			"dependencies": {
 				"chart.js": "^4.4.9",
 				"random-words": "^2.0.1",
+				"svelte-spa-router": "^4.0.1",
 				"word-exists": "^1.0.0"
 			},
 			"devDependencies": {
@@ -1057,6 +1058,14 @@
 				"seedrandom": "^3.0.5"
 			}
 		},
+		"node_modules/regexparam": {
+			"version": "2.0.2",
+			"resolved": "https://registry.npmjs.org/regexparam/-/regexparam-2.0.2.tgz",
+			"integrity": "sha512-A1PeDEYMrkLrfyOwv2jwihXbo9qxdGD3atBYQA9JJgreAx8/7rC6IUkWOw2NQlOxLp2wL0ifQbh1HuidDfYA6w==",
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/rollup": {
 			"version": "4.35.0",
 			"resolved": "https://registry.npmjs.org/rollup/-/rollup-4.35.0.tgz",
@@ -1134,6 +1143,17 @@
 				"node": ">=18"
 			}
 		},
+		"node_modules/svelte-spa-router": {
+			"version": "4.0.1",
+			"resolved": "https://registry.npmjs.org/svelte-spa-router/-/svelte-spa-router-4.0.1.tgz",
+			"integrity": "sha512-2JkmUQ2f9jRluijL58LtdQBIpynSbem2eBGp4zXdi7aDY1znbR6yjw0KsonD0aq2QLwf4Yx4tBJQjxIjgjXHKg==",
+			"dependencies": {
+				"regexparam": "2.0.2"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/ItalyPaleAle"
+			}
+		},
 		"node_modules/tinyglobby": {
 			"version": "0.2.13",
 			"resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.13.tgz",
diff --git a/package.json b/package.json
index e774dd6..cc58dcf 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
 	"dependencies": {
 		"chart.js": "^4.4.9",
 		"random-words": "^2.0.1",
+		"svelte-spa-router": "^4.0.1",
 		"word-exists": "^1.0.0"
 	}
 }
diff --git a/src/SelectionMenue/TypeSelector.svelte b/src/SelectionMenue/TypeSelector.svelte
new file mode 100644
index 0000000..14948e3
--- /dev/null
+++ b/src/SelectionMenue/TypeSelector.svelte
@@ -0,0 +1 @@
+<a href="#/Wordle">Wordle</a>
diff --git a/src/app.svelte b/src/app.svelte
index 6e6427e..8cdbe76 100644
--- a/src/app.svelte
+++ b/src/app.svelte
@@ -1,10 +1,16 @@
 <script>
-	import Game from "./wordle/game.svelte";
+	import Router from "svelte-spa-router";
+	import Wordle from "./wordle/game.svelte";
+	import TypeSelector from "./SelectionMenue/TypeSelector.svelte";
+
+	let routes = {
+		"/": TypeSelector,
+		"/Wordle": Wordle,
+	};
 </script>
 
 <div id="root">
-	<h1>CLASSROOM WORDLE <span>~made by Rhythm Upadhyay of 7th A</span></h1>
-	<Game />
+	<Router {routes} />
 </div>
 
 <style>
@@ -15,21 +21,7 @@
 
 	#root {
 		height: 100%;
-		display: flex;
-		flex-direction: column;
 		margin: 0;
 		font-family: "Sour Gummy", sans-serif;
 	}
-
-	h1 {
-		text-align: center;
-		margin: 5px 0px;
-		text-decoration: underline #444;
-	}
-
-	span {
-		font-size: 0.5em;
-		text-decoration: none;
-		color: #444;
-	}
 </style>
diff --git a/src/wordle/game.svelte b/src/wordle/game.svelte
index 2d788dd..a350fe0 100644
--- a/src/wordle/game.svelte
+++ b/src/wordle/game.svelte
@@ -10,17 +10,18 @@
 	});
 </script>
 
+<h1>CLASSROOM WORDLE <span>~made by Rhythm Upadhyay of 7th A</span></h1>
 <div id="root">
 	<div id="left">
 		<Display />
 		<Keyboard />
 	</div>
-    <Right />
+	<Right />
 </div>
 
 <style>
 	#root {
-        height: 90%;
+		height: 90%;
 		display: flex;
 		margin: 0;
 		font-family: "Sour Gummy", sans-serif;
@@ -37,4 +38,15 @@
 		border: 2px solid #444;
 		font-family: "JetBrains Mono", monospace;
 	}
+	h1 {
+		text-align: center;
+		margin: 5px 0px;
+		text-decoration: underline #444;
+	}
+
+	span {
+		font-size: 0.5em;
+		text-decoration: none;
+		color: #444;
+	}
 </style>
diff --git a/src/wordle/logic.svelte.js b/src/wordle/logic.svelte.js
index b40aa7f..96e3801 100644
--- a/src/wordle/logic.svelte.js
+++ b/src/wordle/logic.svelte.js
@@ -210,7 +210,7 @@ export let data = $state({
 
 let WordleGamesData = localStorage.getItem("WordleGamesData") || "";
 
-if (WordleGamesData == "") {
+if (WordleGamesData != "") {
 	data.value = JSON.parse(WordleGamesData);
 } else {
 	data.value = {