From 592d5241d11c137d593478d7a0c9809a4941f417 Mon Sep 17 00:00:00 2001
From: Muyao CHEN <muyao.chen@intersec.com>
Date: Sat, 29 Jun 2024 21:42:15 +0200
Subject: [PATCH] Add check-avalability js

---
 templates/base.layout.tmpl   | 21 ---------------------
 templates/generals.page.tmpl | 21 ++++++++++++++++++++-
 templates/majors.page.tmpl   | 21 ++++++++++++++++++++-
 3 files changed, 40 insertions(+), 23 deletions(-)

diff --git a/templates/base.layout.tmpl b/templates/base.layout.tmpl
index 71cf68f..fec36f1 100644
--- a/templates/base.layout.tmpl
+++ b/templates/base.layout.tmpl
@@ -218,27 +218,6 @@
                 }
             }
 
-            // document.getElementById("dummy").addEventListener('click', () => {
-            //     notify("This is a message", "success");
-            //     // notifyModal("title", "text", "success", "confirm");
-            //     // Prompt().toast({msg: "Prompt Test"})
-            //     Prompt().success({msg: "Success!"})
-            //     // Prompt().error({msg: "Ooops"})
-            //
-            //     let html = `
-            //     <form action="reservation.html" method="get" novalidate class="needs-validation">
-            //         <div id="reservation-dates-modal" class="row">
-            //             <div class="col mb-3">
-            //                 <input disabled required type="text" class="form-control" name="start" id="start" placeholder="Arrival">
-            //             </div>
-            //             <div class="col mb-3">
-            //                 <input disabled required type="text" class="form-control" name="end" id="end" placeholder="Departure">
-            //             </div>
-            //         </div>
-            //     </form>
-            // `;
-            //     Prompt().custom({title: "Choose your dates", msg: html})
-            // });
         </script>
 
         {{block "js" .}}
diff --git a/templates/generals.page.tmpl b/templates/generals.page.tmpl
index 1f8a629..bba3fdd 100644
--- a/templates/generals.page.tmpl
+++ b/templates/generals.page.tmpl
@@ -23,8 +23,27 @@
 
     <div class="row">
         <div class="d-flex justify-content-center py-3">
-            <a href="/make-reservation-gq" class="btn btn-success">Check Availability</a>
+            <button id="make-reservation" class="btn btn-success">Check Availability</button>
         </div>
     </div>
 </div>
 {{end}}
+{{define "js"}}
+<script>
+    document.getElementById("make-reservation").addEventListener('click', () => {
+        let html = `
+                <form action="reservation.html" method="get" novalidate class="needs-validation">
+                    <div id="reservation-dates-modal" class="row">
+                        <div class="col mb-3">
+                            <input disabled required type="text" class="form-control" name="start" id="start" placeholder="Arrival">
+                        </div>
+                        <div class="col mb-3">
+                            <input disabled required type="text" class="form-control" name="end" id="end" placeholder="Departure">
+                        </div>
+                    </div>
+                </form>
+            `;
+        Prompt().custom({title: "Choose your dates", msg: html})
+    });
+</script>
+{{end}}
diff --git a/templates/majors.page.tmpl b/templates/majors.page.tmpl
index c978353..a81d80b 100644
--- a/templates/majors.page.tmpl
+++ b/templates/majors.page.tmpl
@@ -23,8 +23,27 @@
 
     <div class="row">
         <div class="d-flex justify-content-center py-3">
-            <a href="/make-reservation-ms" class="btn btn-success">Check Availability</a>
+            <button id="make-reservation" class="btn btn-success">Check Availability</button>
         </div>
     </div>
 </div>
 {{end}}
+{{define "js"}}
+<script>
+    document.getElementById("make-reservation").addEventListener('click', () => {
+        let html = `
+                <form action="reservation.html" method="get" novalidate class="needs-validation">
+                    <div id="reservation-dates-modal" class="row">
+                        <div class="col mb-3">
+                            <input disabled required type="text" class="form-control" name="start" id="start" placeholder="Arrival">
+                        </div>
+                        <div class="col mb-3">
+                            <input disabled required type="text" class="form-control" name="end" id="end" placeholder="Departure">
+                        </div>
+                    </div>
+                </form>
+            `;
+        Prompt().custom({title: "Choose your dates", msg: html})
+    });
+</script>
+{{end}}