jahresbericht2018/assets/js/components/achievements.js

1 line
2.6 KiB
JavaScript

"use strict";define("components/achievements",[],function(){return class{constructor(e){this.element=e,this.state={alreadyVisible:!1,runningTasks:0,loading:!0,store:this.element.querySelectorAll(".achievement--store"),unseen:[],lastStoreIndexes:[]},this.element.querySelector(".achievements__button").addEventListener("click",()=>{0==this.state.runningTasks&&this.toggleAnimation()}),this.element.querySelectorAll(".achievements__cube").forEach(e=>{e.addEventListener("click",()=>{0==this.state.runningTasks&&this.toggleAnimation()})})}init(){if(!this.state.alreadyVisible){this.state.alreadyVisible=!0,this.element.querySelectorAll(".achievement").forEach(e=>{this.loadNextUnseen(e)}),this.toggleAnimation(),this.element.querySelector(".achievements__button").classList.remove("invis")}}loadNextUnseen(e){0==this.state.unseen.length&&(this.state.store.forEach((e,t)=>{this.state.unseen.push(t)}),this.state.lastStoreIndexes.forEach(e=>{this.state.unseen=this.state.unseen.filter(t=>t!==e)}));let t=this.state.unseen[Math.floor(Math.random()*this.state.unseen.length)];this.state.lastStoreIndexes.push(t),this.state.lastStoreIndexes.length>2&&this.state.lastStoreIndexes.shift(),this.state.unseen=this.state.unseen.filter(e=>e!==t);let s=this.state.store[t];e.querySelector(".achievement__number").dataset.number=s.dataset.number,e.querySelector(".achievement__number-placeholder").innerHTML=s.dataset.number,e.querySelector(".achievement__number-postfix").innerHTML=s.dataset.postfix,e.querySelector(".achievement__category").innerHTML=s.dataset.category,e.querySelector(".achievement__teaser").innerHTML=s.innerHTML,e.querySelector(".achievement__link").href=s.dataset.url}toggleAnimation(){let e=this.element,t=e.querySelectorAll(".achievement");this.state.loading?(t.forEach(e=>{this.state.runningTasks++,this.countUp(e.querySelector(".achievement__number"),()=>{this.state.runningTasks--})}),e.classList.remove("loading"),this.state.loading=!1):(e.classList.add("loading"),this.state.loading=!0,this.state.runningTasks++,setTimeout(()=>{this.state.runningTasks--,t.forEach(e=>{this.loadNextUnseen(e)}),this.toggleAnimation()},800))}countUp(e,t){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:700,n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:13,a=parseInt(e.dataset.number,10),i=document.documentElement.getAttribute("lang"),r=0;n=Math.min(n,a);let l=Math.abs(Math.floor(s/n)),o=Math.floor(a/n),h=e.querySelector(".achievement__number-placeholder");h.style.width="auto",h.innerHTML=a.toLocaleString(i),h.style.width=h.offsetWidth+"px";let c=setInterval(()=>{o>1&&r+o>=a&&(o=Math.floor(o/4)),r=(r+=o=o<1?1:o)>a?a:r,h.innerHTML=r.toLocaleString(i),r==a&&(clearInterval(c),t())},l)}}});