‼HFAC, GAVI, MoH TARGET 10% UNVACCINATED CHILDREN IN SIERRA LEONE‼:
<?php
session_start();
include '../../db/db.php';
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$title = mysqli_real_escape_string($conn, $_POST['title']);
$description = mysqli_real_escape_string($conn, $_POST['description']);
$date = mysqli_real_escape_string($conn, $_POST['date']);
$image_urls = [];
// Directory for storing uploaded files
$upload_dir = "../../img/event/";
// Ensure the uploads directory exists
if (!is_dir($upload_dir)) {
mkdir($upload_dir, 0777, true);
}
// Handle Image & Video Uploads
if (!empty($_FILES['media']['name'][0])) {
foreach ($_FILES['media']['tmp_name'] as $key => $tmp_name) {
$file_name = time() . "_" . $_FILES['media']['name'][$key];
$file_path = $upload_dir . $file_name; // File path relative to the public img folder
$file_type = mime_content_type($tmp_name);
$allowed_types = ['image/jpeg', 'image/png', 'image/gif', 'video/mp4', 'video/mpeg'];
if (in_array($file_type, $allowed_types)) {
if (move_uploaded_file($tmp_name, $file_path)) {
$image_urls[] = $file_path; // Store the relative file path
}
}
}
}
$image_json = json_encode($image_urls);
// Insert into database
$query = "INSERT INTO events (title, description, image_url, date)
VALUES ('$title', '$description', '$image_json', '$date')";
if (mysqli_query($conn, $query)) {
$_SESSION['success'] = "Event added successfully!";
header("Location: view_events.php");
exit();
} else {
$_SESSION['error'] = "Error adding event.";
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Add Event</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
.preview-container img, .preview-container video {
max-width: 100px;
margin: 5px;
border-radius: 5px;
}
.form-container {
max-width: 600px;
margin: auto;
padding: 20px;
background: white;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
border-radius: 8px;
}
</style>
</head>
<body class="bg-light">
<div class="container mt-5">
<div class="form-container">
<h2 class="text-center mb-4">Add Event</h2>
<?php if (isset($_SESSION['error'])): ?>
<div class="alert alert-danger"><?= $_SESSION['error']; unset($_SESSION['error']); ?></div>
<?php endif; ?>
<form action="add_event.php" method="POST" enctype="multipart/form-data">
<div class="mb-3">
<label class="form-label">Title:</label>
<input type="text" name="title" class="form-control" required>
</div>
<div class="mb-3">
<label class="form-label">Description:</label>
<textarea name="description" class="form-control" rows="4" required></textarea>
</div>
<div class="mb-3">
<label class="form-label">Date:</label>
<input type="date" name="date" class="form-control" required>
</div>
<div class="mb-3">
<label class="form-label">Upload Images & Videos:</label>
<input type="file" name="media[]" id="mediaInput" class="form-control" multiple accept="image/*, video/*">
<div class="preview-container mt-2 d-flex flex-wrap"></div>
</div>
<button type="submit" class="btn btn-primary w-100">Add Event</button>
</form>
</div>
</div>
<script>
document.getElementById('mediaInput').addEventListener('change', function(event) {
let previewContainer = document.querySelector('.preview-container');
previewContainer.innerHTML = ''; // Clear previous previews
Array.from(event.target.files).forEach(file => {
let reader = new FileReader();
reader.onload = function(e) {
let mediaElement;
if (file.type.startsWith('image')) {
mediaElement = document.createElement('img');
mediaElement.src = e.target.result;
} else if (file.type.startsWith('video')) {
mediaElement = document.createElement('video');
mediaElement.src = e.target.result;
mediaElement.controls = true;
}
mediaElement.style.width = '100px';
mediaElement.style.margin = '5px';
previewContainer.appendChild(mediaElement);
};
reader.readAsDataURL(file);
});
});
</script>
</body>
</html>
