From c7884c79efc060aaf16a678ae7e7b2e0277a7ede Mon Sep 17 00:00:00 2001
From: Suvodip <suvodip@l1>
Date: Wed, 28 Aug 2024 20:17:09 +0530
Subject: [PATCH] s1

---
 src/components/SliderHomepage.vue |  5 ++-
 src/pages/contact.astro           | 10 ++---
 src/pages/form.astro              | 40 +++++++++++++++++++
 src/pages/login.astro             | 28 +++++++++++--
 src/pages/sign-up.astro           | 65 +++++++++++++++++++++++++------
 5 files changed, 127 insertions(+), 21 deletions(-)
 create mode 100644 src/pages/form.astro

diff --git a/src/components/SliderHomepage.vue b/src/components/SliderHomepage.vue
index 097e64f..a533962 100644
--- a/src/components/SliderHomepage.vue
+++ b/src/components/SliderHomepage.vue
@@ -1,7 +1,7 @@
 <template>
     <div>
         <div class="">
-            <swiper class="max-w-2xl cursor-pointer shadow-xl rounded-2xl" draggable="false"
+            <swiper  class="max-w-2xl cursor-pointer shadow-xl rounded-2xl" draggable="false"
                 :modules="modules"
                 :slides-per-view="1"
                 :space-between="50"
@@ -11,6 +11,8 @@
                 :autoplay=" { delay: 2500, disableOnInteraction: false}"
                 @swiper="onSwiper"
                 @slideChange="onSlideChange">
+                
+                <swiper-slide v-for="(item, index) in img3DResInter" :key="index"> <img class="aspect-video"  :src="item.image_src" alt="" /></swiper-slide>
                 <swiper-slide> <img class=""  src="/img/school1.jpg" alt="" /></swiper-slide>
                 <swiper-slide> <img class=""  src="/img/school2.jpg" alt="" /></swiper-slide>
                 <swiper-slide> <img class=""  src="/img/school3.jpg" alt="" /></swiper-slide>
@@ -65,6 +67,7 @@
          page: null,
          lessonplan:null,
          isLoading: true,
+         img3DResInter: [{ image_src: "/assets/school_image/hps-image1.jpg" },{ image_src: "/assets/school_image/hps-image2.jpg" },{ image_src: "/assets/school_image/hps-image3.jpg" },{ image_src: "/assets/school_image/hps-image4.jpg" },{ image_src: "/assets/school_image/hps-image5.jpg" },{ image_src: "/assets/school_image/hps-image6.jpg" },{ image_src: "/assets/school_image/hps-image7.jpg" },{ image_src: "/assets/school_image/hps-image8.jpg" },{ image_src: "/assets/school_image/hps-image9.jpg" },{ image_src: "/assets/school_image/hps-image10.jpg" },{ image_src: "/assets/school_image/hps-image11.jpg" },{ image_src: "/assets/school_image/hps-image12.jpg" },{ image_src: "/assets/school_image/hps-image13.jpg" },{ image_src: "/assets/school_image/hps-image14.jpg" },{ image_src: "/assets/school_image/hps-image16.jpg" },{ image_src: "/assets/school_image/hps-image17.jpg" },{ image_src: "/assets/school_image/hps-image18.jpg" },{ image_src: "/assets/school_image/hps-image19.jpg" },{ image_src: "/assets/school_image/hps-image20.jpg" },{ image_src: "/assets/school_image/hps-image21.jpg" },{ image_src: "/assets/school_image/hps-image22.jpg" },{ image_src: "/assets/school_image/hps-image23.jpg" },{ image_src: "/assets/school_image/hps-image24.jpg" },{ image_src: "/assets/school_image/hps-image25.jpg" },{ image_src: "/assets/school_image/hps-image26.jpg" },{ image_src: "/assets/school_image/hps-image27.jpg" },{ image_src: "/assets/school_image/hps-image28.jpg" },{ image_src: "/assets/school_image/hps-image29.jpg" },{ image_src: "/assets/school_image/hps-image30.jpg" },{ image_src: "/assets/school_image/hps-image31.jpg" }]
   
      }
   },
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index f2ad201..30fe377 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -10,9 +10,9 @@ import Layout from "../layouts/Layout.astro";
 						<img class="lg:max-w-2xl" src="/img/rec_girl.png" alt="">
 					</div>
 					<div class="flex flex-col w-full">
-						<h1 class="text-3xl md:text-4xl lg:text-5xl text-[#47ae6a]">Get in Touch with Holywisdom Preschool!</h1>
-						<h2 class="text-2xl md:text-3xl text-[#3084b5] py-4">Contact us for a brighter start at Holywisdom Preschool!</h2>
-						<h3 class="text-xl text-justify pb-4">Drop us a line at Holywisdom Preschool – your gateway to educational excellence!</h3>
+						<h1 class="text-3xl md:text-4xl lg:text-5xl text-[#47ae6a]">Get in Touch with Holywisdom Public School!</h1>
+						<h2 class="text-2xl md:text-3xl text-[#3084b5] py-4">Contact us for a brighter start at Holywisdom Public School!</h2>
+						<h3 class="text-xl text-justify pb-4">Drop us a line at Holywisdom Public School – your gateway to educational excellence!</h3>
 						<!-- <div class="flex flex-row place-content-between">
 							<a href="#" class="text-sm xl:text-lg rounded-lg shadow-2xl text-[#3084b5] px-4 md:px-8 p-3 border-2 border-[#3084b5] transition ease-in-out delay-150 hover:-translate-y-1 hover:scale-110 duration-300">Get in Touch</a>
 						</div> -->
@@ -21,8 +21,8 @@ import Layout from "../layouts/Layout.astro";
 			</section>
             <section class="container mx-auto px-4 my-10">
                 <div class="">
-                    <h1 class="text-2xl">Reach Out to Holywisdom Preschool</h1>
-                    <p class="">Contacting Holywisdom Preschool is your first step toward a seamless connection with our dedicated team. Whether you have inquiries about our programs, enrollment details, or simply want to learn more about our unique approach to early childhood education, we're here to help. Your child's journey with us begins with a conversation. Reach out through the provided contact information, and let's embark on the path of educational discovery together. We look forward to hearing from you and welcoming your family into the Holywisdom community.</p>
+                    <h1 class="text-2xl">Reach Out to Holywisdom Public School</h1>
+                    <p class="">Contacting Holywisdom Public School is your first step toward a seamless connection with our dedicated team. Whether you have inquiries about our programs, enrollment details, or simply want to learn more about our unique approach to early childhood education, we're here to help. Your child's journey with us begins with a conversation. Reach out through the provided contact information, and let's embark on the path of educational discovery together. We look forward to hearing from you and welcoming your family into the Holywisdom community.</p>
                 </div>
             </section>
             <section class="container mx-auto px-4 my-16">
diff --git a/src/pages/form.astro b/src/pages/form.astro
new file mode 100644
index 0000000..854d4b5
--- /dev/null
+++ b/src/pages/form.astro
@@ -0,0 +1,40 @@
+<div>
+    <input type="text" name="name" id="name" style="border: 1px solid #000"><br>
+    <input type="text" name="mobile" id="mobile" style="border: 1px solid #000"><br>
+    <input type="text" name="email" id="email" style="border: 1px solid #000"><br>
+    <textarea name="message" id="message" style="border: 1px solid #000"></textarea><br>
+    <button onclick="saveForm(event)" type="submit" style="border: 1px solid #000">Submit</button>
+</div>
+
+<script is:inline>
+    function saveForm(event){
+        event.preventDefault();
+        let userName = document.getElementById('name').value;
+        let userMobile = document.getElementById('mobile').value;
+        let userEmail = document.getElementById('email').value;
+        let userMessage = document.getElementById('message').value;
+
+        let userData = {
+            name : userName,
+            mobile: userMobile,
+            email: userEmail,
+            message: userMessage 
+        }
+
+
+        fetch(`https://game-du.teachertrainingkolkata.in/items/contact`, {
+            method: 'POST',
+            headers:{
+                'Content-Type' : 'application/json'
+            },
+            body: JSON.stringify(userData)
+        })
+        .then(response => response.json())
+        .then(data => {
+            console.log(data)
+        })
+        .then(error => {
+            console.error(error)
+        })
+    }
+</script>
\ No newline at end of file
diff --git a/src/pages/login.astro b/src/pages/login.astro
index 803e224..a334891 100644
--- a/src/pages/login.astro
+++ b/src/pages/login.astro
@@ -5,15 +5,37 @@
             <div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
                 <img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="">
                 <form action="" class="p-6">
-                    <input v-model="name" id="name" name="name" type="text" placeholder="User ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <input v-model="name" id="name" name="name" type="password" placeholder="Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-6" required/>
-                    <button class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Login</button>
+                    <input id="email" name="email" type="text" placeholder="User ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
+                    <input id="password" name="password" type="password" placeholder="Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-6" required/>
+                    <button onclick="myFunction(event)" class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Login</button>
                 </form>
                 <p class="">Not Registerd? <a href="/sign-up" class="text-[#FFFFFF] font-bold">Register Now</a></p>
             </div>
         </section>
     </div>
 </main>
+<script is:inline>
+    function myFunction(event){
+        event.preventDefault();
+        let emailId = document.getElementById('email').value;
+        let password = document.getElementById('password').value;
+        let userData = {
+            email : emailId,
+            password : password
+        }
+        fetch(`https://game-du.teachertrainingkolkata.in/auth/login`, {
+            method: 'POST',
+            headers: {
+                'Content-Type' : 'application/json'
+            },
+            body: JSON.stringify(userData)
+        })
+        .then(res => res.json())
+        .then(data => {
+            console.log(data)
+        })
+    }
+</script>
 <style>
     .content {
         position: absolute;
diff --git a/src/pages/sign-up.astro b/src/pages/sign-up.astro
index 2339dbb..29adaca 100644
--- a/src/pages/sign-up.astro
+++ b/src/pages/sign-up.astro
@@ -2,23 +2,64 @@
     <div class="content">
         <section class="container mx-auto max-w-lg bg-[url(/img/hps_logo.png)] rounded-2xl">
             <div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
-                <img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="">
-                <form action="" class="p-6 space-y-4">
-                    <input v-model="name" id="name" name="name" type="text" placeholder="Name" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <input v-model="name" id="name" name="name" type="text" placeholder="Email ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <input v-model="name" id="name" name="name" type="text" placeholder="Mobile Number" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <input v-model="name" id="name" name="name" type="password" placeholder="New Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <input v-model="name" id="name" name="name" type="password" placeholder="Confirm Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
-                    <button class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Register</button>
+                <img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="Logo">
+                <form action="" class="p-6 space-y-4" onsubmit="signUp(event)">
+                    <input id="name" name="name" type="text" placeholder="Name" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
+                    <input id="email" name="email" type="email" placeholder="Email ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
+                    <input id="mobile" name="mobile" type="text" placeholder="Mobile Number" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
+                    <input id="password" name="password" type="password" placeholder="New Password" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
+                    <input id="con_password" name="con_password" type="password" placeholder="Confirm Password" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required />
+                    <button type="submit" class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Register</button>
                 </form>
-                <div class="flex flex-col place-content-between float-left">
-                    <p class="">Back to <a href="/login" class="text-[#3084b5] font-bold">Login</a></p>
-                    <p class="">Continue Without <a href="/" class="text-[#3084b5] font-bold">Login</a></p>
+                <div class="flex flex-col">
+                    <p>Back to <a href="/login" class="text-[#3084b5] font-bold">Login</a></p>
+                    <p><a href="/" class="text-[#3084b5] font-bold">Continue</a> Without Login</p>
                 </div>
             </div>
         </section>
     </div>
 </main>
+
+<script is:inline>
+    function signUp(event) {
+        event.preventDefault(); // Prevent form submission
+        let password = document.getElementById('password').value;
+        let conPassword = document.getElementById('con_password').value;
+
+        if (password !== conPassword) {
+            alert('Passwords do not match. Please try again.');
+            return;
+        }
+
+        let userName = document.getElementById('name').value;
+        let userEmail = document.getElementById('email').value;
+        let userMobile = document.getElementById('mobile').value;
+
+        let userSignData = {
+            name: userName,
+            email: userEmail,
+            mobile: userMobile,
+            password: password
+        };
+        console.log(userSignData)
+
+        fetch('https://game-du.teachertrainingkolkata.in/users', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(userSignData)
+        })
+        .then(res => res.json())
+        .then(data => {
+            console.log(data)
+        })
+        .catch(error => {
+            console.error('Error:', error);
+        });
+    }
+</script>
+
 <style>
     .content {
         position: absolute;
@@ -26,4 +67,4 @@
         left: 50%;
         transform: translate(-50%, -50%);
     }
-</style>
\ No newline at end of file
+</style>