i finally committed i guess
Signed-off-by: boris <boris@borishub.co.uk>
This commit is contained in:
163
Views/template/createModal.phtml
Normal file → Executable file
163
Views/template/createModal.phtml
Normal file → Executable file
@@ -1,32 +1,145 @@
|
||||
<button type="button" class="col btn bg-primary btn-outline-primary text-light" data-bs-toggle="modal" data-bs-target="#createModal">
|
||||
<span class="bi bi-pen-fill"></span>
|
||||
</button>
|
||||
<div class="modal fade" id="createModal" tabindex="-1" aria-labelledby="updateModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="updateModalLabel">Add Facility</h5>
|
||||
<?php if($view->user->getAccessLevel() == 1): ?>
|
||||
<!-- Create Facility Modal -->
|
||||
<div class="modal fade" id="createModal" tabindex="-1" aria-labelledby="createModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="createModalLabel">
|
||||
<i class="bi bi-plus-circle-fill text-success me-2"></i>Add New Facility
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form method="post" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>">
|
||||
<form class="form-inline" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?> ">
|
||||
<input name="titlCreate" class="form-control rounded mb-2" placeholder="Title">
|
||||
<input name="cateCreate" class="form-control rounded mb-2" placeholder="Category">
|
||||
<input name="descCreate" class="form-control rounded mb-2" placeholder="Description">
|
||||
<input name="hnumCreate" class="form-control rounded mb-2" placeholder="House Number">
|
||||
<input name="strtCreate" class="form-control rounded mb-2" placeholder="Street Name">
|
||||
<input name="cntyCreate" class="form-control rounded mb-2" placeholder="County">
|
||||
<input name="townCreate" class="form-control rounded mb-2" placeholder="Town">
|
||||
<input name="postCreate" class="form-control rounded mb-2" placeholder="Postcode">
|
||||
<input name="contCreate" class="form-control rounded mb-2" placeholder="Contributor">
|
||||
</form>
|
||||
<button type="submit" class="btn bg-primary btn-outline-primary text-light" name="createButton">Add</button>
|
||||
<div class="modal-body p-4">
|
||||
<form id="createForm">
|
||||
<input type="hidden" name="action" value="create">
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="titlCreate" class="form-label">Title</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-tag text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="titlCreate" name="titlCreate" placeholder="Enter facility title" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="cateCreate" class="form-label">Category</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-bookmark text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="cateCreate" name="cateCreate" placeholder="Enter facility category" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="descCreate" class="form-label">Description</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-card-text text-success"></i>
|
||||
</span>
|
||||
<textarea class="form-control border-start-0" id="descCreate" name="descCreate" placeholder="Enter facility description" rows="3" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="hnumCreate" class="form-label">House/Building Number</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-house text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="hnumCreate" name="hnumCreate" placeholder="Enter number" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="strtCreate" class="form-label">Street Name</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-signpost text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="strtCreate" name="strtCreate" placeholder="Enter street name" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="townCreate" class="form-label">Town/City</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-building text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="townCreate" name="townCreate" placeholder="Enter town/city" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="cntyCreate" class="form-label">County</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-map text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="cntyCreate" name="cntyCreate" placeholder="Enter county" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="postCreate" class="form-label">Postcode</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-mailbox text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="postCreate" name="postCreate" placeholder="Enter postcode" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="latCreate" class="form-label">Latitude</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-geo-alt text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="latCreate" name="latCreate" placeholder="Enter latitude" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="lngCreate" class="form-label">Longitude</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-geo-alt text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="lngCreate" name="lngCreate" placeholder="Enter longitude" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="contCreate" class="form-label">Contributor</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-person text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0 bg-light" id="contCreate" name="contCreate" placeholder="Auto-filled with your username" disabled required>
|
||||
</div>
|
||||
<small class="text-muted">This will be automatically filled with your username</small>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-warning" data-bs-dismiss="modal">Close</button>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" form="createForm" class="btn btn-success">
|
||||
<i class="bi bi-plus-circle me-1"></i>Create Facility
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
41
Views/template/deleteModal.phtml
Normal file → Executable file
41
Views/template/deleteModal.phtml
Normal file → Executable file
@@ -1,20 +1,37 @@
|
||||
<button type="button" class="col btn bg-danger btn-outline-danger text-light" data-bs-toggle="modal" data-bs-target="#deleteModal">
|
||||
<span class="bi bi-trash-fill">
|
||||
</button>
|
||||
<!-- Delete Facility Modal -->
|
||||
<div class="modal fade" id="deleteModal" tabindex="-1" aria-labelledby="deleteModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="deleteModalLabel">Delete Facility Record</h5>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="deleteModalLabel">
|
||||
<i class="bi bi-trash text-danger me-2"></i>Delete Facility
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form method="post" action="">
|
||||
<button type="submit" value="delete" class="btn bg-danger btn-outline-danger text-light" name="deleteButton"">Yes</button>
|
||||
<input type="hidden" name="id" value="<?= $facilityData->getId()?>">
|
||||
<button type="button" class="btn btn-outline primary btn-primary" data-bs-dismiss="modal">No</button>
|
||||
<div class="modal-body p-4">
|
||||
<form id="deleteForm">
|
||||
<input type="hidden" name="action" value="delete">
|
||||
<input type="hidden" name="idDelete" value="">
|
||||
|
||||
<div class="alert alert-warning">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i>
|
||||
<span>Are you sure you want to delete this facility record? This action cannot be undone.</span>
|
||||
</div>
|
||||
|
||||
<div class="mt-3">
|
||||
<p class="mb-1 fw-bold">Facility to be deleted:</p>
|
||||
<p id="deleteConfirmationText" class="text-danger mb-0"></p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" form="deleteForm" class="btn btn-danger">
|
||||
<i class="bi bi-trash me-1"></i>Delete Permanently
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
92
Views/template/footer.phtml
Normal file → Executable file
92
Views/template/footer.phtml
Normal file → Executable file
@@ -1,8 +1,6 @@
|
||||
</div>
|
||||
<div class="site-footer fixed-bottom mt-auto">
|
||||
<div class="col-auto">
|
||||
<?php require_once('pagination.phtml'); ?>
|
||||
</div>
|
||||
<div class="site-footer mt-auto">
|
||||
<!-- Footer Content -->
|
||||
<div class="row">
|
||||
<div id="footer" class="col-xs-12">
|
||||
<p class="m-0">George Wilkinson @2024</p>
|
||||
@@ -10,10 +8,92 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bootstrap core JavaScript
|
||||
================================================== -->
|
||||
<!-- Placed at the end of the document so the pages load faster -->
|
||||
<!-- script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script -->
|
||||
<script src="/js/bootstrap.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<!-- Application JavaScript -->
|
||||
<!-- Note: simpleAuth.js is already included in the header -->
|
||||
<!-- Note: facilityData.js is already included in the header -->
|
||||
<script src="/public/js/comments.js"></script>
|
||||
|
||||
<!-- Initialize components -->
|
||||
<script>
|
||||
// Only run initialization if not already done
|
||||
if (!window.initializationComplete) {
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Initialize auth service
|
||||
const loginButton = document.querySelector('[data-bs-toggle="modal"]');
|
||||
const loginModal = document.getElementById('loginModal');
|
||||
|
||||
// Initialize all modals
|
||||
try {
|
||||
const modalElements = document.querySelectorAll('.modal');
|
||||
modalElements.forEach(modalElement => {
|
||||
if (modalElement) {
|
||||
const modalInstance = new bootstrap.Modal(modalElement, {
|
||||
backdrop: true,
|
||||
keyboard: true,
|
||||
focus: true
|
||||
});
|
||||
|
||||
// Add click handler for modal triggers
|
||||
const triggers = document.querySelectorAll(`[data-bs-target="#${modalElement.id}"]`);
|
||||
triggers.forEach(trigger => {
|
||||
trigger.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
modalInstance.show();
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Error initializing modals:', error);
|
||||
}
|
||||
|
||||
// Initialize auth form handlers
|
||||
const loginForm = document.querySelector('#loginModal form');
|
||||
const loginError = document.querySelector('#loginError');
|
||||
const captchaContainer = document.querySelector('.captcha-container');
|
||||
|
||||
if (loginForm) {
|
||||
// Show CAPTCHA if needed
|
||||
if (simpleAuth.needsCaptcha() && captchaContainer) {
|
||||
captchaContainer.style.display = 'flex';
|
||||
}
|
||||
}
|
||||
|
||||
// Handle logout button
|
||||
const logoutButton = document.querySelector('button[name="logoutButton"]');
|
||||
if (logoutButton) {
|
||||
logoutButton.addEventListener('click', async (e) => {
|
||||
e.preventDefault();
|
||||
await simpleAuth.logout();
|
||||
});
|
||||
}
|
||||
|
||||
// Validate token if authenticated
|
||||
if (simpleAuth.isAuthenticated()) {
|
||||
simpleAuth.validateToken().then(valid => {
|
||||
if (!valid) {
|
||||
if (!localStorage.getItem('validationAttempted')) {
|
||||
localStorage.setItem('validationAttempted', 'true');
|
||||
window.location.reload();
|
||||
} else {
|
||||
localStorage.removeItem('validationAttempted');
|
||||
}
|
||||
} else {
|
||||
localStorage.removeItem('validationAttempted');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Mark initialization as complete
|
||||
window.initializationComplete = true;
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
365
Views/template/header.phtml
Normal file → Executable file
365
Views/template/header.phtml
Normal file → Executable file
@@ -4,100 +4,317 @@
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="">
|
||||
<meta name="description" content="EcoBuddy - Sustainable facilities management platform">
|
||||
<meta name="author" content="">
|
||||
<link rel="icon" type="image/x-icon" href="/images/ecoBuddy_x32.png"
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link href="/css/bootstrap.css" rel="stylesheet">
|
||||
<!-- Bootstrap theme -->
|
||||
<link href="/css/bootstrap-theme.css" rel="stylesheet">
|
||||
<link href="/css/my-style.css" rel="stylesheet">
|
||||
<link rel="icon" type="image/x-icon" href="/images/ecoBuddy_x32.png">
|
||||
|
||||
<!-- Bootstrap core CSS from CDN for faster loading -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||
|
||||
<!-- CSS theme -->
|
||||
<link href="/public/css/my-style.css" rel="stylesheet">
|
||||
|
||||
<!-- Bootstrap Icons -->
|
||||
<link href="/css/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="/public/css/bootstrap-icons.css" rel="stylesheet">
|
||||
|
||||
<!-- Leaflet -->
|
||||
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
|
||||
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
|
||||
|
||||
<!-- Dynamic page title based on the current page -->
|
||||
<title>Ecobuddy - <?php echo $view->pageTitle; ?></title>
|
||||
|
||||
<!-- Load simplified authentication helper -->
|
||||
<script src="/public/js/simpleAuth.js"></script>
|
||||
|
||||
<!-- Load API client -->
|
||||
<script src="/public/js/apiClient.js"></script>
|
||||
|
||||
<!-- Load facility data script -->
|
||||
<script src="/public/js/facilityData.js"></script>
|
||||
|
||||
<!-- Initialise facility data from PHP server-side data -->
|
||||
<script>
|
||||
<?php if (isset($view->facilityDataSet) && is_array($view->facilityDataSet)): ?>
|
||||
try {
|
||||
// Convert PHP data to JavaScript object with proper encoding
|
||||
// Using JSON_UNESCAPED_SLASHES and JSON_UNESCAPED_UNICODE for proper character handling
|
||||
const initialData = <?php echo json_encode($view->facilityDataSet,
|
||||
JSON_UNESCAPED_SLASHES |
|
||||
JSON_UNESCAPED_UNICODE |
|
||||
JSON_PARTIAL_OUTPUT_ON_ERROR
|
||||
); ?>;
|
||||
|
||||
// Validate and store data in sessionStorage for use across the application
|
||||
if (Array.isArray(initialData) && initialData.length > 0) {
|
||||
sessionStorage.setItem('facilityData', JSON.stringify(initialData));
|
||||
|
||||
// Initialize based on DOM state to ensure scripts run at the right time
|
||||
if (document.readyState === 'complete' || document.readyState === 'interactive') {
|
||||
if (typeof initialiseFacilityData === 'function') {
|
||||
initialiseFacilityData(initialData);
|
||||
}
|
||||
} else {
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (typeof initialiseFacilityData === 'function') {
|
||||
initialiseFacilityData(initialData);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// Add client-side authentication check to update UI
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Check if user is authenticated on the client side
|
||||
if (window.auth && window.auth.isAuthenticated()) {
|
||||
console.log('User is authenticated on client side');
|
||||
|
||||
// Get user data
|
||||
const user = window.auth.getUser();
|
||||
if (user) {
|
||||
console.log('User data:', user);
|
||||
|
||||
// Hide login button if it exists
|
||||
const loginButton = document.getElementById('loginButton');
|
||||
if (loginButton) {
|
||||
loginButton.style.display = 'none';
|
||||
}
|
||||
|
||||
// Hide login modal if it exists
|
||||
const loginModal = document.getElementById('loginModal');
|
||||
if (loginModal) {
|
||||
loginModal.style.display = 'none';
|
||||
}
|
||||
|
||||
// Show user menu
|
||||
const userMenuContainer = document.createElement('div');
|
||||
userMenuContainer.className = 'user-menu';
|
||||
userMenuContainer.innerHTML = `
|
||||
<div class="user-avatar">
|
||||
<i class="bi bi-person-fill text-success"></i>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-light dropdown-toggle" type="button" id="userMenuButton" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
${user.username}
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenuButton">
|
||||
<li><a class="dropdown-item" href="#"><i class="bi bi-person me-2"></i>Profile</a></li>
|
||||
<li><a class="dropdown-item" href="#"><i class="bi bi-gear me-2"></i>Settings</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><button class="dropdown-item text-danger" id="logoutButton"><i class="bi bi-box-arrow-right me-2"></i>Logout</button></li>
|
||||
</ul>
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Replace login button with user menu
|
||||
if (loginButton) {
|
||||
loginButton.parentNode.replaceChild(userMenuContainer, loginButton);
|
||||
}
|
||||
|
||||
// Add logout button handler
|
||||
const logoutButton = document.getElementById('logoutButton');
|
||||
if (logoutButton) {
|
||||
logoutButton.addEventListener('click', async function() {
|
||||
await window.auth.logout();
|
||||
window.location.reload();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('Error processing facility data:', error);
|
||||
}
|
||||
<?php endif; ?>
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<nav class="navbar navbar-expand-lg p-0 m-2 border rounded-2">
|
||||
<div class="container-fluid">
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarTogglerDemo03" aria-controls="navbarTogglerDemo03" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<body role="document">
|
||||
<!-- Navigation bar -->
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-white shadow-sm sticky-top">
|
||||
<div class="container-fluid px-3">
|
||||
<!-- Brand logo and name -->
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.php">
|
||||
<img src="/images/ecoBuddy_x64.png" alt="EcoBuddy Logo" width="48" height="48" class="me-2">
|
||||
<span class="fw-bold text-success">EcoBuddy</span>
|
||||
</a>
|
||||
|
||||
<!-- Mobile menu toggle -->
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent"
|
||||
aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="/index.php"><img id="navIcon" class="img-thumbnail bg-transparent border-3 border-success border-opacity-25 rounded my-1 me-2" height="64px" width="64px" src="/images/ecoBuddy_x64.png" alt=""/><span class="pt-5 mb-auto">Ecobuddy</span></a>
|
||||
<div class="collapse navbar-collapse" id="navbarTogglerDemo03">
|
||||
|
||||
<!-- Navigation content -->
|
||||
<div class="collapse navbar-collapse" id="navbarContent">
|
||||
<!-- Main navigation links -->
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" aria-current="page" href="/index.php">
|
||||
<i class="bi bi-house-fill me-1"></i>Home
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="/map.php">
|
||||
<i class="bi bi-map-fill me-1"></i>Map
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="/about.php">
|
||||
<i class="bi bi-info-circle-fill me-1"></i>About
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<form class="row m-0 me-2 align-content-center align-content-center align-items-center" role="search" action="" method="POST">
|
||||
<div class="col">
|
||||
<div class="form-floating input-group">
|
||||
<select name="sort" class="form-select border-3 border-success-subtle" id="sort">
|
||||
<option value="1" <?php if(isset($_GET['sort']) && $_GET['sort'] == '1') echo 'selected'; ?>>Title</option>
|
||||
<option value="2" <?php if(isset($_GET['sort']) && $_GET['sort'] == '2') echo 'selected'; ?>>Category</option>
|
||||
<option value="0" <?php if(isset($_GET['sort']) && $_GET['sort'] == '0') echo 'selected'; ?>>Status</option>
|
||||
<option value="3" <?php if(isset($_GET['sort']) && $_GET['sort'] == '3') echo 'selected'; ?>>Description</option>
|
||||
<option value="4" <?php if(isset($_GET['sort']) && $_GET['sort'] == '4') echo 'selected'; ?>>Street Name</option>
|
||||
<option value="5" <?php if(isset($_GET['sort']) && $_GET['sort'] == '5') echo 'selected'; ?>>County</option>
|
||||
<option value="6" <?php if(isset($_GET['sort']) && $_GET['sort'] == '6') echo 'selected'; ?>>Town</option>
|
||||
<option value="7" <?php if(isset($_GET['sort']) && $_GET['sort'] == '7') echo 'selected'; ?>>Postcode</option>
|
||||
<option value="8" <?php if(isset($_GET['sort']) && $_GET['sort'] == '8') echo 'selected'; ?>>Contributor</option>
|
||||
</select>
|
||||
<span class="form-floating input-group">
|
||||
<select class="form-select border-3 border-start-0 rounded-end border-success-subtle" name="dir" id="dir">
|
||||
<option value="asc" <?php if($_GET['dir'] == 'asc') echo 'selected'; ?>>Asc</option>
|
||||
<option value="desc" <?php if($_GET['dir'] == 'desc') echo 'selected'; ?>>Desc</option>
|
||||
</select>
|
||||
<label for="dir">Order</label>
|
||||
|
||||
<!-- Search and filter controls -->
|
||||
<div class="d-flex flex-column flex-lg-row search-controls mx-auto">
|
||||
<form class="d-flex flex-column flex-lg-row gap-2 w-100" role="search" action="" method="POST">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-sort-alpha-down text-success"></i>
|
||||
</span>
|
||||
<label for="sort">Sort By</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="form-floating input-group">
|
||||
<select name="filterCat" class="form-select border-3 border-success-subtle" id="filterCat">
|
||||
<option value="1" <?php if(isset($_GET['category']) && $_GET['category'] == '1') echo 'selected'; ?>>Title</option>
|
||||
<option value="2" <?php if(isset($_GET['category']) && $_GET['category'] == '2') echo 'selected'; ?>>Category</option>
|
||||
<option value="0" <?php if(isset($_GET['category']) && $_GET['category'] == '0') echo 'selected'; ?>>Status</option>
|
||||
<option value="3" <?php if(isset($_GET['category']) && $_GET['category'] == '3') echo 'selected'; ?>>Description</option>
|
||||
<option value="4" <?php if(isset($_GET['category']) && $_GET['category'] == '4') echo 'selected'; ?>>Street Name</option>
|
||||
<option value="5" <?php if(isset($_GET['category']) && $_GET['category'] == '5') echo 'selected'; ?>>County</option>
|
||||
<option value="6" <?php if(isset($_GET['category']) && $_GET['category'] == '6') echo 'selected'; ?>>Town</option>
|
||||
<option value="7" <?php if(isset($_GET['category']) && $_GET['category'] == '7') echo 'selected'; ?>>Postcode</option>
|
||||
<option value="8" <?php if(isset($_GET['category']) && $_GET['category'] == '8') echo 'selected'; ?>>Contributor</option>
|
||||
<select name="sort" class="form-select border-start-0 filter-control" id="sort">
|
||||
<option value="title">Title</option>
|
||||
<option value="category">Category</option>
|
||||
<option value="status">Status</option>
|
||||
<option value="description">Description</option>
|
||||
<option value="streetName">Street</option>
|
||||
<option value="county">County</option>
|
||||
<option value="town">Town</option>
|
||||
<option value="postcode">Postcode</option>
|
||||
<option value="contributor">Contributor</option>
|
||||
</select>
|
||||
<select class="form-select sort-control" name="dir" id="dir" data-order="asc">
|
||||
<option value="asc">Asc</option>
|
||||
<option value="desc">Desc</option>
|
||||
</select>
|
||||
<span class="input-group-text bi bi-filter-circle bg-success-subtle border-0 rounded-end" id="filterCat"></span>
|
||||
<label for="filterCat">Column Filter</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<div class="form-floating input-group">
|
||||
<label for="search"></label>
|
||||
<input placeholder="<?php if(isset($_GET['filter'])) echo $_GET['filter']; ?>" class="form-control border-3 border-success-subtle" id="search" type="search" name="filter" aria-label="Search">
|
||||
<span class="input-group-text bg-success-subtle border-0 rounded-end" id="search">
|
||||
<button class="btn bg-light bg-success-subtle" type="submit"><span class="bi bi-search"></span></button>
|
||||
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-filter-circle-fill text-success"></i>
|
||||
</span>
|
||||
<select name="filterCat" class="form-select border-start-0 filter-control" id="filterCat">
|
||||
<option value="">All</option>
|
||||
<option value="title">Title</option>
|
||||
<option value="category">Category</option>
|
||||
<option value="status">Status</option>
|
||||
<option value="description">Description</option>
|
||||
<option value="streetName">Street</option>
|
||||
<option value="county">County</option>
|
||||
<option value="town">Town</option>
|
||||
<option value="postcode">Postcode</option>
|
||||
<option value="contributor">Contributor</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div class="me-2 ms-2">
|
||||
<div class="col-sm" id="loginStatus">
|
||||
<?php
|
||||
|
||||
if(!$view->user->isLoggedIn()) {
|
||||
require_once('Views/template/loginModal.phtml');
|
||||
}
|
||||
if($view->user->isLoggedIn()) {
|
||||
require_once('Views/template/logoutButton.phtml');
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-search text-success"></i>
|
||||
</span>
|
||||
<input class="form-control border-start-0" id="searchInput" type="search" name="filter" placeholder="Search..." aria-label="Search">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- User account section -->
|
||||
<div class="ms-lg-3 mt-3 mt-lg-0">
|
||||
<?php if(!$view->user->isLoggedIn()): ?>
|
||||
<button type="button" class="btn btn-success" id="loginButton" data-bs-toggle="modal" data-bs-target="#loginModal">
|
||||
<i class="bi bi-box-arrow-in-right me-1"></i>Login
|
||||
</button>
|
||||
<?php else: ?>
|
||||
<div class="user-menu">
|
||||
<div class="user-avatar">
|
||||
<i class="bi bi-person-fill text-success"></i>
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-light dropdown-toggle" type="button" id="userMenuButton" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<?php echo $view->user->getUsername(); ?>
|
||||
</button>
|
||||
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="userMenuButton">
|
||||
<li><a class="dropdown-item" href="#"><i class="bi bi-person me-2"></i>Profile</a></li>
|
||||
<li><a class="dropdown-item" href="#"><i class="bi bi-gear me-2"></i>Settings</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><button class="dropdown-item text-danger" id="logoutButton"><i class="bi bi-box-arrow-right me-2"></i>Logout</button></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<body role="document">
|
||||
|
||||
<div class="main container-fluid">
|
||||
<div class="col" id="content">
|
||||
<!-- Login Modal -->
|
||||
<?php if(!$view->user->isLoggedIn()): ?>
|
||||
<div class="modal fade" id="loginModal" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="loginModalLabel">
|
||||
<i class="bi bi-box-arrow-in-right text-success me-2"></i>Login to EcoBuddy
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-4">
|
||||
<form id="loginForm">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">Username</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-person text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="username" name="username" placeholder="Enter your username" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-lock text-success"></i>
|
||||
</span>
|
||||
<input type="password" class="form-control border-start-0" id="password" name="password" placeholder="Enter your password" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loginError" class="alert alert-danger" style="display: none;"></div>
|
||||
|
||||
<div class="row captcha-container" style="display: none;">
|
||||
<!-- CAPTCHA Display -->
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="captchaCode" class="form-label">CAPTCHA Code</label>
|
||||
<input type="text" class="form-control bg-light" id="captchaCode" name="generatedCaptcha" value="" readonly>
|
||||
</div>
|
||||
|
||||
<!-- CAPTCHA Input -->
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="captchaInput" class="form-label">Enter CAPTCHA</label>
|
||||
<input type="text" class="form-control" id="captchaInput" name="captchaInput" placeholder="Enter code">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-2 mt-4">
|
||||
<button type="submit" class="btn btn-success">
|
||||
<i class="bi bi-box-arrow-in-right me-2"></i>Login
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">Don't have an account? <a href="" onclick="alert('Please contact the administrator to create an account.');" class="text-success">Register</a></small>
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Main content container -->
|
||||
<div class="container-fluid py-4 px-3">
|
||||
<div class="row" id="content">
|
||||
|
||||
|
||||
|
||||
|
0
Views/template/loginError.phtml
Normal file → Executable file
0
Views/template/loginError.phtml
Normal file → Executable file
74
Views/template/loginModal.phtml
Normal file → Executable file
74
Views/template/loginModal.phtml
Normal file → Executable file
@@ -1,38 +1,62 @@
|
||||
<button type="button" class="btn bg-primary btn-outline-primary text-light m-auto" data-bs-toggle="modal"
|
||||
data-bs-target="#loginModal">
|
||||
Login
|
||||
</button>
|
||||
<?= isset($view->loginError) ? '<div class="modal-backdrop fade show"></div>' : '' ?>
|
||||
<div class="modal fade <?= isset($view->loginError) ? 'show' : '' ?>" id="loginModal" tabindex="-1"
|
||||
aria-labelledby="loginModalLabel" aria-hidden="<?= isset($view->loginError) ? 'false' : 'true' ?>"
|
||||
style="<?= isset($view->loginError) ? 'display: block;' : '' ?>">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="loginModalLabel">Login</h5>
|
||||
<!-- Login Modal -->
|
||||
<div class="modal fade" id="loginModal" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="loginModalLabel">
|
||||
<i class="bi bi-box-arrow-in-right text-success me-2"></i>Login to EcoBuddy
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form method="post" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>">
|
||||
<div class="modal-body p-4">
|
||||
<form id="loginForm">
|
||||
<div class="mb-3">
|
||||
<label for="username" class="form-label">Username</label>
|
||||
<input type="text" class="form-control" id="username" name="username" placeholder="Username"
|
||||
required>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-person text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="username" name="username" placeholder="Enter your username" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="password" class="form-label">Password</label>
|
||||
<input type="password" class="form-control" id="password" name="password" placeholder="Password"
|
||||
required>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-lock text-success"></i>
|
||||
</span>
|
||||
<input type="password" class="form-control border-start-0" id="password" name="password" placeholder="Enter your password" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="loginError" class="alert alert-danger" style="display: none;"></div>
|
||||
|
||||
<div class="row captcha-container" style="display: none;">
|
||||
<!-- CAPTCHA Display -->
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="captchaCode" class="form-label">CAPTCHA Code</label>
|
||||
<input type="text" class="form-control bg-light" id="captchaCode" name="generatedCaptcha" value="" readonly>
|
||||
</div>
|
||||
|
||||
<!-- CAPTCHA Input -->
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="captchaInput" class="form-label">Enter CAPTCHA</label>
|
||||
<input type="text" class="form-control" id="captchaInput" name="captchaInput" placeholder="Enter code">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-2 mt-4">
|
||||
<button type="submit" class="btn btn-success">
|
||||
<i class="bi bi-box-arrow-in-right me-2"></i>Login
|
||||
</button>
|
||||
</div>
|
||||
<?php if (isset($view->loginError)) { include('Views/template/loginError.phtml');} ?>
|
||||
<button type="submit" class="btn bg-primary btn-outline-primary text-light" name="loginButton">Login
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="/index.php <?php unset($_GET['modal'])?>" type="button" class="btn btn-warning btn-outline-warning text-light" data-bs-dismiss="modal">
|
||||
Close
|
||||
</a>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">Don't have an account? <a href="" onclick="alert('Please contact the administrator to create an account.');" class="text-success">Register</a></small>
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
6
Views/template/logoutButton.phtml
Normal file → Executable file
6
Views/template/logoutButton.phtml
Normal file → Executable file
@@ -1,4 +1,2 @@
|
||||
<form class="form-floating my-auto" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?> ">
|
||||
<?php echo "<p class='text-center bg-light border-0 rounded mb-1' style='color: black;'>" . $user->getUsername() . "<span class='bi bi-person-fill'></span></p>"?>
|
||||
<button class="btn bg-danger btn-outline-danger text-light" type="submit" name="logoutButton">Logout</button>
|
||||
</form>
|
||||
<?php echo "<p class='text-center bg-light border-0 rounded mb-1' style='color: black;'>" . $user->getUsername() . "<span class='bi bi-person-fill'></span></p>"?>
|
||||
<button class="btn bg-danger btn-outline-danger text-light" type="button" id="logoutButton">Logout</button>
|
||||
|
111
Views/template/pagination.phtml
Normal file → Executable file
111
Views/template/pagination.phtml
Normal file → Executable file
@@ -1,37 +1,78 @@
|
||||
<div>
|
||||
<div class="row mb-2">
|
||||
<!-- Form for Pagination -->
|
||||
<div id="paginationButtons" class="col-auto m-auto btn-group">
|
||||
|
||||
<?php
|
||||
$param = $_GET;
|
||||
unset($param['page']); // Remove the page parameter to avoid duping
|
||||
function buildUrl($page, $param): string
|
||||
{
|
||||
$param['page'] = $page;
|
||||
return '?' . http_build_query($param);
|
||||
}
|
||||
?>
|
||||
<!-- Start Button -->
|
||||
<a class="btn btn-outline-primary" href="<?= buildUrl(0, $param) ?>0" <?= $view->pageNumber <= 0 ? 'disabled' : '' ?>><i class="bi bi-chevron-double-left"></i> Start</a>
|
||||
<!-- Back Button -->
|
||||
<a class="btn btn-outline-primary" href="<?= buildUrl(max($view->pageNumber - 1, 0), $param)?> " <?= $view->pageNumber <= 0 ? 'disabled' : '' ?>><i class="bi bi-chevron-left"></i> Back</a>
|
||||
<!-- Dynamic Page Buttons -->
|
||||
<?php
|
||||
$totalPages = $view->paginator->getTotalPages();
|
||||
for ($i = $view->pageNumber - 2; $i <= $view->pageNumber + 2; $i++) {
|
||||
if ($i >= 0 && $i < $totalPages): ?>
|
||||
<a href="<?= buildUrl($i, $param) ?>"
|
||||
class="btn <?= $i === $view->pageNumber ? 'btn-dark' : 'btn-outline-primary' ?>"
|
||||
<?= $i === $view->pageNumber ? 'disabled' : '' ?>>
|
||||
<?= $i + 1 ?>
|
||||
</a>
|
||||
<?php endif;
|
||||
} ?>
|
||||
<!-- Forward Button -->
|
||||
<a class="btn btn-outline-primary" href="<?=buildUrl(min($view->pageNumber + 1, $totalPages), $param)?>" <?= $view->pageNumber >= $totalPages - 1 ? 'disabled' : '' ?>>Forward <i class="bi bi-chevron-right"></i></a>
|
||||
<!-- End Button -->
|
||||
<a class="btn btn-outline-primary" href="<?= buildUrl($totalPages - 1, $param) ?>"<?= $view->pageNumber >= $totalPages - 1 ? 'disabled' : '' ?>>End <i class="bi bi-chevron-double-right"></i></a>
|
||||
</div>
|
||||
<div class="d-flex flex-column flex-md-row justify-content-between align-items-center gap-2">
|
||||
<div class="text-muted small">
|
||||
<span id="paginationInfo" class="d-flex align-items-center">
|
||||
<i class="bi bi-info-circle me-2 text-success"></i>
|
||||
<span>Showing facilities</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Pagination controls -->
|
||||
<nav aria-label="Facility table pagination">
|
||||
<ul class="pagination pagination-sm mb-0" id="paginationControls">
|
||||
<!-- First page button -->
|
||||
<li class="page-item">
|
||||
<a class="page-link border-0 text-success" href="#" aria-label="First" id="firstPage">
|
||||
<i class="bi bi-chevron-double-left"></i>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Previous page button -->
|
||||
<li class="page-item">
|
||||
<a class="page-link border-0 text-success" href="#" aria-label="Previous" id="prevPage">
|
||||
<i class="bi bi-chevron-left"></i>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Dynamic page numbers will be inserted here as list items -->
|
||||
|
||||
<!-- Next page button -->
|
||||
<li class="page-item">
|
||||
<a class="page-link border-0 text-success" href="#" aria-label="Next" id="nextPage">
|
||||
<i class="bi bi-chevron-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Last page button -->
|
||||
<li class="page-item">
|
||||
<a class="page-link border-0 text-success" href="#" aria-label="Last" id="lastPage">
|
||||
<i class="bi bi-chevron-double-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<!-- Items per page selector -->
|
||||
<div class="d-flex align-items-center">
|
||||
<label for="itemsPerPage" class="form-label text-muted small mb-0 me-2">Items per page:</label>
|
||||
<select class="form-select form-select-sm" id="itemsPerPage" style="width: 70px;">
|
||||
<option value="10">10</option>
|
||||
<option value="25">25</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
// Set up items per page selector
|
||||
const itemsPerPageSelect = document.getElementById('itemsPerPage');
|
||||
if (itemsPerPageSelect) {
|
||||
itemsPerPageSelect.addEventListener('change', function() {
|
||||
// Update items per page in the pagination system
|
||||
if (typeof itemsPerPage !== 'undefined') {
|
||||
itemsPerPage = parseInt(this.value);
|
||||
currentPage = 1; // Reset to first page
|
||||
|
||||
// Recalculate total pages
|
||||
if (typeof filteredData !== 'undefined' && typeof totalPages !== 'undefined') {
|
||||
totalPages = Math.ceil(filteredData.length / itemsPerPage);
|
||||
|
||||
// Update table with new pagination
|
||||
if (typeof updateTableWithPagination === 'function') {
|
||||
updateTableWithPagination();
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
107
Views/template/statusModal.phtml
Executable file
107
Views/template/statusModal.phtml
Executable file
@@ -0,0 +1,107 @@
|
||||
<!-- Facility Comments Modal -->
|
||||
<div class="modal fade" id="statusModal" tabindex="-1" aria-labelledby="statusModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered modal-lg">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="statusModalLabel">
|
||||
<i class="bi bi-chat-square-text text-primary me-2"></i>Facility Comments
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-4">
|
||||
<!-- Add Comment Form (Only shown to logged in users) -->
|
||||
<?php if (isset($_SESSION['loggedin']) && $_SESSION['loggedin'] === true && $_SESSION['access'] >= 1): ?>
|
||||
<div class="mb-4 border-bottom pb-4">
|
||||
<h6 class="fw-bold mb-3">
|
||||
<i class="bi bi-plus-circle text-success me-2"></i>Add New Comment
|
||||
</h6>
|
||||
<form id="commentForm">
|
||||
<input type="hidden" name="action" value="status">
|
||||
<input type="hidden" name="facilityId" id="commentFacilityId" value="">
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="commentText" class="form-label">Your Comment</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-pencil text-primary"></i>
|
||||
</span>
|
||||
<textarea class="form-control border-start-0" id="commentText" name="commentText" rows="3" placeholder="Share your thoughts about this facility..." required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-end">
|
||||
<button type="submit" class="btn btn-primary">
|
||||
<i class="bi bi-send me-1"></i>Post Comment
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Existing Comments Section -->
|
||||
<div>
|
||||
<h6 class="fw-bold mb-3">
|
||||
<i class="bi bi-chat-square-dots text-primary me-2"></i>Comments
|
||||
</h6>
|
||||
|
||||
<div id="commentsContainer" class="comments-container">
|
||||
<!-- Comments will be loaded here dynamically -->
|
||||
<div class="text-center py-4 text-muted" id="noCommentsMessage">
|
||||
<i class="bi bi-chat-square-text fs-4 d-block mb-2"></i>
|
||||
<p>No comments yet. Be the first to share your thoughts!</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Login Prompt for Non-Authenticated Users -->
|
||||
<?php if (!isset($_SESSION['loggedin']) || $_SESSION['loggedin'] !== true): ?>
|
||||
<div class="alert alert-info mt-3">
|
||||
<i class="bi bi-info-circle me-2"></i>
|
||||
<span>Please <a href="#" data-bs-toggle="modal" data-bs-target="#loginModal" data-bs-dismiss="modal">log in</a> to add your comments.</span>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer bg-light">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Close</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Edit Comment Modal -->
|
||||
<div class="modal fade" id="editCommentModal" tabindex="-1" aria-labelledby="editCommentModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="editCommentModalLabel">
|
||||
<i class="bi bi-pencil-square text-primary me-2"></i>Edit Comment
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body p-4">
|
||||
<form id="editCommentForm">
|
||||
<input type="hidden" name="action" value="editComment">
|
||||
<input type="hidden" name="commentId" id="editCommentId" value="">
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="editCommentText" class="form-label">Edit Your Comment</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-pencil text-primary"></i>
|
||||
</span>
|
||||
<textarea class="form-control border-start-0" id="editCommentText" name="editCommentText" rows="4" placeholder="Update your comment..." required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" form="editCommentForm" class="btn btn-primary">
|
||||
<i class="bi bi-check-circle me-1"></i>Save Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
158
Views/template/updateModal.phtml
Normal file → Executable file
158
Views/template/updateModal.phtml
Normal file → Executable file
@@ -1,31 +1,143 @@
|
||||
<button type="button" class="col btn bg-primary btn-outline-primary text-light" data-bs-toggle="modal" data-bs-target="#updateModal">
|
||||
<span class="bi bi-pen-fill"></span>
|
||||
</button>
|
||||
|
||||
<!-- Update Facility Modal -->
|
||||
<div class="modal fade" id="updateModal" tabindex="-1" aria-labelledby="updateModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="updateModalLabel">Update Facility</h5>
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-header bg-light">
|
||||
<h5 class="modal-title" id="updateModalLabel">
|
||||
<i class="bi bi-pencil-square text-success me-2"></i>Update Facility
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form method="post" action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>">
|
||||
<input name="titlUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getTitle() ?? '' ?>" placeholder="Title">
|
||||
<input name="cateUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getCategory() ?? '' ?>" placeholder="Category">
|
||||
<input name="descUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getDescription() ?? '' ?>" placeholder="Description">
|
||||
<input name="hnumUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getHouseNumber() ?? '' ?>" placeholder="House Number">
|
||||
<input name="strtUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getStreetName() ?? '' ?>" placeholder="Street Name">
|
||||
<input name="cntyUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getCounty() ?? '' ?>" placeholder="County">
|
||||
<input name="townUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getTown() ?? '' ?>" placeholder="Town">
|
||||
<input name="postUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getPostcode() ?? '' ?>" placeholder="Postcode">
|
||||
<input name="contUpdate" class="form-control rounded mb-2" value="<?= $facilityData->getContributor() ?? '' ?>" placeholder="Contributor">
|
||||
<button type="submit" class="btn bg-primary btn-outline-primary text-light" name="updateButton">Update</button>
|
||||
<input type="hidden" name="idUpdate" value="<?= $facilityData->getId()?>">
|
||||
<div class="modal-body p-4">
|
||||
<form id="updateForm">
|
||||
<input type="hidden" name="action" value="update">
|
||||
<input type="hidden" name="idUpdate" value="">
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="titlUpdate" class="form-label">Title</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-tag text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="titlUpdate" name="titlUpdate" placeholder="Enter facility title" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="cateUpdate" class="form-label">Category</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-bookmark text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="cateUpdate" name="cateUpdate" placeholder="Enter facility category" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="descUpdate" class="form-label">Description</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-card-text text-success"></i>
|
||||
</span>
|
||||
<textarea class="form-control border-start-0" id="descUpdate" name="descUpdate" placeholder="Enter facility description" rows="3" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="hnumUpdate" class="form-label">House/Building Number</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-house text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="hnumUpdate" name="hnumUpdate" placeholder="Enter number" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="strtUpdate" class="form-label">Street Name</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-signpost text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="strtUpdate" name="strtUpdate" placeholder="Enter street name" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="townUpdate" class="form-label">Town/City</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-building text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="townUpdate" name="townUpdate" placeholder="Enter town/city" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="cntyUpdate" class="form-label">County</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-map text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="cntyUpdate" name="cntyUpdate" placeholder="Enter county" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="postUpdate" class="form-label">Postcode</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-mailbox text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="postUpdate" name="postUpdate" placeholder="Enter postcode" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="latUpdate" class="form-label">Latitude</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-geo-alt text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="latUpdate" name="latUpdate" placeholder="Enter latitude" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<label for="lngUpdate" class="form-label">Longitude</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-geo-alt text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0" id="lngUpdate" name="lngUpdate" placeholder="Enter longitude" required>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="contUpdate" class="form-label">Contributor</label>
|
||||
<div class="input-group">
|
||||
<span class="input-group-text bg-light border-end-0">
|
||||
<i class="bi bi-person text-success"></i>
|
||||
</span>
|
||||
<input type="text" class="form-control border-start-0 bg-light" id="contUpdate" name="contUpdate" placeholder="Original contributor" readonly required>
|
||||
</div>
|
||||
<small class="text-muted">Original contributor of this facility</small>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-warning" data-bs-dismiss="modal">Close</button>
|
||||
<div class="modal-footer bg-light">
|
||||
<div class="w-100 d-flex justify-content-between">
|
||||
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
|
||||
<button type="submit" form="updateForm" class="btn btn-success">
|
||||
<i class="bi bi-check-circle me-1"></i>Update Facility
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
Reference in New Issue
Block a user