| Dir : /home/trave494/bettingbin.com/wp-content/themes/sinatra/assets/js/dev/ |
| Server: Linux ngx353.inmotionhosting.com 4.18.0-553.22.1.lve.1.el8.x86_64 #1 SMP Tue Oct 8 15:52:54 UTC 2024 x86_64 IP: 209.182.202.254 |
| Dir : //home/trave494/bettingbin.com/wp-content/themes/sinatra/assets/js/dev/sinatra-slider.js |
/**
* Sinatra hover slider
*
* @since 1.0.0
*/
var sinatraHoverSlider = function(el) {
var current = 0,
spinner = el.querySelector( '.si-spinner' );
// Hide spinner
var hideSpinner = function() {
spinner.classList.remove( 'visible' );
setTimeout( function() {
spinner.style.display = 'none';
}, 300 );
el.querySelector( '.hover-slider-backgrounds' ).classList.add( 'loaded' );
};
el.querySelector( '.hover-slide-bg' ).classList.add( 'active' );
// Set background images from data-background
el.querySelectorAll( '.hover-slider-backgrounds .hover-slide-bg' ).forEach( ( item, i ) => {
item.style.backgroundImage = 'url(' + item.getAttribute( 'data-background' ) + ')';
el.querySelector( '.hover-slider-items > div:nth-child(' + (i+1) + ')' ).style.setProperty('--bg-image', 'url("' + item.getAttribute( 'data-background' ) + '")' );
item.removeAttribute( 'data-background' );
})
// Wait for images to load
imagesLoaded( el.querySelectorAll( '.hover-slider-backgrounds' ), { background: '.hover-slide-bg' }, function() {
var preloader = document.getElementById( 'si-preloader' );
// Wait for preloader to finish before we show fade in animation
if ( null !== preloader && ! document.body.classList.contains( 'si-loaded' ) ) {
document.body.addEventListener( 'si-preloader-done', function() {
setTimeout( function() {
hideSpinner();
}, 300);
});
} else {
setTimeout( function() {
hideSpinner();
}, 300);
}
});
// Change backgrounds on hover
el.querySelectorAll( '.hover-slider-item-wrapper' ).forEach( ( item ) => {
item.addEventListener( 'mouseenter', function() {
if ( current !== sinatraGetIndex(item) ) {
current = sinatraGetIndex(item);
el.querySelectorAll( '.hover-slide-bg' ).forEach( ( item, i ) => {
item.classList.remove( 'active' );
if ( i === current ) {
item.classList.add( 'active' );
}
})
}
});
});
return el;
};
// Main
( function() {
// On ready event
document.addEventListener( 'DOMContentLoaded', function () {
// Init sliders
document.querySelectorAll( '.si-hover-slider' ).forEach( ( item ) => {
sinatraHoverSlider(item);
});
});
} )();