Patrick
107 lines
3.8 KiB
JavaScript
107 lines
3.8 KiB
JavaScript
import { initializeSignup } from './signup.js';
|
|
import { initializeLogin, showLoginModal } from './login.js';
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
initializeSignup();
|
|
initializeLogin();
|
|
|
|
const mobileMenuBtn = document.querySelector('.mobile-menu-btn');
|
|
const navLinks = document.querySelector('.nav-links');
|
|
|
|
mobileMenuBtn.addEventListener('click', function() {
|
|
navLinks.classList.toggle('active');
|
|
mobileMenuBtn.innerHTML = navLinks.classList.contains('active') ?
|
|
'<i class="fas fa-times"></i>' : '<i class="fas fa-bars"></i>';
|
|
});
|
|
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
|
|
if (navLinks.classList.contains('active')) {
|
|
navLinks.classList.remove('active');
|
|
mobileMenuBtn.innerHTML = '<i class="fas fa-bars"></i>';
|
|
}
|
|
|
|
const targetId = this.getAttribute('href');
|
|
const targetElement = document.querySelector(targetId);
|
|
|
|
if (targetElement) {
|
|
window.scrollTo({
|
|
top: targetElement.offsetTop - 80,
|
|
behavior: 'smooth'
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
const tabBtns = document.querySelectorAll('.tab-btn');
|
|
const tabPanes = document.querySelectorAll('.tab-pane');
|
|
|
|
tabBtns.forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const tabId = this.getAttribute('data-tab');
|
|
|
|
tabBtns.forEach(btn => btn.classList.remove('active'));
|
|
tabPanes.forEach(pane => pane.classList.remove('active'));
|
|
|
|
this.classList.add('active');
|
|
document.getElementById(tabId).classList.add('active');
|
|
});
|
|
});
|
|
|
|
const copyBtns = document.querySelectorAll('.copy-btn');
|
|
|
|
copyBtns.forEach(btn => {
|
|
btn.addEventListener('click', function() {
|
|
const endpointUrl = this.parentElement.querySelector('h3').textContent;
|
|
navigator.clipboard.writeText(endpointUrl).then(() => {
|
|
const originalIcon = this.innerHTML;
|
|
this.innerHTML = '<i class="fas fa-check"></i>';
|
|
setTimeout(() => {
|
|
this.innerHTML = originalIcon;
|
|
}, 2000);
|
|
});
|
|
});
|
|
});
|
|
|
|
const elementsToFloat = document.querySelectorAll('.feature-card, .price-card');
|
|
elementsToFloat.forEach((el, index) => {
|
|
if (index % 2 === 0) {
|
|
el.classList.add('floating');
|
|
el.style.animationDelay = `${index * 0.2}s`;
|
|
}
|
|
});
|
|
|
|
const contactForm = document.querySelector('.contact-form');
|
|
if (contactForm) {
|
|
contactForm.addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
alert('Thank you for your message! We will get back to you soon.');
|
|
this.reset();
|
|
});
|
|
}
|
|
|
|
const animateOnScroll = function() {
|
|
const elements = document.querySelectorAll('.feature-card, .section-header, .endpoint-card, .price-card');
|
|
|
|
elements.forEach(element => {
|
|
const elementPosition = element.getBoundingClientRect().top;
|
|
const windowHeight = window.innerHeight;
|
|
|
|
if (elementPosition < windowHeight - 100) {
|
|
element.style.opacity = '1';
|
|
element.style.transform = 'translateY(0)';
|
|
}
|
|
});
|
|
};
|
|
|
|
document.querySelectorAll('.feature-card, .section-header, .endpoint-card, .price-card').forEach(el => {
|
|
el.style.opacity = '0';
|
|
el.style.transform = 'translateY(30px)';
|
|
el.style.transition = 'all 0.6s ease';
|
|
});
|
|
|
|
animateOnScroll();
|
|
window.addEventListener('scroll', animateOnScroll);
|
|
}); |