<?php
require_once 'config.inc.php';



$ref = $_GET['ref'] ?? '';

$stmt = $dbh->prepare("
    SELECT *
    FROM mondialisa_formation_certificate
    WHERE ref = ?
   
");
$stmt->execute([$ref]);
$cert = $stmt->fetch(PDO::FETCH_ASSOC);

if (!$cert) {
    die('Certificat introuvable');
}
?>
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Certificat</title>
<style>
body {
    font-family: 'Georgia', serif;
    background: #f0f0f0;
    padding: 40px;
}

.cert {
    background: #fdfdfdff;
    border: 10px double #b8860b; /* double golden border */
    padding: 60px 40px;
    max-width: 850px;
    margin: auto;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    position: relative;
}

/* Corner decorations */
.cert::before,
.cert::after {
    content: '';
    position: absolute;
    width: 80px;
    height: 80px;
    border: 5px solid #b8860b;
    border-radius: 20px;
}
.cert::before { top: -20px; left: -20px; }
.cert::after { bottom: -20px; right: -20px; }

.cert img {
    max-width: 160px;
    margin-bottom: 20px;
}

h1 { font-size: 42px; color: #b8860b; margin: 20px 0; }
h2 { font-size: 32px; color: #222; margin: 15px 0; }
h3 { font-size: 28px; color: #555; margin-bottom: 10px; }

p { font-size: 18px; color: #333; margin: 8px 0; }
small { color: #777; }

/* Buttons */
button {
    padding: 10px 18px;
    margin: 5px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 16px;
}
button:hover { opacity: 0.9; }

</style>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"></script>

</head>
<body>

<div class="cert" id="certificate">

<img src="img/logo.png" alt="Mondialisa"
         style="max-width:160px;margin-bottom:20px">

    <h3>Certificate of achievement</h3>

    <p>This certificate is awarded to</p>
    <h2><?= htmlspecialchars($cert['fullname']) ?></h2>

    <p>for having successfully completed the training and passing the exam for</p>
    <h1><?= htmlspecialchars($cert['title']) ?></h1>

    <p>Date : <?= date('d/m/Y', strtotime($cert['issued_at'])) ?></p>

    <small>ID : <?= htmlspecialchars($cert['ref']) ?></small>
</div>
<br/>
<center>
 <button onclick="downloadPDF()">📄 PDF</button> 
 <button onclick="shareLinkedIn()">🔗 LinkedIn</button>
  <a 
        href="https://www.linkedin.com/profile/add?startTask=CERTIFICATION_NAME
        &name=<?= urlencode($cert['title']) ?>
        &organizationName=Mondialisa
        &issueYear=<?= date('Y', strtotime($cert['issued_at'])) ?>
        &issueMonth=<?= date('m', strtotime($cert['issued_at'])) ?>
        &certUrl=<?= urlencode('https://mondialisa.com/certificate.php?ref='.$cert['ref']) ?>
        &certId=<?= urlencode($cert['ref']) ?>"
        target="_blank"
        class="btn btn-success"
    >
        ➕ Ajouter au profil LinkedIn
    </a>
    </center>


</body>
<script>
async function downloadPDF(){
    const { jsPDF } = window.jspdf;

    const cert = document.getElementById('certificate');

    const canvas = await html2canvas(cert, {
        scale: 2,
        useCORS: true
    });

    const imgData = canvas.toDataURL('image/png');

    const pdf = new jsPDF('landscape', 'mm', 'a4');

    const pageWidth  = pdf.internal.pageSize.getWidth();
    const pageHeight = pdf.internal.pageSize.getHeight();

    pdf.addImage(
        imgData,
        'PNG',
        10,
        10,
        pageWidth - 20,
        pageHeight - 20
    );

    pdf.save("certificat-<?= htmlspecialchars($cert['ref']) ?>.pdf");
}
</script>
<script>
function shareLinkedIn(){
    const url = encodeURIComponent(window.location.href);
    const title = encodeURIComponent(
        "🎓 Certificat de réussite – <?= addslashes($cert['title']) ?>"
    );
    const summary = encodeURIComponent(
        "Je viens de réussir la formation « <?= addslashes($cert['title']) ?> » sur Mondialisa.com 🎉"
    );

    const linkedinUrl =
        "https://www.linkedin.com/sharing/share-offsite/?url=" + url;

    window.open(linkedinUrl, "_blank", "width=600,height=600");
}
</script>


</html>
