98 lines
3.5 KiB
JavaScript
Executable File
98 lines
3.5 KiB
JavaScript
Executable File
// ProostenKrant JavaScript
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Auto-hide alerts after 5 seconds
|
|
const alerts = document.querySelectorAll('.alert');
|
|
alerts.forEach(alert => {
|
|
setTimeout(() => {
|
|
alert.style.opacity = '0';
|
|
setTimeout(() => {
|
|
alert.remove();
|
|
}, 500);
|
|
}, 5000);
|
|
});
|
|
|
|
// Form validation feedback
|
|
const formGroups = document.querySelectorAll('.form-group');
|
|
formGroups.forEach(group => {
|
|
const input = group.querySelector('.form-control');
|
|
const errorMessage = group.querySelector('.error-message');
|
|
|
|
if (input && errorMessage && errorMessage.textContent.trim() !== '') {
|
|
input.addEventListener('focus', function() {
|
|
input.classList.remove('error');
|
|
errorMessage.style.display = 'none';
|
|
});
|
|
}
|
|
});
|
|
|
|
// Auto-focus first input on login page
|
|
if (document.querySelector('.login-form')) {
|
|
const firstInput = document.querySelector('.login-form .form-control');
|
|
if (firstInput) {
|
|
firstInput.focus();
|
|
}
|
|
}
|
|
|
|
// Smooth scrolling for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
const target = document.querySelector(this.getAttribute('href'));
|
|
if (target) {
|
|
target.scrollIntoView({
|
|
behavior: 'smooth',
|
|
block: 'start'
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
// Image preview for article form
|
|
const imageInputs = [document.getElementById('article_image'), document.getElementById('image')];
|
|
imageInputs.forEach(input => {
|
|
if (input) {
|
|
const form = input.closest('form');
|
|
const previewContainer = document.createElement('div');
|
|
previewContainer.className = 'image-preview';
|
|
previewContainer.style.display = 'none';
|
|
previewContainer.style.marginTop = '15px';
|
|
|
|
input.parentNode.parentNode.appendChild(previewContainer);
|
|
|
|
input.addEventListener('change', function(e) {
|
|
const file = e.target.files[0];
|
|
if (file && file.type.startsWith('image/')) {
|
|
const reader = new FileReader();
|
|
reader.onload = function(e) {
|
|
previewContainer.innerHTML = '<img src="' + e.target.result + '" style="max-width: 200px; max-height: 200px; border-radius: 5px;" />';
|
|
previewContainer.style.display = 'block';
|
|
};
|
|
reader.readAsDataURL(file);
|
|
} else {
|
|
previewContainer.style.display = 'none';
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
// Confirm before logout
|
|
const logoutLinks = document.querySelectorAll('.btn-logout, a[href="/logout"]');
|
|
logoutLinks.forEach(link => {
|
|
link.addEventListener('click', function(e) {
|
|
if (!confirm('Weet u zeker dat u wilt uitloggen?')) {
|
|
e.preventDefault();
|
|
}
|
|
});
|
|
});
|
|
|
|
// Season color indicator
|
|
const seasonCards = document.querySelectorAll('.season-card');
|
|
seasonCards.forEach(card => {
|
|
const bgColor = card.style.backgroundColor;
|
|
if (bgColor) {
|
|
card.style.borderLeft = '5px solid ' + bgColor;
|
|
}
|
|
});
|
|
});
|