Show sourcecode
The following files exists in this folder. Click to view.
webbserverprogrammering/submissions/projekt-matkort-handler/includes/
footer.php
functions.php
header.php
footer.php
164 lines UTF-8 Windows (CRLF)
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
</main> <!-- /content-area slutar här -->
</div> <!-- /main-wrapper slutar här -->
</div> <!-- /app-container slutar här -->
<?php if(isset($_SESSION["logged_in"]) && $_SESSION["logged_in"] === true): ?>
<!-- Global Modal Popup -->
<div id="globalLogModal" class="modal-overlay">
<div class="modal-content">
<button class="modal-close" id="closeLogModal">×</button>
<h2>Skapa ny matlogg</h2>
<div id="modal_error_message" style="display: none; background: #ffebee; color: #e74c3c; padding: 10px; border-radius: var(--radius-sm); margin-bottom: 15px; font-size: 0.9rem; border: 1px solid #ffcdd2; text-align: center; font-weight: bold;"></div>
<form id="globalLogForm" action="<?php echo $base_path; ?>food_logs.php" method="POST">
<div class="form-group">
<label for="modal_restaurant_id">Restaurang</label>
<div class="search-box">
<input id="modal_restaurant_id" type="text" autocomplete="off" placeholder="Sök restaurang..." required />
<div class="result" style="position:absolute; background:#fff; width:100%; z-index:10; border-radius:4px; max-height:150px; overflow-y:auto; box-shadow:0 4px 6px rgba(0,0,0,0.1);"></div>
</div>
<input type="hidden" id="modal_restaurant_id_hidden" name="restaurant_id" required />
</div>
<div class="form-group">
<label for="modal_log_date">Datum & Tid:</label>
<input type="datetime-local" id="modal_log_date" name="log_date" required>
</div>
<div class="form-group">
<label for="modal_money_spent">Pengar spenderat (kr):</label>
<div style="display: flex; gap: 10px; align-items: center;">
<input type="number" id="modal_money_spent" name="money_spent" min="0" max="90" step="1" required style="margin: 0; flex: 1;">
<button type="button" onclick="document.getElementById('modal_money_spent').value = 90;" style="margin: 0; padding: 10px 20px; width: auto; background-color: var(--primary); color: var(--white); font-weight: bold; border: none; border-radius: var(--radius-sm); cursor: pointer; font-size: 0.95rem; box-shadow: var(--shadow-soft);">90kr</button>
</div>
</div>
<div class="form-group">
<label for="modal_healthy_rating">Healthy-betyg (1-5):</label>
<input type="number" id="modal_healthy_rating" name="healthy_rating" min="1" max="5" required>
</div>
<div class="form-group">
<label for="modal_happy_rating">Happy-betyg (1-3):</label>
<input type="number" id="modal_happy_rating" name="happy_rating" min="1" max="3" required>
</div>
<div class="form-group">
<label for="modal_comment">Kommentar:</label>
<textarea id="modal_comment" name="comment" rows="3" placeholder="Skriv en kommentar..."></textarea>
</div>
<button type="submit">Spara matlogg</button>
</form>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
// Setup datetime-local default to now
let now = new Date();
let nowString = new Date(now.getTime() - (now.getTimezoneOffset() * 60000)).toISOString().slice(0, 16);
$('#modal_log_date').val(nowString);
// Search Logic
$('#globalLogModal .search-box input[type="text"]').on("focus keyup input", function(){
var inputVal = $(this).val();
var resultDropdown = $(this).siblings(".result");
// Always send request to get favorites if term is empty
$.get("<?php echo $base_path; ?>food_logs.php", {term: inputVal, get_favorites: 1}).done(function(data){
if(data.trim() !== "") {
resultDropdown.html(data).show();
} else {
resultDropdown.empty().hide();
}
});
});
// Hide dropdown when clicking outside
$(document).on("click", function(e) {
if (!$(e.target).closest(".search-box").length) {
$("#globalLogModal .result").hide();
}
});
$(document).on("click", "#globalLogModal .result p", function(){
var id = $(this).data('id');
var name = $(this).find('.restaurant-name').text().trim();
if(!name) { name = $(this).text().trim(); } // fallback
$('#modal_restaurant_id').val(name);
$('#modal_restaurant_id_hidden').val(id);
$(this).closest(".result").hide();
});
// Global Modal Logic
var globalModal = document.getElementById("globalLogModal");
var openBtn = document.getElementById("open-log-modal");
var closeBtn = document.getElementById("closeLogModal");
var errorMsg = document.getElementById("modal_error_message");
if (openBtn) {
openBtn.onclick = function() {
globalModal.classList.add("active");
document.body.classList.add("modal-open");
errorMsg.style.display = "none"; // Göm eventuella fel vid nytt öppnande
}
}
if (closeBtn) {
closeBtn.onclick = function() {
globalModal.classList.remove("active");
document.body.classList.remove("modal-open");
}
}
window.onclick = function(event) {
if (event.target == globalModal) {
globalModal.classList.remove("active");
document.body.classList.remove("modal-open");
}
}
// Validering för att hindra inskickningar av helgdagar (JavaScript)
$('#globalLogForm').on('submit', function(e){
var logDateVal = $('#modal_log_date').val();
if(logDateVal) {
var selectedDate = new Date(logDateVal);
var dayOfWeek = selectedDate.getDay(); // 0 = Söndag, 6 = Lördag
if (dayOfWeek === 0 || dayOfWeek === 6) {
e.preventDefault(); // Stoppar formuläret från att laddas om/skickas in
// Visa röda felet i modalen direkt
errorMsg.innerText = "Du kan inte registrera matloggar under helger (lördag/söndag).";
errorMsg.style.display = "block";
return false;
}
}
});
});
</script>
<?php endif; ?>
<style>
footer {
text-align: center;
padding: 20px;
color: var(--text-dark);
font-size: 0.9rem;
opacity: 0.6;
}
</style>
<footer>
<div class="container">
<p>© <?php echo date('Y'); ?> VGY Matkort Handler. Alla rättigheter förbehållna.</p>
</div>
</footer>
<script>
if (typeof feather !== 'undefined') {
feather.replace(); // Säkerställer att ikonerna ritas ut ordentligt
}
</script>
</body>
</html>