jahresbericht2017/assets/js/components/reports.js

define("components/reports",[],function(){return class t{constructor(t){this.element=t,this.state={runningTransitions:0,animationState:1,store:this.element.querySelectorAll(".reports--store"),unseen:[],lastStoreIndexes:[],loading:!0,backgroundImage:"none"};let e=this.element.querySelector(".reports__background");this.element.querySelectorAll(".reports__link").forEach(t=>{t.addEventListener("mouseenter",()=>{this.state.backgroundImage=t.dataset.cover?"url("+t.dataset.cover+")":"none",e.style.backgroundImage=this.state.backgroundImage,e.classList.remove("hidden")}),t.addEventListener("mouseleave",()=>{this.state.backgroundImage="none",e.classList.add("hidden"),setTimeout(()=>{e.style.backgroundimage=this.state.backgroundImage},300)})});let s=this.element.querySelector(".reports__cube--1"),n=this.element.querySelector(".reports__cube--2"),i=this.element.querySelector(".reports__cube--3"),o=s.offsetWidth/2,l=s.offsetHeight/4;this.shuffleLoop=[[{el:s,styles:{left:1*o,top:2*l},pixelSpeed:80},{el:n,styles:{left:0*o,top:1*l},pixelSpeed:80},{el:i,styles:{left:2*o,top:1*l},pixelSpeed:80}],[{el:s,styles:{left:1*o,top:0*l},pixelSpeed:80}],[{el:s,styles:{left:1*o,top:4*l},pixelSpeed:80}],[{el:n,styles:{left:0*o,top:3*l},pixelSpeed:80}],[{el:s,styles:{left:1*o,top:2*l},pixelSpeed:80},{el:i,styles:{left:1*o,top:0*l},pixelSpeed:80}],[{el:s,styles:{left:0*o,top:1*l},pixelSpeed:80}],[{el:s,styles:{left:1*o,top:2*l},pixelSpeed:80},{el:i,styles:{left:2*o,top:1*l},pixelSpeed:80}]],this.element.querySelector(".reports__button--reload").addEventListener("click",()=>{0==this.state.runningTransitions&&this.loadNewReports()}),this.element.querySelectorAll(".reports__link").forEach(t=>{this.loadNextUnseen(t)}),this.loadNewReports(),this.element.querySelectorAll(".reports__button").forEach(t=>{t.classList.remove("invis")})}loadNextUnseen(t){0==this.state.unseen.length&&(this.state.store.forEach((t,e)=>{this.state.unseen.push(e)}),this.state.lastStoreIndexes.forEach(t=>{this.state.unseen=this.state.unseen.filter(e=>e!==t)}));let e=this.state.unseen[Math.floor(Math.random()*this.state.unseen.length)];this.state.lastStoreIndexes.push(e),this.state.lastStoreIndexes.length>3&&this.state.lastStoreIndexes.shift(),this.state.unseen=this.state.unseen.filter(t=>t!==e);let s=this.state.store[e];t.href=s.dataset.url,t.querySelector(".reports__link-title").innerHTML=s.innerHTML,t.dataset.cover=s.dataset.cover}delayedDropClass(t,e,s,n,i){void 0===i&&(i=0),i<t.length?(t[i].classList.remove(s),setTimeout(()=>{this.delayedDropClass(t,e,s,n,i+1)},e+30*Math.random())):n&&n()}loadNewReports(){let t=this.element,e=t.querySelectorAll(".reports__link");this.state.loading?this.delayedDropClass(e,50,"loading",()=>{this.state.loading=!1}):(this.toggleAnimationState(this.shuffleLoop),e.forEach(t=>{t.classList.add("loading")}),this.state.loading=!0,this.state.runningTasks++,setTimeout(()=>{this.state.runningTasks--,e.forEach(t=>{this.loadNextUnseen(t)}),this.loadNewReports()},300))}toggleAnimationState(t){this.performAnimationState(t[this.state.animationState],()=>{}),this.state.animationState=this.state.animationState+1<t.length?this.state.animationState+1:0}performAnimationState(t,e){let s;Object.entries(t).forEach(t=>{s=t[1],this.performTransition(s,e)})}performAnimation(t,e,s=0){t[s]?this.performAnimationState(t[s],()=>{this.performAnimation(t,e,s+1)}):e&&e()}performTransition(t,e){t.onStart&&t.onStart();let s=[];if(Object.entries(t.styles).forEach(e=>{let n=(t.el.style[e[0]]||window.getComputedStyle(t.el,null)[e[0]]).match(/(-?\d*\.?\d*)(.*)/);n[1]=parseInt(n[1]),s[e[0]]=n}),t.pixelSpeed){let e=void 0===s.left[1]?0:s.left[1],n=void 0===s.top[1]?0:s.top[1],i=void 0===t.styles.left?0:t.styles.left,o=void 0===t.styles.top?0:t.styles.top,l=i-e,a=o-n,r=Math.sqrt(l*l+a*a);r>0&&(t.duration=r/t.pixelSpeed*1e3)}t.el.style.transitionDuration=t.duration/1e3+"s",Object.entries(t.styles).forEach(n=>{let i=t.styles[n[0]];t.el.style[n[0]]=i+s[n[0]][2],this.state.runningTransitions++,setTimeout(()=>{this.state.runningTransitions--,0==this.state.runningTransitions&&e&&e(),t.onEnd&&t.onEnd()},t.duration)})}}});