188 lines
8.6 KiB
PHP
188 lines
8.6 KiB
PHP
<?php
|
|
declare(strict_types=1);
|
|
@ini_set('display_errors', '1');
|
|
@error_reporting(E_ALL);
|
|
@date_default_timezone_set('UTC');
|
|
|
|
require_once __DIR__ . '/includes/registration_db.php';
|
|
require_once __DIR__ . '/includes/flash.php';
|
|
ensure_registration_table();
|
|
|
|
$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
|
|
$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
|
|
$now = date('Y-m-d H:i:s');
|
|
$flash = flash_get();
|
|
?>
|
|
<!doctype html>
|
|
<html lang="id">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Aplikasi Pendaftaran — Form Online</title>
|
|
<?php if ($projectDescription): ?>
|
|
<meta name="description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
|
<meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
|
<meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
|
|
<?php endif; ?>
|
|
<?php if ($projectImageUrl): ?>
|
|
<meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
|
<meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
|
|
<?php endif; ?>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="assets/css/custom.css?v=<?= time() ?>">
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" defer></script>
|
|
<script src="assets/js/main.js?v=<?= time() ?>" defer></script>
|
|
</head>
|
|
<body class="app-body">
|
|
<nav class="navbar navbar-expand-lg navbar-light bg-white border-bottom sticky-top">
|
|
<div class="container">
|
|
<a class="navbar-brand fw-semibold" href="/">Pendaftaran</a>
|
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMain" aria-controls="navMain" aria-expanded="false" aria-label="Toggle navigation">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navMain">
|
|
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
|
|
<li class="nav-item"><a class="nav-link" href="#daftar">Form Pendaftaran</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="#alur">Alur</a></li>
|
|
<li class="nav-item"><a class="nav-link" href="admin_login.php">Admin</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<header class="py-5 border-bottom">
|
|
<div class="container">
|
|
<div class="row align-items-center g-4">
|
|
<div class="col-lg-7">
|
|
<span class="badge text-bg-light border mb-3">Responsive · Mobile & Desktop</span>
|
|
<h1 class="display-6 fw-semibold">Aplikasi Pendaftaran Online yang rapi, cepat, dan mudah diakses.</h1>
|
|
<p class="text-muted mt-3 mb-4">
|
|
Pendaftar mengisi data tanpa login, sistem memberi nomor pendaftaran otomatis,
|
|
dan admin dapat melihat laporan beserta foto serta export PDF.
|
|
</p>
|
|
<div class="d-flex flex-wrap gap-2">
|
|
<a class="btn btn-dark px-4" href="#daftar">Mulai Daftar</a>
|
|
<a class="btn btn-outline-secondary px-4" href="admin_login.php">Login Admin</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-5">
|
|
<div class="card shadow-sm border-0">
|
|
<div class="card-body">
|
|
<h2 class="h6 text-uppercase text-muted">Ringkasan Fitur</h2>
|
|
<ul class="list-unstyled mt-3 mb-0 small">
|
|
<li class="mb-2">✔ Form pendaftaran tanpa login</li>
|
|
<li class="mb-2">✔ Upload foto dari kamera atau galeri</li>
|
|
<li class="mb-2">✔ Admin report + export PDF</li>
|
|
<li class="mb-0">✔ Tampilan responsif</li>
|
|
</ul>
|
|
<p class="small text-muted mt-3 mb-0">Update terakhir: <?= htmlspecialchars($now) ?> UTC</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="py-5">
|
|
<section id="daftar" class="container">
|
|
<div class="row g-4">
|
|
<div class="col-lg-6">
|
|
<h2 class="h4 fw-semibold">Form Pendaftaran</h2>
|
|
<p class="text-muted">Lengkapi data di bawah ini. Semua field wajib diisi.</p>
|
|
<div class="alert alert-light border small mb-4">
|
|
Setelah submit, Anda akan menerima <strong>nomor pendaftaran</strong> sebagai bukti.
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="card shadow-sm border-0">
|
|
<div class="card-body">
|
|
<?php if ($flash): ?>
|
|
<div class="alert alert-<?= htmlspecialchars($flash['type']) ?> border-0 small">
|
|
<?= htmlspecialchars($flash['message']) ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
<form action="register.php" method="post" enctype="multipart/form-data" class="needs-validation" novalidate>
|
|
<div class="mb-3">
|
|
<label class="form-label" for="name">Nama Lengkap</label>
|
|
<input type="text" class="form-control" id="name" name="name" required>
|
|
<div class="invalid-feedback">Nama wajib diisi.</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" for="education">Pendidikan</label>
|
|
<select class="form-select" id="education" name="education" required>
|
|
<option value="">Pilih Pendidikan</option>
|
|
<option>SD</option>
|
|
<option>SMP</option>
|
|
<option>SLTA</option>
|
|
<option>D3</option>
|
|
<option>S1</option>
|
|
</select>
|
|
<div class="invalid-feedback">Pilih pendidikan terakhir.</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" for="major">Jurusan Pendidikan</label>
|
|
<input type="text" class="form-control" id="major" name="major" required>
|
|
<div class="invalid-feedback">Jurusan wajib diisi.</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<label class="form-label" for="profile">Profile (Foto)</label>
|
|
<input type="file" class="form-control" id="profile" name="profile" accept="image/*" capture="environment" required>
|
|
<div class="form-text">Gunakan kamera perangkat atau pilih dari galeri.</div>
|
|
<div class="invalid-feedback">Foto profil wajib diunggah.</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<div class="photo-preview border rounded-3 p-2 text-center text-muted small">
|
|
<img id="photoPreview" alt="Preview foto pendaftar" class="img-fluid d-none rounded-2">
|
|
<span id="photoPlaceholder">Preview foto akan tampil di sini.</span>
|
|
</div>
|
|
</div>
|
|
<button type="submit" class="btn btn-dark w-100">Kirim Pendaftaran</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="alur" class="container mt-5 pt-3">
|
|
<div class="row g-4">
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 border-0 shadow-sm">
|
|
<div class="card-body">
|
|
<h3 class="h6 fw-semibold">1. Isi Form</h3>
|
|
<p class="text-muted small mb-0">Pendaftar mengisi data dan unggah foto.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 border-0 shadow-sm">
|
|
<div class="card-body">
|
|
<h3 class="h6 fw-semibold">2. Nomor Pendaftaran</h3>
|
|
<p class="text-muted small mb-0">Sistem memberi kode registrasi otomatis.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-4">
|
|
<div class="card h-100 border-0 shadow-sm">
|
|
<div class="card-body">
|
|
<h3 class="h6 fw-semibold">3. Admin Report</h3>
|
|
<p class="text-muted small mb-0">Admin melihat data + export PDF.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="border-top py-4">
|
|
<div class="container small text-muted d-flex flex-wrap gap-3 justify-content-between">
|
|
<span>© <?= date('Y') ?> Aplikasi Pendaftaran</span>
|
|
<span>Butuh bantuan? hubungi admin internal.</span>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|