251 lines
10 KiB
JavaScript
251 lines
10 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
|
|
// Smooth scrolling for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
document.querySelector(this.getAttribute('href')).scrollIntoView({
|
|
behavior: 'smooth'
|
|
});
|
|
});
|
|
});
|
|
|
|
// Interaction Checker Logic
|
|
const interactionForm = document.getElementById('interaction-form');
|
|
const resultDiv = document.getElementById('interaction-result');
|
|
|
|
if (interactionForm) {
|
|
interactionForm.addEventListener('submit', function (e) {
|
|
e.preventDefault();
|
|
const drugA = document.getElementById('drugA').value.trim();
|
|
const drugB = document.getElementById('drugB').value.trim();
|
|
|
|
resultDiv.className = 'mt-4 d-none'; // Hide previous result
|
|
resultDiv.innerHTML = '<div class="d-flex justify-content-center"><div class="spinner-border text-primary" role="status"><span class="visually-hidden">Loading...</span></div></div>';
|
|
resultDiv.classList.remove('d-none');
|
|
|
|
setTimeout(() => {
|
|
let resultMessage = '';
|
|
let alertClass = 'alert-success';
|
|
|
|
if (drugA.toLowerCase() === 'warfarin' && drugB.toLowerCase() === 'aspirin' || drugA.toLowerCase() === 'aspirin' && drugB.toLowerCase() === 'warfarin') {
|
|
resultMessage = `<strong>High Risk Interaction:</strong> Combining ${drugA} and ${drugB} increases the risk of bleeding. Consult your doctor immediately.`;
|
|
alertClass = 'alert-danger';
|
|
} else if (drugA === '' || drugB === '') {
|
|
resultMessage = 'Please enter both drug names.';
|
|
alertClass = 'alert-warning';
|
|
} else {
|
|
resultMessage = `<strong>No Major Interaction Found:</strong> No significant interaction was found between ${drugA} and ${drugB}. This is not a substitute for professional medical advice.`;
|
|
}
|
|
|
|
resultDiv.innerHTML = `<div class="alert ${alertClass}">${resultMessage}</div>`;
|
|
}, 1500);
|
|
});
|
|
}
|
|
|
|
// Contact Form Logic
|
|
const contactForm = document.getElementById('contact-form');
|
|
const contactToastEl = document.getElementById('contact-toast');
|
|
const contactToast = new bootstrap.Toast(contactToastEl);
|
|
|
|
if (contactForm) {
|
|
contactForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
const name = document.getElementById('name').value;
|
|
const email = document.getElementById('email').value;
|
|
const message = document.getElementById('message').value;
|
|
const submitButton = contactForm.querySelector('button[type="submit"]');
|
|
|
|
const formData = new FormData();
|
|
formData.append('name', name);
|
|
formData.append('email', email);
|
|
formData.append('message', message);
|
|
|
|
submitButton.disabled = true;
|
|
submitButton.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Sending...';
|
|
|
|
fetch('contact.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
const toastBody = contactToastEl.querySelector('.toast-body');
|
|
if (data.success) {
|
|
toastBody.textContent = data.message;
|
|
contactToastEl.classList.remove('bg-danger');
|
|
contactToastEl.classList.add('bg-success', 'text-white');
|
|
contactForm.reset();
|
|
} else {
|
|
toastBody.textContent = data.message || 'An error occurred.';
|
|
contactToastEl.classList.remove('bg-success');
|
|
contactToastEl.classList.add('bg-danger', 'text-white');
|
|
}
|
|
contactToast.show();
|
|
})
|
|
.catch(error => {
|
|
const toastBody = contactToastEl.querySelector('.toast-body');
|
|
toastBody.textContent = 'A network error occurred. Please try again.';
|
|
contactToastEl.classList.remove('bg-success');
|
|
contactToastEl.classList.add('bg-danger', 'text-white');
|
|
contactToast.show();
|
|
})
|
|
.finally(() => {
|
|
submitButton.disabled = false;
|
|
submitButton.innerHTML = 'Send Message';
|
|
});
|
|
});
|
|
}
|
|
|
|
// Expiry Alert Tracker Logic
|
|
const medicineForm = document.getElementById('medicine-form');
|
|
const medicineListContainer = document.getElementById('medicine-list-container');
|
|
|
|
// Function to calculate date difference and apply styling
|
|
const getExpiryStatus = (expiryDate) => {
|
|
const now = new Date();
|
|
const expiry = new Date(expiryDate);
|
|
// Reset time part to compare dates only
|
|
now.setHours(0, 0, 0, 0);
|
|
expiry.setHours(0, 0, 0, 0);
|
|
|
|
const diffTime = expiry - now;
|
|
const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
|
|
|
|
if (diffDays < 0) {
|
|
return { text: `Expired on ${expiry.toLocaleDateString()}`, className: 'expired' };
|
|
}
|
|
if (diffDays <= 7) {
|
|
return { text: `Expires in ${diffDays} day(s)`, className: 'expiry-soon' };
|
|
}
|
|
return { text: `Expires on ${expiry.toLocaleDateString()}`, className: '' };
|
|
};
|
|
|
|
// Function to render medicines
|
|
const renderMedicines = (medicines) => {
|
|
if (!medicines || medicines.length === 0) {
|
|
medicineListContainer.innerHTML = '<p class="text-muted">No medicines being tracked yet.</p>';
|
|
return;
|
|
}
|
|
|
|
const list = document.createElement('ul');
|
|
list.className = 'list-group list-group-flush';
|
|
|
|
medicines.forEach(medicine => {
|
|
const status = getExpiryStatus(medicine.expiry_date);
|
|
const item = document.createElement('li');
|
|
item.className = 'list-group-item';
|
|
item.innerHTML = `
|
|
<div>
|
|
<strong>${medicine.medicine_name}</strong>
|
|
<br>
|
|
<small class="expiry-date ${status.className}">${status.text}</small>
|
|
</div>
|
|
<button class="btn btn-sm btn-outline-danger delete-medicine" data-id="${medicine.id}">Remove</button>
|
|
`;
|
|
list.appendChild(item);
|
|
});
|
|
|
|
medicineListContainer.innerHTML = '';
|
|
medicineListContainer.appendChild(list);
|
|
};
|
|
|
|
// Function to fetch medicines from the server
|
|
const fetchMedicines = () => {
|
|
fetch('medicines.php?action=get')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
renderMedicines(data.medicines);
|
|
} else {
|
|
console.error('Failed to fetch medicines:', data.message);
|
|
medicineListContainer.innerHTML = '<p class="text-danger">Could not load medicines.</p>';
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error fetching medicines:', error);
|
|
medicineListContainer.innerHTML = '<p class="text-danger">Error loading medicines.</p>';
|
|
});
|
|
};
|
|
|
|
// Event listener for adding a new medicine
|
|
if (medicineForm) {
|
|
medicineForm.addEventListener('submit', function (e) {
|
|
e.preventDefault();
|
|
const medicineName = document.getElementById('medicine_name').value.trim();
|
|
const expiryDate = document.getElementById('expiry_date').value;
|
|
const submitButton = medicineForm.querySelector('button[type="submit"]');
|
|
|
|
const formData = new FormData();
|
|
formData.append('action', 'add');
|
|
formData.append('medicine_name', medicineName);
|
|
formData.append('expiry_date', expiryDate);
|
|
|
|
submitButton.disabled = true;
|
|
submitButton.innerHTML = '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Adding...';
|
|
|
|
fetch('medicines.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
medicineForm.reset();
|
|
fetchMedicines(); // Refresh the list
|
|
} else {
|
|
alert(`Error: ${data.message}`);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
alert('A network error occurred.');
|
|
})
|
|
.finally(() => {
|
|
submitButton.disabled = false;
|
|
submitButton.innerHTML = 'Add to Tracker';
|
|
});
|
|
});
|
|
}
|
|
|
|
// Event listener for deleting a medicine (using event delegation)
|
|
if (medicineListContainer) {
|
|
medicineListContainer.addEventListener('click', function(e) {
|
|
if (e.target && e.target.classList.contains('delete-medicine')) {
|
|
const medicineId = e.target.getAttribute('data-id');
|
|
if (!confirm('Are you sure you want to remove this medicine?')) {
|
|
return;
|
|
}
|
|
|
|
const formData = new FormData();
|
|
formData.append('action', 'delete');
|
|
formData.append('id', medicineId);
|
|
|
|
e.target.disabled = true;
|
|
|
|
fetch('medicines.php', {
|
|
method: 'POST',
|
|
body: formData
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
fetchMedicines(); // Refresh the list
|
|
} else {
|
|
alert(`Error: ${data.message}`);
|
|
e.target.disabled = false;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
alert('A network error occurred.');
|
|
e.target.disabled = false;
|
|
});
|
|
}
|
|
});
|
|
}
|
|
|
|
// Initial fetch of medicines when the page loads
|
|
if (medicineListContainer) {
|
|
fetchMedicines();
|
|
}
|
|
});
|