1
0
web/static/svg/index.js
2024-04-05 17:09:39 +09:00

11 lines
4.0 KiB
JavaScript

const v=function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const a of document.querySelectorAll('link[rel="modulepreload"]'))s(a);new MutationObserver(a=>{for(const e of a)if(e.type==="childList")for(const i of e.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&s(i)}).observe(document,{childList:!0,subtree:!0});function n(a){const e={};return a.integrity&&(e.integrity=a.integrity),a.referrerpolicy&&(e.referrerPolicy=a.referrerpolicy),a.crossorigin==="use-credentials"?e.credentials="include":a.crossorigin==="anonymous"?e.credentials="omit":e.credentials="same-origin",e}function s(a){if(a.ep)return;a.ep=!0;const e=n(a);fetch(a.href,e)}};v();const S=(r,t)=>{t.forEach(n=>r.appendChild(n))},x=r=>{r.forEach(t=>{var n;return(n=t.parentNode)==null?void 0:n.removeChild(t)})},y=(r,t="div",n="")=>Array(r).fill(0).map(()=>{const s=document.createElement(t);return s.className=n,s}),$="ai-star-stage",u=document.querySelector(`#${$}`),E=document.querySelector(`#${$} .center`),g=document.querySelector(`#${$} .star`),X=async()=>{await g.animate([{transform:"scale(1)"},{transform:"scale(0.6)"}],{duration:150}).finished,g.animate([{transform:"scale(0.6)"},{transform:"scale(1)"}],{duration:500,easing:"ease-out"})},A=async()=>{await X();const r=7,t=y(r,"div","dot"),n=y(r,"div","wrapper");n.forEach((e,i)=>e.appendChild(t[i])),S(E,n);const s=n.map((e,i)=>{const o=360/r*i,l=80,c=2+Math.random()*4,d=Math.random()*600;return e.animate([{transform:`
rotate(${o}deg)
translateX(0px)
scaleX(1)`,opacity:1,easing:"ease-out"},{transform:`
rotate(${o}deg)
translateX(${l*.9}px)
scaleX(${c})`,opacity:1,offset:.3,easing:"ease-in"},{transform:`
rotate(${o}deg)
translateX(${l}px)
scaleX(1)`,opacity:1}],{duration:500,delay:d,fill:"forwards"})});await Promise.all(s.map(e=>e.finished));const a=t.map(e=>e.animate([{transform:"scale(1)",easing:"ease-out"},{transform:"translateX(-20px) scale(1)",offset:.8},{transform:"translateX(30px) scale(0)"}],{duration:500}));g.animate([{transform:"scale(1)"},{transform:"scale(0.6)",offset:.7},{transform:"scale(1)"}],{duration:500,easing:"ease-out"}),await Promise.all(a.map(e=>e.finished)),x(n)};u==null||u.addEventListener("mouseenter",A);const b="ai-star-stage2",p=document.querySelector(`#${b}`),C=document.querySelector(`#${b} .center`),w=document.querySelector(`#${b} .star`),q=()=>{const r=["gold","#f7e486","#fff9d9","#ff792b"],t=[.6,.8,.9,1],n=Math.random(),s=t.findIndex(a=>a>n);return r[s]},h=(r,t)=>{const n=[...r].map(s=>({order:Math.random(),item:s})).sort((s,a)=>s.order-a.order).map(s=>s.item);return n.length=t,n},L=async()=>{await w.animate([{transform:"scale(1)"},{transform:"scale(0.6)"}],{duration:150}).finished,w.animate([{transform:"scale(0.6)"},{transform:"scale(1.4)",offset:.3},{transform:"scale(1)"}],{duration:700,easing:"ease-out"})},N=async()=>{await L();const r=20,t=y(r,"div","dot");S(C,t);const n=h(t,Math.round(r*.2)),s=h(t,Math.round(r*.2)),a=h(t,Math.round(r*.3)),e=t.map((o,l)=>{const c=360/r*l,d=(Math.random()*Math.random())**1.5*(Math.random()<.5?-1:1),m=100+d*50,f=n.includes(o)?1+Math.random()*2:.5+Math.random(),M=q();return s.includes(o)?(o.style.border=`1px solid ${M}`,o.style.background="transparent"):o.style.background=M,o.animate([{transform:`rotate(${c}deg) translateX(0px) scale(${f})`,opacity:1},{transform:`rotate(${c}deg) translateX(${m*1.3}px) scale(${f*1.2})`,opacity:1,offset:.7,easing:"cubic-bezier(.12,.73,.42,1)"},{transform:`rotate(${c}deg) translateX(${m}px) scale(${f})`,opacity:1}],{duration:m*3,delay:200*Math.random(),fill:"forwards"})});await Promise.all(e.map(o=>o.finished)),e.forEach(o=>o.commitStyles());const i=t.map((o,l)=>{const c=a.includes(o);return e[l].commitStyles(),o.animate([{opacity:1,filter:"brightness(1)"},{opacity:0,filter:"brightness(3)"}],{duration:c?500+Math.random()*500:200,delay:Math.random()*300,fill:"both"})});await Promise.all(i.map(o=>o.finished))};p==null||p.addEventListener("mouseenter",N);