/*======================================================
V2.02 — RENDERER
======================================================*/
/*======================================================
01 — HERO PARALLAX
======================================================*/
const hero = document.querySelector(".ila-hero");
if(hero){
window.addEventListener("scroll",()=>{
hero.style.transform =
`translateY(${window.scrollY * 0.08}px)`;
});
}
/*======================================================
02 — SPLIT NAVIGATION
======================================================*/
document.querySelectorAll(".ila-nav").forEach(nav=>{
nav.addEventListener("mouseenter",()=>{
document.body.classList.add("ila-nav-hover");
});
nav.addEventListener("mouseleave",()=>{
document.body.classList.remove("ila-nav-hover");
});
});
/*======================================================
03 — COLLECTION GALLERY
======================================================*/
const cursor = document.querySelector(".ila-image-cursor");
if(cursor){
const counter = cursor.querySelector("span");
const galleries = document.querySelectorAll(".ila-object");
galleries.forEach(gallery=>{
const figure = gallery.querySelector(".ila-object-image");
const slides = gallery.querySelectorAll(".ila-slide");
if(!figure || slides.length === 0) return;
let current = 0;
/*------------------------------
ENTER
------------------------------*/
figure.addEventListener("mouseenter",()=>{
cursor.style.opacity="1";
counter.textContent=`${current+1} / ${slides.length}`;
});
/*------------------------------
LEAVE
------------------------------*/
figure.addEventListener("mouseleave",()=>{
cursor.style.opacity="0";
});
/*------------------------------
FOLLOW CURSOR
------------------------------*/
figure.addEventListener("mousemove",(e)=>{
cursor.style.left=e.clientX+"px";
cursor.style.top=e.clientY+"px";
});
/*------------------------------
NEXT IMAGE
------------------------------*/
figure.addEventListener("click",()=>{
if(slides.length <= 1) return;
slides[current].classList.remove("is-active");
current++;
if(current >= slides.length){
current = 0;
}
slides[current].classList.add("is-active");
counter.textContent=`${current+1} / ${slides.length}`;
});
});
}
