UNPKG

my-animation-lib

Version:

A powerful animation library combining Three.js, GSAP, custom scroll triggers, and advanced effects with MathUtils integration

3 lines (2 loc) 36.1 kB
import{gsap as t}from"gsap";import*as e from"three";class i{constructor(){this.triggers=new Map,this.scrollY=0,this.viewportHeight=window.innerHeight,this.isInitialized=!1}async init(){this.setupEventListeners(),this.isInitialized=!0}setupEventListeners(){window.addEventListener("scroll",this.handleScroll.bind(this)),window.addEventListener("resize",this.handleResize.bind(this))}handleScroll(){this.scrollY=window.pageYOffset,this.updateTriggers()}handleResize(){this.viewportHeight=window.innerHeight,this.updateTriggers()}updateTriggers(){this.triggers.forEach(t=>{t.isActive&&this.updateTrigger(t)})}updateTrigger(t){const e=t.element.getBoundingClientRect(),i=this.calculateProgress(e,t);t.onUpdate&&t.onUpdate(i,t)}calculateProgress(t,e){const i=t.top,n=t.height,s=this.viewportHeight;let r=0;return"top"===e.start?r=1-i/s:"center"===e.start?r=1-(i+n/2)/s:"bottom"===e.start&&(r=1-(i+n)/s),Math.max(0,Math.min(1,r))}createTrigger(t,e={}){const i={element:t,start:e.start||"top",end:e.end||"bottom",onUpdate:e.onUpdate||null,isActive:!0,...e},n=`trigger_${Date.now()}_${Math.random()}`;return this.triggers.set(n,i),n}createParallax(e,i={}){const n=i.speed||.5,s=i.direction||"vertical";return this.createTrigger(e,{onUpdate:i=>{"vertical"===s?t.set(e,{y:i*n*100}):"horizontal"===s&&t.set(e,{x:i*n*100})}})}destroy(){window.removeEventListener("scroll",this.handleScroll),window.removeEventListener("resize",this.handleResize),this.triggers.clear()}}class n{constructor(){this.scene=null,this.camera=null,this.renderer=null,this.objects=new Map,this.animations=new Map,this.isInitialized=!1}async init(){this.setupScene(),this.setupCamera(),this.setupRenderer(),this.setupLights(),this.setupEventListeners(),this.animate(),this.isInitialized=!0}setupScene(){this.scene=new e.Scene,this.scene.background=new e.Color(0)}setupCamera(){this.camera=new e.PerspectiveCamera(75,window.innerWidth/window.innerHeight,.1,1e3),this.camera.position.z=5}setupRenderer(){this.renderer=new e.WebGLRenderer({antialias:!0}),this.renderer.setSize(window.innerWidth,window.innerHeight),this.renderer.setPixelRatio(window.devicePixelRatio),document.body.appendChild(this.renderer.domElement)}setupLights(){const t=new e.AmbientLight(16777215,.5);this.scene.add(t);const i=new e.DirectionalLight(16777215,.8);i.position.set(0,1,1),this.scene.add(i)}setupEventListeners(){window.addEventListener("resize",this.handleResize.bind(this))}handleResize(){this.camera.aspect=window.innerWidth/window.innerHeight,this.camera.updateProjectionMatrix(),this.renderer.setSize(window.innerWidth,window.innerHeight)}animate(){requestAnimationFrame(this.animate.bind(this)),this.animations.forEach(t=>{t.isActive&&t.update()}),this.renderer.render(this.scene,this.scene)}createCube(t={}){const i=new e.BoxGeometry(t.width||1,t.height||1,t.depth||1),n=new e.MeshLambertMaterial({color:t.color||65280}),s=new e.Mesh(i,n);this.scene.add(s);const r=`cube_${Date.now()}`;return this.objects.set(r,s),r}createSphere(t={}){const i=new e.SphereGeometry(t.radius||.5,t.widthSegments||32,t.heightSegments||16),n=new e.MeshLambertMaterial({color:t.color||16711680}),s=new e.Mesh(i,n);this.scene.add(s);const r=`sphere_${Date.now()}`;return this.objects.set(r,s),r}createParticleSystem(t={}){const i=t.count||1e3,n=new e.BufferGeometry,s=new Float32Array(3*i);for(let t=0;t<3*i;t+=3)s[t]=10*(Math.random()-.5),s[t+1]=10*(Math.random()-.5),s[t+2]=10*(Math.random()-.5);n.setAttribute("position",new e.BufferAttribute(s,3));const r=new e.PointsMaterial({color:t.color||16777215,size:t.size||.05}),a=new e.Points(n,r);this.scene.add(a);const o=`particles_${Date.now()}`;return this.objects.set(o,a),o}animateObject(t,e){const i=this.objects.get(t);if(!i)return;const n={object:i,isActive:!0,update:e.bind(null,i)};this.animations.set(t,n)}rotateObject(t,e=.01){this.animateObject(t,t=>{t.rotation.x+=e,t.rotation.y+=e})}moveObject(t,e="up",i=.01){this.animateObject(t,t=>{switch(e){case"up":t.position.y+=i;break;case"down":t.position.y-=i;break;case"left":t.position.x-=i;break;case"right":t.position.x+=i}})}destroy(){window.removeEventListener("resize",this.handleResize),this.renderer&&(document.body.removeChild(this.renderer.domElement),this.renderer.dispose()),this.objects.clear(),this.animations.clear()}}class s{static clamp(t,e,i){return Math.min(Math.max(t,e),i)}static lerp(t,e,i){return t+(e-t)*i}static map(t,e,i,n,s){return(t-e)*(s-n)/(i-e)+n}static random(t,e){return Math.random()*(e-t)+t}static randomInt(t,e){return Math.floor(Math.random()*(e-t+1))+t}static randomChoice(t){return t[Math.floor(Math.random()*t.length)]}static distance(t,e,i,n){const s=i-t,r=n-e;return Math.sqrt(s*s+r*r)}static distance3D(t,e,i,n,s,r){const a=n-t,o=s-e,c=r-i;return Math.sqrt(a*a+o*o+c*c)}static angle(t,e,i,n){return Math.atan2(n-e,i-t)}static degreesToRadians(t){return t*(Math.PI/180)}static radiansToDegrees(t){return t*(180/Math.PI)}static normalize(t,e,i){return(t-e)/(i-e)}static smoothstep(t,e,i){const n=s.clamp((i-t)/(e-t),0,1);return n*n*(3-2*n)}static smootherstep(t,e,i){const n=s.clamp((i-t)/(e-t),0,1);return n*n*n*(n*(6*n-15)+10)}static noise(t){return Math.sin(12.9898*t)*Math.cos(78.233*t)*43758.5453%1}static perlinNoise(t,e){const i=255&Math.floor(t),n=255&Math.floor(e);t-=Math.floor(t),e-=Math.floor(e);const s=this.fade(t),r=this.fade(e),a=this.p[i]+n,o=this.p[a],c=this.p[a+1],l=this.p[i+1]+n,h=this.p[l],d=this.p[l+1];return this.lerp(this.lerp(this.grad(this.p[o],t,e),this.grad(this.p[h],t-1,e),s),this.lerp(this.grad(this.p[c],t,e-1),this.grad(this.p[d],t-1,e-1),s),r)}static fade(t){return t*t*t*(t*(6*t-15)+10)}static lerp(t,e,i){return t+i*(e-t)}static grad(t,e,i){const n=15&t,s=n<8?e:i,r=n<4?i:12===n||14===n?e:0;return(1&n?-s:s)+(2&n?-r:r)}static p=new Array(512);static permutation=[151,160,137,91,90,15,131,13,201,95,96,53,194,233,7,225,140,36,103,30,69,142,8,99,37,240,21,10,23,190,6,148,247,120,234,75,0,26,197,62,94,252,219,203,117,35,11,32,57,177,33,88,237,149,56,87,174,20,125,136,171,168,68,175,74,165,71,134,139,48,27,166,77,146,158,231,83,111,229,122,60,211,133,230,220,105,92,41,55,46,245,40,244,102,143,54,65,25,63,161,1,216,80,73,209,76,132,187,208,89,18,169,200,196,135,130,116,188,159,86,164,100,109,198,173,186,3,64,52,217,226,250,124,123,5,202,38,147,118,126,255,82,85,212,207,206,59,227,47,16,58,17,182,189,28,42,223,183,170,213,119,248,152,2,44,154,163,70,221,153,101,155,167,43,172,9,129,22,39,253,19,98,108,110,79,113,224,232,178,185,112,104,218,246,97,228,251,34,242,193,238,210,144,12,191,179,162,241,81,51,145,235,249,14,239,107,49,192,214,31,181,199,106,157,184,84,204,176,115,121,50,45,127,4,150,254,138,236,205,93,222,114,67,29,24,72,243,141,128,195,78,66,215,61,156,180];static{for(let t=0;t<256;t++)this.p[t]=this.permutation[t],this.p[t+256]=this.permutation[t]}static bezier(t,e,i,n,s){const r=1-t,a=t*t,o=r*r;return o*r*e+3*o*t*i+3*r*a*n+a*t*s}static catmullRom(t,e,i,n,s){const r=t*t;return.5*(2*i+(-e+n)*t+(2*e-5*i+4*n-s)*r+(3*i-e-3*n+s)*(r*t))}static fibonacci(t){return t<=1?t:this.fibonacci(t-1)+this.fibonacci(t-2)}static factorial(t){return t<=1?1:t*this.factorial(t-1)}static isPrime(t){if(t<2)return!1;if(2===t)return!0;if(t%2==0)return!1;for(let e=3;e<=Math.sqrt(t);e+=2)if(t%e===0)return!1;return!0}static gcd(t,e){for(;0!==e;){const i=e;e=t%e,t=i}return t}static lcm(t,e){return t*e/this.gcd(t,e)}static bounce(t){return Math.abs(Math.sin(t*Math.PI*2))}static elastic(t){return Math.pow(2,10*(t-1))*Math.cos(t*Math.PI*2)}static back(t){const e=1.70158;return t*t*((e+1)*t-e)}static circular(t){return 1-Math.sqrt(1-t*t)}static exponential(t){return 0===t?0:Math.pow(2,10*(t-1))}static sine(t){return 1-Math.cos(t*Math.PI/2)}static cubic(t){return t*t*t}static quartic(t){return t*t*t*t}static quintic(t){return t*t*t*t*t}static bounceOut(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375}static elasticOut(t){return 0===t?0:1===t?1:Math.pow(2,-10*t)*Math.sin((t-.075)*(2*Math.PI)/.3)+1}static backOut(t){const e=1.70158;return--t*t*((e+1)*t+e)+1}}class r{static linear(t){return t}static easeInQuad(t){return t*t}static easeOutQuad(t){return t*(2-t)}static easeInOutQuad(t){return t<.5?2*t*t:(4-2*t)*t-1}static easeInCubic(t){return t*t*t}static easeOutCubic(t){return--t*t*t+1}static easeInOutCubic(t){return t<.5?4*t*t*t:(t-1)*(2*t-2)*(2*t-2)+1}static easeInQuart(t){return t*t*t*t}static easeOutQuart(t){return 1- --t*t*t*t}static easeInOutQuart(t){return t<.5?8*t*t*t*t:1-8*--t*t*t*t}static easeInSine(t){return 1-Math.cos(t*Math.PI/2)}static easeOutSine(t){return Math.sin(t*Math.PI/2)}static easeInOutSine(t){return-(Math.cos(Math.PI*t)-1)/2}static easeInExpo(t){return 0===t?0:Math.pow(2,10*t-10)}static easeOutExpo(t){return 1===t?1:1-Math.pow(2,-10*t)}static easeInOutExpo(t){return 0===t?0:1===t?1:t<.5?Math.pow(2,20*t-10)/2:(2-Math.pow(2,-20*t+10))/2}static easeInCirc(t){return 1-Math.sqrt(1-t*t)}static easeOutCirc(t){return Math.sqrt(1-(t-1)*(t-1))}static easeInOutCirc(t){return t<.5?(1-Math.sqrt(1-2*t*(2*t)))/2:(Math.sqrt(1-Math.pow(-2*t+2,2))+1)/2}static easeInBack(t){const e=1.70158;return 2.70158*t*t*t-e*t*t}static easeOutBack(t){const e=1.70158;return 1+2.70158*Math.pow(t-1,3)+e*Math.pow(t-1,2)}static easeInOutBack(t){const e=2.5949095;return t<.5?Math.pow(2*t,2)*(7.189819*t-e)/2:(Math.pow(2*t-2,2)*((e+1)*(2*t-2)+e)+2)/2}static easeInElastic(t){return 0===t?0:1===t?1:-Math.pow(2,10*t-10)*Math.sin((10*t-10.75)*(2*Math.PI/3))}static easeOutElastic(t){return 0===t?0:1===t?1:Math.pow(2,-10*t)*Math.sin((10*t-.75)*(2*Math.PI/3))+1}static easeInOutElastic(t){return 0===t?0:1===t?1:t<.5?-Math.pow(2,20*t-10)*Math.sin((20*t-11.125)*(2*Math.PI/4.5))/2:Math.pow(2,-20*t+10)*Math.sin((20*t-11.125)*(2*Math.PI/4.5))/2+1}static easeInBounce(t){return 1-r.easeOutBounce(1-t)}static easeOutBounce(t){return t<1/2.75?7.5625*t*t:t<2/2.75?7.5625*(t-=1.5/2.75)*t+.75:t<2.5/2.75?7.5625*(t-=2.25/2.75)*t+.9375:7.5625*(t-=2.625/2.75)*t+.984375}static easeInOutBounce(t){return t<.5?r.easeInBounce(2*t)/2:r.easeOutBounce(2*t-1)/2+.5}static custom(t){return e=>{if(e<=0)return t[0];if(e>=1)return t[t.length-1];const i=e*(t.length-1),n=Math.floor(i),s=Math.ceil(i),r=i-n;return n===s?t[n]:t[n]*(1-r)+t[s]*r}}static bezier(t,e,i,n){return s=>{if(0===s||1===s)return s;const r=3*t,a=3*(i-t)-r,o=1-r-a,c=3*e,l=3*(n-e)-c,h=1-c-l,d=t=>((o*t+a)*t+r)*t,u=t=>(3*o*t+2*a)*t+r;return(t=>((h*t+l)*t+c)*t)(((t,e)=>{let i,n,s,r,a,o;for(s=t,o=0;o<8;o++){if(r=d(s)-t,Math.abs(r)<e)return s;if(a=u(s),Math.abs(a)<1e-6)break;s-=r/a}if(i=0,n=1,s=t,s<i)return i;if(s>n)return n;for(;i<n;){if(r=d(s),Math.abs(r-t)<e)return s;t>r?i=s:n=s,s=.5*(n-i)+i}return s})(x,1e-6))}}}class a{constructor(t={}){this.options={enableThreeJS:!0,enableScrollTrigger:!0,enableParallax:!0,enableImageEffects:!0,...t},this.scrollTrigger=null,this.threeJSManager=null,this.animations=new Map,this.isInitialized=!1,this.init()}async init(){try{this.options.enableScrollTrigger&&(this.scrollTrigger=new i,await this.scrollTrigger.init()),this.options.enableThreeJS&&(this.threeJSManager=new n,await this.threeJSManager.init()),this.isInitialized=!0,this.emit("ready")}catch(t){console.error("AnimationEngine initialization failed:",t),this.emit("error",t)}}createAnimation(e,i){this.animations.has(e)&&console.warn(`Animation with id '${e}' already exists. Overwriting...`);const n={id:e,config:i,timeline:t.timeline(),isActive:!1,startTime:0};return this.animations.set(e,n),n}playAnimation(t){const e=this.animations.get(t);return e?(e.timeline.play(),e.isActive=!0,e.startTime=Date.now(),!0):(console.warn(`Animation '${t}' not found`),!1)}pauseAnimation(t){const e=this.animations.get(t);e&&(e.timeline.pause(),e.isActive=!1)}stopAnimation(t){const e=this.animations.get(t);e&&(e.timeline.kill(),e.isActive=!1)}getAnimationStatus(t){const e=this.animations.get(t);return e?{id:e.id,isActive:e.isActive,progress:e.timeline.progress(),duration:e.timeline.duration(),isPlaying:e.timeline.isActive()}:null}createParallax(t,e={}){if(!this.options.enableParallax)return console.warn("Parallax effects are disabled"),null;const i={speed:.5,direction:"vertical",easing:"power2.out",...e};return this.scrollTrigger?.createParallax(t,i)}createImageEffect(t,e,i={}){if(!this.options.enableImageEffects)return console.warn("Image effects are disabled"),null;const n={morph:this.createMorphEffect.bind(this),distortion:this.createDistortionEffect.bind(this),glitch:this.createGlitchEffect.bind(this),wave:this.createWaveEffect.bind(this)}[e];return n?n(t,i):(console.warn(`Unknown effect type: ${e}`),null)}createMorphEffect(e,i={}){const n=t.timeline();return n.to(e,{duration:i.duration||2,morphSVG:i.target||e,ease:i.easing||"power2.inOut"}),n}createDistortionEffect(e,i={}){const n=t.timeline();return n.to(e,{duration:i.duration||1.5,filter:"hue-rotate(180deg) saturate(2)",ease:i.easing||"power2.out"}),n}createGlitchEffect(e,i={}){const n=t.timeline({repeat:-1});return n.to(e,{duration:.1,x:i.intensity||10,ease:"none"}).to(e,{duration:.1,x:-(i.intensity||10),ease:"none"}).to(e,{duration:.1,x:0,ease:"none"}),n}createWaveEffect(e,i={}){const n=t.timeline({repeat:-1});return n.to(e,{duration:i.duration||2,y:i.amplitude||20,ease:"sine.inOut"}).to(e,{duration:i.duration||2,y:-(i.amplitude||20),ease:"sine.inOut"}),n}createAdvancedWaveEffect(e,i={}){const{duration:n=2,amplitude:r=20,frequency:a=1,phase:o=0,easing:c="sine"}=i,l=t.timeline({repeat:-1}),h=this;return l.to(e,{duration:n,y:r,ease:"none",onUpdate:function(){const t=(t=>{const e=h.getEasingFunction(c)(t);return s.lerp(-r,r,e)})(this.progress());e.style.transform=`translateY(${t}px)`}}),l}createNoiseAnimation(e,i={}){const{duration:n=3,intensity:r=10,noiseScale:a=.1}=i,o=t.timeline({repeat:-1});return o.to(e,{duration:n,ease:"none",onUpdate:function(){const t=this.progress()*n,i=s.perlinNoise(t*a,0)*r,o=s.perlinNoise(0,t*a)*r,c=e.style.transform||"",l=c.match(/translate\(([^)]+)\)/);e.style.transform=l?c.replace(/translate\([^)]+\)/,`translate(${i}px, ${o}px)`):`${c} translate(${i}px, ${o}px)`.trim()}}),o}createSpringAnimation(e,i={}){const{targetValue:n=100,stiffness:r=.1,damping:a=.8,duration:o=2}=i,c=t.timeline();return c.to(e,{duration:o,ease:"none",onUpdate:function(){const t=this.progress(),i=s.elastic(t)*n,r=e.style.transform||"",a=r.match(/translateX\([^)]+\)/);e.style.transform=a?r.replace(/translateX\([^)]+\)/,`translateX(${i}px)`):`${r} translateX(${i}px)`.trim()}}),c}createMorphingPath(e,i,n={}){const{duration:s=3,easing:r="sine"}=n,a=t.timeline();return a.to(e,{duration:s,ease:"none",onUpdate:function(){const t=this.progress(),n=this.getEasingFunction(r)(t),s=this.interpolatePath(i,n);e.style.transform=`translate(${s.x}px, ${s.y}px)`}}),a}getEasingFunction(t){return{linear:r.linear,sine:r.easeInOutSine,bounce:r.easeOutBounce,elastic:r.easeOutElastic,back:r.easeOutBack,circular:r.easeInOutCirc,exponential:r.easeInOutExpo,cubic:r.easeInOutCubic,quartic:r.easeInOutQuart,quintic:r.easeInOutQuart,"math-bounce":s.bounce,"math-elastic":s.elastic,"math-back":s.back,"math-circular":s.circular,"math-exponential":s.exponential,"math-sine":s.sine,"math-cubic":s.cubic,"math-quartic":s.quartic,"math-quintic":s.quintic,"math-bounceOut":s.bounceOut,"math-elasticOut":s.elasticOut,"math-backOut":s.backOut}[t]||r.linear}interpolatePath(t,e){if(t.length<4){const i=e*(t.length-1),n=Math.floor(i),r=Math.ceil(i),a=i-n;return n===r?t[n]:{x:s.lerp(t[n].x,t[r].x,a),y:s.lerp(t[n].y,t[r].y,a)}}const i=Math.floor(e*(t.length-3)),n=e*(t.length-3)-i,r=t[Math.max(0,i-1)]||t[0],a=t[i]||t[0],o=t[i+1]||t[t.length-1],c=t[Math.min(t.length-1,i+2)]||t[t.length-1];return{x:s.catmullRom(n,r.x,a.x,o.x,c.x),y:s.catmullRom(n,r.y,a.y,o.y,c.y)}}createColorTransition(e,i,n,s={}){const{duration:r=2,easing:a="sine"}=s,o=t.timeline();return o.to(e,{duration:r,ease:"none",onUpdate:function(){const t=this.progress(),s=this.getEasingFunction(a)(t),r=this.interpolateColor(i,n,s);e.style.backgroundColor=r}}),o}interpolateColor(t,e,i){const n=this.hexToRgb(t),r=this.hexToRgb(e);if(!n||!r)return t;return`rgb(${Math.round(s.lerp(n.r,r.r,i))}, ${Math.round(s.lerp(n.g,r.g,i))}, ${Math.round(s.lerp(n.b,r.b,i))})`}hexToRgb(t){const e=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(t);return e?{r:parseInt(e[1],16),g:parseInt(e[2],16),b:parseInt(e[3],16)}:null}createParticleSystem(e,i={}){const{particleCount:n=50,duration:r=5,spread:a=100,speed:o=1}=i,c=[],l=t.timeline({repeat:-1});for(let t=0;t<n;t++){const t=document.createElement("div");t.className="particle",t.style.cssText="\n position: absolute;\n width: 4px;\n height: 4px;\n background: #fff;\n border-radius: 50%;\n pointer-events: none;\n ",e.appendChild(t),c.push(t)}return l.to(c,{duration:r,ease:"none",onUpdate:function(){const t=this.progress(),e=t*r*o;c.forEach((i,n)=>{const r=s.perlinNoise(.1*e,.1*n)*a,o=s.perlinNoise(.1*n,.1*e)*a;s.smoothstep(-a,a,r),s.smoothstep(-a,a,o),i.style.transform=`translate(${r}px, ${o}px)`,i.style.opacity=s.lerp(1,0,t)})}}),l}createMorphingShape(e,i,n={}){const{duration:s=3,easing:r="sine"}=n,a=t.timeline();return a.to(e,{duration:s,ease:"none",onUpdate:function(){const t=this.progress(),n=this.getEasingFunction(r)(t),s=this.interpolateShapes(i,n);e.style.clipPath=s}}),a}interpolateShapes(t,e){if(t.length<2)return t[0]||"none";const i=e*(t.length-1),n=Math.floor(i);Math.ceil(i);return t[n]}getThreeJSManager(){return this.threeJSManager}getScrollTrigger(){return this.scrollTrigger}destroy(){this.animations.forEach(t=>{t.timeline.kill()}),this.animations.clear(),this.scrollTrigger&&this.scrollTrigger.destroy(),this.threeJSManager&&this.threeJSManager.destroy(),this.isInitialized=!1}emit(t,e){this.eventListeners&&this.eventListeners[t]&&this.eventListeners[t].forEach(t=>t(e))}on(t,e){this.eventListeners||(this.eventListeners={}),this.eventListeners[t]||(this.eventListeners[t]=[]),this.eventListeners[t].push(e)}off(t,e){this.eventListeners&&this.eventListeners[t]&&(this.eventListeners[t]=this.eventListeners[t].filter(t=>t!==e))}}class o{constructor(t,e={}){this.container=t,this.options={speed:e.speed||1,smoothness:e.smoothness||.1,showProgress:e.showProgress||!0,showIndicator:e.showIndicator||!0,...e},this.currentScroll=0,this.targetScroll=0,this.isScrolling=!1,this.progressBar=null,this.scrollIndicator=null,this.sections=[],this.init()}init(){this.setupContainer(),this.createProgressBar(),this.createScrollIndicator(),this.setupEventListeners(),this.animate()}setupContainer(){this.container.style.position="relative",this.container.style.overflow="hidden",this.container.style.height="100vh"}createProgressBar(){this.options.showProgress&&(this.progressBar=document.createElement("div"),this.progressBar.style.cssText="\n position: fixed;\n top: 0;\n left: 0;\n width: 0%;\n height: 3px;\n background: linear-gradient(90deg, #00ff88, #00ccff, #ff0088);\n z-index: 1000;\n transition: width 0.1s ease;\n ",document.body.appendChild(this.progressBar))}createScrollIndicator(){if(!this.options.showIndicator)return;this.scrollIndicator=document.createElement("div"),this.scrollIndicator.style.cssText="\n position: fixed;\n right: 20px;\n top: 50%;\n transform: translateY(-50%);\n width: 4px;\n height: 100px;\n background: rgba(255, 255, 255, 0.2);\n border-radius: 2px;\n z-index: 1000;\n ";const t=document.createElement("div");t.style.cssText="\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 20px;\n background: linear-gradient(180deg, #00ff88, #00ccff);\n border-radius: 2px;\n transition: top 0.1s ease;\n ",this.scrollIndicator.appendChild(t),this.indicatorDot=t,document.body.appendChild(this.scrollIndicator)}setupEventListeners(){window.addEventListener("wheel",this.handleWheel.bind(this)),window.addEventListener("keydown",this.handleKeydown.bind(this)),window.addEventListener("resize",this.handleResize.bind(this))}handleWheel(t){t.preventDefault();const e=t.deltaY*this.options.speed;this.targetScroll+=e,this.targetScroll=Math.max(0,this.targetScroll),this.targetScroll=Math.min(this.getMaxScroll(),this.targetScroll),this.isScrolling=!0,setTimeout(()=>{this.isScrolling=!1},150)}handleKeydown(t){switch(t.key){case"ArrowDown":case"PageDown":t.preventDefault(),this.scrollTo(this.targetScroll+window.innerHeight);break;case"ArrowUp":case"PageUp":t.preventDefault(),this.scrollTo(this.targetScroll-window.innerHeight);break;case"Home":t.preventDefault(),this.scrollTo(0);break;case"End":t.preventDefault(),this.scrollTo(this.getMaxScroll())}}handleResize(){this.updateProgressBar(),this.updateScrollIndicator()}animate(){Math.abs(this.currentScroll-this.targetScroll)>.1&&(this.currentScroll+=(this.targetScroll-this.currentScroll)*this.options.smoothness,this.updateScroll()),requestAnimationFrame(this.animate.bind(this))}updateScroll(){this.container.style.transform=`translateY(-${this.currentScroll}px)`,this.updateProgressBar(),this.updateScrollIndicator()}updateProgressBar(){if(this.progressBar){const t=this.currentScroll/this.getMaxScroll()*100;this.progressBar.style.width=`${t}%`}}updateScrollIndicator(){if(this.indicatorDot){const t=this.currentScroll/this.getMaxScroll()*80;this.indicatorDot.style.top=`${t}%`}}getMaxScroll(){return Math.max(0,this.container.scrollHeight-window.innerHeight)}scrollTo(e,i=1){t.to(this,{targetScroll:e,duration:i,ease:"power2.out"})}scrollToSection(t,e=1){if(this.sections[t]){const i=this.sections[t].offsetTop;this.scrollTo(i,e)}}addSection(t){this.sections.push(t)}destroy(){window.removeEventListener("wheel",this.handleWheel),window.removeEventListener("keydown",this.handleKeydown),window.removeEventListener("resize",this.handleResize),this.progressBar&&document.body.removeChild(this.progressBar),this.scrollIndicator&&document.body.removeChild(this.scrollIndicator)}}class c{constructor(t,e={}){this.element=t,this.options={speed:e.speed||.5,direction:e.direction||"vertical",easing:e.easing||"power2.out",...e},this.currentScroll=0,this.init()}init(){this.setupElement(),this.bindEvents()}setupElement(){this.element.style.willChange="transform",this.element.style.transform="translateZ(0)"}bindEvents(){window.addEventListener("scroll",this.handleScroll.bind(this)),window.addEventListener("resize",this.handleResize.bind(this))}handleScroll(){this.currentScroll=window.pageYOffset,this.updateParallax()}handleResize(){this.updateParallax()}updateParallax(){const e=this.element.getBoundingClientRect(),i=e.top,n=e.height,s=window.innerHeight;let r=0;if(i<s&&i+n>0){r=(s-i)/(s+n),r=Math.max(0,Math.min(1,r));const e=r*this.options.speed*100;"vertical"===this.options.direction?t.set(this.element,{y:e,ease:this.options.easing}):"horizontal"===this.options.direction&&t.set(this.element,{x:e,ease:this.options.easing})}}destroy(){window.removeEventListener("scroll",this.handleScroll),window.removeEventListener("resize",this.handleResize),t.set(this.element,{x:0,y:0,clearProps:"transform"})}}class l{constructor(t,e={}){this.element=t,this.options={duration:e.duration||2,easing:e.easing||"power2.out",...e}}morph(e,i={}){const n=t.timeline();return n.to(this.element,{duration:i.duration||this.options.duration,morphSVG:e||this.element,ease:i.easing||this.options.easing}),n}distortion(e={}){const i=t.timeline();return i.to(this.element,{duration:e.duration||this.options.duration,filter:"hue-rotate(180deg) saturate(2) contrast(1.5)",ease:e.easing||this.options.easing}).to(this.element,{duration:e.duration||this.options.duration,filter:"none",ease:e.easing||this.options.easing}),i}glitch(e={}){const i=e.intensity||10,n=t.timeline({repeat:-1});return n.to(this.element,{duration:.1,x:i,ease:"none"}).to(this.element,{duration:.1,x:-i,ease:"none"}).to(this.element,{duration:.1,x:0,ease:"none"}),n}wave(e={}){const i=e.amplitude||20,n=e.duration||this.options.duration,s=t.timeline({repeat:-1});return s.to(this.element,{duration:n,y:i,ease:"sine.inOut"}).to(this.element,{duration:n,y:-i,ease:"sine.inOut"}),s}pulse(e={}){const i=e.scale||1.2,n=t.timeline({repeat:-1,yoyo:!0});return n.to(this.element,{duration:e.duration||this.options.duration,scale:i,ease:e.easing||this.options.easing}),n}shake(e={}){const i=e.intensity||5,n=t.timeline({repeat:-1});for(let t=0;t<10;t++)n.to(this.element,{duration:.05,x:(Math.random()-.5)*i*2,y:(Math.random()-.5)*i*2,ease:"none"});return n.to(this.element,{duration:.1,x:0,y:0,ease:"power2.out"}),n}fadeIn(e={}){const i=t.timeline();return i.fromTo(this.element,{opacity:0,scale:.8},{opacity:1,scale:1,duration:e.duration||this.options.duration,ease:e.easing||this.options.easing}),i}fadeOut(e={}){const i=t.timeline();return i.to(this.element,{opacity:0,scale:.8,duration:e.duration||this.options.duration,ease:e.easing||this.options.easing}),i}}class h{constructor(t,e={}){this.element=t,this.options={duration:e.duration||1,easing:e.easing||"power2.out",...e}}typewriter(e={}){const i=this.element.textContent;this.element.textContent="";const n=t.timeline();for(let t=0;t<i.length;t++){const s=document.createElement("span");s.textContent=i[t],s.style.opacity="0",this.element.appendChild(s),n.to(s,{opacity:1,duration:e.speed||.05,ease:e.easing||this.options.easing},t*(e.speed||.05))}return n}scramble(e={}){const i=this.element.textContent,n="ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%^&*()",s=e.duration||this.options.duration,r=t.timeline();return r.to({},{duration:s,onUpdate:function(){const t=this.progress(),e=i.split("").map((e,s)=>t>s/i.length?i[s]:n[Math.floor(46*Math.random())]).join("");this.targets()[0].element.textContent=e},onUpdateParams:[this]}),r}wave(e={}){const i=this.element.textContent;this.element.textContent="";const n=t.timeline({repeat:-1});for(let t=0;t<i.length;t++){const s=document.createElement("span");s.textContent=i[t],s.style.display="inline-block",this.element.appendChild(s),n.to(s,{y:e.amplitude||-20,duration:e.duration||.5,ease:"sine.inOut",delay:t*(e.delay||.1)},0)}return n}bounce(e={}){const i=this.element.textContent;this.element.textContent="";const n=t.timeline({repeat:-1});for(let t=0;t<i.length;t++){const s=document.createElement("span");s.textContent=i[t],s.style.display="inline-block",this.element.appendChild(s),n.to(s,{y:e.amplitude||-30,duration:e.duration||.6,ease:"bounce.out",delay:t*(e.delay||.1)},0)}return n}fadeIn(e={}){const i=t.timeline();return i.fromTo(this.element,{opacity:0,y:50},{opacity:1,y:0,duration:e.duration||this.options.duration,ease:e.easing||this.options.easing}),i}slideIn(e={}){const i=e.direction||"left",n=t.timeline();let s={};return"left"===i?s.x=-100:"right"===i?s.x=100:"up"===i?s.y=100:"down"===i&&(s.y=-100),n.fromTo(this.element,{...s,opacity:0},{x:0,y:0,opacity:1,duration:e.duration||this.options.duration,ease:e.easing||this.options.easing}),n}rotateIn(e={}){const i=t.timeline();return i.fromTo(this.element,{rotation:e.startRotation||-180,scale:0,opacity:0},{rotation:0,scale:1,opacity:1,duration:e.duration||this.options.duration,ease:e.easing||this.options.easing}),i}glitch(e={}){const i=e.intensity||10,n=t.timeline({repeat:-1});return n.to(this.element,{duration:.1,x:i,ease:"none"}).to(this.element,{duration:.1,x:-i,ease:"none"}).to(this.element,{duration:.1,x:0,ease:"none"}),n}}class d{constructor(t){this.threeJSManager=t||new n,this.particleSystems=new Map,this.particleCount=0}createParticleSystem(t={}){const{count:e=1e3,size:i=.1,color:n=16777215,speed:s=.01,spread:r=100,lifetime:a=5e3,texture:o=null,blending:c="additive",transparent:l=!0,opacity:h=.8}=t,d=new THREE.BufferGeometry,u=new Float32Array(3*e),p=new Float32Array(3*e),m=new Float32Array(e),g=new Float32Array(3*e);for(let t=0;t<e;t++){const e=3*t;u[e]=(Math.random()-.5)*r,u[e+1]=(Math.random()-.5)*r,u[e+2]=(Math.random()-.5)*r,p[e]=(Math.random()-.5)*s,p[e+1]=(Math.random()-.5)*s,p[e+2]=(Math.random()-.5)*s,m[t]=Math.random()*a,g[e]=Math.random(),g[e+1]=Math.random(),g[e+2]=Math.random()}d.setAttribute("position",new THREE.BufferAttribute(u,3)),d.setAttribute("color",new THREE.BufferAttribute(g,3));const f=new THREE.PointsMaterial({size:i,color:n,transparent:l,opacity:h,vertexColors:!0,blending:"additive"===c?THREE.AdditiveBlending:THREE.NormalBlending});o&&(f.map=o);const w=new THREE.Points(d,f),y="particles_"+ ++this.particleCount;return this.particleSystems.set(y,{particles:w,geometry:d,velocities:p,lifetimes:m,options:t,startTime:Date.now()}),this.threeJSManager.scene.add(w),y}createFireEffect(t={}){const{position:e={x:0,y:0,z:0},intensity:i=1,height:n=50,width:s=20}=t,r=Math.floor(500*i),a=this.createParticleSystem({count:r,size:.3,color:16729088,speed:.05,spread:s,lifetime:3e3,transparent:!0,opacity:.8}),o=this.particleSystems.get(a);return o.particles.position.set(e.x,e.y,e.z),o.update=t=>{const e=o.geometry.attributes.position.array,i=o.velocities,n=o.lifetimes;for(let a=0;a<r;a++){const r=3*a;n[a]-=1e3*t,n[a]<=0?(n[a]=3e3*Math.random(),e[r]=(Math.random()-.5)*s,e[r+1]=0,e[r+2]=(Math.random()-.5)*s):(e[r]+=i[r],e[r+1]+=i[r+1]+.02,e[r+2]+=i[r+2],i[r]+=.001*(Math.random()-.5),i[r+2]+=.001*(Math.random()-.5))}o.geometry.attributes.position.needsUpdate=!0},a}createSmokeEffect(t={}){const{position:e={x:0,y:0,z:0},intensity:i=1,height:n=100,width:s=30}=t,r=Math.floor(300*i),a=this.createParticleSystem({count:r,size:2,color:6710886,speed:.02,spread:s,lifetime:8e3,transparent:!0,opacity:.3}),o=this.particleSystems.get(a);return o.particles.position.set(e.x,e.y,e.z),o.update=t=>{const e=o.geometry.attributes.position.array,i=o.lifetimes;for(let n=0;n<r;n++){const r=3*n;i[n]-=1e3*t,i[n]<=0?(i[n]=8e3*Math.random(),e[r]=(Math.random()-.5)*s,e[r+1]=0,e[r+2]=(Math.random()-.5)*s):(e[r+1]+=.01,e[r]+=.02*(Math.random()-.5),e[r+2]+=.02*(Math.random()-.5))}o.geometry.attributes.position.needsUpdate=!0},a}createSparkleEffect(t={}){const{position:e={x:0,y:0,z:0},count:i=200,color:n=16776960,size:s=.2}=t,r=this.createParticleSystem({count:i,size:s,color:n,speed:.1,spread:50,lifetime:2e3,transparent:!0,opacity:1}),a=this.particleSystems.get(r);return a.particles.position.set(e.x,e.y,e.z),a.update=t=>{const e=a.geometry.attributes.position.array,n=a.lifetimes;for(let s=0;s<i;s++){const i=3*s;n[s]-=1e3*t,n[s]<=0?(n[s]=2e3*Math.random(),e[i]=50*(Math.random()-.5),e[i+1]=50*(Math.random()-.5),e[i+2]=50*(Math.random()-.5)):(e[i]+=.1*Math.sin(.001*Date.now()+s),e[i+1]+=.1*Math.cos(.001*Date.now()+s),e[i+2]+=.1*Math.sin(.002*Date.now()+s))}a.geometry.attributes.position.needsUpdate=!0},r}createRainEffect(t={}){const{intensity:e=1,height:i=200,width:n=100}=t,s=Math.floor(1e3*e),r=this.createParticleSystem({count:s,size:.1,color:8965375,speed:.1,spread:n,lifetime:5e3,transparent:!0,opacity:.6}),a=this.particleSystems.get(r);return a.update=t=>{const e=a.geometry.attributes.position.array,r=a.lifetimes;for(let a=0;a<s;a++){const s=3*a;r[a]-=1e3*t,r[a]<=0?(r[a]=5e3*Math.random(),e[s]=(Math.random()-.5)*n,e[s+1]=i,e[s+2]=(Math.random()-.5)*n):(e[s+1]-=.5,e[s+1]<-10&&(e[s+1]=i))}a.geometry.attributes.position.needsUpdate=!0},r}createSnowEffect(t={}){const{intensity:e=1,height:i=150,width:n=120}=t,s=Math.floor(800*e),r=this.createParticleSystem({count:s,size:.3,color:16777215,speed:.02,spread:n,lifetime:1e4,transparent:!0,opacity:.8}),a=this.particleSystems.get(r);return a.update=t=>{const e=a.geometry.attributes.position.array,r=a.lifetimes;for(let a=0;a<s;a++){const s=3*a;r[a]-=1e3*t,r[a]<=0?(r[a]=1e4*Math.random(),e[s]=(Math.random()-.5)*n,e[s+1]=i,e[s+2]=(Math.random()-.5)*n):(e[s+1]-=.1,e[s]+=.02*Math.sin(1e-4*Date.now()+a),e[s+2]+=.02*Math.cos(1e-4*Date.now()+a),e[s+1]<-10&&(e[s+1]=i))}a.geometry.attributes.position.needsUpdate=!0},r}update(t){this.particleSystems.forEach(e=>{e.update&&e.update(t)})}getParticleSystem(t){return this.particleSystems.get(t)||null}removeParticleSystem(t){const e=this.particleSystems.get(t);e&&(this.threeJSManager.scene.remove(e.particles),e.geometry.dispose(),e.particles.material.dispose(),this.particleSystems.delete(t))}removeAllParticleSystems(){this.particleSystems.forEach(t=>{this.threeJSManager.scene.remove(t.particles),t.geometry.dispose(),t.particles.material.dispose()}),this.particleSystems.clear()}setParticleSystemPosition(t,e){const i=this.particleSystems.get(t);i&&i.particles.position.set(e.x,e.y,e.z)}setParticleSystemScale(t,e){const i=this.particleSystems.get(t);i&&i.particles.scale.setScalar(e)}getParticleSystemIds(){return Array.from(this.particleSystems.keys())}getParticleSystemCount(){return this.particleSystems.size}}class u{static createElement(t,e={},i=""){const n=document.createElement(t);return Object.keys(e).forEach(t=>{"className"===t?n.className=e[t]:"style"===t&&"object"==typeof e[t]?Object.assign(n.style,e[t]):n.setAttribute(t,e[t])}),"string"==typeof i?n.textContent=i:i instanceof Element&&n.appendChild(i),n}static getElement(t,e=document){return e.querySelector(t)}static getElements(t,e=document){return e.querySelectorAll(t)}static addEvent(t,e,i,n={}){t.addEventListener(e,i,n)}static removeEvent(t,e,i,n={}){t.removeEventListener(e,i,n)}static addEvents(t,e,i={}){Object.keys(e).forEach(n=>{this.addEvent(t,n,e[n],i)})}static removeEvents(t,e,i={}){Object.keys(e).forEach(n=>{this.removeEvent(t,n,e[n],i)})}static addClass(t,e){t.classList.add(e)}static removeClass(t,e){t.classList.remove(e)}static toggleClass(t,e){return t.classList.toggle(e)}static hasClass(t,e){return t.classList.contains(e)}static setStyle(t,e,i){"object"==typeof e?Object.assign(t.style,e):t.style[e]=i}static getStyle(t,e){return window.getComputedStyle(t)[e]}static setAttributes(t,e){Object.keys(e).forEach(i=>{t.setAttribute(i,e[i])})}static getAttribute(t,e){return t.getAttribute(e)}static removeAttribute(t,e){t.removeAttribute(e)}static appendChild(t,e){t.appendChild(e)}static insertBefore(t,e,i){t.insertBefore(e,i)}static removeElement(t){t.parentNode&&t.parentNode.removeChild(t)}static clearContent(t){t.innerHTML=""}static getElementRect(t){const e=t.getBoundingClientRect();return{width:e.width,height:e.height,top:e.top+window.scrollY,left:e.left+window.scrollX,right:e.right+window.scrollX,bottom:e.bottom+window.scrollY}}static isInViewport(t,e=0){const i=t.getBoundingClientRect(),n=window.innerHeight,s=window.innerWidth;return(Math.min(i.bottom,n)-Math.max(i.top,0))*(Math.min(i.right,s)-Math.max(i.left,0))/(i.height*i.width)>e}static getScrollPosition(){return{x:window.pageXOffset||document.documentElement.scrollLeft,y:window.pageYOffset||document.documentElement.scrollTop}}static scrollToElement(t,e={}){const{behavior:i="smooth",block:n="start",inline:s="nearest"}=e;t.scrollIntoView({behavior:i,block:n,inline:s})}static scrollToPosition(t,e,i={}){const{behavior:n="smooth"}=i;window.scrollTo({left:t,top:e,behavior:n})}static debounce(t,e){let i;return function(...n){clearTimeout(i),i=setTimeout(()=>{clearTimeout(i),t(...n)},e)}}static throttle(t,e){let i;return function(...n){i||(t.apply(this,n),i=!0,setTimeout(()=>i=!1,e))}}static waitForElement(t,e=5e3){return new Promise((i,n)=>{const s=document.querySelector(t);if(s)return void i(s);const r=new MutationObserver(e=>{const n=document.querySelector(t);n&&(r.disconnect(),i(n))});r.observe(document.body,{childList:!0,subtree:!0}),setTimeout(()=>{r.disconnect(),n(new Error(`Element ${t} not found within ${e}ms`))},e)})}static dispatchCustomEvent(t,e={},i=document){const n=new CustomEvent(t,{detail:e,bubbles:!0,cancelable:!0});i.dispatchEvent(n)}static getComputedStyles(t,e=[]){const i=window.getComputedStyle(t),n={};return e.forEach(t=>{n[t]=i[t]}),n}static animateProperty(t,e,i,n,s={}){const{duration:r=1e3,easing:a="ease",onUpdate:o=null,onComplete:c=null}=s,l=performance.now(),h=i,d=n-i;requestAnimationFrame(function i(n){const s=n-l,a=Math.min(s/r,1),u=h+d*a;t.style[e]=u,o&&o(u,a),a<1?requestAnimationFrame(i):c&&c()})}}export{a as AnimationEngine,u as DOMUtils,r as Easing,o as HiTechScroller,l as ImageEffects,s as MathUtils,c as ParallaxEffect,d as ParticleEffects,i as ScrollTrigger,h as TextEffects,n as ThreeJSManager,a as default}; //# sourceMappingURL=index.esm.js.map