/*! * Jarallax v2.0.3 (https://github.com/nk-o/jarallax) * Copyright 2022 nK * Licensed under MIT (https://github.com/nk-o/jarallax/blob/master/LICENSE) */ (function(global,factory){typeof exports==='object'&&typeof module!=='undefined'?module.exports=factory():typeof define==='function'&&define.amd?define(factory):(global=typeof globalThis!=='undefined'?globalThis:global||self,global.jarallax=factory());})(this,(function(){'use strict';function ready(callback){if('complete'===document.readyState||'interactive'===document.readyState){callback();}else{document.addEventListener('DOMContentLoaded',callback,{capture:true,once:true,passive:true});}} let win;if('undefined'!==typeof window){win=window;}else if('undefined'!==typeof global){win=global;}else if('undefined'!==typeof self){win=self;}else{win={};} var global$1=win;const{navigator}=global$1;const isMobile=/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);let $deviceHelper;function getDeviceHeight(){if(!$deviceHelper&&document.body){$deviceHelper=document.createElement('div');$deviceHelper.style.cssText='position: fixed; top: -9999px; left: 0; height: 100vh; width: 0;';document.body.appendChild($deviceHelper);} return($deviceHelper?$deviceHelper.clientHeight:0)||global$1.innerHeight||document.documentElement.clientHeight;} let wndH;function updateWndVars(){if(isMobile){wndH=getDeviceHeight();}else{wndH=global$1.innerHeight||document.documentElement.clientHeight;}} updateWndVars();global$1.addEventListener('resize',updateWndVars);global$1.addEventListener('orientationchange',updateWndVars);global$1.addEventListener('load',updateWndVars);ready(()=>{updateWndVars();});const jarallaxList=[];function getParents(elem){const parents=[];while(null!==elem.parentElement){elem=elem.parentElement;if(1===elem.nodeType){parents.push(elem);}} return parents;} function updateParallax(){if(!jarallaxList.length){return;} jarallaxList.forEach((data,k)=>{const{instance,oldData}=data;const clientRect=instance.$item.getBoundingClientRect();const newData={width:clientRect.width,height:clientRect.height,top:clientRect.top,bottom:clientRect.bottom,wndW:global$1.innerWidth,wndH};const isResized=!oldData||oldData.wndW!==newData.wndW||oldData.wndH!==newData.wndH||oldData.width!==newData.width||oldData.height!==newData.height;const isScrolled=isResized||!oldData||oldData.top!==newData.top||oldData.bottom!==newData.bottom;jarallaxList[k].oldData=newData;if(isResized){instance.onResize();} if(isScrolled){instance.onScroll();}});global$1.requestAnimationFrame(updateParallax);} let instanceID=0;class Jarallax{constructor(item,userOptions){const self=this;self.instanceID=instanceID;instanceID+=1;self.$item=item;self.defaults={type:'scroll',speed:0.5,imgSrc:null,imgElement:'.jarallax-img',imgSize:'cover',imgPosition:'50% 50%',imgRepeat:'no-repeat',keepImg:false,elementInViewport:null,zIndex:-100,disableParallax:false,disableVideo:false,videoSrc:null,videoStartTime:0,videoEndTime:0,videoVolume:0,videoLoop:true,videoPlayOnlyVisible:true,videoLazyLoading:true,onScroll:null,onInit:null,onDestroy:null,onCoverImage:null};const dataOptions=self.$item.dataset||{};const pureDataOptions={};Object.keys(dataOptions).forEach(key=>{const loweCaseOption=key.substr(0,1).toLowerCase()+key.substr(1);if(loweCaseOption&&'undefined'!==typeof self.defaults[loweCaseOption]){pureDataOptions[loweCaseOption]=dataOptions[key];}});self.options=self.extend({},self.defaults,pureDataOptions,userOptions);self.pureOptions=self.extend({},self.options);Object.keys(self.options).forEach(key=>{if('true'===self.options[key]){self.options[key]=true;}else if('false'===self.options[key]){self.options[key]=false;}});self.options.speed=Math.min(2,Math.max(-1,parseFloat(self.options.speed)));if('string'===typeof self.options.disableParallax){self.options.disableParallax=new RegExp(self.options.disableParallax);} if(self.options.disableParallax instanceof RegExp){const disableParallaxRegexp=self.options.disableParallax;self.options.disableParallax=()=>disableParallaxRegexp.test(navigator.userAgent);} if('function'!==typeof self.options.disableParallax){self.options.disableParallax=()=>false;} if('string'===typeof self.options.disableVideo){self.options.disableVideo=new RegExp(self.options.disableVideo);} if(self.options.disableVideo instanceof RegExp){const disableVideoRegexp=self.options.disableVideo;self.options.disableVideo=()=>disableVideoRegexp.test(navigator.userAgent);} if('function'!==typeof self.options.disableVideo){self.options.disableVideo=()=>false;} let elementInVP=self.options.elementInViewport;if(elementInVP&&'object'===typeof elementInVP&&'undefined'!==typeof elementInVP.length){[elementInVP]=elementInVP;} if(!(elementInVP instanceof Element)){elementInVP=null;} self.options.elementInViewport=elementInVP;self.image={src:self.options.imgSrc||null,$container:null,useImgTag:false,position:'fixed'};if(self.initImg()&&self.canInitParallax()){self.init();}} css(el,styles){if('string'===typeof styles){return global$1.getComputedStyle(el).getPropertyValue(styles);} Object.keys(styles).forEach(key=>{el.style[key]=styles[key];});return el;} extend(out,...args){out=out||{};Object.keys(args).forEach(i=>{if(!args[i]){return;} Object.keys(args[i]).forEach(key=>{out[key]=args[i][key];});});return out;} getWindowData(){return{width:global$1.innerWidth||document.documentElement.clientWidth,height:wndH,y:document.documentElement.scrollTop};} initImg(){const self=this;let $imgElement=self.options.imgElement;if($imgElement&&'string'===typeof $imgElement){$imgElement=self.$item.querySelector($imgElement);} if(!($imgElement instanceof Element)){if(self.options.imgSrc){$imgElement=new Image();$imgElement.src=self.options.imgSrc;}else{$imgElement=null;}} if($imgElement){if(self.options.keepImg){self.image.$item=$imgElement.cloneNode(true);}else{self.image.$item=$imgElement;self.image.$itemParent=$imgElement.parentNode;} self.image.useImgTag=true;} if(self.image.$item){return true;} if(null===self.image.src){self.image.src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';self.image.bgImage=self.css(self.$item,'background-image');} return!(!self.image.bgImage||'none'===self.image.bgImage);} canInitParallax(){return!this.options.disableParallax();} init(){const self=this;const containerStyles={position:'absolute',top:0,left:0,width:'100%',height:'100%',overflow:'hidden'};let imageStyles={pointerEvents:'none',transformStyle:'preserve-3d',backfaceVisibility:'hidden',willChange:'transform,opacity'};if(!self.options.keepImg){const curStyle=self.$item.getAttribute('style');if(curStyle){self.$item.setAttribute('data-jarallax-original-styles',curStyle);} if(self.image.useImgTag){const curImgStyle=self.image.$item.getAttribute('style');if(curImgStyle){self.image.$item.setAttribute('data-jarallax-original-styles',curImgStyle);}}} if('static'===self.css(self.$item,'position')){self.css(self.$item,{position:'relative'});} if('auto'===self.css(self.$item,'z-index')){self.css(self.$item,{zIndex:0});} self.image.$container=document.createElement('div');self.css(self.image.$container,containerStyles);self.css(self.image.$container,{'z-index':self.options.zIndex});if('fixed'===this.image.position){self.css(self.image.$container,{'-webkit-clip-path':'polygon(0 0, 100% 0, 100% 100%, 0 100%)','clip-path':'polygon(0 0, 100% 0, 100% 100%, 0 100%)'});} self.image.$container.setAttribute('id',`jarallax-container-${self.instanceID}`);self.$item.appendChild(self.image.$container);if(self.image.useImgTag){imageStyles=self.extend({'object-fit':self.options.imgSize,'object-position':self.options.imgPosition,'max-width':'none'},containerStyles,imageStyles);}else{self.image.$item=document.createElement('div');if(self.image.src){imageStyles=self.extend({'background-position':self.options.imgPosition,'background-size':self.options.imgSize,'background-repeat':self.options.imgRepeat,'background-image':self.image.bgImage||`url("${self.image.src}")`},containerStyles,imageStyles);}} if('opacity'===self.options.type||'scale'===self.options.type||'scale-opacity'===self.options.type||1===self.options.speed){self.image.position='absolute';} if('fixed'===self.image.position){const $parents=getParents(self.$item).filter(el=>{const styles=global$1.getComputedStyle(el);const parentTransform=styles['-webkit-transform']||styles['-moz-transform']||styles.transform;const overflowRegex=/(auto|scroll)/;return parentTransform&&'none'!==parentTransform||overflowRegex.test(styles.overflow+styles['overflow-y']+styles['overflow-x']);});self.image.position=$parents.length?'absolute':'fixed';} imageStyles.position=self.image.position;self.css(self.image.$item,imageStyles);self.image.$container.appendChild(self.image.$item);self.onResize();self.onScroll(true);if(self.options.onInit){self.options.onInit.call(self);} if('none'!==self.css(self.$item,'background-image')){self.css(self.$item,{'background-image':'none'});} self.addToParallaxList();} addToParallaxList(){jarallaxList.push({instance:this});if(1===jarallaxList.length){global$1.requestAnimationFrame(updateParallax);}} removeFromParallaxList(){const self=this;jarallaxList.forEach((data,key)=>{if(data.instance.instanceID===self.instanceID){jarallaxList.splice(key,1);}});} destroy(){const self=this;self.removeFromParallaxList();const originalStylesTag=self.$item.getAttribute('data-jarallax-original-styles');self.$item.removeAttribute('data-jarallax-original-styles');if(!originalStylesTag){self.$item.removeAttribute('style');}else{self.$item.setAttribute('style',originalStylesTag);} if(self.image.useImgTag){const originalStylesImgTag=self.image.$item.getAttribute('data-jarallax-original-styles');self.image.$item.removeAttribute('data-jarallax-original-styles');if(!originalStylesImgTag){self.image.$item.removeAttribute('style');}else{self.image.$item.setAttribute('style',originalStylesTag);} if(self.image.$itemParent){self.image.$itemParent.appendChild(self.image.$item);}} if(self.image.$container){self.image.$container.parentNode.removeChild(self.image.$container);} if(self.options.onDestroy){self.options.onDestroy.call(self);} delete self.$item.jarallax;} clipContainer(){} coverImage(){const self=this;const rect=self.image.$container.getBoundingClientRect();const contH=rect.height;const{speed}=self.options;const isScroll='scroll'===self.options.type||'scroll-opacity'===self.options.type;let scrollDist=0;let resultH=contH;let resultMT=0;if(isScroll){if(0>speed){scrollDist=speed*Math.max(contH,wndH);if(wndHspeed){resultH=scrollDist / speed+Math.abs(scrollDist);}else{resultH+=(wndH-contH)*(1-speed);} scrollDist /=2;} self.parallaxScrollDistance=scrollDist;if(isScroll){resultMT=(wndH-resultH)/ 2;}else{resultMT=(contH-resultH)/ 2;} self.css(self.image.$item,{height:`${resultH}px`,marginTop:`${resultMT}px`,left:'fixed'===self.image.position?`${rect.left}px`:'0',width:`${rect.width}px`});if(self.options.onCoverImage){self.options.onCoverImage.call(self);} return{image:{height:resultH,marginTop:resultMT},container:rect};} isVisible(){return this.isElementInViewport||false;} onScroll(force){const self=this;const rect=self.$item.getBoundingClientRect();const contT=rect.top;const contH=rect.height;const styles={};let viewportRect=rect;if(self.options.elementInViewport){viewportRect=self.options.elementInViewport.getBoundingClientRect();} self.isElementInViewport=0<=viewportRect.bottom&&0<=viewportRect.right&&viewportRect.top<=wndH&&viewportRect.left<=global$1.innerWidth;if(force?false:!self.isElementInViewport){return;} const beforeTop=Math.max(0,contT);const beforeTopEnd=Math.max(0,contH+contT);const afterTop=Math.max(0,-contT);const beforeBottom=Math.max(0,contT+contH-wndH);const beforeBottomEnd=Math.max(0,contH-(contT+contH-wndH));const afterBottom=Math.max(0,-contT+wndH-contH);const fromViewportCenter=1-2*((wndH-contT)/(wndH+contH));let visiblePercent=1;if(contHself.options.speed){scale-=self.options.speed*visiblePercent;}else{scale+=self.options.speed*(1-visiblePercent);} styles.transform=`scale(${scale}) translate3d(0,0,0)`;} if('scroll'===self.options.type||'scroll-opacity'===self.options.type){let positionY=self.parallaxScrollDistance*fromViewportCenter;if('absolute'===self.image.position){positionY-=contT;} styles.transform=`translate3d(0,${positionY}px,0)`;} self.css(self.image.$item,styles);if(self.options.onScroll){self.options.onScroll.call(self,{section:rect,beforeTop,beforeTopEnd,afterTop,beforeBottom,beforeBottomEnd,afterBottom,visiblePercent,fromViewportCenter});}} onResize(){this.coverImage();}} const jarallax=function(items,options,...args){if('object'===typeof HTMLElement?items instanceof HTMLElement:items&&'object'===typeof items&&null!==items&&1===items.nodeType&&'string'===typeof items.nodeName){items=[items];} const len=items.length;let k=0;let ret;for(k;k{jarallax(document.querySelectorAll('[data-jarallax]'));});return jarallax;}));