%PDF- %PDF-
Mini Shell

Mini Shell

Direktori : /home/tjamichg/defensoria.tjamich.gob.mx/js/
Upload File :
Create Path :
Current File : /home/tjamichg/defensoria.tjamich.gob.mx/js/script.js

  //////////////////////LOADER///////////////////////
 function redirectWithLoading(url, delay = 1500){
  const loaderContainer = document.getElementById('loader-container');
  if (!loaderContainer) return console.warn("No se encontrado el apartado.");

  loaderContainer.style.display = 'flex';
  setTimeout(() =>{
    window.location.href = url;
  }, delay);
 }
  
  
  //////////////////////TOP y NAVBAR////////////////////

  const topBar = document.getElementById('topbar');
  const navbar = document.getElementById('navbar');

  window.addEventListener('scroll', () => {
    if (window.scrollY > 50) { //si baja minimo 50px se cumple cambio
      topBar.style.display = 'none';
      navbar.style.top = '0';
    } else {
      topBar.style.display = 'flex';
      navbar.style.top = topBar.offsetHeight + 'px';
    }
  });

  //inicializa el top del navbar
  window.addEventListener('DOMContentLoaded', () => {
    navbar.style.top = topBar.offsetHeight + 'px';
  });
  ////////////////////CARRUSEL NUEVO////////////////////
  
  //cambiar automáticamente entre las imágenes cada 10 segundos
  let currentIndex = 1;
  const totalImages = 2; //número total de imágenes
  
  function changeImage() {
    //cambiar el índice de la imagen
    currentIndex = (currentIndex % totalImages) + 1;
  
    //cambiar el 'radio button' correspondiente
    document.getElementById(`img-${currentIndex}`).checked = true;
  }
  
  //cambiar imagen cada 10 segundos
  setInterval(changeImage, 10000);


  ///////////////////////FAQS////////////////////////
  const faqToggle = document.getElementById('faqToggle');
  const faqMenu = document.getElementById('faqMenu');

  faqToggle.addEventListener('click', () => {
  if(faqMenu.classList.contains('active')){
    faqMenu.style.animation = 'slideUpFaqs 0.6s ease-in-out forwards';

    setTimeout(() =>{
      faqMenu.classList.remove('active');
      faqMenu.style.animation = '';
      faqMenu.style.display = 'none';
    }, 600);

  }else {
    faqMenu.style.display = 'block';
    faqMenu.classList.add('active');
    faqMenu.style.animation = 'slideDownFaqs 0.6s ease-in-out forwards';
  }
  
  });

  document.querySelectorAll('.faq-question').forEach(btn => {
  btn.addEventListener('click', () => {
    const item = btn.parentElement;
    item.classList.toggle('active');
  });
  });

  //////////////////////WHATSAPP////////////////////////
  /********************************************/
function toggleIcon(iconID){
    const icon = document.getElementById(iconID);
    
    if(getComputedStyle(icon).display=="block"){
        icon.style.animation ="slideUpSocial 0.6s ease-in-out forwards";

        setTimeout(() => {
            icon.style.display = "none";
            icon.style.animation = "";
        }, 600);
    } else {
        icon.style.display = "block";
        
    }

    

}

/********************************************/
 function toggleContacto(contactoId) {
    const contacto = document.getElementById(contactoId);

    if(getComputedStyle(contacto).display=="block"){
        contacto.style.animation ="slideUpSocial 0.6s ease-in-out forwards";

        setTimeout(() => {
            contacto.style.display = "none";
            contacto.style.animation = "";
        }, 600);
    } else {
        contacto.style.display = "block";
    }

}

  //////////////////////////////MENU//////////////////////////////////
  const cmascToggle = document.getElementById('cmasc-toggle');
  const cmascNav = document.getElementById('cmasc-nav');
  const submenuToggles = document.querySelectorAll('.cmasc-submenu-toggle');

  cmascToggle.addEventListener('click', () => {
    cmascToggle.classList.toggle("active");
    cmascNav.classList.toggle("show");
  });

  submenuToggles.forEach(toggle => {
    toggle.addEventListener('click', (e) => {
      const parent = toggle.closest('.cmasc-has-submenu');
      if (window.innerWidth <= 768) {
        e.preventDefault();
        parent.classList.toggle('open');
      }
    });
  });


  //////////////MODALS DE SERVICIOS/////////////
  document.addEventListener('DOMContentLoaded', () => {
    const cards = document.querySelectorAll('.card-tramites-cmasc');
    const modals = document.querySelectorAll('.cmasc-modal');
    const closeBtns = document.querySelectorAll('.cmasc-cerrar');

    cards.forEach(card => {
      const modalId = card.getAttribute('data-modal');
      const modal = document.getElementById(modalId);
      const contenido = document.querySelector('.cmasc-modal-contenido');
      if (modal && contenido) {
        card.addEventListener('click', () => {
          modal.style.display = 'block';
          contenido.style.animation = 'aparecerModal 0.4s ease-out';
        });
      }
    });

    closeBtns.forEach(btn => {
      btn.addEventListener('click', () => {
        const modal = btn.closest('.cmasc-modal');
        const contenido = modal.querySelector('.cmasc-modal-contenido');
        contenido.style.animation = 'desaparecerModal 0.3s ease-in';
        setTimeout(() => {
          modal.style.display = 'none';
      }, 300);
      });
    });

    window.addEventListener('click', (e) => {
      modals.forEach(modal => {
        if (e.target === modal) {
          const contenido = modal.querySelector('.cmasc-modal-contenido');
          contenido.style.animation = 'desaparecerModal 0.3s ease-in';
          setTimeout(() => {
            modal.style.display = 'none';
          }, 300);
        }
      });
    });
  });


//////////////////////UBICACIONES//////////////////////////

function toggleMap(cardId) {
    const card = document.getElementById(cardId);

    if (getComputedStyle(card).display === "block") {
        //Aplicar animación de salida
        card.style.animation = "slideUpCard 0.6s ease-in-out forwards";

        //Después de la animación, ocultarla
        setTimeout(() => {
            card.style.display = "none";
            card.style.animation = "";
        }, 600);
    } else {
        // Mostrar con animación de entrada
        card.style.display = "block";
        
    }
}

function activarIcono(elemento){
    elemento.classList.toggle("active");
}

/*****************************************/
function toggleIcon(iconID){
    const icon = document.getElementById(iconID);
    
    if(getComputedStyle(icon).display=="block"){
        icon.style.animation ="slideUpSocial 0.6s ease-in-out forwards";

        setTimeout(() => {
            icon.style.display = "none";
            icon.style.animation = "";
        }, 600);
    } else {
        icon.style.display = "block";
    }
}

/********************************************/

function toggleContacto(contactoId) {
    const contacto = document.getElementById(contactoId);

    if(getComputedStyle(contacto).display=="block"){
        contacto.style.animation ="slideUpSocial 0.6s ease-in-out forwards";

        setTimeout(() => {
            contacto.style.display = "none";
            contacto.style.animation = "";
        }, 600);
    } else {
        contacto.style.display = "block";
    }

}

Zerion Mini Shell 1.0