| @@ -1 +1,9 @@ | ||
| 1 | -(()=>{"use strict";class e{constructor(e,t=!1){this.contentTimeline=e,this.timelineElement=e.querySelector(".ablocks-block-content-timeline"),this.blockTopHeight=this.contentTimeline.getBoundingClientRect().top+window.scrollY,this.editor=t,this.arrowAlignment=this.timelineElement.getAttribute("data-arrow-alignment"),this.animationColor=this.timelineElement.getAttribute("data-animation-color"),this.showAnimation=this.timelineElement.getAttribute("data-show-animation"),this.lineElement=this.contentTimeline.querySelector(".ablocks-block-content-timeline__line"),this.lineInnerElement=this.contentTimeline.querySelector(".ablocks-block-content-timeline__line__inner"),this.childBlocks=Array.from(this.contentTimeline.querySelectorAll(".ablocks-block-content-timeline-child")),this.handleScroll=this.handleScroll.bind(this),this.updateTimeline=this.updateTimeline.bind(this);const i=document.querySelector(".interface-navigable-region.interface-interface-skeleton__content");this.editorDiv=i,this.init()}init(){this.updateTimeline(),this.handleScroll(),window.addEventListener("scroll",this.handleScroll)}updateTimeline(){if(0===this.childBlocks.length||!this.lineElement)return;const[e,t]=[this.childBlocks[0],this.childBlocks[this.childBlocks.length-1]],[i,n]=[e.getBoundingClientRect().height,t.getBoundingClientRect().height];switch(this.arrowAlignment){case"center":this.lineElement.style.top=i/2+"px",this.lineElement.style.bottom=n/2+"px";break;case"bottom":this.lineElement.style.top=`${i}px`,this.lineElement.style.bottom=n/n+"px";break;case"top":this.lineElement.style.top=i/i+"px",this.lineElement.style.bottom=`${n}px`}this.lineInnerElement.style.height="0px"}handleScroll(){var e;e=()=>{let e=0;const t=window.scrollY;this.childBlocks.forEach((i=>{e+=i.getBoundingClientRect().height;const n=i.querySelector(".ablocks-icon-wrap");t-this.blockTopHeight>e-i.getBoundingClientRect().height?"true"===this.showAnimation&&!1===this.editor&&(n.style.backgroundColor=this.animationColor):n.style.backgroundColor=""})),this.lineInnerElement&&("true"===this.showAnimation&&(this.lineInnerElement.style.backgroundColor=this.animationColor),this.editor||(this.lineInnerElement.style.height=t-this.blockTopHeight+"px"))},"undefined"!=typeof window&&window.requestAnimationFrame?window.requestAnimationFrame(e):setTimeout(e,16)}destroy(){window.removeEventListener("scroll",this.handleScroll)}}document.addEventListener("DOMContentLoaded",(()=>{document.querySelectorAll(".ablocks-block--content-timeline").forEach((t=>{new e(t,!1)}))}))})(); | |
| 1 | +(()=>{"use strict";const t=(t,e)=>{if("string"==typeof t&&t.startsWith(`var:${e}`)){const i=t.split("|");if(3===i.length)return{source:i[0],color:i[1]||"",..."preset"===e?{slug:i[2]}:{id:i[2]}}}return!1},e="ablocks-block-content-timeline__marker--active",i="--ablocks-ct-active-color",s="--ablocks-ct-date-width",n=["top","bottom","left","right","width","height","margin-left","margin-right","transform"],r=["width","height","transform","transform-origin"],l=["top","bottom","left","right"];class o{constructor(e,i=!1){var s;this.contentTimeline=e,this.editor=i,this.timelineElement=e.querySelector(".ablocks-block-content-timeline"),this.timelineElement&&(this.window=e.ownerDocument.defaultView||window,this.showAnimation="true"===this.timelineElement.getAttribute("data-show-animation"),this.animationColor="string"==typeof(s=this.timelineElement.getAttribute("data-animation-color"))&&/^(?:[0-9a-f]{3,4}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(s.trim())?`#${s.trim()}`:(e=>{if(e){ | |
| 2 | +const i=t(e,"preset"),s=t(e,"global");return i?`var(--wp--preset--color--${i?.slug})`:s?`var(--ablocks-${s?.id})`:e}return""})(s),this.lineElement=this.timelineElement.querySelector(".ablocks-block-content-timeline__line"),this.lineInnerElement=this.timelineElement.querySelector(".ablocks-block-content-timeline__line__inner"),this.childBlocks=Array.from(this.timelineElement.querySelectorAll(".ablocks-block-content-timeline-child")),this.markers=this.childBlocks.map(t=>t.querySelector(".ablocks__in-view-icon")).filter(Boolean),this.arrows=this.childBlocks.map(t=>({marker:t.querySelector(".ablocks__in-view-icon"),arrow:t.querySelector(".ablocks-block-content-timeline-child__arrow")})).filter(({marker:t,arrow:e})=>t&&e),this.geometry=null,this.dirty=!0,this.frameRequested=!1,this.destroyed=!1,this.handleScroll=this.handleScroll.bind(this),this.handleResize=this.handleResize.bind(this),this.markDirty=this.markDirty.bind(this),this.frame=this.frame.bind(this),this.init())}init(){ | |
| 3 | +if(!this.lineElement||0===this.markers.length)return;this.animationColor&&this.timelineElement.style.setProperty(i,this.animationColor);const t=this.window;t.addEventListener("scroll",this.handleScroll,{passive:!0,capture:!0}),t.addEventListener("resize",this.handleResize),void 0!==t.ResizeObserver&&(this.resizeObserver=new t.ResizeObserver(this.markDirty),[this.timelineElement,...this.childBlocks,...this.markers].forEach(t=>this.resizeObserver.observe(t))),void 0!==t.MutationObserver&&(this.mutationObserver=new t.MutationObserver(this.markDirty),[this.timelineElement,...this.childBlocks].forEach(t=>this.mutationObserver.observe(t,{attributes:!0,attributeFilter:["class"]}))),this.images=Array.from(this.timelineElement.querySelectorAll("img")).filter(t=>!t.complete),this.images.forEach(t=>t.addEventListener("load",this.markDirty));const e=this.contentTimeline.ownerDocument.fonts;e&&e.ready&&e.ready.then(this.markDirty).catch(()=>{}),this.updateTimeline()}updateTimeline(){ | |
| 4 | +!this.destroyed&&this.lineElement&&(this.measure(),this.update())}handleScroll(){this.requestFrame()}handleResize(){this.markDirty()}markDirty(){this.dirty=!0,this.requestFrame()}requestFrame(){this.frameRequested||this.destroyed||(this.frameRequested=!0,this.window.requestAnimationFrame(this.frame))}frame(){this.frameRequested=!1,this.destroyed||(this.dirty&&this.measure(),this.update())}isHorizontal(){const t=this.timelineElement.classList.contains("ablocks-block-content-timeline--top")||this.timelineElement.classList.contains("ablocks-block-content-timeline--bottom"),e=this.childBlocks[0]?.parentElement;return t&&!!e&&"row"===this.window.getComputedStyle(e).flexDirection}setLineStyle(t,e){this.lineElement.style.setProperty(t,e,"important")}clearLineStyles(t=!1){n.forEach(t=>this.lineElement.style.removeProperty(t)),t&&this.lineInnerElement&&r.forEach(t=>this.lineInnerElement.style.removeProperty(t))}equalizeDateColumns(t,e){if(this.timelineElement.style.removeProperty(s), | |
| 5 | +t||!this.timelineElement.classList.contains("ablocks-block-content-timeline--left")&&!this.timelineElement.classList.contains("ablocks-block-content-timeline--right"))return!1;const i=Math.max(0,...this.childBlocks.map(t=>t.querySelector(".ablocks-block-content-timeline-child__date")?.getBoundingClientRect().width||0));return!(i<=0||(this.timelineElement.style.setProperty(s,`${Math.ceil(i/e)}px`),0))}measure(){this.dirty=!1;const t=this.isHorizontal();this.clearLineStyles();let e=this.timelineElement.getBoundingClientRect();const i=e.width/(this.timelineElement.offsetWidth||1)||1,s=e.height/(this.timelineElement.offsetHeight||1)||1;this.equalizeDateColumns(t,i)&&(e=this.timelineElement.getBoundingClientRect());const n=e.left+this.timelineElement.clientLeft*i,r=e.top+this.timelineElement.clientTop*s,l=this.markers.map(t=>{const e=t.getBoundingClientRect();return{x:(e.left+e.width/2-n)/i,y:(e.top+e.height/2-r)/s}});this.scaleY=s;const o=l[0],h=l[l.length-1] | |
| 6 | +;if(this.setLineStyle("margin-left","0px"),this.setLineStyle("margin-right","0px"),this.setLineStyle("right","auto"),this.setLineStyle("bottom","auto"),t){const t=parseFloat(this.window.getComputedStyle(this.lineElement).width)||3;this.setLineStyle("left",`${o.x}px`),this.setLineStyle("top",`${o.y}px`),this.setLineStyle("width",`${Math.max(h.x-o.x,0)}px`),this.setLineStyle("height",`${t}px`),this.setLineStyle("transform","translateY(-50%)")}else this.setLineStyle("left",`${o.x}px`),this.setLineStyle("top",`${o.y}px`),this.setLineStyle("height",`${Math.max(h.y-o.y,0)}px`),this.setLineStyle("transform","translateX(-50%)");this.positionArrows(t,i,s),this.geometry={horizontal:t,centers:l}}clearArrowStyles(){this.arrows.forEach(({arrow:t})=>l.forEach(e=>t.style.removeProperty(e)))}positionArrows(t,e,i){this.clearArrowStyles() | |
| 7 | +;const s=this.timelineElement.classList.contains("ablocks-block-content-timeline--top")||this.timelineElement.classList.contains("ablocks-block-content-timeline--bottom");this.arrows.forEach(({marker:n,arrow:r})=>{const l=r.offsetParent;if(!l)return;const o=n.getBoundingClientRect(),h=l.getBoundingClientRect(),a=(t,e)=>r.style.setProperty(t,e,"important");if(t)return a("left",(o.left+o.width/2-h.left-l.clientLeft*e)/e-r.offsetWidth/2+"px"),void a("right","auto");const m=(o.top+o.height/2-h.top-l.clientTop*i)/i;a("top",`${s?m-r.offsetHeight/2:m}px`),a("bottom","auto")})}update(){if(!this.geometry||!this.lineInnerElement)return;const{horizontal:t,centers:i}=this.geometry;if(!this.showAnimation)return this.setFill(t,0),void this.markers.forEach(t=>t.classList.remove(e));const s=this.timelineElement.getBoundingClientRect(),n=this.scaleY||1,r=(this.window.innerHeight/2-(s.top+this.timelineElement.clientTop*n))/n,l=i[0],o=i[i.length-1];if(t){const t=r>=l.y;return this.setFill(!0,t?1:0), | |
| 8 | +void this.markers.forEach(i=>i.classList.toggle(e,t))}const h=o.y-l.y,a=h>0?(m=(r-l.y)/h,Math.min(Math.max(m,0),1)):0;var m;this.setFill(!1,a),this.markers.forEach((t,s)=>t.classList.toggle(e,r>=i[s].y))}setFill(t,e){const i=this.lineInnerElement;i.style.setProperty("width","100%"),i.style.setProperty("height","100%"),i.style.setProperty("transform-origin",t?"left center":"center top"),i.style.setProperty("transform",t?`scaleX(${e})`:`scaleY(${e})`)}destroy(){this.destroyed||(this.destroyed=!0,this.lineElement&&(this.window.removeEventListener("scroll",this.handleScroll,{capture:!0}),this.window.removeEventListener("resize",this.handleResize),this.resizeObserver&&this.resizeObserver.disconnect(),this.mutationObserver&&this.mutationObserver.disconnect(),(this.images||[]).forEach(t=>t.removeEventListener("load",this.markDirty)),this.clearLineStyles(!0),this.clearArrowStyles(),this.markers.forEach(t=>t.classList.remove(e)),this.timelineElement.style.removeProperty(i), | |
| 9 | +this.timelineElement.style.removeProperty(s)))}}function h(){document.querySelectorAll(".ablocks-block--content-timeline").forEach(t=>{new o(t,!1)})}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",h):h()})(); | |
