%PDF- %PDF-
| Direktori : /home/tjamichg/cmasc.tjamich.gob.mx/js/ |
| Current File : /home/tjamichg/cmasc.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 = 3; //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);
/////////////////CARRUSEL DE DOCUMENTOS//////////////////
/*const track = document.getElementById('carousel');
let isDown = false;
let startX;
let scrollLeft;
//mouse events
track.addEventListener('mousedown', (e) => {
isDown = true;
track.classList.add('dragging');
startX = e.pageX - track.offsetLeft;
scrollLeft = track.scrollLeft;
});
track.addEventListener('mouseleave', () => {
isDown = false;
track.classList.remove('dragging');
});
track.addEventListener('mouseup', () => {
isDown = false;
track.classList.remove('dragging');
});
track.addEventListener('mousemove', (e) => {
if (!isDown) return;
e.preventDefault();
const x = e.pageX - track.offsetLeft;
const walk = (x - startX) * 1.5;
track.scrollLeft = scrollLeft - walk;
});
//touch support
track.addEventListener('touchstart', (e) => {
isDown = true;
startX = e.touches[0].pageX - track.offsetLeft;
scrollLeft = track.scrollLeft;
}, { passive: true });
track.addEventListener('touchmove', (e) => {
if (!isDown) return;
const x = e.touches[0].pageX - track.offsetLeft;
const walk = (x - startX) * 1.5;
track.scrollLeft = scrollLeft - walk;
}, {passive: false});
track.addEventListener('touchend', ()=>{
isDown= false;
});
track.addEventListener('touchcancel', () =>{
isDown = false;
});
//para abrir cada documento de los pdfs agredados
function abrirDocumento(e){
const pdf = e.currentTarget.getAttribute('data-pdf');
if(pdf){
window.open(pdf, '_blank');
}
}
document.querySelectorAll('.button-cmasc-documento').forEach(item =>{
item.addEventListener('click', abrirDocumento);
})*/
///////////////////////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);
}
});
});
});
/////////////////CARRUSEL/////////////////
let slideIndex = 0;
showSlides();
// Next-previous control
function nextSlide() {
slideIndex++;
showSlides();
timer = _timer; // reset timer
}
function prevSlide() {
slideIndex--;
showSlides();
timer = _timer;
}
// Thumbnail image controlls
function currentSlide(n) {
slideIndex = n - 1;
showSlides();
timer = _timer;
}
function showSlides() {
let slides = document.querySelectorAll(".mySlides");
let dots = document.querySelectorAll(".dots");
if (slideIndex > slides.length - 1) slideIndex = 0;
if (slideIndex < 0) slideIndex = slides.length - 1;
// hide all slides
slides.forEach((slide) => {
slide.style.display = "none";
});
// show one slide base on index number
slides[slideIndex].style.display = "block";
dots.forEach((dot) => {
dot.classList.remove("active");
});
dots[slideIndex].classList.add("active");
}
// autoplay slides --------
let timer = 7; // sec
const _timer = timer;
// this function runs every 1 second
setInterval(() => {
timer--;
if (timer < 1) {
nextSlide();
timer = _timer; // reset timer
}
}, 1000); // 1sec