kar
/
phaser-game-bs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 's6' (#35) from newb2 into master 

Reviewed-on: #35
master
Subhodip Ghosh 2025-01-26 09:25:37 +00:00
parent bc169b6dfa 50db006fd5
commit 970acf7521
6 changed files with 45 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
public/saveGameAI.js
View File

@ -312,26 +312,24 @@ function submitUserData(drawingZone) {
setTimeout(() => {
if (data && data.message === "Game data saved successfully") {
starValue = data.data.score;
let feedbackMessage = '';
if (starValue >= 1 && starValue <= 3) {
feedbackMessage = "You're making progress! Let's keep going!";
} else if (starValue >= 4 && starValue <= 6) {
feedbackMessage = "Nice work! You're improving every day!";
} else if (starValue >= 7 && starValue <= 8) {
feedbackMessage = "Amazing work! Keep it up!";
} else if (starValue >= 9 && starValue <= 10) {
feedbackMessage = "Outstanding! You're a true superstar!";
} else {
feedbackMessage = "Invalid star value.";
}
loadingMainContainer.style.display = 'none';
loadingDiv.style.display = 'none';
starContainer.style.display = 'flex';
starContainer.style.flexDirection = 'row';
document.getElementById('countStar').innerHTML = starValue;
for (let i = 0; i < starValue; i++) {
const starDiv = document.createElement('div');
starDiv.innerHTML = starSVG;
starDiv.classList.add('star');
starContainer.appendChild(starDiv);
setTimeout(() => {
starDiv.style.opacity = '1';
starDiv.style.animationDelay = `${i * 0.5}s`;
}, i * 500);
}
for (let i = 0; i < maxStarValue - starValue; i++) {
const starDiv = document.createElement('div');
starDiv.innerHTML = blankStar;
starContainer.appendChild(starDiv);
}
document.getElementById('get-star-value').innerHTML = starValue;
document.getElementById('starFeedbackMessage').innerHTML = feedbackMessage;
scoreBoard.style.display = 'flex';
if (scoreBoard.style.display === 'flex') {
const bottomAnimateClipart = document.getElementById('bottomAnimateClipart');

9
src/pages/drawing/drawing_phonics.astro
View File

@ -18,11 +18,14 @@ import Layout from '../../layouts/Layout.astro';
<div id="scoreBoard" class="z-10 w-full h-screen bg-[#00000070] absolute" style="display: none;">
<div class="flex absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 max-w-lg flex-col rounded-[8px] bg-white space-y-2 w-full p-6" >
<div class="flex flex-row space-x-4 items-center justify-center">
<div id="star-container"></div>
<div id="star-container" class="relative inline-flex items-center justify-center">
<img src="/assets/bg-star.svg" alt="" class="block" />
<p id="get-star-value" class="absolute inset-0 flex items-center justify-center text-[#E76408] text-[40px] font-[900]"></p>
</div>
</div>
<div class="flex flex-row" style="margin-top: 15px; margin-bottom: 15px;">
<img class="z-10" src="/assets/animate-clipart.gif" alt="" style="width: 90.21px; height: 86.24px;" />
<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>
<p id="starFeedbackMessage" 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%);"></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>
@ -94,7 +97,7 @@ import Layout from '../../layouts/Layout.astro';
let galleryData = []; // Store gallery data from the API
let currentSlide = 0; // Initialize the current slide index
fetch(`http://localhost:5175/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
.then(res => res.json())
.then(data => {
galleryData = data; // Store the fetched gallery data

9
src/pages/drawing/drawing_writo.astro
View File

@ -18,11 +18,14 @@ import Layout from '../../layouts/Layout.astro';
<div id="scoreBoard" class="z-10 w-full h-screen bg-[#00000070] absolute" style="display: none;">
<div class="flex absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 max-w-lg flex-col rounded-[8px] bg-white space-y-2 w-full p-6" >
<div class="flex flex-row space-x-4 items-center justify-center">
<div id="star-container"></div>
<div id="star-container" class="relative inline-flex items-center justify-center">
<img src="/assets/bg-star.svg" alt="" class="block" />
<p id="get-star-value" class="absolute inset-0 flex items-center justify-center text-[#E76408] text-[40px] font-[900]"></p>
</div>
</div>
<div class="flex flex-row" style="margin-top: 15px; margin-bottom: 15px;">
<img class="z-10" src="/assets/animate-clipart.gif" alt="" style="width: 90.21px; height: 86.24px;" />
<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>
<p id="starFeedbackMessage" 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%);"></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>
@ -93,7 +96,7 @@ import Layout from '../../layouts/Layout.astro';
let galleryData = []; // Store gallery data from the API
let currentSlide = 0; // Initialize the current slide index
fetch(`http://localhost:5175/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
.then(res => res.json())
.then(data => {
galleryData = data; // Store the fetched gallery data

9
src/pages/drawing/index.astro
View File

@ -18,11 +18,14 @@ import Layout from '../../layouts/Layout.astro';
<div id="scoreBoard" class="z-10 w-full h-screen bg-[#00000070] absolute" style="display: none;">
<div class="flex absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 max-w-lg flex-col rounded-[8px] bg-white space-y-2 w-full p-6" >
<div class="flex flex-row space-x-4 items-center justify-center">
<div id="star-container"></div>
<div id="star-container" class="relative inline-flex items-center justify-center">
<img src="/assets/bg-star.svg" alt="" class="block" />
<p id="get-star-value" class="absolute inset-0 flex items-center justify-center text-[#E76408] text-[40px] font-[900]"></p>
</div>
</div>
<div class="flex flex-row" style="margin-top: 15px; margin-bottom: 15px;">
<img class="z-10" src="/assets/animate-clipart.gif" alt="" style="width: 90.21px; height: 86.24px;" />
<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>
<p id="starFeedbackMessage" 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%);"></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>
@ -108,7 +111,7 @@ import Layout from '../../layouts/Layout.astro';
// ];
let galleryData = []; // Store gallery data from the API
let currentSlide = 0; // Initialize the current slide index
fetch(`http://localhost:5175/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
.then(res => res.json())
.then(data => {
galleryData = data; // Store the fetched gallery data

9
src/pages/drawing/v2.astro
View File

@ -18,11 +18,14 @@ import Layout from '../../layouts/Layout.astro';
<div id="scoreBoard" class="z-10 w-full h-screen bg-[#00000070] absolute" style="display: none;">
<div class="flex absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 max-w-lg flex-col rounded-[8px] bg-white space-y-2 w-full p-6" >
<div class="flex flex-row space-x-4 items-center justify-center">
<div id="star-container"></div>
<div id="star-container" class="relative inline-flex items-center justify-center">
<img src="/assets/bg-star.svg" alt="" class="block" />
<p id="get-star-value" class="absolute inset-0 flex items-center justify-center text-[#E76408] text-[40px] font-[900]"></p>
</div>
</div>
<div class="flex flex-row" style="margin-top: 15px; margin-bottom: 15px;">
<img class="z-10" src="/assets/animate-clipart.gif" alt="" style="width: 90.21px; height: 86.24px;" />
<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>
<p id="starFeedbackMessage" 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%);"></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>
@ -93,7 +96,7 @@ import Layout from '../../layouts/Layout.astro';
let galleryData = []; // Store gallery data from the API
let currentSlide = 0; // Initialize the current slide index
fetch(`http://localhost:5175/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
.then(res => res.json())
.then(data => {
galleryData = data; // Store the fetched gallery data

11
src/pages/drawing/v3.astro
View File

@ -18,11 +18,14 @@ import Layout from '../../layouts/Layout.astro';
<div id="scoreBoard" class="z-10 w-full h-screen bg-[#00000070] absolute" style="display: none;">
<div class="flex absolute left-1/2 top-1/2 -translate-y-1/2 -translate-x-1/2 max-w-lg flex-col rounded-[8px] bg-white space-y-2 w-full p-6" >
<div class="flex flex-row space-x-4 items-center justify-center">
<div id="star-container"></div>
<div id="star-container" class="relative inline-flex items-center justify-center">
<img src="/assets/bg-star.svg" alt="" class="block" />
<p id="get-star-value" class="absolute inset-0 flex items-center justify-center text-[#E76408] text-[40px] font-[900]"></p>
</div>
</div>
<div class="flex flex-row" style="margin-top: 15px; margin-bottom: 15px;">
<img class="z-10" src="/assets/animate-clipart.gif" alt="" style="width: 90.21px; height: 86.24px;" />
<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>
<p id="starFeedbackMessage" 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%);"></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>
@ -93,14 +96,14 @@ import Layout from '../../layouts/Layout.astro';
let galleryData = []; // Store gallery data from the API
let currentSlide = 0; // Initialize the current slide index
fetch(`http://localhost:5175/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
fetch(`https://api.teachertrainingkolkata.in/api/getGalleryImage?userId=${akademyUserId}&gameID=${paramsID}&gameName=${akademyGameName}`)
.then(res => res.json())
.then(data => {
galleryData = data; // Store the fetched gallery data
updateSlide(); // Call updateSlide after the data is fetched
})
.catch(err => {
console.error(err);
console.error(err);
});
function updateSlide() {
if (galleryData.length > 0) {