From 2385d0bf7b5734add878fdce5a7e72bd270e4aa3 Mon Sep 17 00:00:00 2001
From: Aidan <aidan@p0ntus.com>
Date: Fri, 20 Dec 2024 01:16:45 -0500
Subject: [PATCH] improve donation page, registration page, add button to
 request checker to home

---
 public/css/donate.css |  4 ++++
 public/js/donate.js   |  8 ++++++++
 src/donate.ejs        | 28 ++++++++++++++++++++++------
 src/index.ejs         |  1 +
 src/register.ejs      |  8 ++++++++
 src/shards/header.ejs |  3 +++
 6 files changed, 46 insertions(+), 6 deletions(-)
 create mode 100644 public/css/donate.css
 create mode 100644 public/js/donate.js

diff --git a/public/css/donate.css b/public/css/donate.css
new file mode 100644
index 0000000..7ae5217
--- /dev/null
+++ b/public/css/donate.css
@@ -0,0 +1,4 @@
+.monero {
+  max-height: 100px;
+  overflow-y: auto;
+}
\ No newline at end of file
diff --git a/public/js/donate.js b/public/js/donate.js
new file mode 100644
index 0000000..cd6505e
--- /dev/null
+++ b/public/js/donate.js
@@ -0,0 +1,8 @@
+function copyToClipboard(elementId) {
+    const text = document.getElementById(elementId).innerText;
+    navigator.clipboard.writeText(text).then(() => {
+        alert('Copied to clipboard');
+    }).catch(err => {
+        console.error('Failed to copy: ', err);
+    });
+}
\ No newline at end of file
diff --git a/src/donate.ejs b/src/donate.ejs
index 46bbb4f..c15198e 100644
--- a/src/donate.ejs
+++ b/src/donate.ejs
@@ -1,4 +1,4 @@
-<%- include('shards/header', { title: 'Donate - p0ntus mail' }) %>
+<%- include('shards/header', { title: 'Donate - p0ntus mail', currentPage: 'donate' }) %>
 <div class="container">
     <%- include('shards/nav', { currentPage: 'donate' }) %>
     <i class="il mt-5">Current donation progress this month</i>
@@ -16,15 +16,31 @@
     <hr>
     <div class="text-start">
         <h5><i class="fa-brands fa-bitcoin ico-sm" style="color: #f7931a;"></i> Bitcoin</h5>
-        <p><%= bitcoin %></p>
+        <div class="d-flex justify-content-between">
+            <p id="bitcoin-address"><%= bitcoin %></p>
+            <button class="btn btn-outline-secondary btn-sm ms-2" onclick="copyToClipboard('bitcoin-address')">Copy</button>
+        </div>
         <h5><i class="fa-brands fa-ethereum ico-sm" style="color: #3c3c3d;"></i> Ethereum</h5>
-        <p><%= ethereum %></p>
+        <div class="d-flex justify-content-between">
+            <p id="ethereum-address"><%= ethereum %></p>
+            <button class="btn btn-outline-secondary btn-sm ms-2" onclick="copyToClipboard('ethereum-address')">Copy</button>
+        </div>
         <h5><i class="fa-solid fa-litecoin-sign ico-sm" style="color: #bebebe;"></i> Litecoin</h5>
-        <p><%= litecoin %></p>
+        <div class="d-flex justify-content-between">
+            <p id="litecoin-address"><%= litecoin %></p>
+            <button class="btn btn-outline-secondary btn-sm ms-2" onclick="copyToClipboard('litecoin-address')">Copy</button>
+        </div>
         <h5><i class="fa-brands fa-monero ico-sm" style="color: #fc6621;"></i> Monero</h5>
-        <p><%= monero %></p>
+        <div class="d-flex justify-content-between">
+            <p id="monero-address" class="monero"><%= monero %></p>
+            <button class="btn btn-outline-secondary btn-sm ms-2" onclick="copyToClipboard('monero-address')">Copy</button>
+        </div>
         <h5><i class="fa-solid fa-dollar-sign ico-sm"></i> Solana</h5>
-        <p><%= solana %></p>
+        <div class="d-flex justify-content-between">
+            <p id="solana-address"><%= solana %></p>
+            <button class="btn btn-outline-secondary btn-sm ms-2" onclick="copyToClipboard('solana-address')">Copy</button>
+        </div>
     </div>
 </div>
+<script src="/js/donate.js"></script>
 <%- include('shards/footer') %>
\ No newline at end of file
diff --git a/src/index.ejs b/src/index.ejs
index c942688..688c9f6 100644
--- a/src/index.ejs
+++ b/src/index.ejs
@@ -11,6 +11,7 @@
             <div class="col-md-6 text-start">
                 <h5><i>If you aren't a current user</i></h5>
                 <a href="/register" class="btn bg-dark text-white mt-2"><i class="fa-solid fa-user-plus ico-sm"></i> Register</a>
+                <a href="/request" class="btn bg-dark text-white mt-2"><i class="fa-solid fa-person-circle-question ico-sm"></i> Check Registration Status</a>
             </div>
             <div class="col-md-6 text-start">
                 <h5><i>If you are a current user</i></h5>
diff --git a/src/register.ejs b/src/register.ejs
index 040af30..5e8c83e 100644
--- a/src/register.ejs
+++ b/src/register.ejs
@@ -2,6 +2,14 @@
 <div class="container">
     <%- include('shards/nav', { currentPage: 'register' }) %>
     <h1 class="mt-5">Register</h1>
+    <i class="il mt-5">If you already filled out a registration request</i>
+    <hr>
+    <div class="text-center">
+      <a href="/request" class="btn bg-dark text-white mt-2">
+        <i class="fa-solid fa-person-circle-question ico-sm"></i> Check Registration Status
+      </a>
+    </div>
+    <i class="il mt-5">If you haven't filled out a registration request</i>
     <hr>
     <form action="/register" method="POST">
         <div class="form-group">
diff --git a/src/shards/header.ejs b/src/shards/header.ejs
index b783ae2..16f112e 100644
--- a/src/shards/header.ejs
+++ b/src/shards/header.ejs
@@ -10,5 +10,8 @@
     <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&display=swap" rel="stylesheet">
     <script src="https://kit.fontawesome.com/50495cc725.js" crossorigin="anonymous"></script>
     <link rel="stylesheet" href="/css/main.css">
+    <% if (currentPage === 'donate') { %>
+        <link rel="stylesheet" href="/css/donate.css">
+    <% } %>
 </head>
 <body>
\ No newline at end of file