a_sparkles.iife.js

var b=Object.defineProperty;var w=(i,a,d)=>a in i?b(i,a,{enumerable:!0,configurable:!0,writable:!0,value:d}):i[a]=d;var o=(i,a,d)=>(w(i,typeof a!="symbol"?a+"":a,d),d);(function(){"use strict";const i=(r,n)=>Math.floor(Math.random()*(n-r))+r;function a(r,n=void 0,e=1){const t=[];typeof n>"u"&&(n=r,r=0);for(let s=r;s<n;s+=e)t.push(s);return t}function d(){return!!(typeof window<"u"&&window.document&&window.document.createElement)}const _=r=>window.matchMedia(r).matches,c=(r,n={timeId:null},e,t)=>{if(typeof e=="number"&&typeof t=="number"){const s=()=>{const h=i(e,t);n.timeId=window.setTimeout(()=>{r(),s()},h)};s()}else window.clearTimeout(n.timeId)},g=".sparkles-box{position:relative;display:inline-block;box-sizing:border-box;cursor:pointer}.single-sparkle-box{position:absolute;transform:translate3d(-50%,-50%,0);color:orange;pointer-events:none}.slot{position:relative;z-index:5}@media (prefers-reduced-motion: no-preference){.single-sparkle-box{animation:comeInout .6s ease-in-out forwards}.single-sparkle-box svg{animation:spin .6s ease-in-out forwards}}@keyframes comeInout{0%{transform:scale(0)}50%{transform:scale(1)}to{transform:scale(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(180deg)}}",u=(r=!1,n=[],e="text",t,s)=>({id:String(i(1e4,99999)),createdAt:Date.now(),size:i(10,17),style:{color:n.length?n[i(0,n.length)]:void 0,top:`${i(s[0],s[1])}%`,left:`${i(t[0],t[1])}%`,zIndex:(e==="text"?r?1:i(1,8):6).toString()}}),p="(prefers-reduced-motion: no-preference)";class y extends HTMLElement{constructor(){super();o(this,"_mediaQueryList",window.matchMedia(p));o(this,"_preferredReducedMotion",!_(p));o(this,"_sparklesBox");o(this,"_sparkles",[]);o(this,"_timeId",{timeId:null});o(this,"_shadow");o(this,"_randomColors");o(this,"_minDelay",300);o(this,"_maxDelay",800);o(this,"_leftOffsetRange",[-15,60]);o(this,"_topOffsetRange",[0,85]);o(this,"_slotType","text");this._shadow=this.attachShadow({mode:"closed"});const e=document.createElement("style");e.textContent=g,this._shadow.appendChild(e),this._sparklesBox=document.createElement("div"),this._sparklesBox.className="sparkles-box";const t=document.createElement("slot");t.setAttribute("class","slot"),this._sparklesBox.appendChild(t),this._shadow.appendChild(this._sparklesBox),this._randomColors=this.getAttribute("colors")?this.getAttribute("colors").split(",").map(l=>l.trim()):void 0;const s=this.getAttribute("left-offset-range")?this.getAttribute("left-offset-range").split(",").map(l=>Number(l.trim())):[-15,60];this._leftOffsetRange=s.length===2?s:[-10,60];const h=this.getAttribute("top-offset-range")?this.getAttribute("top-offset-range").split(",").map(l=>Number(l.trim())):[-15,60];if(this._topOffsetRange=h.length===2?h:[0,85],this._minDelay=this.getAttribute("min-delay")?Number(this.getAttribute("min-delay")):300,this._maxDelay=this.getAttribute("max-delay")?Number(this.getAttribute("max-delay"))<500?500:Number(this.getAttribute("max-delay")):800,this._slotType=this.getAttribute("slot-type")?this.getAttribute("slot-type"):"text",this._preferredReducedMotion){const l=this.getAttribute("init-num"),m=document.createDocumentFragment();this._sparkles=a(i(0,Number(l))).map(()=>u(this._preferredReducedMotion,this._randomColors)),this._sparkles.forEach(f=>{this.generateSparkle(f),m.appendChild(this.generateSparkle(f))}),this._sparklesBox.appendChild(m)}this.reCreate=this.reCreate.bind(this),this.mediaListener=this.mediaListener.bind(this)}generateSparkle(e){const t=document.createElement("span");return t.className="single-sparkle-box",t.innerHTML=`<svg xmlns="http://www.w3.org/2000/svg" width="${e.size}" height="${e.size}" viewBox="0 0 160 160" fill="none"><path fill="currentColor" d="M80 0s4.285 41.292 21.496 58.504C118.707 75.715 160 80 160 80s-41.293 4.285-58.504 21.496S80 160 80 160s-4.285-41.293-21.496-58.504C41.292 84.285 0 80 0 80s41.292-4.285 58.504-21.496C75.715 41.292 80 0 80 0z"></path></svg>`,t.style.color=e.style.color,t.style.top=e.style.top,t.style.left=e.style.left,t.style.zIndex=e.style.zIndex,t.id=e.id,t}mediaListener(e){if(e&&(this._preferredReducedMotion=!e.matches,this._preferredReducedMotion))return c(this.reCreate,this._timeId,null,null);this._preferredReducedMotion||c(this.reCreate,this._timeId,this._minDelay,this._maxDelay)}reCreate(){const e=u(!1,this._randomColors,this._slotType,this._leftOffsetRange,this._topOffsetRange),t=Date.now(),s=this._sparkles.filter(h=>{if(t-h.createdAt<this._maxDelay+150)return!0;{const m=this._shadow.getElementById(h.id);return m&&this._sparklesBox.removeChild(m),!1}});this._sparklesBox.appendChild(this.generateSparkle(e)),s.push(e),this._sparkles=[...s]}connectedCallback(){this.mediaListener(),this._mediaQueryList.addEventListener?this._mediaQueryList.addEventListener("change",this.mediaListener):this._mediaQueryList.addListener(this.mediaListener)}disconnectCallback(){if(this._mediaQueryList.removeEventListener?this._mediaQueryList.removeEventListener("change",this.mediaListener):this._mediaQueryList.removeListener(this.mediaListener),typeof this._timeId=="number")return window.clearTimeout(this._timeId)}}if(d())customElements.define("a-sparkles",y);else throw new Error("仅在浏览器中可用")})();