// Menu Text Animation - GSAP ScrambleTextPlugin
// Scramble-Effekt beim Wechsel zwischen "MENU" und "CLOSE"

document.addEventListener('DOMContentLoaded', () => {
  gsap.registerPlugin(ScrambleTextPlugin);

  const menuButton = document.querySelector('.navbar18_menu-button');
  const menuText = document.querySelector('.menu-inner > div');

  if (!menuButton || !menuText) {
    console.warn('Menu button or text not found');
    return;
  }

  const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
      if (mutation.attributeName === 'class') {
        const isOpen = menuButton.classList.contains('w--open');
        scrambleText(isOpen ? 'CLOSE' : 'MENU');
      }
    });
  });

  observer.observe(menuButton, { attributes: true });

  function scrambleText(targetText) {
    gsap.to(menuText, {
      duration: 0.4,
      scrambleText: {
        text: targetText,
        chars: "!@#$%^&*()_+-=[]{}|;:<>?/~`",
        speed: 0.3,
        revealDelay: 0.1
      },
      ease: "none"
    });
  }
});