eis-website/js/script.js

// ===========================
// Active Navigation Highlighting
// ===========================

document.addEventListener('DOMContentLoaded', function() {
  // Highlight active navigation link
  const currentLocation = location.pathname.split('/').pop() || 'index.html';
  const navLinks = document.querySelectorAll('nav a');
  
  navLinks.forEach(link => {
    const href = link.getAttribute('href');
    if (href === currentLocation) {
      link.classList.add('active');
    } else {
      link.classList.remove('active');
    }
  });

  // Initialize lightbox gallery
  initializeLightbox();

  // Initialize contact form
  initializeContactForm();
});

// ===========================
// Lightbox Gallery
// ===========================

function initializeLightbox() {
  const galleryImages = document.querySelectorAll('.galerie img');
  
  galleryImages.forEach(img => {
    img.addEventListener('click', function() {
      openLightbox(this.src);
    });
  });
}

function openLightbox(imageSrc) {
  // Create overlay
  const overlay = document.createElement('div');
  overlay.className = 'lightbox-overlay';
  
  // Create image container
  const imgContainer = document.createElement('div');
  imgContainer.style.position = 'relative';
  
  // Create close button
  const closeBtn = document.createElement('span');
  closeBtn.className = 'lightbox-close';
  closeBtn.innerHTML = '×';
  closeBtn.addEventListener('click', function(e) {
    e.stopPropagation();
    overlay.remove();
  });
  
  // Create large image
  const img = document.createElement('img');
  img.src = imageSrc;
  
  imgContainer.appendChild(closeBtn);
  imgContainer.appendChild(img);
  overlay.appendChild(imgContainer);
  
  // Close on overlay click
  overlay.addEventListener('click', function() {
    overlay.remove();
  });
  
  // Close on Escape key
  document.addEventListener('keydown', function(e) {
    if (e.key === 'Escape') {
      overlay.remove();
    }
  });
  
  document.body.appendChild(overlay);
}

// ===========================
// Contact Form Handling
// ===========================

function initializeContactForm() {
  const form = document.getElementById('contactForm');
  const formMessage = document.getElementById('formMessage');
  
  if (!form) return;
  
  form.addEventListener('submit', function(e) {
    e.preventDefault();
    
    // Get form data
    const name = document.getElementById('name').value.trim();
    const email = document.getElementById('email').value.trim();
    const subject = document.getElementById('subject').value.trim();
    const message = document.getElementById('message').value.trim();
    
    // Validate
    if (!name || !email || !subject || !message) {
      showFormMessage('Bitte füllen Sie alle Felder aus.', 'error');
      return;
    }
    
    // Validate email format
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    if (!emailRegex.test(email)) {
      showFormMessage('Bitte geben Sie eine gültige E-Mail-Adresse ein.', 'error');
      return;
    }
    
    // Show success message (in production, this would send to a server)
    showFormMessage(
      'Vielen Dank! Ihre Nachricht wurde erfolgreich eingegeben. ' +
      '(In einer produktiven Umgebung würde diese an den Server gesendet.)',
      'success'
    );
    
    // Reset form
    form.reset();
    
    console.log('Form data:', { name, email, subject, message });
  });
}

function showFormMessage(message, type) {
  const formMessage = document.getElementById('formMessage');
  if (!formMessage) return;
  
  formMessage.textContent = message;
  formMessage.style.padding = '1rem';
  formMessage.style.marginTop = '1rem';
  formMessage.style.borderRadius = '6px';
  formMessage.style.borderLeft = '4px solid';
  
  if (type === 'success') {
    formMessage.style.background = '#dcfce7';
    formMessage.style.color = '#166534';
    formMessage.style.borderLeftColor = '#16a34a';
  } else if (type === 'error') {
    formMessage.style.background = '#fee2e2';
    formMessage.style.color = '#991b1b';
    formMessage.style.borderLeftColor = '#dc2626';
  }
  
  // Remove message after 5 seconds
  setTimeout(() => {
    formMessage.textContent = '';
    formMessage.style.background = '';
    formMessage.style.color = '';
  }, 5000);
}

// ===========================
// Smooth Scroll (Progressive Enhancement)
// ===========================

document.addEventListener('click', function(e) {
  if (e.target.tagName === 'A' && e.target.getAttribute('href').startsWith('#')) {
    e.preventDefault();
    const targetId = e.target.getAttribute('href').substring(1);
    const targetElement = document.getElementById(targetId);
    
    if (targetElement) {
      targetElement.scrollIntoView({ behavior: 'smooth' });
    }
  }
});

// ===========================
// Utility: Log
// ===========================

console.log('✅ EIS Website erfolgreich geladen!');
console.log('📚 Veranstaltung: Entwicklung interaktiver Softwareanwendungen');
console.log('🏫 Institution: PH Weingarten');
console.log('👨‍🏫 Dozenten: Stefan Franke und Prof. Dr. Wolfgang Müller');