https://www.smint.nl/_next/static/chunks/3002.361a01692e6187cf.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3002],{19865:e=>{e.exports={root:"styles_root__dcxAa"}},69798:e=>{e.exports={canvas:"styles_canvas__L3dI9"}},93002:(e,t,n)=>{"use strict";n.r(t),n.d(t,{default:()=>h});var r=n(95155),u=n(12115),l=n(69798),a=n.n(l);function s({src:e,manifestUrl:t,fps:n,loop:l=!0,className:i}){let o=(0,u.useRef)(null),c=(0,u.useRef)(null),[f,h]=(0,u.useState)(null),[d,m]=(0,u.useState)(null),p=function(){let[e,t]=(0,u.useState)(()=>window.matchMedia("(prefers-reduced-motion: reduce)").matches);return(0,u.useEffect)(()=>{let e=window.matchMedia("(prefers-reduced-motion: reduce)"),n=e=>{t(e.matches)};return e.addEventListener("change",n),()=>{e.removeEventListener("change",n)}},[]),e}();return(0,u.useEffect)(()=>{let e=!1;return fetch(t).then(async e=>{if(!e.ok)throw Error(`Manifest request failed: ${e.status}`);return e.json()}).then(t=>{!e&&function(e){if("object"!=typeof e||null===e||"object"!=typeof e.meta||null===e.meta)return!1;let t=e.meta;return"number"==typeof t.frameWidth&&"number"==typeof t.frameHeight&&"number"==typeof t.fps&&!!Array.isArray(e.frames)&&0!==e.frames.length&&e.frames.every(e=>"number"==typeof e?.x&&"number"==typeof e?.y&&"number"==typeof e?.w&&"number"==typeof e?.h)}(t)&&h(t)}).catch(()=>{}),()=>{e=!0}},[t]),(0,u.useEffect)(()=>{if(null===f)return;let t=!1,n=new Image;return n.onload=()=>{t||m(n)},n.src=e,()=>{t=!0}},[e,f]),(0,u.useEffect)(()=>{let e=o.current;if(null===e||null===f)return;let{frameWidth:t,frameHeight:n}=f.meta,r=()=>{let r=window.devicePixelRatio??1,u=e.parentElement;if(null===u)return;let{width:l,height:a}=u.getBoundingClientRect(),s=t/n,i=l,o=l/s;o>a&&a>0&&(o=a,i=a*s),e.width=Math.round(i*r),e.height=Math.round(o*r),e.style.width=`${Math.round(i)}px`,e.style.height=`${Math.round(o)}px`,c.current?.()};r();let u=new ResizeObserver(r),l=e.parentElement;return null!==l&&u.observe(l),()=>{u.disconnect()}},[f]),(0,u.useEffect)(()=>{let e=o.current;if(null===e||null===f||null===d)return;let t=e.getContext("2d");if(null===t)return;let{frames:r,meta:u}=f,a=n??u.fps;function s(n){if(null===e||null===t)return;let u=r[n];t.clearRect(0,0,e.width,e.height),t.drawImage(d,u.x,u.y,u.w,u.h,0,0,e.width,e.height)}if(p){let e=Math.floor(r.length/2);c.current=()=>{s(e)};let t=setTimeout(()=>{s(e)},0);return()=>{clearTimeout(t),c.current=null}}let i=0,h=0,m=1e3/a,g=0;c.current=()=>{s(i)};let y=e=>{e-h>=m&&(h=e,s(i),i=l?(i+1)%r.length:Math.min(i+1,r.length-1)),g=requestAnimationFrame(y)};return g=requestAnimationFrame(y),()=>{cancelAnimationFrame(g),c.current=null}},[f,d,n,l,p]),(0,r.jsx)("canvas",{ref:o,className:`${a().canvas}${void 0!==i?` ${i}`:""}`,"aria-hidden":"true"})}var i=n(68130),o=n.n(i),c=n(19865),f=n.n(c);function h({options:e}){let t="number"==typeof e?.fps&&e.fps>0?e.fps:void 0;return(0,r.jsx)("div",{className:o().grid,"aria-hidden":"true",children:(0,r.jsx)("div",{className:f().root,children:(0,r.jsx)(s,{src:"/campaigns/chupaMADS/explosion.png",manifestUrl:"/campaigns/chupaMADS/explosion.json",fps:t,loop:!0})})})}}}]);