Аккордеон в Zero-блоке

<!-- Аккордеон в Zero-блоке | https://necodim.ru/tilda/accordion-in-zero --> <script>!function(){const findLowestElement=selector=>{const elements=document.querySelectorAll(selector);let lowestElement=null,maxBottom=-1/0;return elements.forEach(el=>{const rect=el.getBoundingClientRect(),bottom=rect.top+rect.height;bottom>maxBottom&&(maxBottom=bottom,lowestElement=el)}),lowestElement},findElementWithClassEnding=(ending,parent=null)=>{const allElements=parent?parent.querySelectorAll("*"):document.querySelectorAll("*"),elements=new Array;for(let element of allElements)Array.from(element.classList).some(className=>className.endsWith(ending))&&elements.push(element);const result=elements.length?elements:null;return result},getElementHeight=element=>{if(element){const height=element.offsetHeight;return height}return!1},getBottom=element=>{const elementHeight=element.offsetHeight,elementTopPosition=element.closest(".tn-elem").offsetTop,bottom=Math.round(elementTopPosition+elementHeight);return bottom},getRealDistanceBetweenBottoms=element=>{const zeroArtboardBaseHeight=Math.round(parseInt(zeroWithAccordionArtboard.getAttribute("data-artboard-height"),10)),bottom=getBottom(element),distance=Math.round(zeroArtboardBaseHeight-bottom);return distance},setZeroProperty=(prop,value)=>{const zeroFilter=zeroWithAccordionArtboard.querySelector(".t396__filter"),zeroCarrier=zeroWithAccordionArtboard.querySelector(".t396__carrier");zeroWithAccordionArtboard.style.setProperty(prop,value,"important"),zeroFilter.style.setProperty(prop,value,"important"),zeroCarrier.style.setProperty(prop,value,"important")},setZeroHeight=height=>{const px=height+"px";setZeroProperty("height",px),setZeroProperty("min-height",px),zeroWithAccordionArtboard.setAttribute("data-artboard-height",height),zeroWithAccordionArtboard.setAttribute("data-artboard-proxy-min-height",height),zeroWithAccordionArtboard.setAttribute("data-artboard-proxy-max-height",height)},zeroID="#rec123456789",accordionID="#rec234567890",zeroWithAccordionArtboard=document.querySelector(` .t396__artboard`);zeroWithAccordionArtboard.addEventListener("artBoardRendered",()=>{setZeroProperty("transition","all .2s ease-in-out");const accordion=document.getElementById("zero-accordion"),accordionHeight=getElementHeight(document.querySelector(accordionID)),htmlElement=accordion.closest(".tn-elem"),htmlElementBaseHeight=parseInt(htmlElement.style.height.replace(/\D/g,""),10),zeroArtboardBaseHeight=Math.round(parseInt(zeroWithAccordionArtboard.getAttribute("data-artboard-height"),10)),zeroSummarizeHeight=zeroArtboardBaseHeight-htmlElementBaseHeight+accordionHeight,zoom="window"===zeroWithAccordionArtboard.getAttribute("data-artboard-upscale")?window.tn_scale_factor:1,zeroArtboardZoomHeight=Math.round(zeroSummarizeHeight*zoom);zeroWithAccordionArtboard.setAttribute("data-artboard-height",zeroArtboardZoomHeight),zeroWithAccordionArtboard.setAttribute("data-artboard-proxy-min-height",zeroArtboardZoomHeight),zeroWithAccordionArtboard.setAttribute("data-artboard-proxy-max-height",zeroArtboardZoomHeight),htmlElement.style.height=Math.ceil(accordion.getBoundingClientRect().height)+"px",setZeroHeight(zeroArtboardZoomHeight),accordion.appendChild(document.querySelector(accordionID)),accordion.querySelectorAll(".t-col").forEach(col=>(col.style.marginLeft="0",col.style.marginRight="0"));const accordionHiddenElements=findElementWithClassEnding("__content",accordion),accordionBaseHeight=accordion.offsetHeight;let accordionHiddenHeight=0,accordionMaxHeight=accordionBaseHeight;accordionHiddenElements.forEach(el=>{el.style.display="block",elStyle=window.getComputedStyle(el,null);var paddingBottom=Number(elStyle.paddingBottom.replace("px","")),height=el.scrollHeight+paddingBottom;el.style.display="",accordionHiddenHeight+=height}),accordionMaxHeight+=accordionHiddenHeight;const lowestDiv=findLowestElement(` .tn-atom`);let zeroArtboardMaxHeight,differenceBottom;if(isAccordionLastDiv=lowestDiv===accordion.closest(".tn-atom"),isAccordionLastDiv)zeroArtboardMaxHeight=Math.round((zeroSummarizeHeight+accordionHiddenHeight)*zoom),differenceBottom=getRealDistanceBetweenBottoms(accordion);else{const lowestDivHeight=lowestDiv.offsetHeight,difference=Math.round(Math.abs(lowestDiv.getBoundingClientRect().top-accordion.getBoundingClientRect().top));differenceBottom=getRealDistanceBetweenBottoms(lowestDiv),zeroArtboardMaxHeight=Math.round((zeroSummarizeHeight+accordionMaxHeight-lowestDivHeight+difference)*zoom)}accordion.querySelectorAll("button").forEach(button=>{button.addEventListener("click",e=>{const interval=setInterval(()=>{const needToGrow=isAccordionLastDiv?getBottom(accordion)<zeroArtboardMaxHeight:getBottom(accordion)>getBottom(lowestDiv),height=(accordion.offsetHeight+accordion.closest(".tn-elem").offsetTop+differenceBottom)*zoom;setZeroHeight(needToGrow?height:zeroArtboardZoomHeight)},16);setTimeout(()=>{clearInterval(interval)},400)})})})}();</script>