| 1 |
(()=>{"use strict";document.addEventListener("DOMContentLoaded",(function(){t.init()}));const t={init:function(){this.holder=document.querySelectorAll(".qi-block-progress-bar-horizontal"),this.holder.length&&[...this.holder].map((e=>{t.initItem(e)}))},getRealCurrentItem:function(t){return"string"==typeof t&&""!==t&&(t=qiBlocksEditor.qodefGetCurrentBlockElement.get(t)),t},initItem:function(e,r){if(!(e=t.getRealCurrentItem(e)))return;const i="object"!=typeof qiBlocksEditor?qiBlocks:qiBlocksEditor;r&&e.classList.remove("qodef--init"),i.qodefIsInViewport.check(e,(()=>{e.classList.contains("qodef--init")||t.initHorizontalBar(e,r)}))},generateBarData:function(t){const e=parseInt(t.getAttribute("data-active-line-width"),10),r=t.getAttribute("data-active-line-color"),i=parseInt(t.getAttribute("data-inactive-line-width"),10),n=t.getAttribute("data-inactive-line-color"),a=t.getAttribute("data-duration")&&!isNaN(t.getAttribute("data-duration"))?parseInt(t.getAttribute("data-duration"),10):1200,o=t.getAttribute("data-percentage-type"),d=t.clientWidth;let s={strokeWidth:100*e/d,trailWidth:100*i/d,svgStyle:{display:"block",width:"100%"},easing:"easeInOut",duration:a,step:function(e,r){const i=Math.round(100*r.value());t.querySelector(".qodef-m-value-inner").innerHTML=i+'<span class="qodef-m-percentage">%</span>',"floating-above"!==o&&"floating-on"!==o||(t.querySelector(".qodef-m-value").style.left=i+"%")}};return r&&(s.color=r,s.to={color:r}),n&&(s.trailColor=n,s.from={color:n}),s},initHorizontalBar:function(e,r){const i=e.querySelector(".qodef-m-canvas"),n=t.generateBarData(e),a=parseInt(e.getAttribute("data-number"),10)/100;r&&(i.innerHTML="");const o=new ProgressBar.Line(i,n);"yes"===e.getAttribute("data-gradient-fill")&&t.generateGradient(e);const d=e.getAttribute("data-pattern");d&&(e.querySelector("svg").style.backgroundImage='url("'+d+'")'),e.classList.add("qodef--init"),o.animate(a)},generateGradient:function(t){const e="http://www.w3.org/2000/svg",r=document.createElementNS(e,"defs"),i=document.createElementNS(e,"linearGradient"),n=[{color:t.getAttribute("data-gradient-start"),offset:"0%"},{color:t.getAttribute("data-gradient-end"),offset:"100%"}];for(let t=0,r=n.length;t<r;t++){let r=document.createElementNS(e,"stop");r.setAttribute("offset",n[t].offset),r.setAttribute("stop-color",n[t].color),i.appendChild(r)}i.id="Gradient-"+t.getAttribute("data-rand-id"),i.setAttribute("gradientUnits","userSpaceOnUse"),i.setAttribute("x1","0"),i.setAttribute("x2",t.getAttribute("data-number")+"%"),i.setAttribute("y1","0"),i.setAttribute("y2","0"),r.appendChild(i),t.querySelector(".qodef-m-canvas svg").appendChild(r),t.querySelector(".qodef-m-canvas svg path:nth-child(2)").setAttribute("stroke","url(#Gradient-"+t.getAttribute("data-rand-id")+")")}}})(); |
