site-1a835/script.js

// ========================================
// HEADER SCROLL EFFECT
// ========================================
const header = document.getElementById('header');
let lastScroll = 0;

function handleScroll() {
  const currentScroll = window.pageYOffset;
  
  if (currentScroll > 50) {
    header.classList.add('header--scrolled');
  } else {
    header.classList.remove('header--scrolled');
  }
  
  lastScroll = currentScroll;
}

window.addEventListener('scroll', handleScroll, { passive: true });

// ========================================
// MOBILE NAVIGATION
// ========================================
const navToggle = document.querySelector('.nav-toggle');
const nav = document.getElementById('nav');

if (navToggle && nav) {
  navToggle.addEventListener('click', () => {
    const isExpanded = navToggle.getAttribute('aria-expanded') === 'true';
    navToggle.setAttribute('aria-expanded', !isExpanded);
    nav.classList.toggle('active');
  });
  
  // Close nav when clicking on a link
  nav.querySelectorAll('.nav__link').forEach(link => {
    link.addEventListener('click', () => {
      navToggle.setAttribute('aria-expanded', 'false');
      nav.classList.remove('active');
    });
  });
  
  // Close nav on escape key
  document.addEventListener('keydown', (e) => {
    if (e.key === 'Escape' && nav.classList.contains('active')) {
      navToggle.setAttribute('aria-expanded', 'false');
      nav.classList.remove('active');
      navToggle.focus();
    }
  });
}

// ========================================
// REVEAL ON SCROLL
// ========================================
function initReveal() {
  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
  
  if (prefersReducedMotion) {
    document.querySelectorAll('.reveal').forEach(el => {
      el.classList.add('visible');
    });
    return;
  }
  
  const revealElements = document.querySelectorAll('.reveal');
  
  const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
      if (entry.isIntersecting) {
        entry.target.classList.add('visible');
        observer.unobserve(entry.target);
      }
    });
  }, {
    threshold: 0.1,
    rootMargin: '0px 0px -50px 0px'
  });
  
  reveal Elements.forEach(el => observer.observe(el));
}

// ========================================
// SMOOTH SCROLL FOR ANCHOR LINKS
// ========================================
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
  anchor.addEventListener('click', function(e) {
    const href = this.getAttribute('href');
    if (href === '#') return;
    
    const target = document.querySelector(href);
    if (target) {
      e.preventDefault();
      const headerHeight = header.offsetHeight;
      const targetPosition = target.getBoundingClientRect().top + window.pageYOffset - headerHeight;
      
      window.scrollTo({
        top: targetPosition,
        behavior: 'smooth'
      });
    }
  });
});

// ========================================
// FORM HANDLING
// ========================================
const contactForm = document.querySelector('.contact-form');

if (contactForm) {
  const formStatus = document.getElementById('form-status');
  
  function showError(field, message) {
    const errorEl = document.getElementById(field.id + '-error');
    field.classList.add('error');
    field.setAttribute('aria-invalid', 'true');
    if (errorEl) {
      errorEl.textContent = message;
    }
  }
  
  function clearError(field) {
    const errorEl = document.getElementById(field.id + '-error');
    field.classList.remove('error');
    field.removeAttribute('aria-invalid');
    if (errorEl) {
      errorEl.textContent = '';
    }
  }
  
  contactForm.addEventListener('submit', function(e) {
    e.preventDefault();
    
    let isValid = true;
    let firstError = null;
    
    // Validate name
    const nameField = this.querySelector('#name');
    if (!nameField.value.trim()) {
      showError(nameField, 'נא להזין שם מלא');
      isValid = false;
      if (!firstError) firstError = nameField;
    } else {
      clearError(nameField);
    }
    
    // Validate email
    const emailField = this.querySelector('#email');
    const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    if (!emailField.value.trim()) {
      showError(emailField, 'נא להזין כתובת אימייל');
      isValid = false;
      if (!firstError) firstError = emailField;
    } else if (!emailPattern.test(emailField.value)) {
      showError(emailField, 'נא להזין כתובת אימייל תקינה');
      isValid = false;
      if (!firstError) firstError = emailField;
    } else {
      clearError(emailField);
    }
    
    // Validate message
    const messageField = this.querySelector('#message');
    if (!messageField.value.trim()) {
      showError(messageField, 'נא להזין הודעה');
      isValid = false;
      if (!firstError) firstError = messageField;
    } else {
      clearError(messageField);
    }
    
    if (!isValid) {
      if (firstError) {
        firstError.focus();
      }
      if (formStatus) {
        formStatus.textContent = 'יש לתקן את השגיאות בטופס';
      }
      return;
    }
    
    const submitBtn = this.querySelector('.form-submit');
    const originalText = submitBtn.textContent;
    
    submitBtn.textContent = 'שולח...';
    submitBtn.disabled = true;
    
    // Simulate form submission
    setTimeout(() => {
      submitBtn.textContent = 'נשלח בהצלחה!';
      submitBtn.style.background = 'var(--gold)';
      if (formStatus) {
        formStatus.textContent = 'ההודעה נשלחה בהצלחה. אחזור אליכם בהקדם.';
      }
      
      setTimeout(() => {
        submitBtn.textContent = originalText;
        submitBtn.style.background = '';
        submitBtn.disabled = false;
        contactForm.reset();
        if (formStatus) {
          formStatus.textContent = '';
        }
      }, 3000);
    }, 1500);
  });
  
  // Clear error on input
  contactForm.querySelectorAll('.form-input').forEach(input => {
    input.addEventListener('input', function() {
      clearError(this);
    });
  });
}

// ========================================
// INIT
// ========================================
document.addEventListener('DOMContentLoaded', () => {
  initReveal();
});

// Also run on load for images etc
window.addEventListener('load', () => {
  setTimeout(initReveal, 100);
});