.elementor-kit-404{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-404 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}
/* Start custom CSS *//* ============================================================
INADUG — GLOBAL JAVASCRIPT
For use in: Elementor > Site Settings > Custom Code
OR: functions.php wp_footer hook
Place in: custom code block in Elementor Pro
============================================================ */
(function () {
'use strict';
/* ============================================================
1. CONSTANTS & CONFIG
============================================================ */
const CONFIG = {
NAV_SCROLL_THRESHOLD: 60,
BTT_SCROLL_THRESHOLD: 200,
GEO_SHAPE_COUNT: 14,
GEO_MIN_SIZE: 50,
GEO_MAX_SIZE: 100,
GEO_SPEED: 0.6,
GEO_ROTATION_SPEED: 0.006,
GEO_OPACITY_YELLOW_BG: 0.12,
GEO_OPACITY_BLACK_BG: 0.12,
GEO_OPACITY_WHITE_BG: 0.10,
GEO_LINE_WIDTH: 1.2,
MARQUEE_DURATION: '28s',
AUDIO_BASE_URL: 'https://www.inadug.com/wp-content/uploads/2026/04/',
PREVIEW_DURATION: 30,
};
/* ============================================================
2. UTILITY FUNCTIONS
============================================================ */
const $ = (.elementor-kit-404, ctx = document) => ctx.querySelector(.elementor-kit-404);
const $$ = (.elementor-kit-404, ctx = document) => [...ctx.querySelectorAll(.elementor-kit-404)];
function debounce(fn, delay = 100) {
let timer;
return (...args) => {
clearTimeout(timer);
timer = setTimeout(() => fn(...args), delay);
};
}
function formatTime(seconds) {
const s = Math.floor(seconds);
const m = Math.floor(s / 60);
const sec = s % 60;
return `${m}:${sec < 10 ? '0' : ''}${sec}`;
}
function getSectionBg(el) {
const bg = window.getComputedStyle(el).backgroundColor;
if (bg.includes('255, 214, 0') || bg.includes('255,214,0')) return 'yellow';
if (bg.includes('10, 10, 10') || bg.includes('10,10,10')) return 'black';
return 'white';
}
/* ============================================================
3. STICKY NAVIGATION
============================================================ */
function initStickyNav() {
const nav = $('.inadug-nav') || $('#main-nav');
if (!nav) return;
function onScroll() {
nav.classList.toggle('scrolled', window.scrollY > CONFIG.NAV_SCROLL_THRESHOLD);
}
window.addEventListener('scroll', onScroll, { passive: true });
onScroll();
}
/* ============================================================
4. HAMBURGER MENU
============================================================ */
function initHamburger() {
const hamburger = $('.hamburger') || $('#hamburger');
const drawer = $('.mobile-drawer') || $('#mobile-drawer');
if (!hamburger || !drawer) return;
hamburger.addEventListener('click', () => {
const isOpen = hamburger.classList.toggle('open');
drawer.classList.toggle('open', isOpen);
hamburger.setAttribute('aria-expanded', isOpen);
document.body.style.overflow = isOpen ? 'hidden' : '';
});
// Close on nav link click
$$('.drawer-link', drawer).forEach(link => {
link.addEventListener('click', () => {
hamburger.classList.remove('open');
drawer.classList.remove('open');
hamburger.setAttribute('aria-expanded', false);
document.body.style.overflow = '';
$$('.drawer-link', drawer).forEach(l => l.classList.remove('active'));
link.classList.add('active');
});
});
// Close on outside click
document.addEventListener('click', (e) => {
if (!hamburger.contains(e.target) && !drawer.contains(e.target)) {
hamburger.classList.remove('open');
drawer.classList.remove('open');
hamburger.setAttribute('aria-expanded', false);
document.body.style.overflow = '';
}
});
}
/* ============================================================
5. BACK TO TOP BUTTON
============================================================ */
function initBackToTop() {
const btn = $('.back-to-top-btn') || $('#btt');
if (!btn) return;
window.addEventListener('scroll', () => {
btn.classList.toggle('visible', window.scrollY > CONFIG.BTT_SCROLL_THRESHOLD);
}, { passive: true });
btn.addEventListener('click', () => {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
}
/* ============================================================
6. ACTIVE NAV LINK — HIGHLIGHT CURRENT PAGE
============================================================ */
function initActiveNavLink() {
const currentPath = window.location.pathname;
const navLinks = $$('.inadug-nav .nav-link, .mobile-drawer .drawer-link');
navLinks.forEach(link => {
const href = link.getAttribute('href') || link.dataset.href || '';
if (!href) return;
const linkPath = new URL(href, window.location.origin).pathname;
if (
currentPath === linkPath ||
(linkPath !== '/' && currentPath.startsWith(linkPath))
) {
link.classList.add('active');
} else {
link.classList.remove('active');
}
});
}
/* ============================================================
7. GEOMETRIC BACKGROUND ANIMATION
============================================================ */
function initGeoCanvas(canvas) {
if (!canvas) return;
const section = canvas.closest('.section') || canvas.parentElement;
if (!section) return;
const ctx = canvas.getContext('2d');
const bg = getSectionBg(section);
const color = bg === 'yellow' ? '#0A0A0A'
: bg === 'black' ? '#FFD600'
: '#0A0A0A';
const opacity = bg === 'white'
? CONFIG.GEO_OPACITY_WHITE_BG
: bg === 'black'
? CONFIG.GEO_OPACITY_BLACK_BG
: CONFIG.GEO_OPACITY_YELLOW_BG;
let w, h, shapes = [], animId;
function resize() {
w = section.offsetWidth;
h = section.offsetHeight || 400;
canvas.width = w;
canvas.height = h;
}
function makeShapes() {
shapes = [];
for (let i = 0; i < CONFIG.GEO_SHAPE_COUNT; i++) {
shapes.push({
x: Math.random() * w,
y: Math.random() * h,
vx: (Math.random() - 0.5) * CONFIG.GEO_SPEED,
vy: (Math.random() - 0.5) * CONFIG.GEO_SPEED,
size: CONFIG.GEO_MIN_SIZE + Math.random() * CONFIG.GEO_MAX_SIZE,
rot: Math.random() * Math.PI * 2,
vr: (Math.random() - 0.5) * CONFIG.GEO_ROTATION_SPEED,
type: i % 3,
});
}
}
function drawShape(s) {
const r = s.size / 2;
ctx.save();
ctx.translate(s.x, s.y);
ctx.rotate(s.rot);
ctx.beginPath();
if (s.type === 0) {
// Triangle
for (let j = 0; j < 3; j++) {
const a = (j / 3) * Math.PI * 2 - Math.PI / 2;
j === 0
? ctx.moveTo(Math.cos(a) * r, Math.sin(a) * r)
: ctx.lineTo(Math.cos(a) * r, Math.sin(a) * r);
}
ctx.closePath();
} else if (s.type === 1) {
// Square
ctx.rect(-r, -r, s.size, s.size);
} else {
// Diamond
for (let j = 0; j < 4; j++) {
const a = (j / 4) * Math.PI * 2 - Math.PI / 4;
j === 0
? ctx.moveTo(Math.cos(a) * r, Math.sin(a) * r)
: ctx.lineTo(Math.cos(a) * r, Math.sin(a) * r);
}
ctx.closePath();
}
ctx.stroke();
ctx.restore();
}
function tick() {
ctx.clearRect(0, 0, w, h);
ctx.strokeStyle = color;
ctx.lineWidth = CONFIG.GEO_LINE_WIDTH;
ctx.globalAlpha = opacity;
shapes.forEach(s => {
s.x += s.vx;
s.y += s.vy;
s.rot += s.vr;
// Wrap around edges
if (s.x < -s.size) s.x = w + s.size;
if (s.x > w + s.size) s.x = -s.size;
if (s.y < -s.size) s.y = h + s.size;
if (s.y > h + s.size) s.y = -s.size;
drawShape(s);
});
ctx.globalAlpha = 1;
animId = requestAnimationFrame(tick);
}
const handleResize = debounce(() => {
resize();
makeShapes();
}, 200);
resize();
makeShapes();
tick();
window.addEventListener('resize', handleResize);
// Pause animation when section is not visible (performance)
if ('IntersectionObserver' in window) {
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.isIntersecting) {
if (!animId) tick();
} else {
cancelAnimationFrame(animId);
animId = null;
}
});
}, { threshold: 0.01 });
observer.observe(section);
}
}
function initAllGeoCanvases() {
$$('.geo-canvas').forEach(canvas => initGeoCanvas(canvas));
}
/* ============================================================
8. HERO PARALLAX — NAME & PHOTO MOUSE TRACKING
============================================================ */
function initHeroParallax() {
const heroSection = $('.inadug-hero') || $('#inadug-hero');
if (!heroSection) return;
const heroName = $('.hero-name', heroSection) || $('#hero-name');
const heroPhoto = $('.hero-photo', heroSection) || $('#hero-photo');
heroSection.addEventListener('mousemove', (e) => {
const rect = heroSection.getBoundingClientRect();
const dx = (e.clientX - rect.left - rect.width / 2) / (rect.width / 2);
const dy = (e.clientY - rect.top - rect.height / 2) / (rect.height / 2);
if (heroName) heroName.style.transform = `translate(${dx * 6}px, ${dy * 4}px)`;
if (heroPhoto) heroPhoto.style.transform = `translate(${dx * -10}px, ${dy * -6}px)`;
});
heroSection.addEventListener('mouseleave', () => {
if (heroName) heroName.style.transform = '';
if (heroPhoto) heroPhoto.style.transform = '';
});
}
/* ============================================================
9. TWO-COLUMN HOVER INTERACTION
============================================================ */
function initTwoColHover() {
$$('.two-col').forEach(col => {
const left = col.querySelector('.col-left');
const right = col.querySelector('.col-right');
if (!left || !right) return;
col.addEventListener('mouseenter', () => {
left.style.transform = 'translateX(-8px)';
right.style.transform = 'translateX(8px)';
});
col.addEventListener('mouseleave', () => {
left.style.transform = '';
right.style.transform = '';
});
});
}
/* ============================================================
10. LYRICS TOGGLE
============================================================ */
function initLyricsToggle() {
$$('.lyrics-toggle-btn').forEach(btn => {
const targetId = btn.dataset.target || 'lyrics-panel';
const panel = document.getElementById(targetId)
|| btn.nextElementSibling;
const inner = panel ? panel.querySelector('.lyrics-inner') : null;
const arrow = btn.querySelector('.arrow');
if (!panel) return;
// Disable right-click on lyrics
if (inner) {
inner.addEventListener('contextmenu', e => e.preventDefault());
}
btn.addEventListener('click', () => {
const isOpen = panel.classList.toggle('open');
btn.classList.toggle('open', isOpen);
if (arrow) {
arrow.style.transform = isOpen ? 'rotate(180deg)' : '';
}
// Update button label
const labelNode = btn.childNodes[0];
if (labelNode && labelNode.nodeType === Node.TEXT_NODE) {
labelNode.textContent = isOpen ? 'Hide Lyrics ' : 'View Lyrics ';
}
});
});
}
/* ============================================================
11. AUDIO PLAYER
============================================================ */
function initAudioPlayer(playerEl) {
if (!playerEl) return;
const audioSrc = playerEl.dataset.audio;
const isPreview = playerEl.dataset.preview === 'true';
const previewEnd = parseFloat(playerEl.dataset.previewEnd) || CONFIG.PREVIEW_DURATION;
const playBtn = playerEl.querySelector('.play-btn');
const playIcon = playerEl.querySelector('.play-icon');
const progressFill = playerEl.querySelector('.progress-bar-fill');
const progressThumb = playerEl.querySelector('.progress-thumb');
const progressWrap = playerEl.querySelector('.progress-bar-wrap');
const currentTimeEl = playerEl.querySelector('.current-time');
const totalTimeEl = playerEl.querySelector('.total-time');
const loopBtn = playerEl.querySelector('[data-action="loop"]');
const prevBtn = playerEl.querySelector('[data-action="prev"]');
const nextBtn = playerEl.querySelector('[data-action="next"]');
const restartBtn = playerEl.querySelector('[data-action="restart"]');
if (!audioSrc || !playBtn) return;
const audio = new Audio(audioSrc);
let looping = false;
let animId = null;
// Pause icon SVG
const PAUSE_SVG = `
`;
const PLAY_SVG = ``;
function setIcon(playing) {
if (playIcon) playIcon.innerHTML = playing ? PAUSE_SVG : PLAY_SVG;
}
function updateBar() {
if (!audio.duration) return;
const pct = (audio.currentTime / audio.duration) * 100;
if (progressFill) progressFill.style.width = pct + '%';
if (progressThumb) progressThumb.style.left = `calc(${pct}% - 6px)`;
if (currentTimeEl) currentTimeEl.textContent = formatTime(audio.currentTime);
}
function tickBar() {
updateBar();
if (!audio.paused) {
animId = requestAnimationFrame(tickBar);
}
}
// Set total time once metadata loads
audio.addEventListener('loadedmetadata', () => {
if (totalTimeEl) totalTimeEl.textContent = formatTime(audio.duration);
});
// Preview mode — stop at preview duration
audio.addEventListener('timeupdate', () => {
if (isPreview && audio.currentTime >= previewEnd) {
audio.pause();
audio.currentTime = 0;
setIcon(false);
cancelAnimationFrame(animId);
updateBar();
showPreviewEndMessage(playerEl);
}
});
// Ended
audio.addEventListener('ended', () => {
if (looping) {
audio.currentTime = 0;
audio.play();
} else {
setIcon(false);
cancelAnimationFrame(animId);
updateBar();
}
});
// Play / Pause
playBtn.addEventListener('click', () => {
if (audio.paused) {
// Pause all other players first
pauseAllPlayers(playerEl);
audio.play();
setIcon(true);
tickBar();
} else {
audio.pause();
setIcon(false);
cancelAnimationFrame(animId);
}
});
// Progress bar click to seek
if (progressWrap) {
progressWrap.addEventListener('click', (e) => {
if (!audio.duration) return;
const rect = progressWrap.getBoundingClientRect();
const pct = (e.clientX - rect.left) / rect.width;
audio.currentTime = pct * audio.duration;
updateBar();
});
}
// Loop
if (loopBtn) {
loopBtn.addEventListener('click', () => {
looping = !looping;
loopBtn.style.color = looping ? 'var(--color-yellow)' : '';
loopBtn.style.opacity = looping ? '1' : '';
});
}
// Restart
if (restartBtn) {
restartBtn.addEventListener('click', () => {
audio.currentTime = 0;
updateBar();
});
}
// Prev / Next — dispatches events for playlist controller to handle
if (prevBtn) {
prevBtn.addEventListener('click', () => {
document.dispatchEvent(new CustomEvent('inadug:prev', { detail: { playerEl } }));
});
}
if (nextBtn) {
nextBtn.addEventListener('click', () => {
document.dispatchEvent(new CustomEvent('inadug:next', { detail: { playerEl } }));
});
}
// Store audio instance on element for external access
playerEl._audio = audio;
playerEl._pauseAudio = () => {
audio.pause();
setIcon(false);
cancelAnimationFrame(animId);
};
updateBar();
}
function pauseAllPlayers(exceptEl) {
$$('.inadug-player').forEach(p => {
if (p !== exceptEl && typeof p._pauseAudio === 'function') {
p._pauseAudio();
}
});
}
function showPreviewEndMessage(playerEl) {
const existing = playerEl.querySelector('.preview-end-msg');
if (existing) return;
const msg = document.createElement('div');
msg.className = 'preview-end-msg';
msg.innerHTML = `
Preview ended — stream the full track on
`;
msg.style.cssText = 'margin-top:16px;padding-top:16px;border-top:1px solid var(--color-black-border);';
playerEl.appendChild(msg);
setTimeout(() => {
if (msg.parentNode) msg.remove();
}, 12000);
}
function initAllAudioPlayers() {
$$('.inadug-player').forEach(p => initAudioPlayer(p));
}
/* ============================================================
12. TRACK ROW PLAY BUTTONS — ALBUM PAGE
============================================================ */
function initTrackRowButtons() {
$$('.track-play-btn').forEach(btn => {
btn.addEventListener('click', () => {
const row = btn.closest('.track-row');
const audio = row ? row.dataset.audio : null;
const songUrl = row ? row.dataset.href : null;
if (songUrl) {
window.location.href = songUrl;
return;
}
if (audio) {
// Quick preview from tracklist
pauseAllPlayers(null);
const tempAudio = new Audio(audio);
tempAudio.play();
btn.classList.add('playing');
setTimeout(() => {
tempAudio.pause();
btn.classList.remove('playing');
}, CONFIG.PREVIEW_DURATION * 1000);
}
});
});
}
/* ============================================================
13. MERCH CARD — NOTIFY ME FORM TOGGLE
============================================================ */
function initMerchNotify() {
$$('[data-action="notify-me"]').forEach(btn => {
btn.addEventListener('click', () => {
const card = btn.closest('.merch-card');
const form = card ? card.querySelector('.notify-form') : null;
if (!form) return;
const isVisible = form.style.maxHeight && form.style.maxHeight !== '0px';
form.style.maxHeight = isVisible ? '0px' : '200px';
form.style.overflow = 'hidden';
form.style.transition = 'max-height 0.4s ease';
btn.textContent = isVisible ? 'Notify Me' : 'Cancel';
});
});
}
/* ============================================================
14. SCROLL REVEAL ANIMATION
============================================================ */
function initScrollReveal() {
const targets = $$('[data-reveal]');
if (!targets.length) return;
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('revealed');
observer.unobserve(entry.target);
}
});
}, {
threshold: 0.15,
rootMargin: '0px 0px -40px 0px',
});
targets.forEach(el => {
el.classList.add('reveal-ready');
observer.observe(el);
});
// Inject scroll reveal CSS if not already present
if (!document.getElementById('inadug-reveal-css')) {
const style = document.createElement('style');
style.id = 'inadug-reveal-css';
style.textContent = `
.reveal-ready {
opacity: 0;
transform: translateY(24px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal-ready.revealed {
opacity: 1;
transform: translateY(0);
}
`;
document.head.appendChild(style);
}
}
/* ============================================================
15. COPY PROTECTION — LYRICS PAGES
============================================================ */
function initCopyProtection() {
$$('.lyrics-inner, .lyrics-protected').forEach(el => {
el.addEventListener('contextmenu', e => e.preventDefault());
el.addEventListener('selectstart', e => e.preventDefault());
el.addEventListener('copy', e => e.preventDefault());
el.addEventListener('cut', e => e.preventDefault());
el.addEventListener('dragstart', e => e.preventDefault());
});
}
/* ============================================================
16. NAV SMOOTH SCROLL — FOR ANCHOR LINKS
============================================================ */
function initAnchorScroll() {
$$('a[href^="#"]').forEach(link => {
link.addEventListener('click', (e) => {
const id = link.getAttribute('href').slice(1);
const target = document.getElementById(id);
if (!target) return;
e.preventDefault();
const navHeight = ($('.inadug-nav') || { offsetHeight: 0 }).offsetHeight;
const top = target.getBoundingClientRect().top + window.scrollY - navHeight - 16;
window.scrollTo({ top, behavior: 'smooth' });
});
});
}
/* ============================================================
17. PLATFORM LINK RESOLVER
Fills platform buttons with real URLs from page data attrs
============================================================ */
function initPlatformLinks() {
const pageData = window.INADUG_PAGE_DATA || {};
const platformMap = {
'[data-platform="spotify"]': pageData.spotify || 'https://open.spotify.com/album/0OCTKpEaSih9kj8g63ZDkv',
'[data-platform="apple"]': pageData.apple || 'https://music.apple.com/za/album/beyond-the-universe/1868165040',
'[data-platform="youtube"]': pageData.youtube || 'https://youtube.com/@Inadug',
'[data-platform="deezer"]': pageData.deezer || 'https://deezer.com/us/album/895171722',
'[data-platform="amazon"]': pageData.amazon || 'https://music.amazon.com/es-us/artists/B0GG1CPH7R/inadug',
'[data-platform="tidal"]': pageData.tidal || 'https://tidal.com/artist/72871331',
};
Object.entries(platformMap).forEach(([.elementor-kit-404, url]) => {
$$(.elementor-kit-404).forEach(el => {
if (el.tagName === 'A') {
el.href = url;
el.target = '_blank';
el.rel = 'noopener noreferrer';
} else {
el.style.cursor = 'pointer';
el.addEventListener('click', () => window.open(url, '_blank', 'noopener'));
}
});
});
}
/* ============================================================
18. CONTACT / PRESS FORM SUBMISSION
============================================================ */
function initContactForm() {
$$('.inadug-contact-form').forEach(form => {
form.addEventListener('submit', async (e) => {
e.preventDefault();
const btn = form.querySelector('[type="submit"]');
const originalTxt = btn ? btn.textContent : '';
if (btn) {
btn.textContent = 'Sending...';
btn.disabled = true;
}
const data = Object.fromEntries(new FormData(form));
try {
// Uses WPForms AJAX or CF7 endpoint
// Replace action URL with your WPForms REST endpoint
const res = await fetch(form.action || '/wp-admin/admin-ajax.php', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ action: 'inadug_contact', ...data }),
});
const json = await res.json();
if (json.success) {
showFormSuccess(form);
} else {
showFormError(form, json.message || 'Something went wrong. Please try again.');
}
} catch {
showFormError(form, 'Network error. Please email us at booking@inadug.com');
} finally {
if (btn) {
btn.textContent = originalTxt;
btn.disabled = false;
}
}
});
});
}
function showFormSuccess(form) {
const msg = document.createElement('div');
msg.className = 'form-success-msg';
msg.style.cssText = `
background:var(--color-yellow);color:var(--color-black);
padding:14px 20px;border-radius:var(--radius-pill);
font-weight:700;font-size:var(--fs-label);
letter-spacing:2px;text-transform:uppercase;
margin-top:16px;`;
msg.textContent = 'Message sent — we will be in touch shortly.';
form.appendChild(msg);
form.reset();
setTimeout(() => msg.remove(), 6000);
}
function showFormError(form, message) {
const msg = document.createElement('div');
msg.className = 'form-error-msg';
msg.style.cssText = `
background:#FF4444;color:#fff;
padding:14px 20px;border-radius:var(--radius-pill);
font-weight:700;font-size:var(--fs-label);
letter-spacing:2px;text-transform:uppercase;
margin-top:16px;`;
msg.textContent = message;
form.appendChild(msg);
setTimeout(() => msg.remove(), 6000);
}
/* ============================================================
19. MOBILE — PREVENT SCROLL WHEN DRAWER OPEN
============================================================ */
function initScrollLock() {
const observer = new MutationObserver(() => {
const drawer = $('.mobile-drawer');
if (!drawer) return;
document.body.style.overflow = drawer.classList.contains('open') ? 'hidden' : '';
});
const drawer = $('.mobile-drawer');
if (drawer) {
observer.observe(drawer, { attributes: true, attributeFilter: ['class'] });
}
}
/* ============================================================
20. VIDEO PLAYER — PREVIEW SUPPORT
============================================================ */
function initVideoPlayers() {
$$('.inadug-video-wrap').forEach(wrap => {
const iframe = wrap.querySelector('iframe');
const overlay = wrap.querySelector('.video-overlay');
const playBtn = wrap.querySelector('.video-play-btn');
const isPreview = wrap.dataset.preview === 'true';
if (!overlay || !playBtn || !iframe) return;
playBtn.addEventListener('click', () => {
overlay.style.display = 'none';
// Autoplay YouTube embed by appending ?autoplay=1
const src = iframe.src;
if (!src.includes('autoplay')) {
iframe.src = src + (src.includes('?') ? '&' : '?') + 'autoplay=1';
}
});
});
}
/* ============================================================
21. MARQUEE — PAUSE ON HOVER
============================================================ */
function initMarqueePause() {
$$('.inadug-marquee').forEach(marquee => {
const inner = marquee.querySelector('.inadug-marquee-inner');
if (!inner) return;
marquee.addEventListener('mouseenter', () => inner.style.animationPlayState = 'paused');
marquee.addEventListener('mouseleave', () => inner.style.animationPlayState = 'running');
});
}
/* ============================================================
22. GLOBAL PAGE DATA — SET BY ELEMENTOR CUSTOM CODE PER PAGE
Example usage in a page's custom code block:
window.INADUG_PAGE_DATA = {
spotify: 'https://open.spotify.com/track/...',
apple: 'https://music.apple.com/...',
youtube: 'https://youtube.com/watch?v=...',
audio: 'https://www.inadug.com/wp-content/uploads/2026/04/On-Bended-Knee.wav',
preview: false,
};
============================================================ */
window.INADUG_PAGE_DATA = window.INADUG_PAGE_DATA || {};
/* ============================================================
23. EXPOSE PUBLIC API
Allows Elementor custom code blocks to call these functions
============================================================ */
window.INADUG = {
initGeoCanvas,
initAllGeoCanvases,
initAudioPlayer,
initAllAudioPlayers,
initLyricsToggle,
pauseAllPlayers,
formatTime,
};
/* ============================================================
24. INIT — RUN ON DOM READY
============================================================ */
function init() {
initStickyNav();
initHamburger();
initBackToTop();
initActiveNavLink();
initAllGeoCanvases();
initHeroParallax();
initTwoColHover();
initLyricsToggle();
initAllAudioPlayers();
initTrackRowButtons();
initMerchNotify();
initScrollReveal();
initCopyProtection();
initAnchorScroll();
initPlatformLinks();
initContactForm();
initScrollLock();
initVideoPlayers();
initMarqueePause();
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', init);
} else {
init();
}
/* ============================================================
25. ELEMENTOR FRONTEND HOOK
Re-runs init after Elementor re-renders widgets in editor
============================================================ */
if (typeof elementorFrontend !== 'undefined') {
elementorFrontend.hooks.addAction('frontend/element_ready/global', () => {
initAllGeoCanvases();
initAllAudioPlayers();
initLyricsToggle();
initPlatformLinks();
});
}
})();
/* ============================================================
END OF INADUG GLOBAL JS
Version: 1.0
Last Updated: April 2026
============================================================ *//* End custom CSS */