1"use strict";(self.webpackChunksvk_designsystem=self.webpackChunksvk_designsystem||[]).push([[3086],{13086:function(t,e,n){n.r(e),n.d(e,{SvkBlockChurchElectionCountdown:function(){return i}});class i extends HTMLElement{constructor(){super(),this.timer=null,this.currentViewMode=null,this.handleVisibilityChange=this.handleVisibilityChange.bind(this)}connectedCallback(){this.startTime=new Date(this.getAttribute("starttime")),this.endTime=new Date(this.getAttribute("endtime")),this.upcomingTitle=this.getAttribute("upcoming-title"),this.upcomingDescription=this.getAttribute("upcoming-description"),this.upcomingButtonUrl=this.getAttribute("upcoming-button-url"),this.upcomingButtonTitle=this.getAttribute("upcoming-button-title"),this.ongoingTitle=this.getAttribute("ongoing-title"),this.ongoingDescription=this.getAttribute("ongoing-description"),this.ongoingButtonUrl=this.getAttribute("ongoing-button-url"),this.ongoingButtonTitle=this.getAttribute("ongoing-button-title"),this.electionDayTitle=this.getAttribute("election-day-title")||this.ongoingTitle,this.electionDayDescription=this.getAttribute("election-day-description")||this.ongoingDescription,this.electionDayButtonUrl=this.getAttribute("election-day-button-url")||this.ongoingButtonUrl,this.electionDayButtonTitle=this.getAttribute("election-day-button-title")||this.ongoingButtonTitle,this.endTitle=this.getAttribute("end-title"),this.endDescription=this.getAttribute("end-description"),this.endButtonUrl=this.getAttribute("end-button-url"),this.endButtonTitle=this.getAttribute("end-button-title"),document.addEventListener("visibilitychange",this.handleVisibilityChange),window.addEventListener("focus",this.handleVisibilityChange),this.renderCountdown(),this.startCountdown()}disconnectedCallback(){clearInterval(this.timer),document.removeEventListener("visibilitychange",this.handleVisibilityChange),window.removeEventListener("focus",this.handleVisibilityChange)}isInfoScreenEnabled(){return"true"===new URLSearchParams(window.location.search).get("infoscreen")}isInfoQREnabled(){return"true"===new URLSearchParams(window.location.search).get("qr")}handleVisibilityChange(){document.hidden||this.updateCountdown()}startCountdown(){this.timer&&clearInterval(this.timer),this.timer=setInterval(()=>this.updateCountdown(),1e3),this.updateCountdown()}isSameDay(t,e){return t.toDateString()===e.toDateString()}getState(){const t=new Date;let e,n;return t<this.startTime?(n="upcoming",e=this.startTime):t>=this.startTime&&t<this.endTime?(n=this.isSameDay(t,this.endTime)?"electionday":"ongoing",e=this.endTime):n="ended",this.currentViewMode!==n&&(this.currentViewMode=n,"ended"===n?(clearInterval(this.timer),this.renderEndView()):this.renderContentForState(n)),e}updateCountdown(){const t=new Date;let e=this.getState();if(!e)return void clearInterval(this.timer);const n=e-t;let i=Math.floor(n/864e5),o=Math.floor(n%864e5/36e5),s=Math.floor(n%36e5/6e4),h=Math.floor(n%6e4/1e3);if(n<=0)return clearInterval(this.timer),void this.getState();this.updateAnimatedNumbers("days",i),this.updateAnimatedNumbers("hours",o),this.updateAnimatedNumbers("minutes",s),this.updateAnimatedNumbers("seconds",h)}renderContentForState(t){const e={upcoming:{title:this.upcomingTitle,description:this.upcomingDescription,buttonUrl:this.upcomingButtonUrl,buttonTitle:this.upcomingButtonTitle},ongoing:{title:this.ongoingTitle,description:this.ongoingDescription,buttonUrl:this.ongoingButtonUrl,buttonTitle:this.ongoingButtonTitle},electionday:{title:this.electionDayTitle,description:this.electionDayDescription,buttonUrl:this.electionDayButtonUrl,buttonTitle:this.electionDayButtonTitle}};e[t]&&this.renderContent(e[t])}createAnimatedNumber(t,e,n){return`\n <div class="counter__item">\n <div class="counter ${e}" data-value="${n}">\n <div class="heading-01 number">${n}</div>\n </div>\n <span class="label-75">${t}</span>\n </div>\n `}updateAnimatedNumbers(t,e){const n=this.querySelector(`.counter.${t}`);if(!n)return;let i="days"===t?String(e):String(e).padStart(2,"0");const o=n.getAttribute("data-value");if(o===i)return;n.innerHTML="";const s=document.createElement("div");s.classList.add("number"),s.textContent=i,s.style.transform="translateY(100%)",s.style.transition="transform 0.5s ease-in-out";const h=document.createElement("div");h.classList.add("number"),h.textContent=o,h.style.transform="translateY(0%)",n.appendChild(h),n.appendChild(s),setTimeout(()=>{s.style.transform="translateY(0)",h.style.transform="translateY(-100%)"},50),setTimeout(()=>{h.remove(),n.setAttribute("data-value",i)},500)}renderContent(t){this.querySelector(".countdown__content").innerHTML=`\n <div class="svk-flex svk-flex--100">\n <h2>${t.title}</h2>\n <p class="paragraph-100">${t.description}</p>\n ${t.buttonUrl&&t.buttonTitle?`<a href="${t.buttonUrl}" class="svk-button button--primary">${t.buttonTitle}</a>`:""}\n </div>\n `}renderCountdown(){this.innerHTML=`\n <div class="countdown-container svk-flex">\n <div class="countdown__content"></div>\n <div class="countdown__counter heading-01">\n ${this.createAnimatedNumber("Dagar","days",0)}\n ${this.createAnimatedNumber("Timmar","hours",0)}\n ${this.createAnimatedNumber("Minuter","minutes",0)}\n ${this.createAnimatedNumber("Sekunder","seconds",0)}\n </div>\n </div>\n `}renderEndView(){this.endTitle&&this.endDescription?this.innerHTML=`\n\t\t\t\t<div class="countdown-container svk-flex">\n\t\t\t\t\t<div class="countdown__content">\n\t\t\t\t\t\t<div class="svk-flex svk-flex--100">\n\t\t\t\t\t\t\t<h2>${this.endTitle}</h2>\n\t\t\t\t\t\t\t<p class="paragraph-100">${this.endDescription}</p>\n\t\t\t\t\t\t\t${this.endButtonUrl&&this.endButtonTitle?`<a href="${this.endButtonUrl}" class="svk-button button--primary">${this.endButtonTitle}</a>`:""}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class="countdown__image">\n\t\t\t\t\t\t<svk-icon name="kyrkovalet"></svk-icon>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t`:this.innerHTML=""}renderInfoScreenView(){this.querySelector(".countdown-container").insertAdjacentHTML("beforeend",`\n\t\t\t<div class="heading-04">Läs mer på svenskakyrkan.se/kyrkoval</div>\n\t\t\t${this.isInfoQREnabled()?'\n\t\t\t\t<div class="qr-code">\n\t\t\t\t<?xml version="1.0" encoding="UTF-8"?>\n\t\t\t\t\t<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">\n\t\t\t\t\t<rect x="48.34" y="2" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<path d="m94.69,2h-19.86v23.17h23.17V2h-3.31Zm0,6.62v13.24h-16.55V5.31h16.55v3.31Z" stroke-width="0"/>\n\t\t\t\t\t<polygon points="48.34 8.62 48.34 5.31 45.03 5.31 45.03 8.62 45.03 11.93 48.34 11.93 48.34 8.62" stroke-width="0"/>\n\t\t\t\t\t<polygon points="84.76 8.62 81.45 8.62 81.45 11.93 81.45 15.24 81.45 18.55 84.76 18.55 88.07 18.55 91.38 18.55 91.38 15.24 91.38 11.93 91.38 8.62 88.07 8.62 84.76 8.62" stroke-width="0"/>\n\t\t\t\t\t<polygon points="15.24 18.55 18.55 18.55 18.55 15.24
118.55 11.93 18.55 8.62 15.24 8.62 11.93 8.62 8.62 8.62 8.62 11.93 8.62 15.24 8.62 18.55 11.93 18.55 15.24 18.55" stroke-width="0"/>\n\t\t\t\t\t<polygon points="35.1 18.55 35.1 15.24 38.41 15.24 38.41 11.93 41.72 11.93 41.72 8.62 41.72 5.31 38.41 5.31 38.41 8.62 35.1 8.62 31.79 8.62 31.79 5.31 35.1 5.31 38.41 5.31 38.41 2 35.1 2 31.79 2 28.48 2 28.48 5.31 28.48 8.62 28.48 11.93 31.79 11.93 31.79 15.24 28.48 15.24 28.48 18.55 31.79 18.55 31.79 21.86 35.1 21.86 35.1 18.55" stroke-width="0"/>\n\t\t\t\t\t<path d="m8.62,25.17h16.55V2H2v23.17h6.62Zm-3.31-6.62V5.31h16.55v16.55H5.31v-3.31Z" stroke-width="0"/>\n\t\t\t\t\t<rect x="28.48" y="21.86" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="68.21 25.17 64.9 25.17 64.9 28.48 68.21 28.48 68.21 31.79 71.52 31.79 71.52 35.1 71.52 38.41 71.52 41.72 74.83 41.72 74.83 38.41 74.83 35.1 74.83 31.79 74.83 28.48 71.52 28.48 71.52 25.17 71.52 21.86 71.52 18.55 68.21 18.55 68.21 21.86 68.21 25.17" stroke-width="0"/>\n\t\t\t\t\t<path d="m38.41,28.48v3.31h9.93v9.93h-3.31v3.31h6.62v-3.31h3.31v-3.31h3.31v-3.31h-3.31v-6.62h3.31v-6.62h3.31v3.31h3.31v-6.62h3.31v-3.31h-6.62v-3.31h-3.31v-3.31h13.24v-3.31h-6.62v-3.31h-3.31v3.31h-6.62v3.31h-3.31v3.31h3.31v13.24h-3.31v-13.24h-3.31v3.31h-3.31v-3.31h-3.31v13.24h-3.31v-3.31h-3.31v3.31h-3.31v3.31h6.62Zm6.62-6.62h3.31v6.62h-3.31v-6.62Z" stroke-width="0"/>\n\t\t\t\t\t<rect x="2" y="28.48" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="91.38 28.48 88.07 28.48 88.07 31.79 88.07 35.1 88.07 38.41 91.38 38.41 91.38 35.1 94.69 35.1 94.69 31.79 98 31.79 98 28.48 94.69 28.48 91.38 28.48" stroke-width="0"/>\n\t\t\t\t\t<polygon points="64.9 35.1 68.21 35.1 68.21 31.79 64.9 31.79 61.59 31.79 61.59 28.48 58.28 28.48 58.28 31.79 58.28 35.1 61.59 35.1 64.9 35.1" stroke-width="0"/>\n\t\t\t\t\t<polygon points="25.17 35.1 21.86 35.1 21.86 38.41 25.17 38.41 28.48 38.41 28.48 35.1 25.17 35.1" stroke-width="0"/>\n\t\t\t\t\t<polygon points="81.45 35.1 84.76 35.1 84.76 31.79 84.76 28.48 81.45 28.48 81.45 31.79 78.14 31.79 78.14 35.1 78.14 38.41 81.45 38.41 81.45 35.1" stroke-width="0"/>\n\t\t\t\t\t<rect x="84.76" y="38.41" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="94.69 41.72 94.69 45.03 91.38 45.03 88.07 45.03 84.76 45.03 81.45 45.03 81.45 48.34 84.76 48.34 88.07 48.34 88.07 51.66 88.07 54.97 91.38 54.97 91.38 51.66 91.38 48.34 94.69 48.34 94.69 51.66 94.69 54.97 98 54.97 98 51.66 98 48.34 98 45.03 98 41.72 98 38.41 94.69 38.41 94.69 41.72" stroke-width="0"/>\n\t\t\t\t\t<polygon points="8.62 45.03 8.62 41.72 11.93 41.72 15.24 41.72 15.24 38.41 18.55 38.41 18.55 35.1 21.86 35.1 21.86 31.79 25.17 31.79 28.48 31.79 31.79 31.79 31.79 28.48 28.48 28.48 25.17 28.48 21.86 28.48 18.55 28.48 15.24 28.48 11.93 28.48 11.93 31.79 8.62 31.79 5.31 31.79 5.31 35.1 5.31 38.41 2 38.41 2 41.72 2 45.03 2 48.34 5.31 48.34 5.31 45.03 8.62 45.03" stroke-width="0"/>\n\t\t\t\t\t<polygon points="41.72 41.72 41.72 38.41 45.03 38.41 45.03 35.1 41.72 35.1 38.41 35.1 35.1 35.1 35.1 31.79 31.79 31.79 31.79 35.1 31.79 38.41 28.48 38.41 28.48 41.72 25.17 41.72 21.86 41.72 18.55 41.72 18.55 45.03 21.86 45.03 25.17 45.03 25.17 48.34 28.48 48.34 28.48 51.66 31.79 51.66 31.79 48.34 31.79 45.03 31.79 41.72 35.1 41.72 35.1 38.41 38.41 38.41 38.41 41.72 38.41 45.03 35.1 45.03 35.1 48.34 38.41 48.34 41.72 48.34 41.72 45.03 41.72 41.72" stroke-width="0"/>\n\t\t\t\t\t<rect x="68.21" y="41.72" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="71.52 45.03 71.52 48.34 74.83 48.34 74.83 51.66 78.14 51.66 78.14 54.97 81.45 54.97 84.76 54.97 84.76 51.66 81.45 51.66 81.45 48.34 78.14 48.34 78.14 45.03 81.45 45.03 81.45 41.72 78.14 41.72 74.83 41.72 74.83 45.03 71.52 45.03" stroke-width="0"/>\n\t\t\t\t\t<polygon points="18.55 48.34 18.55 51.66 15.24 51.66 15.24 48.34 15.24 45.03 11.93 45.03 8.62 45.03 8.62 48.34 11.93 48.34 11.93 51.66 11.93 54.97 11.93 58.28 15.24 58.28 18.55 58.28 18.55 54.97 21.86 54.97 21.86 51.66 25.17 51.66 25.17 48.34 21.86 48.34 18.55 48.34" stroke-width="0"/>\n\t\t\t\t\t<rect x="41.72" y="48.34" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="25.17 54.97 21.86 54.97 21.86 58.28 25.17 58.28 28.48 58.28 28.48 54.97 28.48 51.
166 25.17 51.66 25.17 54.97" stroke-width="0"/>\n\t\t\t\t\t<polygon points="51.66 54.97 54.97 54.97 58.28 54.97 58.28 51.66 54.97 51.66 54.97 48.34 58.28 48.34 58.28 51.66 61.59 51.66 61.59 48.34 64.9 48.34 64.9 45.03 64.9 41.72 68.21 41.72 68.21 38.41 64.9 38.41 61.59 38.41 58.28 38.41 58.28 41.72 61.59 41.72 61.59 45.03 58.28 45.03 58.28 41.72 54.97 41.72 54.97 45.03 51.66 45.03 51.66 48.34 48.34 48.34 48.34 51.66 45.03 51.66 45.03 54.97 48.34 54.97 51.66 54.97" stroke-width="0"/>\n\t\t\t\t\t<rect x="61.59" y="51.66" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="8.62 54.97 8.62 51.66 8.62 48.34 5.31 48.34 5.31 51.66 2 51.66 2 54.97 5.31 54.97 5.31 58.28 8.62 58.28 8.62 54.97" stroke-width="0"/>\n\t\t\t\t\t<polygon points="31.79 58.28 35.1 58.28 35.1 54.97 35.1 51.66 31.79 51.66 31.79 54.97 31.79 58.28" stroke-width="0"/>\n\t\t\t\t\t<rect x="84.76" y="54.97" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<rect x="18.55" y="58.28" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<rect x="28.48" y="58.28" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="45.03 58.28 45.03 54.97 41.72 54.97 41.72 51.66 38.41 51.66 38.41 54.97 38.41 58.28 41.72 58.28 41.72 61.59 45.03 61.59 45.03 58.28" stroke-width="0"/>\n\t\t\t\t\t<rect x="58.28" y="58.28" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="71.52 61.59 71.52 58.28 71.52 54.97 71.52 51.66 71.52 48.34 68.21 48.34 64.9 48.34 64.9 51.66 68.21 51.66 68.21 54.97 68.21 58.28 64.9 58.28 64.9 61.59 61.59 61.59 61.59 64.9 64.9 64.9 68.21 64.9 68.21 61.59 71.52 61.59" stroke-width="0"/>\n\t\t\t\t\t<rect x="81.45" y="58.28" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="91.38 61.59 94.69 61.59 94.69 58.28 91.38 58.28 88.07 58.28 88.07 61.59 91.38 61.59" stroke-width="0"/>\n\t\t\t\t\t<polygon points="21.86 61.59 21.86 64.9 25.17 64.9 28.48 64.9 28.48 61.59 25.17 61.59 21.86 61.59" stroke-width="0"/>\n\t\t\t\t\t<rect x="74.83" y="61.59" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<path d="m84.76,64.9h-6.62v3.31h-3.31v-3.31h-6.62v9.93h-3.31v6.62h-3.31v3.31h-13.24v3.31h-3.31v3.31h3.31v3.31h-3.31v-3.31h-3.31v-13.24h3.31v6.62h3.31v-19.86h3.31v13.24h3.31v3.31h6.62v-6.62h-6.62v-9.93h3.31v-3.31h-3.31v-3.31h-3.31v3.31h-6.62v3.31h-3.31v3.31h3.31v6.62h-9.93v3.31h3.31v3.31h-3.31v3.31h3.31v3.31h-3.31v6.62h3.31v3.31h13.24v-3.31h6.62v-3.31h-3.31v-3.31h3.31v3.31h3.31v-3.31h3.31v-3.31h6.62v9.93h-3.31v-6.62h-3.31v9.93h13.24v-3.31h-3.31v-9.93h3.31v9.93h3.31v-3.31h3.31v-3.31h-3.31v-3.31h6.62v-3.31h-3.31v-3.31h3.31v-6.62h6.62v-3.31h-3.31v-3.31h-3.31v-3.31h-3.31v3.31Zm-3.31,16.55h-9.93v-9.93h9.93v9.93Z" stroke-width="0"/>\n\t\t\t\t\t<rect x="94.69" y="61.59" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="15.24 64.9 15.24 61.59 11.93 61.59 8.62 61.59 5.31 61.59 5.31 58.28 2 58.28 2 61.59 2 64.9 2 68.21 2 71.52 5.31 71.52 8.62 71.52 11.93 71.52 15.24 71.52 18.55 71.52 21.86 71.52 25.17 71.52 25.17 68.21 21.86 68.21 21.86 64.9 18.55 64.9 15.24 64.9" stroke-width="0"/>\n\t\t\t\t\t<polygon points="38.41 64.9 41.72 64.9 41.72 61.59 38.41 61.59 35.1 61.59 35.1 64.9 35.1 68.21 35.1 71.52 38.41 71.52 41.72 71.52 41.72 68.21 38.41 68.21 38.41 64.9" stroke-width="0"/>\n\t\t\t\t\t<rect x="58.28" y="68.21" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<rect x="61.59" y="71.52" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<path d="m18.55,74.83H2v23.17h23.17v-23.17h-6.62Zm3.31,6.62v13.24H5.31v-16.55h16.55v3.31Z" stroke-width="0"/>\n\t\t\t\t\t<rect x="74.83" y="74.83" width="3.31" height="3.31" stroke-width="0"/>\n\t\t\t\t\t<polygon points="31.79 78.14 31.79 74.83 31.79 71.52 31.79 68.21 28.48 68.21 28.48 71.52 28.48 74.83 28.48 78.14 28.48 81.45 28.48 84.76 28.48 88.07 31.79 88.07 31.79 84.76 31.79 81.45 35.1 81.45 35.1 78.14 31.79 78.14" stroke-width="0"/>\n\t\t\t\t\t<polygon points="11.93 81.45 8.62 81.45 8.62 84.76 8.62 88.07 8.62 91.38 11.93 91.38 15.24 91.38 18.55 91.38 18.55 88.07 18.55 84.76 18.55 81.45 15.24 81.45 11.93 81.45" stroke-width="0"/>\n\t\t\t\t\t<polygon points="28.48 94.69 28.48 98 31.79 98 35.1 98 35.1 94.69 31.79 94.69 28.48 94.69" stroke-width="0"/>\n\t\t\t\t\t<polygon points="81.45 94.69 81.45 98 84.76 98 88.07 98 88.07 94.69 91.38 94.69 91.38 91.38 94.69 91.38 94.69 94.69 98 94.69 98 91.38 98 88.07 98 84.76 98 81.45 98 78.14 94.69 78.14 91.38 78.14 91.38 81.45 94.69 81.45 94.69 84.76 94.69 88.07 91.38 88.07 88.07 88.07 88.07 91.38 84.76 91.38 84.76 94.69 81.45 94.69" stroke-width="0"/>\n\t\t\t\t\t</svg>\n\t\t\t\t</div>':""}\n\t\t`)}}window.customElements.define("svk-block-church-election-countdown",i)}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.