From 7823c4d002740cf23f9d8ef9fbf6b0fb50f876f6 Mon Sep 17 00:00:00 2001
From: Anjaliavv51 <154777864+Anjaliavv51@users.noreply.github.com>
Date: Wed, 3 Jul 2024 22:48:51 +0530
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8[Feature=20Request]:=20Creating=20POPU?=
=?UTF-8?q?P=20to=20blood=20types?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
#746
---
Css-Files/bloodstyle.css | 58 +++-
Html-Files/blood.html | 27 +-
Html-Files/list.html | 730 ---------------------------------------
js/popupbloodlist.js | 135 ++++++++
4 files changed, 207 insertions(+), 743 deletions(-)
delete mode 100644 Html-Files/list.html
create mode 100644 js/popupbloodlist.js
diff --git a/Css-Files/bloodstyle.css b/Css-Files/bloodstyle.css
index dc998bba..b12974c6 100644
--- a/Css-Files/bloodstyle.css
+++ b/Css-Files/bloodstyle.css
@@ -664,4 +664,60 @@ padding-top: 3rem;
text-align: center;
padding: 1rem 0.5rem 2rem 0.5rem;
}
- }
\ No newline at end of file
+ }
+ /*Popup Blood list*/
+ .popup {
+ display: none;
+ position: fixed;
+ z-index: 1000;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ background-color: rgba(0,0,0,0.4);
+}
+
+.popup-content {
+ background-color: #fefefe;
+ margin: 15% auto;
+ padding: 20px;
+ border: 1px solid #888;
+ width: 80%;
+ max-width: 600px;
+}
+
+.close {
+ color: #aaa;
+ float: right;
+ font-size: 28px;
+ font-weight: bold;
+ cursor: pointer;
+}
+
+.close:hover,
+.close:focus {
+ color: black;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.popup-content h2, .popup-content h3 {
+ color: #4bb6b7;
+ padding: 10px 0;
+ margin: 0;
+}
+
+.popup-content .list {
+ padding-left: 20px;
+}
+
+.popup-content .list p {
+ margin: 5px 0;
+}
+
+.popup-content strong {
+ display: block;
+ margin-top: 10px;
+ margin-bottom: 20px;
+}
\ No newline at end of file
diff --git a/Html-Files/blood.html b/Html-Files/blood.html
index 14b86ba2..7f0a4d2e 100644
--- a/Html-Files/blood.html
+++ b/Html-Files/blood.html
@@ -53,7 +53,7 @@
A+
liters
- Get List
+ Get List
@@ -207,10 +207,12 @@ RAPIDOC Newsletter
-
-
-
-
+
+
diff --git a/Html-Files/list.html b/Html-Files/list.html
deleted file mode 100644
index 0f5026bd..00000000
--- a/Html-Files/list.html
+++ /dev/null
@@ -1,730 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-Blood Bank
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Top Donors to India
-
-
-
-
${bloodType} Blood
`;
+
+ content += `Donors
`;
+ let totalDonation = 0;
+ data.donors.forEach(donor => {
+ content += `
${donor.name}: ${donor.amount} L
`;
+ totalDonation += donor.amount;
+ });
+ content += `
Total Donation: ${totalDonation.toFixed(2)} L
`;
+
+ content += `Recipients
`;
+ let totalNeeded = 0;
+ data.recipients.forEach(recipient => {
+ content += `
${recipient.name}: ${recipient.amount} L
`;
+ totalNeeded += recipient.amount;
+ });
+ content += `
Total Needed: ${totalNeeded.toFixed(2)} L
`;
+
+ return content;
+ }
+
+ // Add click event listeners to all "Get List" buttons
+ document.querySelectorAll('.get-list-btn').forEach(btn => {
+ btn.addEventListener('click', function(e) {
+ e.preventDefault();
+ const bloodType = this.id.split('-')[1];
+ popupContent.innerHTML = generatePopupContent(bloodType);
+ popup.style.display = 'block';
+ });
+ });
+
+ // Close popup when clicking the close button
+ closeBtn.addEventListener('click', function() {
+ popup.style.display = 'none';
+ });
+
+ // Close popup when clicking outside the popup content
+ window.addEventListener('click', function(e) {
+ if (e.target == popup) {
+ popup.style.display = 'none';
+ }
+ });
+});
\ No newline at end of file
-
-
-