function getInnerHtml(){return`<div class="progressring-bg">
    <div class="progressring-text"></div>
</div>
<div class="spiner-holder-one animate-0-25-a">
    <div class="spiner-holder-two animate-0-25-b">
        <div class="progressring-spiner"></div>
    </div>
</div>
<div class="spiner-holder-one animate-25-50-a">
    <div class="spiner-holder-two animate-25-50-b">
        <div class="progressring-spiner"></div>
    </div>
</div>
<div class="spiner-holder-one animate-50-75-a">
    <div class="spiner-holder-two animate-50-75-b">
        <div class="progressring-spiner"></div>
    </div>
</div>
<div class="spiner-holder-one animate-75-100-a">
    <div class="spiner-holder-two animate-75-100-b">
        <div class="progressring-spiner"></div>
    </div>
</div>`}function onInit(){this.hasInit||(this.hasInit=!0,this.classList.add("progressring"),this.innerHTML=getInnerHtml(),this.setProgress(parseFloat(this.getAttribute("data-progress")||"0")))}require(["css!modules/emby-elements/emby-progressring/emby-progressring.css"]);class EmbyProgressRing extends HTMLDivElement{constructor(){var self=super();return onInit.call(self),self}connectedCallback(){onInit.call(this)}disconnectedCallback(){var observer=this.observer;observer&&(observer.disconnect(),this.observer=null)}setProgress(progress){let angle;(progress=Math.floor(progress))<25?(angle=progress/100*360-90,this.querySelector(".animate-0-25-b").style.transform="rotate("+angle+"deg)",this.querySelector(".animate-25-50-b").style.transform="rotate(-90deg)",this.querySelector(".animate-50-75-b").style.transform="rotate(-90deg)",this.querySelector(".animate-75-100-b").style.transform="rotate(-90deg)"):25<=progress&&progress<50?(angle=(progress-25)/100*360-90,this.querySelector(".animate-0-25-b").style.transform="none",this.querySelector(".animate-25-50-b").style.transform="rotate("+angle+"deg)",this.querySelector(".animate-50-75-b").style.transform="rotate(-90deg)",this.querySelector(".animate-75-100-b").style.transform="rotate(-90deg)"):50<=progress&&progress<75?(angle=(progress-50)/100*360-90,this.querySelector(".animate-0-25-b").style.transform="none",this.querySelector(".animate-25-50-b").style.transform="none",this.querySelector(".animate-50-75-b").style.transform="rotate("+angle+"deg)",this.querySelector(".animate-75-100-b").style.transform="rotate(-90deg)"):75<=progress&&progress<=100&&(angle=(progress-75)/100*360-90,this.querySelector(".animate-0-25-b").style.transform="none",this.querySelector(".animate-25-50-b").style.transform="none",this.querySelector(".animate-50-75-b").style.transform="none",this.querySelector(".animate-75-100-b").style.transform="rotate("+angle+"deg)"),this.querySelector(".progressring-text").innerHTML=progress+"%"}}customElements.define("emby-progressring",EmbyProgressRing,{extends:"div"});export default EmbyProgressRing;