diff --git a/assets/pasted-20251017-100534-44f1cec7.png b/assets/pasted-20251017-100534-44f1cec7.png new file mode 100644 index 0000000..db005ef Binary files /dev/null and b/assets/pasted-20251017-100534-44f1cec7.png differ diff --git a/register.php b/register.php index c10a65f..7b73c91 100644 --- a/register.php +++ b/register.php @@ -23,20 +23,7 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") { header('Content-Type: application/json'); // --- DATA CAPTURE --- - $webinar_id = filter_input(INPUT_POST, 'webinar_id', FILTER_VALIDATE_INT); - - // --- WEBINAR DETAILS --- - $webinar = null; - if ($webinar_id) { - try { - // Fetch webinar details to create calendar links - $stmt = $pdo->prepare("SELECT title, description, starts_at, ends_at FROM webinars WHERE id = ?"); - $stmt->execute([$webinar_id]); - $webinar = $stmt->fetch(PDO::FETCH_ASSOC); - } catch (PDOException $e) { - // Log error, but don't show to user - } - } + // The $webinar object is already available from the initial page load. $email = filter_input(INPUT_POST, 'email', FILTER_VALIDATE_EMAIL); $first_name = filter_input(INPUT_POST, 'first_name', FILTER_SANITIZE_STRING); $last_name = filter_input(INPUT_POST, 'last_name', FILTER_SANITIZE_STRING); @@ -149,17 +136,14 @@ if (!$webinar) { .form-card h2 { margin-top: 0; font-size: 1.5rem; color: #f6e05e; text-align: center; } .form-group { margin-bottom: 1.5rem; } label { display: block; margin-bottom: 0.5rem; font-weight: bold; } - input[type="email"], input[type="text"] { width: 100%; padding: 0.75rem; background-color: #1a202c; border: 1px solid #4a5568; border-radius: 0.375rem; color: #e2e8f0; font-size: 1rem; box-sizing: border-box; } - .consent-group { display: flex; align-items: start; gap: 0.75rem; } - .consent-group label { font-weight: normal; font-size: 0.9rem; color: #a0aec0; } - .microcopy { font-size: 0.8rem; color: #718096; margin-top: 0.5rem; } + input[type="email"], input[type="text"], input[type="password"] { width: 100%; padding: 0.75rem; background-color: #1a202c; border: 1px solid #4a5568; border-radius: 0.375rem; color: #e2e8f0; font-size: 1rem; box-sizing: border-box; } .submit-btn { display: block; width: 100%; background-color: #f6e05e; color: #1a202c; padding: 0.85rem; border: none; border-radius: 0.375rem; font-weight: bold; font-size: 1.125rem; cursor: pointer; transition: background-color 0.2s; } .submit-btn:hover { background-color: #f6d32d; } .submit-btn:disabled { background-color: #4a5568; cursor: not-allowed; } #form-result { margin-top: 1.5rem; text-align: center; } - .success-message { background-color: #2d3748; border: 1px solid #4a5568; padding: 2rem; border-radius: 0.5rem; } + .success-message { background-color: #2d3748; border: 1px solid #4a5568; padding: 2rem; border-radius: 0.5rem; text-align: center; } .error-message { background-color: #c53030; padding: 1rem; border-radius: 0.375rem; } - .calendar-buttons a, .copy-link-btn { display: inline-block; background-color: #4a5568; color: #e2e8f0; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; margin: 0.5rem; font-weight: bold; } + .calendar-buttons a { display: inline-block; background-color: #4a5568; color: #e2e8f0; padding: 0.75rem 1.5rem; border-radius: 0.375rem; text-decoration: none; margin: 0.5rem; font-weight: bold; } @media (max-width: 768px) { .container { grid-template-columns: 1fr; } } @@ -187,7 +171,6 @@ if (!$webinar) {
-

We’ll send the join link & calendar invite.

@@ -264,78 +247,81 @@ if (!$webinar) { submitButton.textContent = 'Processing...'; const formData = new FormData(form); - fetch(window.location.href, { - method: 'POST', - body: formData - }) - .then(response => response.json()) - .then(data => { - if (data.success) { - formContainer.style.display = 'none'; - const webinarTitle = encodeURIComponent(data.webinar_title); - const webinarDate = new Date(data.webinar_date_utc + 'Z'); - - // Correctly format dates for UTC (YYYYMMDDTHHMMSSZ) - const formatUTCDate = (date) => { - return date.toISOString().replace(/\.\d{3}Z$/, 'Z').replace(/[-:]/g, ''); - }; + const xhr = new XMLHttpRequest(); + xhr.open('POST', window.location.href, true); + + xhr.onload = function() { + if (xhr.status >= 200 && xhr.status < 400) { + console.log("Response from server:", xhr.responseText); + let data; + try { + data = JSON.parse(xhr.responseText); + } catch (e) { + formResult.innerHTML = '
An unexpected error occurred parsing the server response.
'; + console.error("JSON Parsing Error:", e); + return; + } - const startTime = formatUTCDate(webinarDate); - const endTime = formatUTCDate(new Date(webinarDate.getTime() + (60 * 60 * 1000))); - const googleLink = `https://www.google.com/calendar/render?action=TEMPLATE&text=${webinarTitle}&dates=${startTime}/${endTime}&details=Join+the+webinar!&ctz=UTC`; - - const icsContent = [ - 'BEGIN:VCALENDAR', - 'VERSION:2.0', - 'BEGIN:VEVENT', - `URL:${window.location.href}`, - `DTSTART:${startTime}`, - `DTEND:${endTime}`, - `SUMMARY:${data.webinar_title}`, - 'DESCRIPTION:Join the webinar!', - 'END:VEVENT', - 'END:VCALENDAR' - ].join('\n'); - const outlookLink = `data:text/calendar;charset=utf-8,${encodeURIComponent(icsContent)}`; + if (data.success) { + formContainer.style.display = 'none'; + const webinarTitle = encodeURIComponent(data.webinar_title); + const webinarDate = new Date(data.webinar_date_utc + 'Z'); + + const formatUTCDate = (date) => { + return date.toISOString().replace(/\.\d{3}Z$/, 'Z').replace(/[-:]/g, ''); + }; - formResult.innerHTML = ` -
-

You’re in for ${data.webinar_title}!

-

Check your email for your confirmation. You can now log in to see the details.

-
- Add to Google Calendar - Add to Outlook (ICS) + const startTime = formatUTCDate(webinarDate); + const endTime = formatUTCDate(new Date(webinarDate.getTime() + (60 * 60 * 1000))); + + const googleLink = `https://www.google.com/calendar/render?action=TEMPLATE&text=${webinarTitle}&dates=${startTime}/${endTime}&details=Join+the+webinar!&ctz=UTC`; + + const icsContent = [ + 'BEGIN:VCALENDAR', + 'VERSION:2.0', + 'BEGIN:VEVENT', + `URL:${window.location.href}`, + `DTSTART:${startTime}`, + `DTEND:${endTime}`, + `SUMMARY:${data.webinar_title}`, + 'DESCRIPTION:Join the webinar!', + 'END:VEVENT', + 'END:VCALENDAR' + ].join('\n'); + const outlookLink = `data:text/calendar;charset=utf-8,${encodeURIComponent(icsContent)}`; + + formResult.innerHTML = ` +
+

You’re in for ${data.webinar_title}!

+

Check your email for your confirmation. You can now log in to see the details.

+
-
- `; + `; + } else { + formResult.innerHTML = `
${data.error || 'An unknown error occurred.'}
`; + submitButton.disabled = false; + submitButton.textContent = 'Register Now'; + } } else { - formResult.innerHTML = `
${data.error}
`; + formResult.innerHTML = '
A server error occurred. Please try again later.
'; submitButton.disabled = false; submitButton.textContent = 'Register Now'; } - }) - .catch(error => { - formResult.innerHTML = `
An unexpected error occurred.
`; + }; + + xhr.onerror = function() { + formResult.innerHTML = '
A network error occurred. Please check your connection.
'; submitButton.disabled = false; submitButton.textContent = 'Register Now'; - }); - }); + }; - // --- COPY LINK --- - formResult.addEventListener('click', function(e) { - if (e.target.classList.contains('copy-link-btn')) { - e.preventDefault(); - const link = e.target.dataset.link; - navigator.clipboard.writeText(link).then(() => { - e.target.textContent = 'Copied!'; - setTimeout(() => { - e.target.textContent = 'Copy Join Link'; - }, 2000); - }); - } + xhr.send(formData); }); - \ No newline at end of file +