change submission api url for staging and staging url

.gitignore

@@ -19,3 +19,5 @@ pnpm-debug.log*
 # macOS-specific files
 .DS_Store
 dist.zip
+
+/public/config.js

public/config.js

@@ -0,0 +1,4 @@
+window.APP_CONFIG = {
+  PUBLIC_GAME_DU_API_URL: "https://game-du.teachertrainingkolkata.in",
+  siteName: "Interakto Games"
+};

public/saveGameAI.js

@@ -4,6 +4,7 @@
     const queryString = window.location.search;
     const urlParams = new URLSearchParams(queryString);
     const childId = urlParams.get('childId');
+    const schoolId = urlParams.get('schoolId');
     const gameVersion = urlParams.get('gameName');
     const gameId = urlParams.get('id');
     const spriteName = urlParams.get('spriteName');
@@ -216,7 +217,7 @@ function submitUserData(drawingZone) {
         };
         
         // First API call
-        fetch(`https://api.teachertrainingkolkata.in/api/aiEvaluateImageToStar`, {
+        fetch(`https://ai-image-api.cs1.hz.siliconpin.com/bs_drawing`, {
             method: 'POST',
             headers: {
                 'Content-Type': 'application/json'
@@ -230,9 +231,10 @@ function submitUserData(drawingZone) {
             return response.json();
         })
         .then(data => {
+            console.log('response from', data)
             setTimeout(() => {
                 if (data && data.message === "Game data saved successfully") {
-                    let starValue = data.data.gameStar; // Ensure starValue is available
+                    let starValue = data.gameStar; // Ensure starValue is available
         
                     let feedbackMessage = '';
                     if (starValue >= 1 && starValue <= 3) {
@@ -312,6 +314,7 @@ function submitUserData(drawingZone) {
                                 assignmentId: assignmentId,
                                 worksheetId: worksheetId,
                                 studentId: childId,
+                                schoolId: schoolId,
                                 submissionFile: data.screenshotUrl.split('/')[4].split('?')[0],
                             };
                             const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q';
@@ -342,4 +345,9 @@ function submitUserData(drawingZone) {
         .catch(error => {
             console.error('An error occurred', error);
         });        
-    }
+    }
+
+
+
+
+

public/saveGameData.js

@@ -5,6 +5,7 @@ function retryGame(){
 const queryString = window.location.search;
 const urlParams = new URLSearchParams(queryString);
 const childId = urlParams.get('childId');
+const schoolId = urlParams.get('schoolId');
 const gameVersion = urlParams.get('gameName');
 const assignmentId = urlParams.get('assignmentId');
 const worksheetId = urlParams.get('worksheetId');
@@ -194,7 +195,7 @@ function submitUserData(drawingZone) {
         })
         .then(response => response.json())
         .then(data => {
-            console.log('Gallery Response Data', data)
+            // console.log('Gallery Response Data', data)
 
             if(data.screenshotUrl){
                 let userData = {
@@ -248,6 +249,7 @@ function submitUserData(drawingZone) {
                     assignmentId: assignmentId,
                     worksheetId: worksheetId,
                     studentId: childId,
+                    schoolId: schoolId,
                     submissionFile: data.screenshotUrl.split('/')[4].split('?')[0],
                 };
                 const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token

public/saveTracingGameData.js

@@ -33,7 +33,7 @@ const gameType = gameName[3].split('?id=');
 //     console.log('Type - 3');
 // }
 
-console.log(gameVersion)
+// console.log(gameVersion)
 
 function submitUserData(drawingZone) {
     const endTime = Date.now();

src/layouts/Layout.astro

@@ -10,7 +10,7 @@ const { title } = Astro.props;
 <html lang="en">
 	<head>
 		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
 		<link rel="icon" type="image/ico+xml" href="/favicon.ico" />
 		<meta name="generator" content={Astro.generator} />
@@ -21,7 +21,7 @@ const { title } = Astro.props;
 	</body>
 </html>
 <style is:global>
-	@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@500&display=swap');
+	@import url("https://fonts.googleapis.com/css?family=Quicksand&display=swap");
 	/* :root {
 		--accent: 124, 58, 237;
 		--accent-gradient: linear-gradient(45deg, rgb(var(--accent)), #da62c4 30%, white 60%);
@@ -48,4 +48,10 @@ const { title } = Astro.props;
                 opacity: 1;
             }
     } */
+	* {
+		margin: 0;
+		padding: 0;
+		cursor: -webkit-grab; cursor: grab;
+		font-family: quicksand;
+	}
 </style>

src/pages/buzzboard.astro

@@ -17,7 +17,7 @@ import Layout from '../layouts/Layout.astro';
                         <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>

src/pages/cross/cross_phonics_v1.astro

@@ -102,7 +102,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -122,7 +122,10 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -140,6 +143,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -172,11 +176,11 @@ import Layout from "../../layouts/Layout.astro";
     let progress = 0;
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
-    fetch(`https://game-du.teachertrainingkolkata.in/items/cross_phonics_option_6/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/cross_phonics_option_6/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -203,7 +207,7 @@ import Layout from "../../layouts/Layout.astro";
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
 
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 6; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -476,11 +480,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',

src/pages/cross/cross_phonics_v2.astro

@@ -111,7 +111,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -131,7 +131,10 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -149,6 +152,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -180,11 +184,11 @@ import Layout from "../../layouts/Layout.astro";
     let progress = 0;
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
-    fetch(`https://game-du.teachertrainingkolkata.in/items/cross_phonics_option_9/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/cross_phonics_option_9/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -219,7 +223,7 @@ import Layout from "../../layouts/Layout.astro";
             }
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 9; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -488,11 +492,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',

src/pages/cross/v1.astro

@@ -102,7 +102,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -122,7 +122,10 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -140,6 +143,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -173,11 +177,11 @@ import Layout from "../../layouts/Layout.astro";
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
 
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_cross_varient1/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_cross_varient1/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -204,7 +208,7 @@ import Layout from "../../layouts/Layout.astro";
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
 
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 6; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -478,11 +482,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',

src/pages/cross/v2.astro

@@ -106,7 +106,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -126,7 +126,10 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -144,6 +147,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -176,11 +180,11 @@ import Layout from "../../layouts/Layout.astro";
     let progress = 0;
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_cross_varient2/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_cross_varient2/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -213,7 +217,7 @@ import Layout from "../../layouts/Layout.astro";
             if(gameData.label9){
                 document.getElementById("label9").innerHTML = gameData.label9;
             }
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 9; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -488,11 +492,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',

src/pages/cross/v3.astro

@@ -81,7 +81,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -101,7 +101,10 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -119,6 +122,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -149,11 +153,11 @@ import Layout from "../../layouts/Layout.astro";
     let progress = 0;
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_cross_varient3/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_cross_varient3/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -166,7 +170,7 @@ import Layout from "../../layouts/Layout.astro";
                 document.getElementById("label3").innerHTML = gameData.label3;
             }
             
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             document.getElementById('descImage').src = assetsURL + gameData.descript_img;
             for (let i = 1; i <= 3; i++) {
                 const imageId = `image${i}`;
@@ -428,11 +432,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',

src/pages/drag/dragdrop_phonics.astro

@@ -21,7 +21,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -38,7 +38,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     // function showAnimation() {
     //     const clipArt = document.querySelector('.clip-art');
     //     clipArt.classList.add('show');
@@ -65,6 +68,9 @@ import Layout from '../../layouts/Layout.astro';
   let retryButton;
   let blockMatches;
   let audioData;
+  let retryButtonWidth;
+  let leftTargetZoneW;
+  let rightTargetZoneW;
   let audioFileId = false;
   let isPlaying = false;
 
@@ -167,20 +173,20 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drag_drop_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/drag_drop_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
         if(isMobile){
           imageCustomWidth = "?width=80";
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`
         assetsList.element1 = assetsURL + image1   + imageCustomWidth;
         assetsList.element2 = assetsURL + image2   + imageCustomWidth;
         assetsList.element3 = assetsURL + image3   + imageCustomWidth;
@@ -339,7 +345,7 @@ import Layout from '../../layouts/Layout.astro';
 
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/drag_drop_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/drag_drop_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             blockMatches = [
@@ -651,7 +657,7 @@ import Layout from '../../layouts/Layout.astro';
   };
 
 </script>
-<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
+<style>
   * {
       margin: 0;
       padding: 0;

src/pages/drag/index.astro

@@ -24,7 +24,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -41,7 +41,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
   // function showAnimation() {
   //     const clipArt = document.querySelector('.clip-art');
   //     clipArt.classList.add('show');
@@ -172,22 +175,22 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         console.log(data)
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         // console.log(audioData)
         const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
         if(isMobile){
-          imageCustomWidth = "?width=100";
+          imageCustomWidth = "?width=60";
         } else{
-          imageCustomWidth = "?width=100";
+          imageCustomWidth = "?width=60";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.left_image1  = assetsURL + left_image1   + imageCustomWidth;
         assetsList.left_image2  = assetsURL + left_image2   + imageCustomWidth;
         assetsList.left_image3  = assetsURL + left_image3   + imageCustomWidth;
@@ -326,7 +329,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data)
@@ -610,7 +613,7 @@ import Layout from '../../layouts/Layout.astro';
 
 
 </script>
-<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet">
+<style>
   * {
     margin: 0;
     padding: 0;

src/pages/drag/match_phonics.astro

@@ -21,7 +21,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -38,7 +38,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     // function showAnimation() {
     //     const clipArt = document.querySelector('.clip-art');
     //     clipArt.classList.add('show');
@@ -171,20 +174,20 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/drag_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/drag_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
         if(isMobile){
           imageCustomWidth = "?width=100";
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.left_image1  = assetsURL + left_image1   + imageCustomWidth;
         assetsList.left_image2  = assetsURL + left_image2   + imageCustomWidth;
         assetsList.left_image3  = assetsURL + left_image3   + imageCustomWidth;
@@ -324,7 +327,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/drag_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/drag_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data) right_match
@@ -608,7 +611,7 @@ import Layout from '../../layouts/Layout.astro';
   };
 
 </script>
-<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
+<style>
   * {
     margin: 0;
     padding: 0;

src/pages/drag/testv3.astro

@@ -623,7 +623,8 @@ import Layout from '../../layouts/Layout.astro';
   };
 
 </script>
-<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
+<style>
+  @import url("https://fonts.googleapis.com/css?family=Quicksand&display=swap");
   * {
 margin: 0;
 padding: 0;

src/pages/drag/v2.astro

@@ -20,7 +20,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -37,7 +37,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     // function showAnimation() {
     //     const clipArt = document.querySelector('.clip-art');
     //     clipArt.classList.add('show');
@@ -171,21 +174,21 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
 
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
         if(isMobile){
           imageCustomWidth = "?width=100";
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.left_image1  = assetsURL + left_image1   + imageCustomWidth;
         assetsList.left_image2  = assetsURL + left_image2   + imageCustomWidth;
         assetsList.left_image3  = assetsURL + left_image3   + imageCustomWidth;
@@ -325,7 +328,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data) right_match
@@ -594,7 +597,7 @@ import Layout from '../../layouts/Layout.astro';
   };
 
 </script>
-<style href="https://fonts.googleapis.com/css?family=Quicksand&display=swap" rel="stylesheet" >
+<style>
   * {
     margin: 0;
     padding: 0;

src/pages/drag/v20.astro

@@ -50,7 +50,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
   const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
   const drawingZone = {
       x: isMobile ? 0 : window.innerWidth / 4, // Set x to 0 on mobile, else 1/4 of screen width
@@ -132,7 +135,7 @@ import Layout from '../../layouts/Layout.astro';
   var assetsList = {}
   const params = new URLSearchParams(window.location.search);
   const paramsID = params.get('id');
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         const {left_image1, left_image2, left_image3, left_image4, right_image1, right_image2, right_image3, right_image4} = data;
@@ -141,7 +144,7 @@ import Layout from '../../layouts/Layout.astro';
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.left_image1  = assetsURL + left_image1   + imageCustomWidth;
         assetsList.left_image2  = assetsURL + left_image2   + imageCustomWidth;
         assetsList.left_image3  = assetsURL + left_image3   + imageCustomWidth;
@@ -277,7 +280,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data) right_match

src/pages/drag/v3.astro

@@ -21,7 +21,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -38,7 +38,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     // function showAnimation() {
     //     const clipArt = document.querySelector('.clip-art');
     //     clipArt.classList.add('show');
@@ -203,20 +206,20 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
         if(isMobile){
           imageCustomWidth = "?width=100";
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.element1 = assetsURL + image1   + imageCustomWidth;
         assetsList.element2 = assetsURL + image2   + imageCustomWidth;
         assetsList.element3 = assetsURL + image3   + imageCustomWidth;
@@ -357,7 +360,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data)

src/pages/drag/v30.astro

@@ -50,7 +50,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
   const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
   const drawingZone = {
       x: isMobile ? 0 : window.innerWidth / 4, // Set x to 0 on mobile, else 1/4 of screen width
@@ -160,7 +163,7 @@ import Layout from '../../layouts/Layout.astro';
   var assetsList = {};
   const params = new URLSearchParams(window.location.search);
   const paramsID = params.get('id');
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
@@ -169,7 +172,7 @@ import Layout from '../../layouts/Layout.astro';
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.element1 = assetsURL + image1   + imageCustomWidth;
         assetsList.element2 = assetsURL + image2   + imageCustomWidth;
         assetsList.element3 = assetsURL + image3   + imageCustomWidth;
@@ -300,7 +303,7 @@ import Layout from '../../layouts/Layout.astro';
     create() {
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             // console.log(data)

src/pages/drag/v4.astro

@@ -21,7 +21,7 @@ import Layout from '../../layouts/Layout.astro';
               <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
           </div>
           <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-            <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+            <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
             <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
           </div>
         </div>
@@ -38,7 +38,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     // function showAnimation() {
     //     const clipArt = document.querySelector('.clip-art');
     //     clipArt.classList.add('show');
@@ -170,16 +173,16 @@ import Layout from '../../layouts/Layout.astro';
         }
     }
     displaySprite();
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
         if(isMobile){imageCustomWidth = "?width=100";} else{imageCustomWidth = "?width=100";};
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.element1 = assetsURL + image1   + imageCustomWidth;
         assetsList.element2 = assetsURL + image2   + imageCustomWidth;
         assetsList.element3 = assetsURL + image3   + imageCustomWidth;
@@ -322,7 +325,7 @@ import Layout from '../../layouts/Layout.astro';
 
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             blockMatches = [

src/pages/drag/v40.astro

@@ -50,7 +50,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script src="/config.js" is:inline></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
   const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
   const drawingZone = {
       x: isMobile ? 0 : window.innerWidth / 4, // Set x to 0 on mobile, else 1/4 of screen width
@@ -127,7 +130,7 @@ import Layout from '../../layouts/Layout.astro';
   var assetsList = {};
   const params = new URLSearchParams(window.location.search);
   const paramsID = params.get('id');
-  const data = fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+  const data = fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
       .then(response => response.json())
       .then(({data}) => {
         const {image1, image2, image3, image4, image5, image6, image7, image8} = data;
@@ -136,7 +139,7 @@ import Layout from '../../layouts/Layout.astro';
         } else{
           imageCustomWidth = "?width=100";
         }
-        const assetsURL = "https://game-du.teachertrainingkolkata.in/assets/"
+        const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
         assetsList.element1 = assetsURL + image1   + imageCustomWidth;
         assetsList.element2 = assetsURL + image2   + imageCustomWidth;
         assetsList.element3 = assetsURL + image3   + imageCustomWidth;
@@ -289,7 +292,7 @@ import Layout from '../../layouts/Layout.astro';
 
       const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drag_v4/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
           .then(response => response.json())
           .then(({ data }) => {
             blockMatches = [

src/pages/drawing/drawing_phonics.astro

@@ -28,12 +28,11 @@ import Layout from '../../layouts/Layout.astro';
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
             </div>
-           
             <div class="clip-art-container absolute bottom-10 right-10" id="bottomAnimateClipart">
                 <div class="flex flex-row z-50 place-items-end clip-art">
                     <img id="clipArtWithHand" src="" alt="Clip Art" class="">
@@ -42,7 +41,7 @@ import Layout from '../../layouts/Layout.astro';
                         <img src="/assets/svg/bg-star.svg" alt="Right Star" class="absolute right-0 top-1/4 transform -translate-y-1/2 w-12 h-12">
                         
                         <!-- Content -->
-                        <div class="flex flex-col space-y-3 px-10 py-10 w-[348px] h-[187px] ">
+                        <div class="flex flex-col space-y-3 px-4 md:px-10 py-4 md:py-10 md:w-[348px] md:h-[187px] ">
                             <p class="text-center text-[14px] font-[600] text-[#394FC0]">Want to find how much stars you’ve earned?</p>
                             <button id="buddiesName" class="text-[12px] font-[700] text-white bg-[#394FC0] rounded-[4px] w-full py-2.5" onclick="calculateFromAI();"></button>
                             <a href="" class="text-center text-[12px] font-[600] text-[#394FC0] underline decoration-2 underline-offset-[4px]">Skip</a>
@@ -70,7 +69,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameAI.js" is:inline></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const akademyUserId = params.get('childId');
@@ -98,7 +100,7 @@ import Layout from '../../layouts/Layout.astro';
 
     let galleryData = [];  // Store gallery data from the API
     let currentSlide = 0;  // Initialize the current slide index
-    fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
+    fetch(`${GAME_DU_URL_PREFIX}/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
         .then(res => res.json())
         .then(data => {
             galleryData = data; // Store the fetched gallery data
@@ -168,9 +170,9 @@ import Layout from '../../layouts/Layout.astro';
 
     if(isMobile){
         topLogoWidth = 4.5;
-        muteIconWidth = 1.8;
-        resetIconWidth = 1.47;
-        tickIconWidth = 1.24;
+        muteIconWidth = 1.65;
+        resetIconWidth = 1.40;
+        tickIconWidth = 1.21;
         cancelIconWidth = 1.08;
         galleryIconWidth = 2;
     }else if(isTab){
@@ -226,17 +228,17 @@ import Layout from '../../layouts/Layout.astro';
     // shortUniqueID = generateShortUniqueID(10); // Change 10 to the desired length
     // console.log(shortUniqueID);
 
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data = fetch(`${GAME_DU_URL_PREFIX}/items/drawing_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         // console.log(data)
         // colorList = data.colors;
     const {image} = data;
-    assetsList.image = "https://game-du.teachertrainingkolkata.in/assets/" + image; // + "?width=450";
+    assetsList.image = `${GAME_DU_URL_PREFIX}/assets/` + image; // + "?width=450";
     // console.log(assetsList)
     
     const config = {
@@ -290,7 +292,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/drawing_phonics/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/drawing/drawing_writo.astro

@@ -28,7 +28,7 @@ import Layout from '../../layouts/Layout.astro';
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
@@ -42,7 +42,7 @@ import Layout from '../../layouts/Layout.astro';
                         <img src="/assets/svg/bg-star.svg" alt="Right Star" class="absolute right-0 top-1/4 transform -translate-y-1/2 w-12 h-12">
                         
                         <!-- Content -->
-                        <div class="flex flex-col space-y-3 px-10 py-10 w-[348px] h-[187px] ">
+                        <div class="flex flex-col space-y-3 px-4 md:px-10 py-4 md:py-10 md:w-[348px] md:h-[187px] ">
                             <p class="text-center text-[14px] font-[600] text-[#394FC0]">Want to find how much stars you’ve earned?</p>
                             <button id="buddiesName" class="text-[12px] font-[700] text-white bg-[#394FC0] rounded-[4px] w-full py-2.5" onclick="calculateFromAI();"></button>
                             <a href="" class="text-center text-[12px] font-[600] text-[#394FC0] underline decoration-2 underline-offset-[4px]">Skip</a>
@@ -70,7 +70,9 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameAI.js" is:inline></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const akademyUserId = params.get('childId');
@@ -166,9 +168,9 @@ import Layout from '../../layouts/Layout.astro';
 
     if(isMobile){
         topLogoWidth = 4.5;
-        muteIconWidth = 1.8;
-        resetIconWidth = 1.47;
-        tickIconWidth = 1.24;
+        muteIconWidth = 1.65;
+        resetIconWidth = 1.40;
+        tickIconWidth = 1.21;
         cancelIconWidth = 1.08;
         galleryIconWidth = 2;
     }else if(isTab){
@@ -225,17 +227,17 @@ import Layout from '../../layouts/Layout.astro';
     // shortUniqueID = generateShortUniqueID(10); // Change 10 to the desired length
     // console.log(shortUniqueID);
 
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_writo/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data =       fetch(`${GAME_DU_URL_PREFIX}/items/drawing_writo/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         // console.log(data)
         // colorList = data.colors;
     const {image} = data;
-    assetsList.image = "https://game-du.teachertrainingkolkata.in/assets/" + image; // + "?width=450";
+    assetsList.image = `${GAME_DU_URL_PREFIX}/assets/` + image; // + "?width=450";
     // console.log(assetsList)
     
     const config = {
@@ -289,7 +291,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/drawing_writo/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/drawing_writo/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/drawing/index.astro

@@ -28,7 +28,7 @@ import Layout from '../../layouts/Layout.astro';
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
@@ -42,7 +42,7 @@ import Layout from '../../layouts/Layout.astro';
                         <img src="/assets/svg/bg-star.svg" alt="Right Star" class="absolute right-0 top-1/4 transform -translate-y-1/2 w-12 h-12">
                         
                         <!-- Content -->
-                        <div class="flex flex-col space-y-3 px-10 py-10 w-[348px] h-[187px] ">
+                        <div class="flex flex-col space-y-3 px-4 md:px-10 py-4 md:py-10 md:w-[348px] md:h-[187px] ">
                             <p class="text-center text-[14px] font-[600] text-[#394FC0]">Want to find how much stars you’ve earned?</p>
                             <button id="buddiesName" class="text-[12px] font-[700] text-white bg-[#394FC0] rounded-[4px] w-full py-2.5" onclick="calculateFromAI();"></button>
                             <a href="" class="text-center text-[12px] font-[600] text-[#394FC0] underline decoration-2 underline-offset-[4px]">Skip</a>
@@ -70,7 +70,9 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameAI.js" is:inline></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const akademyUserId = params.get('childId');
@@ -245,17 +247,17 @@ import Layout from '../../layouts/Layout.astro';
     // shortUniqueID = generateShortUniqueID(10); // Change 10 to the desired length
     // console.log(shortUniqueID);
 
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data =       fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         // console.log(data)
         // colorList = data.colors;
     const {image} = data;
-    assetsList.image = "https://game-du.teachertrainingkolkata.in/assets/" + image; // + "?width=450";
+    assetsList.image = `${GAME_DU_URL_PREFIX}/assets/${image}`; // + "?width=450";
     // console.log(assetsList)
     
     const config = {
@@ -310,7 +312,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/drawing/test.astro

@@ -10,7 +10,9 @@ import Layout from '../../layouts/Layout.astro';
     </main>
 </Layout>
 <script src="/saveGameData.js" is:inline></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const isMobile = window.innerWidth <= 768; // Define your mobile breakpoint as needed
     const isTab = window.innerWidth > 768 && window.innerWidth <= 1416;
 
@@ -95,13 +97,13 @@ import Layout from '../../layouts/Layout.astro';
 
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data =       fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         // console.log(data)
         // colorList = data.colors;
     const {image} = data;
-    assetsList.image = "https://game-du.teachertrainingkolkata.in/assets/" + image; // + "?width=450";
+    assetsList.image = `${GAME_DU_URL_PREFIX}/assets/${image}`; // + "?width=450";
     // console.log(assetsList)
     
     const config = {
@@ -152,7 +154,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/drawing/v2.astro

@@ -28,7 +28,7 @@ import Layout from '../../layouts/Layout.astro';
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
@@ -42,7 +42,7 @@ import Layout from '../../layouts/Layout.astro';
                         <img src="/assets/svg/bg-star.svg" alt="Right Star" class="absolute right-0 top-1/4 transform -translate-y-1/2 w-12 h-12">
                         
                         <!-- Content -->
-                        <div class="flex flex-col space-y-3 px-10 py-10 w-[348px] h-[187px] ">
+                        <div class="flex flex-col space-y-3 px-4 md:px-10 py-4 md:py-10 md:w-[348px] md:h-[187px] ">
                             <p class="text-center text-[14px] font-[600] text-[#394FC0]">Want to find how much stars you’ve earned?</p>
                             <button id="buddiesName" class="text-[12px] font-[700] text-white bg-[#394FC0] rounded-[4px] w-full py-2.5" onclick="calculateFromAI();"></button>
                             <a href="" class="text-center text-[12px] font-[600] text-[#394FC0] underline decoration-2 underline-offset-[4px]">Skip</a>
@@ -70,7 +70,10 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameAI.js" is:inline></script>
+<script is:inline src="/config.js"></script>
+
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const akademyUserId = params.get('childId');
@@ -174,9 +177,9 @@ import Layout from '../../layouts/Layout.astro';
 
     if(isMobile){
         topLogoWidth = 4.5;
-        muteIconWidth = 1.8;
-        resetIconWidth = 1.47;
-        tickIconWidth = 1.24;
+        muteIconWidth = 1.65;
+        resetIconWidth = 1.40;
+        tickIconWidth = 1.21;
         cancelIconWidth = 1.08;
         galleryIconWidth = 2;
     }else if(isTab){
@@ -226,6 +229,7 @@ import Layout from '../../layouts/Layout.astro';
         image2Bottom = 0;
     }
     
+    
     gameResult = [];
     window.onload = function() {
         currentDate = new Date();
@@ -242,19 +246,19 @@ import Layout from '../../layouts/Layout.astro';
         return result;
     }
 
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data =       fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         colorList = data.colors;
         defaultColor = colorList[0];
     const {image1, image2} = data;
-    assetsList.image1 = "https://game-du.teachertrainingkolkata.in/assets/" + image1; // + "?width=450";
-    assetsList.image2 = "https://game-du.teachertrainingkolkata.in/assets/" + image2; // + "?width=450";
-    // console.log('Here is image -1', "https://game-du.teachertrainingkolkata.in/assets/" + image1)
+    assetsList.image1 = `${GAME_DU_URL_PREFIX}/assets/${image1}`; // + "?width=450";
+    assetsList.image2 = `${GAME_DU_URL_PREFIX}/assets/${image2}`; // + "?width=450";
+    // console.log('Here is image -1', `${GAME_DU_URL_PREFIX}/assets/${image1}`)
     const config = {
         type: Phaser.AUTO,
         width: window.innerWidth,
@@ -309,7 +313,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing_v2/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/drawing/v3.astro

@@ -28,7 +28,7 @@ import Layout from '../../layouts/Layout.astro';
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
@@ -42,7 +42,7 @@ import Layout from '../../layouts/Layout.astro';
                         <img src="/assets/svg/bg-star.svg" alt="Right Star" class="absolute right-0 top-1/4 transform -translate-y-1/2 w-12 h-12">
                         
                         <!-- Content -->
-                        <div class="flex flex-col space-y-3 px-10 py-10 w-[348px] h-[187px] ">
+                        <div class="flex flex-col space-y-3 px-4 md:px-10 py-4 md:py-10 md:w-[348px] md:h-[187px] ">
                             <p class="text-center text-[14px] font-[600] text-[#394FC0]">Want to find how much stars you’ve earned?</p>
                             <button id="buddiesName" class="text-[12px] font-[700] text-white bg-[#394FC0] rounded-[4px] w-full py-2.5" onclick="calculateFromAI();"></button>
                             <a href="" class="text-center text-[12px] font-[600] text-[#394FC0] underline decoration-2 underline-offset-[4px]">Skip</a>
@@ -70,7 +70,9 @@ import Layout from '../../layouts/Layout.astro';
 	</main>
 </Layout>
 <script src="/saveGameAI.js" is:inline></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const akademyUserId = params.get('childId');
@@ -166,9 +168,9 @@ import Layout from '../../layouts/Layout.astro';
     
     if(isMobile){
         topLogoWidth = 4.5;
-        muteIconWidth = 1.8;
-        resetIconWidth = 1.47;
-        tickIconWidth = 1.24;
+        muteIconWidth = 1.65;
+        resetIconWidth = 1.40;
+        tickIconWidth = 1.21;
         cancelIconWidth = 1.08;
         galleryIconWidth = 2;
     }else if(isTab){
@@ -186,17 +188,17 @@ import Layout from '../../layouts/Layout.astro';
         cancelIconWidth = 1.185;
         galleryIconWidth = 1.345;
     }
-
+    
     if(isMobile){
         submitWidth = 250;
         submitHeight = 110;
         noticeWidth = 100;
         noticeHeight = 0;
         downloadWidth = 67;
-        downloadHeight = 160;
+        downloadHeight = 200;
         learningWidth = 200;
         learningHeight = 400
-    } else {
+    }else {
         submitWidth = 380;
         submitHeight = 95;
         noticeWidth = 0;
@@ -225,17 +227,17 @@ import Layout from '../../layouts/Layout.astro';
     // shortUniqueID = generateShortUniqueID(10); // Change 10 to the desired length
     // console.log(shortUniqueID);
 
-    const data =       fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+    const data =       fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
     .then(response => response.json())
     .then(({data}) => {
         if(data.instruction){
           audioFileId = true;
         }
-        audioData = `https://game-du.teachertrainingkolkata.in/assets/${data.instruction}.mp3`;
+        audioData = `${GAME_DU_URL_PREFIX}/assets/${data.instruction}.mp3`;
         // console.log(data)
         // colorList = data.colors;
     const {image} = data;
-    assetsList.image = "https://game-du.teachertrainingkolkata.in/assets/" + image; // + "?width=450";
+    assetsList.image = `${GAME_DU_URL_PREFIX}/assets/${image}`; // + "?width=450";
     // console.log(assetsList)
     
     const config = {
@@ -289,7 +291,7 @@ import Layout from '../../layouts/Layout.astro';
     function create() {
         const params = new URLSearchParams(window.location.search);
         const paramsID = params.get('id');
-        fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
+        fetch(`${GAME_DU_URL_PREFIX}/items/game_drawing_v3/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
             .then(response => response.json())
             .then(({ data }) => {
                 // console.log(data.colors)

src/pages/guided-tracing/0.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                       <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
                   </div>
                   <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                      <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                      <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                       <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                   </div>
               </div>

src/pages/guided-tracing/1.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/2.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/3.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/4.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/5.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/6.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/7.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/8.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/9.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/B.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/C.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/D.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/E.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/F.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/G.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/H.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/I.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/J.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/K.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/L.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/M.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/N.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/O.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/P.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/Q.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/R.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/S.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/T.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/U.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/V.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/W.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/X.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/Y.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/Z.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/a.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/b.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/c.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/d.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/e.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/f.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/g.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/h.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/i.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/j.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/k.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/l.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/m.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/n.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/o.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/p.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/q.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/r.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/s.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/t.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/u.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/v.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/w.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/x.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/y.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/guided-tracing/z.astro

@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
                   <p class="text-[#0348A8] text-[12px] font-[700] p-6 rounded-[10px] -ml-[10px]" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);">Well done! <span id="countStar"></span> stars for your effort! <br> Keep pushing, you’ve got this!</p>
               </div>
               <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
               </div>
           </div>

src/pages/test-game.astro

@@ -0,0 +1,35 @@
+---
+import Layout from "../layouts/Layout.astro"
+---
+<Layout title="">
+  <div style="width: 100%; height: 100%;">
+    <iframe
+      id="gameIframe"
+      src="https://interaktogames.beanstalkedu.com/drawing/game_drawing_jpg?id=2"
+      frameborder="0"
+      style="width: 100%; border: 1px solid red;"
+      height="670px"
+    ></iframe>
+  </div>
+  
+</Layout>
+
+<script is:inline>
+    fetch('https://game-api.teachertrainingkolkata.in/api/getGameInfo?schoolId=65e83085a0f71e31ba804f35', {
+        method: 'GET',
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        credentials: 'include' // Corrected this line
+    })
+    .then(res => res.json())
+    .then(data => {
+        console.log('data', data);
+    })
+    .catch(err => {
+        console.error('Fetch error:', err);
+    });
+</script>
+
+<!-- http://192.168.1.186:2022/ -->
+ <!-- src="https://interaktogames.beanstalkedu.com/drawing/game_drawing_jpg?id=2" -->

src/pages/test.astro

@@ -0,0 +1,18 @@
+---
+import Layout from "../layouts/Layout.astro"
+---
+<Layout title="">
+    <div>
+        <button>Click</button>
+    </div>
+</Layout>
+<script is:inline>
+    function testImageAI(){
+        const formData = new FormData();
+        formData.append('image', )
+        fetch(`ai-image-api.cs1.hz.siliconpin.com`, {
+            method: 'POST',
+
+        })
+    }
+</script>

src/pages/tick/tick_phonics_v1.astro

@@ -105,7 +105,7 @@ import Layout from "../../layouts/Layout.astro";
                         <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                     </div>
                     <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                        <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                        <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                         <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                     </div>
                 </div>
@@ -125,7 +125,9 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -143,6 +145,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -206,11 +209,11 @@ import Layout from "../../layouts/Layout.astro";
         }, 100);
     }
 
-    fetch(`https://game-du.teachertrainingkolkata.in/items/tick_phonics_option_6/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/tick_phonics_option_6/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -236,7 +239,7 @@ import Layout from "../../layouts/Layout.astro";
                 document.getElementById("label6").innerHTML = gameData.label6;
             }
 
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 6; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -482,11 +485,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -547,6 +551,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;

src/pages/tick/tick_phonics_v2.astro

@@ -129,7 +129,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -149,7 +149,9 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -167,6 +169,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -231,11 +234,11 @@ import Layout from "../../layouts/Layout.astro";
         }, 100);
     }
     
-    fetch(`https://game-du.teachertrainingkolkata.in/items/tick_phonics_option_9/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/tick_phonics_option_9/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -270,7 +273,7 @@ import Layout from "../../layouts/Layout.astro";
             }
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 9; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -511,11 +514,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -573,6 +577,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6, #image7, #image8, #image9{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6, #label7, #label8, #label9{
         text-align: center;

src/pages/tick/tick_phonics_v3.astro

@@ -86,7 +86,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame();" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -106,7 +106,9 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -124,6 +126,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -187,11 +190,11 @@ import Layout from "../../layouts/Layout.astro";
         }, 100);
     }
 
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_tick_v3_phonics/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_tick_v3_phonics/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -203,7 +206,7 @@ import Layout from "../../layouts/Layout.astro";
                 document.getElementById("label2").innerHTML = gameData.label2;
                 document.getElementById("label3").innerHTML = gameData.label3;
             }
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             document.getElementById('descImage').src = assetsURL + gameData.descript_img;
             for (let i = 1; i <= 3; i++) {
                 const imageId = `image${i}`;
@@ -434,11 +437,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -498,7 +502,10 @@ import Layout from "../../layouts/Layout.astro";
         transition: border 0.5s, border-color 0.3s, transform 6s;
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
-        width: 240px;
+        width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;

src/pages/tick/v1.astro

@@ -1,5 +1,6 @@
 ---
 import Layout from "../../layouts/Layout.astro";
+// const API_URL = import.meta.env.PUBLIC_GAME_DU_API_URL;
 ---
 <Layout title="">
     <main>
@@ -27,7 +28,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a1" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image1" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image1" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label1"></p>
                                     </div>
                                 </label>
@@ -35,7 +36,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a2" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image2" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image2" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label2"></p>
                                     </div>
                                 </label>
@@ -44,7 +45,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a3" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image3" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image3" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label3"></p>
                                     </div>
                                 </label>
@@ -52,7 +53,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a4" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image4" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image4" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label4"></p>
                                     </div>
                                 </label>
@@ -61,7 +62,7 @@ import Layout from "../../layouts/Layout.astro";
                             <div class="flex flex-col gap-6 place-items-center">
                                 <label for="a5" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image5" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image5" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label5"></p>
                                     </div>
                                 </label>
@@ -69,7 +70,7 @@ import Layout from "../../layouts/Layout.astro";
                                 
                                 <label for="a6" class="round-checkbox-label">
                                     <div class="flex flex-col place-items-center">
-                                        <img id="image6" src="" alt="" draggable="false" class="select-none" />
+                                        <img id="image6" src="" alt="" draggable="false" class="select-none "  />
                                         <p id="label6"></p>
                                     </div>
                                 </label>
@@ -102,7 +103,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -123,9 +124,12 @@ import Layout from "../../layouts/Layout.astro";
 </Layout>
 <!-- <script is:inline src="/html2canvas.min.js"></script> -->
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 
 
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL
+
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -143,6 +147,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -173,13 +178,13 @@ import Layout from "../../layouts/Layout.astro";
     let progress = 0;
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_tick_variant1/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_tick_variant1/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;  
             // console.log('totalCorrectFromApi', totalCorrectFromApi)    gameData
                
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -206,7 +211,7 @@ import Layout from "../../layouts/Layout.astro";
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
 
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 6; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -474,11 +479,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -533,6 +539,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;

src/pages/tick/v2.astro

@@ -125,7 +125,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -145,7 +145,9 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -224,11 +226,11 @@ import Layout from "../../layouts/Layout.astro";
             }
         }, 100);
     }
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_tick_variant2/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_tick_variant2/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -263,7 +265,7 @@ import Layout from "../../layouts/Layout.astro";
             }
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             for (let i = 1; i <= 9; i++) {
                 const imageId = `image${i}`;
                 document.getElementById(imageId).src = assetsURL + gameData[imageId];
@@ -502,11 +504,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -560,6 +563,9 @@ import Layout from "../../layouts/Layout.astro";
     }
     #image1, #image2, #image3, #image4, #image5, #image6, #image7, #image8, #image9{
         width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6, #label7, #label8, #label9{
         text-align: center;

src/pages/tick/v3.astro

@@ -88,7 +88,7 @@ import Layout from "../../layouts/Layout.astro";
                     <p id="starFeedbackMessage" class="text-[#0348A8] text-[12px] font-[700] p-8 rounded-[10px] -ml-[40px] h-fit" style="background: linear-gradient(270.05deg, #FFFFFF 4.67%, #DAEAFF 99.61%);"></p>
                 </div>
                 <div class="flex flex-col w-full max-w-sm items-center justify-center mx-auto gap-3">
-                  <button onclick="history.back();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
+                  <button onclick="history.length > 1 ? history.back() : location.reload();" class="rounded-[4px] bg-[#0348A8] text-[#FFF] text-[12px] font-[700] p-2.5 w-full border-[1px] border-[#0348A8]">Wow, Lets Go</button>
                   <button onclick="retryGame()" class="border-[1px] border-[#0348A8] p-2.5 rounded-[4px] text-[#0348A8] w-full">Try Again</button>
                 </div>
               </div>
@@ -111,7 +111,9 @@ import Layout from "../../layouts/Layout.astro";
     </main>
 </Layout>
 <script is:inline src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>
+<script is:inline src="/config.js"></script>
 <script is:inline>
+    let GAME_DU_URL_PREFIX = window.APP_CONFIG.PUBLIC_GAME_DU_API_URL;
     let isPlaying = false;
     function audioPlayAndPause(){
         if(isPlaying === false){
@@ -129,6 +131,7 @@ import Layout from "../../layouts/Layout.astro";
     const params = new URLSearchParams(window.location.search);
     const gameId = params.get('id');
     const childId = params.get('childId');
+    const schoolId = params.get('schoolId');
     const gameName = params.get('gameName');
     const assignmentId = params.get('assignmentId');
     const worksheetId = params.get('worksheetId');
@@ -160,11 +163,11 @@ import Layout from "../../layouts/Layout.astro";
     const progressBar = document.createElement('div');
     let totalCorrectFromApi = 0;
 
-    fetch(`https://game-du.teachertrainingkolkata.in/items/game_tick_varient3/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
+    fetch(`${GAME_DU_URL_PREFIX}/items/game_tick_varient3/${encodeURIComponent(gameId)}?filter[status][_eq]=published`)
         .then(res => res.json())
         .then(data => {
             gameData = data.data;
-            let audioLink = `https://game-du.teachertrainingkolkata.in/assets/${gameData.instruction}.mp3`;
+            let audioLink = `${GAME_DU_URL_PREFIX}/assets/${gameData.instruction}.mp3`;
             document.getElementById('instrucAudio1').src = audioLink;
             document.getElementById('instrucAudio2').src = audioLink;
             document.querySelector('audio').load();
@@ -188,7 +191,7 @@ import Layout from "../../layouts/Layout.astro";
             // document.getElementById('LearningArea').innerHTML = gameData.LearningArea;
             // document.getElementById('LearningSubArea').innerHTML = gameData.LearningSubArea;
 
-            const assetsURL = 'https://game-du.teachertrainingkolkata.in/assets/';
+            const assetsURL = `${GAME_DU_URL_PREFIX}/assets/`;
             document.getElementById('descImage').src = assetsURL + gameData.descript_img;
             for (let i = 1; i <= 3; i++) {
                 const imageId = `image${i}`;
@@ -450,11 +453,12 @@ import Layout from "../../layouts/Layout.astro";
                         assignmentId: assignmentId,
                         worksheetId: worksheetId,
                         studentId: childId,
+                        schoolId: schoolId,
                         submissionFile: saveResult.screenshotUrl.split('/')[4].split('?')[0],
                     };
                     const authToken = 'Bearer eyJhbGciOiJSUzUxMiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImlkZW50aXR5SWQiOiI2NjNjNGMzNjRiNmYzZjU0YmExZjcxMTUiLCJfaWQiOiI2NjNjNGMzNjBiOWYyZDk5MGQyNWYwYjMiLCJ0eXBlIjoiQUtBREVNWSIsImRldmljZUlkIjoiMDBqNXJtODl5b3BvNjh1a2Yyb2c5cTdoIn0sImlhdCI6MTczNjM5ODkwNCwiZXhwIjoxNzM3MDAzNzA0LCJpc3MiOiJidXp6T25lIn0.vhH0zTkVisnbK6n5aPgV3RrtmpP095Gtz6ayUc29XerEV-XPVhYwg06JQnm2FWGPtadEJ2Ea5z6_YNp5Kz9DENL9LxpYYuXRUOGvMEaVM5YZOYQ88viqxM7SIvxElIsc8cQeJr5v-4ov4MyOuXws7R5MDDO2PuzYdwaA52GXbQ0LO3aFGOQL7nWPKVYqFWCQe_T-1JphbsGStHivcmUy8_DAdjs0VpXFJKiQm6jcWQO3j3uOUJSi14af4ZvrUPkjIT92OOHiZTL7CUbbFt4yktnw3Gm2Fv6lS5pamSJpVJnGJQ6ebjd70IXnE49Mn9IK9AssnjTBh2DaNeVc0C1z9Q'; // Your token
                     try {
-                        const submitResponse = await fetch('https://beanstalkedu.in/api/one/v1/akademy/worksheet/submissions', {
+                        const submitResponse = await fetch('https://app.buzzapp.tech/api/one/v1/akademy/worksheet/submissions', {
                             method: 'POST',
                             headers: {
                                 'Content-Type': 'application/json',
@@ -509,7 +513,10 @@ import Layout from "../../layouts/Layout.astro";
         transition: border 0.5s, border-color 0.3s, transform 6s;
     }
     #image1, #image2, #image3, #image4, #image5, #image6{
-        width: 240px;
+        width: 150px;
+        height: 150px;
+        object-fit: contain;
+        border-radius: 8px;
     }
     #label1, #label2, #label3, #label4, #label5, #label6{
         text-align: center;

task/27.11.2024.txt

@@ -1,2 +0,0 @@
-Gallery Implement in all drawing games?
-The new design for Buzzboard is hard to achieve so its need to develope from base lavel