Sid Gifari File Manager Pro v10.0.3

✏️ Editing: sticky-element.js Writable

(()=>{"use strict";new class{constructor(){this.elements=document.querySelectorAll("[data-gb-is-sticky]"),this.lastScrollY=window.scrollY,this.lastWidth=window.innerWidth,this.rafId=null,this.wpAdminBarOffset=0,this.isTicking=!1,this.lastTriggerScrollY=new Map,this.lastScrollDirection=new Map,this.scrollDirectionChangeY=new Map,this.initializedElements=new Set,this.mediaQueryHandlers=new Map,this.originalStyles=new Map,this.elementMetadata=new Map,this.activeAnimations=new Map,this.stickyBaseZIndex=100,this.scrollStopTimeout=null,this.scrollStopDelay=150,this.isScrolling=!1,this.domCache=new Map,this.isReducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)").matches,this.resizeHandler=()=>this.handleResize(),this.scrollHandler=()=>this.requestTick(),this.init()}getSafeZIndex(t){return t&&"auto"!==t&&""!==t?t:this.stickyBaseZIndex}getCachedValue(t,e){return this.domCache.has(t)||this.domCache.set(t,e()),this.domCache.get(t)}clearCache(){this.domCache.clear()}init(){const t=document.querySelector("#wpadminbar");if(t){const e=new MutationObserver((()=>{this.updateAdminBarOffset(),this.requestTick()}));e.observe(t,{attributes:!0,childList:!0,subtree:!0}),this.elementMetadata.set("adminBarObserver",e)}this.updateAdminBarOffset();const e=window.scrollY;this.elements.forEach((t=>{this.initializeElement(t,e)})),window.addEventListener("scroll",this.scrollHandler,{passive:!0}),window.addEventListener("resize",this.resizeHandler,{passive:!0}),this.updateHeaderClasses(this.lastScrollY)}initializeElement(t,e){const i=t.dataset.gbStickyHeaderType||"always",s="scroll-up"===i,a="past-threshold"===i,n="always"===i||!s&&!a,l=this.isReducedMotion?"none":t.dataset.gbStickyAnimation||"slide",o=parseInt(t.dataset.gbStickySpeed)||200;let r=null;if(t.dataset.gbStickyThreshold)try{r=this.parseThresholdValue(t.dataset.gbStickyThreshold)}catch(e){console.warn("StickyElement: Invalid threshold value",t.dataset.gbStickyThreshold),r=200}else a&&(r=200);const d=t.style.position,h=t.style.top,c=t.style.zIndex,y=t.style.left,p=t.style.right,m=t.style.width;this.originalStyles.set(t,{originalPosition:d,originalTop:h,originalZIndex:c,originalLeft:y,originalRight:p,originalWidth:m}),this.elementMetadata.set(t,{headerType:i,isScrollUpType:s,isPastThresholdType:a,isAlwaysType:n,animationType:l,animationSpeed:o,stickyThreshold:r,placeholder:null,wasSticking:!1,isAnimatedSticky:!1});const g=t.dataset.gbStickyBreakpoint;let u=!0;if(g)try{const e=window.matchMedia(`(${g.trim()})`);u=e.matches;const i=()=>{this.handleMediaQueryChange(t,e)};e.addEventListener("change",i),this.mediaQueryHandlers.set(t,{mql:e,handler:i})}catch(t){u=!1}u&&(this.initializeElementPositioning(t,e),this.initializedElements.add(t))}initializeElementPositioning(t,e){this.updateAdminBarOffset();const i=this.elementMetadata.get(t),{isScrollUpType:s,isPastThresholdType:a}=i,n=this.getCachedValue(t,(()=>{const e=getComputedStyle(t),s=t.offsetHeight,a=parseFloat(e.marginBottom)||0,n=s+a;let l=i.placeholder;l&&l.parentNode||(l=document.createElement("div"),l.classList.add("gb-sticky-placeholder"),l.style.boxSizing=e.boxSizing,t.parentNode.insertBefore(l,t.nextSibling),i.placeholder=l),l.style.height=`${n}px`,l.style.display="none";const o=t.classList.contains("gb-is-sticky"),r=t.style.position,d=t.style.width,h=t.style.maxWidth,c=t.style.left,y=t.style.right,p=t.style.top;o?(t.classList.remove("gb-is-sticky"),t.style.position="static",t.style.width="",t.style.maxWidth="",t.style.left="",t.style.right="",t.style.top="",l.style.display="block"):(t.style.position="static",t.style.width="",t.style.maxWidth="");const m=t.getBoundingClientRect(),g=m.top+window.scrollY,u=m.width,f=t.closest('[style*="max-width"], [style*="width"], .container, .wrapper')||document.body,w=f.getBoundingClientRect(),S=getComputedStyle(f),k=parseFloat(S.paddingLeft)||0,T=parseFloat(S.borderLeftWidth)||0,x=parseFloat(S.paddingRight)||0,E=parseFloat(S.borderRightWidth)||0,v=m.left-(w.left+k+T),b=w.width-(k+x+T+E),A=Math.abs(u-b)<2||u>=window.innerWidth;return o?(t.classList.add("gb-is-sticky"),t.style.position=r,t.style.width=d,t.style.maxWidth=h,t.style.left=c,t.style.right=y,t.style.top=p,l.style.display="block"):(t.style.position=r,t.style.width=d,t.style.maxWidth=h),{originalHeight:s,marginBottom:a,naturalTop:g,naturalWidth:u,naturalLeft:v,container:f,isFullWidth:A}}));let l,o;Object.assign(i,n),l=Math.max(0,n.naturalTop-this.wpAdminBarOffset),o=!s&&!a&&(n.naturalTop<=this.wpAdminBarOffset?e>0:e>=l),this.elementMetadata.set(t,{...i,triggerPoint:l,wasSticking:o,isAnimatedSticky:!1}),this.applyStickyStyles(t,o),s&&(this.lastTriggerScrollY.delete(t),this.lastScrollDirection.delete(t),this.scrollDirectionChangeY.delete(t))}updateAdminBarOffset(){this.wpAdminBarOffset=this.getCachedValue("adminBarOffset",(()=>{const t=document.querySelector("#wpadminbar");return t&&"fixed"===getComputedStyle(t).position&&t.offsetHeight>0?t.offsetHeight:0}))}animateElementIn(t){const e=this.elementMetadata.get(t);if(!e)return;const{animationType:i,animationSpeed:s}=e;if(this.cancelExistingAnimation(t),this.applyStickyStylesForAnimation(t),"none"===i)return;let a;try{if("fade"===i)t.style.opacity="0",t.getBoundingClientRect(),a=t.animate([{opacity:0},{opacity:1}],{duration:s,easing:"cubic-bezier(0.4, 0, 0.2, 1)",fill:"forwards"}),a.addEventListener("finish",(()=>{t.style.opacity="",this.activeAnimations.delete(t)}));else{const e=parseInt(t.style.top)||0,i=e-t.offsetHeight;t.style.top=`${i}px`,t.getBoundingClientRect(),a=t.animate([{top:`${i}px`},{top:`${e}px`}],{duration:s,easing:"cubic-bezier(0.4, 0, 0.2, 1)",fill:"forwards"}),a.addEventListener("finish",(()=>{t.style.top=`${e}px`,this.activeAnimations.delete(t)}))}this.activeAnimations.set(t,a)}catch(e){console.warn("StickyElement: Animation failed",e),t.style.opacity=""}return a}animateElementOut(t,e){const i=this.elementMetadata.get(t);if(!i)return;const{animationType:s,animationSpeed:a}=i;if(this.cancelExistingAnimation(t),"none"===s)return void(e&&e());let n;try{if("fade"===s)n=t.animate([{opacity:1},{opacity:0}],{duration:a,easing:"cubic-bezier(0.4, 0, 0.2, 1)",fill:"forwards"});else{const e=parseInt(t.style.top)||0,i=e-t.offsetHeight;n=t.animate([{top:`${e}px`},{top:`${i}px`}],{duration:a,easing:"cubic-bezier(0.4, 0, 0.2, 1)",fill:"forwards"})}this.activeAnimations.set(t,n),n.addEventListener("finish",(()=>{e&&e(),this.activeAnimations.delete(t)}))}catch(t){console.warn("StickyElement: Animation failed",t),e&&e()}return n}cancelExistingAnimation(t){const e=this.activeAnimations.get(t);if(e){try{e.cancel()}catch(t){}this.activeAnimations.delete(t)}t.style.opacity=""}applyStickyStylesForAnimation(t){const e=this.elementMetadata.get(t);if(!e)return;const{placeholder:i,naturalLeft:s,naturalWidth:a,container:n,originalHeight:l,marginBottom:o,isFullWidth:r}=e,{originalZIndex:d}=this.originalStyles.get(t);if(i&&n&&void 0!==l&&void 0!==o){const e=n.getBoundingClientRect(),h=getComputedStyle(n),c=parseFloat(h.paddingLeft)||0,y=parseFloat(h.borderLeftWidth)||0;let p,m,g;r?(m="0px",g="0px",p="auto"):(m=`${e.left+c+y+s}px`,p=`${a}px`,g=""),i.style.display="block",i.style.height=`${l+o}px`,t.style.position="fixed",t.style.top=`${this.wpAdminBarOffset}px`,t.style.zIndex=this.getSafeZIndex(d),t.classList.add("gb-is-sticky"),t.style.left=m,t.style.right=g,t.style.width=p}}isElementInViewport(t){const e=t.getBoundingClientRect();return e.top>=0&&e.left>=0&&e.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&e.right<=(window.innerWidth||document.documentElement.clientWidth)}applyStickyStyles(t,e){const i=this.elementMetadata.get(t);if(!i)return;const{placeholder:s,naturalLeft:a,naturalWidth:n,container:l,originalHeight:o,marginBottom:r,isFullWidth:d}=i;if(!s||!l||void 0===o||void 0===r)return;const h=this.originalStyles.get(t);if(!h)return;const{originalPosition:c,originalTop:y,originalZIndex:p,originalLeft:m,originalRight:g,originalWidth:u}=h;if(e){const e=l.getBoundingClientRect(),i=getComputedStyle(l),h=parseFloat(i.paddingLeft)||0,c=parseFloat(i.borderLeftWidth)||0;let y,m,g;d?(m="0px",g="0px",y="auto"):(m=`${e.left+h+c+a}px`,y=`${n}px`,g=""),s.style.display="block",s.style.height=`${o+r}px`,t.style.position="fixed",t.style.top=`${this.wpAdminBarOffset}px`,t.style.zIndex=this.getSafeZIndex(p),t.classList.add("gb-is-sticky"),t.style.left=m,t.style.right=g,t.style.width=y}else t.classList.remove("gb-is-sticky"),t.style.position=c||"",t.style.top=y||"",t.style.zIndex=p||"",t.style.left=m||"",t.style.right=g||"",t.style.width=u||"",t.style.transform="",t.style.opacity="",s.style.display="none",this.cancelExistingAnimation(t)}parseThresholdValue(t){const e=t.trim().match(/^(-?\d*\.?\d+)(px|rem|em|%|vh|vw|vmin|vmax)?$/i);if(!e)throw new Error(`Invalid threshold format: ${t}`);const i=parseFloat(e[1]);switch((e[2]||"px").toLowerCase()){case"px":default:return i;case"rem":return i*parseFloat(getComputedStyle(document.documentElement).fontSize);case"em":return 16*i;case"%":case"vh":return i/100*window.innerHeight;case"vw":return i/100*window.innerWidth;case"vmin":return i/100*Math.min(window.innerWidth,window.innerHeight);case"vmax":return i/100*Math.max(window.innerWidth,window.innerHeight)}}handleMediaQueryChange(t,e){const i=this.elementMetadata.get(t);if(!i)return;const s=this.originalStyles.get(t);if(!s)return;const{originalPosition:a,originalTop:n,originalZIndex:l,originalLeft:o,originalRight:r,originalWidth:d}=s,{placeholder:h}=i;if(e.matches&&!this.initializedElements.has(t))this.initializeElementPositioning(t,window.scrollY),this.initializedElements.add(t);else if(!e.matches&&this.initializedElements.has(t)){t.style.position=a||"",t.style.top=n||"",t.style.zIndex=l||"",t.style.left=o||"",t.style.right=r||"",t.style.width=d||"",t.style.transform="",t.style.opacity="",t.classList.remove("gb-is-sticky"),h&&(h.style.display="none"),h&&h.parentNode&&h.parentNode.removeChild(h),this.lastTriggerScrollY.delete(t),this.lastScrollDirection.delete(t),this.scrollDirectionChangeY.delete(t),this.initializedElements.delete(t),this.cancelExistingAnimation(t);const e=i.headerType,s=i.stickyThreshold;this.elementMetadata.set(t,{headerType:e,isScrollUpType:"scroll-up"===e,isPastThresholdType:"past-threshold"===e,isAlwaysType:"always"===e||!e||"scroll-up"!==e&&"past-threshold"!==e,stickyThreshold:s,placeholder:null,wasSticking:!1,isAnimatedSticky:!1})}}requestTick(){this.isTicking||(this.rafId=requestAnimationFrame((()=>this.update())),this.isTicking=!0)}update(){this.updateAdminBarOffset(),this.updateHeaderClasses(window.scrollY),this.isTicking=!1}handleResize(){const t=window.innerWidth,e=this.lastWidth||t;this.lastWidth=t,t!==e&&(this.clearCache(),this.updateAdminBarOffset(),this.elements.forEach((t=>{if(this.initializedElements.has(t)){const e=this.elementMetadata.get(t);if(e&&e.isPastThresholdType&&t.dataset.gbStickyThreshold)try{const i=this.parseThresholdValue(t.dataset.gbStickyThreshold);e.stickyThreshold=i}catch(t){console.warn("StickyElement: Threshold recalculation failed on resize")}this.initializeElementPositioning(t,window.scrollY)}})),this.requestTick())}updateHeaderClasses(t){if(0===this.initializedElements.size)return void(this.lastScrollY=t);this.isScrolling=!0;const e=t>this.lastScrollY?"down":"up";this.currentScrollDirection=e,this.scrollStopTimeout&&clearTimeout(this.scrollStopTimeout),this.scrollStopTimeout=setTimeout((()=>{this.isScrolling=!1,this.handleScrollStop(t,this.currentScrollDirection)}),this.scrollStopDelay),this.elements.forEach((e=>{if(!this.initializedElements.has(e))return;const i=this.elementMetadata.get(e);if(!i)return;const{triggerPoint:s,isAlwaysType:a,naturalTop:n}=i,l=e.classList.contains("gb-is-sticky");let o;o=a?n<=this.wpAdminBarOffset?-1:n-this.wpAdminBarOffset:n;const r=t<o;if(r&&l)return this.cancelExistingAnimation(e),this.applyStickyStyles(e,!1),this.elementMetadata.get(e).wasSticking=!1,void(this.elementMetadata.get(e).isAnimatedSticky=!1);if(a&&!r){const a=n<=this.wpAdminBarOffset?t>0:t>=s;a!==i.wasSticking&&(this.applyStickyStyles(e,a),this.elementMetadata.get(e).wasSticking=a)}})),this.lastScrollY=t}handleScrollStop(t,e){this.elements.forEach((i=>{if(!this.initializedElements.has(i))return;const s=this.elementMetadata.get(i);if(!s)return;const{triggerPoint:a,isScrollUpType:n,isPastThresholdType:l,stickyThreshold:o,naturalTop:r}=s;if(!n&&!l)return;const d=t<=r,h=i.classList.contains("gb-is-sticky");if(d)return void(h&&(this.cancelExistingAnimation(i),this.applyStickyStyles(i,!1),this.elementMetadata.get(i).wasSticking=!1,this.elementMetadata.get(i).isAnimatedSticky=!1));const c=t>a;if(n){const t=this.isElementInViewport(i);"up"!==e||!c||t||h?"down"===e&&h&&this.animateElementOut(i,(()=>{this.applyStickyStyles(i,!1),this.elementMetadata.get(i).wasSticking=!1})):(this.animateElementIn(i),this.elementMetadata.get(i).wasSticking=!0)}else if(l){const e=t>a+o;e&&!s.wasSticking?(this.animateElementIn(i),this.elementMetadata.get(i).wasSticking=!0,this.elementMetadata.get(i).isAnimatedSticky=!0):!e&&s.wasSticking&&this.animateElementOut(i,(()=>{this.applyStickyStyles(i,!1),this.elementMetadata.get(i).wasSticking=!1,this.elementMetadata.get(i).isAnimatedSticky=!1}))}}))}destroy(){this.elements.forEach((t=>{const e=this.originalStyles.get(t),i=this.elementMetadata.get(t);if(!e||!i)return;const{originalPosition:s,originalTop:a,originalZIndex:n,originalLeft:l,originalRight:o,originalWidth:r}=e,{placeholder:d}=i;this.cancelExistingAnimation(t),t.style.position=s||"",t.style.top=a||"",t.style.zIndex=n||"",t.style.left=l||"",t.style.right=o||"",t.style.width=r||"",t.style.transform="",t.style.opacity="",t.classList.remove("gb-is-sticky"),d&&(d.style.display="none"),d&&d.parentNode&&d.parentNode.removeChild(d),this.lastTriggerScrollY.delete(t),this.lastScrollDirection.delete(t),this.scrollDirectionChangeY.delete(t),this.initializedElements.delete(t),this.elementMetadata.delete(t)})),window.removeEventListener("scroll",this.scrollHandler,{passive:!0}),window.removeEventListener("resize",this.resizeHandler,{passive:!0}),this.rafId&&cancelAnimationFrame(this.rafId),this.mediaQueryHandlers.forEach((({mql:t,handler:e})=>t.removeEventListener("change",e))),this.mediaQueryHandlers.clear(),this.originalStyles.clear(),this.activeAnimations.clear(),this.lastTriggerScrollY.clear(),this.lastScrollDirection.clear(),this.scrollDirectionChangeY.clear();const t=this.elementMetadata.get("adminBarObserver");t&&t.disconnect(),this.elementMetadata.clear(),this.domCache.clear()}}})();

✏️ Editing: sticky-element.js Writable

📁 File Manager Pro

📁 File Manager Pro