<!DOCTYPE html>
<html>
<head>
<title> Home </title>
<meta charset="UTF-8">
<meta name="keywords" content="HTML, CSS, JavaScript">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<%- include('./parcials/cssLinks') %>
<link href="<%= baseUrl %>css/dashboard.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="loader">
<div class="loader-content">
<span class="loader-text">Generating Certificate...</span>
<div class="loader-spinner"></div>
</div>
</div>
<%- include('./parcials/dashboard-header') %>
<main>
<section class="dashboard-wrapper">
<div class="container">
<%- include('./parcials/dashboard-topsec') %>
<div class="certificate-track-card">
<div class="card-head">
<h4 class="theme-h4">Recent Items
<!-- <a href="javascript:;" data-bs-toggle="modal"
data-bs-target="#sendCertificate">Generate New <i class="fa-solid fa-plus"></i></a> -->
</h4>
<!-- <ul class="certificate-filters">
<li>
<input type="radio" name="certificate-filter" id="all-certificate" checked>
<label for="all-certificate">all</label>
</li>
<li>
<input type="radio" name="certificate-filter" id="send-certificate">
<label for="send-certificate">send</label>
</li>
<li>
<input type="radio" name="certificate-filter" id="received-certificate">
<label for="received-certificate">received</label>
</li>
</ul> -->
</div>
<div class="certificates-listing">
<% if(certificates.length> 0){ %>
<% const
months=['January','February','March','April','May','June','July','August','September','October','November','December'];
%>
<% certificates.forEach(certificate=> { %>
<% if(certificate.sender==user.id){ %>
<a class="certificate-item sent"
href="<%= baseUrl %>certificate/<%= certificate._id %>">
<div class="info">
<!-- <span class="date-time">16:23, 12 dec 2022</span> -->
<span class="date-time">
<%= certificate.createdAt.getHours() %>:<%=
certificate.createdAt.getMinutes() %>
<%= certificate.createdAt.getDate() %>
<%= months[certificate.createdAt.getMonth()] %>
<%= certificate.createdAt.getFullYear() %>
</span>
<span class="note">
<%= certificate.message %>
</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-right-long"></i>
<span class="account-title">
<%= certificate.name %>
</span>
</div>
</a>
<% } else { %>
<a class="certificate-item" href="<%= certificate.pdfUrl %>"
target="_blank">
<div class="info">
<span class="date-time">16:23, 12 dec 2022</span>
<span class="note">
<%= certificate.message %>
</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-left-long"></i>
<span class="account-title">
<%= certificate.sender.firstName %>
</span>
</div>
</a>
<% } %>
<% }) %>
<% } else { %>
<h4 class="theme-h4">No Certificates Founds</h4>
<% } %>
<!-- <a class="certificate-item sent" href="javascript:;">
<div class="info">
<span class="date-time">16:23, 12 dec 2022</span>
<span class="note">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis,
adipisci?</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-right-long"></i>
<span class="account-title">Name</span>
</div>
</a>
<a class="certificate-item" href="javascript:;">
<div class="info">
<span class="date-time">16:23, 12 dec 2022</span>
<span class="note">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis,
adipisci?</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-left-long"></i>
<span class="account-title">Name</span>
</div>
</a>
<a class="certificate-item sent" href="javascript:;">
<div class="info">
<span class="date-time">16:23, 12 dec 2022</span>
<span class="note">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis,
adipisci?</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-right-long"></i>
<span class="account-title">Name</span>
</div>
</a>
<a class="certificate-item" href="javascript:;">
<div class="info">
<span class="date-time">16:23, 12 dec 2022</span>
<span class="note">Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis,
adipisci?</span>
</div>
<div class="to-whome">
<i class="fa-regular fa-arrow-left-long"></i>
<span class="account-title">Name</span>
</div>
</a> -->
</div>
</div>
</div>
</section>
</main>
<%- include('./parcials/dashboard-footer') %>
<%- include('./parcials/scriptLinks') %>
<script>
$("#loader").css("display", "none")
$("#Generate-certificate-form").submit(function () {
$("#loader").css("display", "block")
})
window.addEventListener('beforeunload', function () {
$("#loader").css("display", "none")
});
</script>
</body>
</html>