38458-vm/ballot.php
2026-02-15 20:43:30 +00:00

211 lines
8.5 KiB
PHP

<?php
declare(strict_types=1);
require_once __DIR__ . '/auth_helper.php';
require_login();
$user = get_user();
$id = $_GET['id'] ?? '';
if (!$id) {
header("Location: index.php");
exit;
}
$pdo = db();
$stmt = $pdo->prepare("SELECT * FROM elections WHERE id = ?");
$stmt->execute([$id]);
$election = $stmt->fetch();
if (!$election || $election['status'] !== 'Ongoing') {
die("Election is not currently ongoing.");
}
// Check if already voted
$check = $pdo->prepare("SELECT COUNT(*) FROM votes WHERE election_id = ? AND voter_id = ?");
$check->execute([$id, $user['id']]);
if ($check->fetchColumn() > 0) {
header("Location: view_results.php?id=$id&error=AlreadyVoted");
exit;
}
$positions = $pdo->prepare("SELECT * FROM positions WHERE election_id = ? ORDER BY sort_order ASC");
$positions->execute([$id]);
$positions = $positions->fetchAll();
?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Vote: <?= htmlspecialchars($election['title']) ?></title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/css/dashboard.css?v=<?= time() ?>">
<script src="https://unpkg.com/lucide@latest"></script>
<style>
body { background: #f8fafc; color: #1e293b; font-family: 'Inter', sans-serif; }
.ballot-container { max-width: 800px; margin: 40px auto; padding: 0 20px; }
.ballot-header { text-align: center; margin-bottom: 48px; }
.ballot-header h1 { font-size: 2.5rem; font-weight: 800; color: #1e293b; margin-bottom: 12px; letter-spacing: -0.025em; }
.ballot-header p { color: #64748b; font-size: 1.125rem; }
.position-group { margin-bottom: 40px; background: white; border-radius: 24px; border: 1px solid #e2e8f0; padding: 32px; box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1); }
.position-title { font-size: 1.25rem; font-weight: 700; color: #1e293b; margin-bottom: 24px; display: flex; align-items: center; gap: 12px; }
.position-title i { color: #4f46e5; }
.candidates-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.candidate-label { cursor: pointer; display: block; }
.candidate-card {
border: 2px solid #e2e8f0;
border-radius: 16px;
padding: 20px;
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
display: flex;
align-items: center;
gap: 16px;
background: white;
position: relative;
}
.candidate-card:hover { border-color: #cbd5e1; background: #f8fafc; }
input[type="radio"]:checked + .candidate-card,
input[type="checkbox"]:checked + .candidate-card {
border-color: #4f46e5;
background: #f5f3ff;
box-shadow: 0 0 0 1px #4f46e5;
}
input[type="radio"]:checked + .candidate-card .check-icon,
input[type="checkbox"]:checked + .candidate-card .check-icon {
background: #4f46e5;
color: white;
border-color: #4f46e5;
}
input[type="radio"], input[type="checkbox"] { display: none; }
.avatar-placeholder {
width: 56px;
height: 56px;
background: #f1f5f9;
border-radius: 14px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
color: #4f46e5;
font-size: 1.25rem;
border: 1px solid #e2e8f0;
}
.candidate-info h3 { margin: 0; font-size: 1.125rem; font-weight: 700; color: #1e293b; }
.candidate-info p { margin: 4px 0 0 0; font-size: 0.875rem; color: #64748b; font-weight: 500; }
.check-icon {
margin-left: auto;
width: 24px;
height: 24px;
border: 2px solid #e2e8f0;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
color: transparent;
transition: all 0.2s;
}
.submit-section { margin-top: 64px; text-align: center; padding: 48px; background: #1e293b; border-radius: 24px; color: white; }
.btn-submit {
background: #4f46e5;
color: white;
border: none;
padding: 16px 48px;
border-radius: 12px;
font-size: 1.125rem;
font-weight: 700;
cursor: pointer;
transition: all 0.2s;
box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.4);
}
.btn-submit:hover { transform: translateY(-2px); background: #4338ca; }
.btn-submit:active { transform: translateY(0); }
</style>
</head>
<body>
<div class="ballot-container">
<div class="ballot-header animate-fade-in">
<div style="display: inline-flex; align-items: center; gap: 8px; background: #e0e7ff; color: #4338ca; padding: 6px 16px; border-radius: 100px; font-size: 0.875rem; font-weight: 700; margin-bottom: 16px;">
<i data-lucide="vote" style="width: 16px;"></i> OFFICIAL BALLOT
</div>
<h1><?= htmlspecialchars($election['title']) ?></h1>
<p>Your vote is secure and anonymous. Choose your representatives below.</p>
</div>
<form action="api/submit_vote.php" method="POST" onsubmit="return confirm('Are you sure you want to cast your vote? This action cannot be undone.')">
<input type="hidden" name="election_id" value="<?= $id ?>">
<?php foreach ($positions as $index => $pos): ?>
<div class="position-group animate-stagger" style="--order: <?= $index ?>">
<div class="position-title">
<i data-lucide="award"></i>
<?= htmlspecialchars($pos['name']) ?>
</div>
<?php
$sql = "SELECT c.*, u.name, u.track FROM candidates c JOIN users u ON c.user_id = u.id WHERE c.position_id = ? AND c.approved = TRUE";
$params = [$pos['id']];
if ($pos['type'] === 'Track Specific') {
$sql .= " AND u.track = ?";
$params[] = $user['track'];
}
$cStmt = $pdo->prepare($sql);
$cStmt->execute($params);
$candidates = $cStmt->fetchAll();
?>
<?php if (empty($candidates)): ?>
<div style="padding: 24px; background: #f8fafc; border-radius: 12px; text-align: center; border: 1px dashed #cbd5e1;">
<p style="margin: 0; color: #64748b; font-size: 0.875rem;">No candidates for this position.</p>
</div>
<?php else: ?>
<div class="candidates-grid">
<?php foreach ($candidates as $cand): ?>
<label class="candidate-label">
<input type="radio" name="votes[<?= $pos['id'] ?>]" value="<?= $cand['id'] ?>" required>
<div class="candidate-card">
<div class="avatar-placeholder">
<?= substr($cand['name'], 0, 1) ?>
</div>
<div class="candidate-info">
<h3><?= htmlspecialchars($cand['name']) ?></h3>
<p><?= htmlspecialchars($cand['party_name'] ?: 'Independent') ?></p>
</div>
<div class="check-icon">
<i data-lucide="check" style="width: 14px;"></i>
</div>
</div>
</label>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php endforeach; ?>
<div class="submit-section animate-fade-in">
<h2 style="margin: 0 0 12px 0; font-size: 1.5rem;">Ready to submit?</h2>
<p style="margin: 0 0 32px 0; color: #94a3b8; font-size: 1rem;">Please review your selections before casting your vote.</p>
<button type="submit" class="btn-submit">
Cast My Vote
</button>
<div style="margin-top: 24px; display: flex; align-items: center; justify-content: center; gap: 8px; color: #64748b; font-size: 0.875rem;">
<i data-lucide="shield-check" style="width: 16px; color: #10b981;"></i> Verified Secure Election
</div>
</div>
</form>
</div>
<script>
lucide.createIcons();
</script>
</body>
</html>