121 lines
3.5 KiB
JavaScript
121 lines
3.5 KiB
JavaScript
/**
|
|
* Main JavaScript file for argobox.com
|
|
* Handles animations, interactions, and dynamic content
|
|
*/
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Initialize all website functionality
|
|
initNavigation();
|
|
initParticlesAndIcons();
|
|
initTerminalTyping();
|
|
updateYear();
|
|
});
|
|
|
|
/**
|
|
* Set up navigation functionality - mobile menu and scroll spy
|
|
*/
|
|
function initNavigation() {
|
|
const menuToggle = document.querySelector('.menu-toggle');
|
|
const navMenu = document.querySelector('.nav-menu');
|
|
|
|
if (menuToggle && navMenu) {
|
|
menuToggle.addEventListener('click', () => {
|
|
navMenu.classList.toggle('show');
|
|
const icon = menuToggle.querySelector('i');
|
|
if (navMenu.classList.contains('show')) {
|
|
icon.classList.remove('fa-bars');
|
|
icon.classList.add('fa-times');
|
|
} else {
|
|
icon.classList.remove('fa-times');
|
|
icon.classList.add('fa-bars');
|
|
}
|
|
});
|
|
}
|
|
|
|
// Scroll spy for navigation
|
|
window.addEventListener('scroll', () => {
|
|
const sections = document.querySelectorAll('section');
|
|
const navLinks = document.querySelectorAll('.nav-link');
|
|
|
|
let current = '';
|
|
sections.forEach(section => {
|
|
const sectionTop = section.offsetTop;
|
|
if (window.scrollY >= sectionTop - 100) {
|
|
current = section.getAttribute('id');
|
|
}
|
|
});
|
|
|
|
navLinks.forEach(link => {
|
|
link.classList.remove('active');
|
|
if (link.getAttribute('href').substring(1) === current) {
|
|
link.classList.add('active');
|
|
}
|
|
});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Create background particles and floating tech icons
|
|
*/
|
|
function initParticlesAndIcons() {
|
|
createBackgroundParticles();
|
|
createFloatingIcons();
|
|
}
|
|
|
|
/**
|
|
* Create animated background particles
|
|
*/
|
|
function createBackgroundParticles() {
|
|
const particlesContainer = document.getElementById('particles-container');
|
|
|
|
if (!particlesContainer) return;
|
|
|
|
// Clear existing particles
|
|
particlesContainer.innerHTML = '';
|
|
|
|
// Create particles
|
|
for (let i = 0; i < 50; i++) {
|
|
const particle = document.createElement('div');
|
|
particle.classList.add('particle');
|
|
|
|
// Random size between 2 and 6px
|
|
const size = Math.random() * 4 + 2;
|
|
particle.style.width = `${size}px`;
|
|
particle.style.height = `${size}px`;
|
|
|
|
// Random position
|
|
particle.style.left = `${Math.random() * 100}%`;
|
|
particle.style.top = `${Math.random() * 100}%`;
|
|
|
|
// Random opacity between 0.1 and 0.3
|
|
particle.style.opacity = (Math.random() * 0.2 + 0.1).toString();
|
|
|
|
// Animation properties
|
|
particle.style.animation = `float-particle ${Math.random() * 20 + 10}s linear infinite`;
|
|
particle.style.animationDelay = `${Math.random() * 10}s`;
|
|
|
|
particlesContainer.appendChild(particle);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Initialize terminal typing animation
|
|
*/
|
|
function initTerminalTyping() {
|
|
const cursor = document.querySelector('.cursor');
|
|
if (cursor) {
|
|
setInterval(() => {
|
|
cursor.style.opacity = cursor.style.opacity === '0' ? '1' : '0';
|
|
}, 600);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Update copyright year in the footer
|
|
*/
|
|
function updateYear() {
|
|
const yearElement = document.getElementById('current-year');
|
|
if (yearElement) {
|
|
yearElement.textContent = new Date().getFullYear();
|
|
}
|
|
} |