@tsparticles/confetti
Version:
tsParticles confetti bundle — easily create confetti, confetti cannon, confetti explosions, confetti falling, and confetti parade animations with presets. Ready to use components available for React, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact,
2 lines (1 loc) • 9.2 kB
JavaScript
!function(t){t.__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.bundles=t.__tsParticlesInternals.bundles||{},t.__tsParticlesInternals.effects=t.__tsParticlesInternals.effects||{},t.__tsParticlesInternals.engine=t.__tsParticlesInternals.engine||{},t.__tsParticlesInternals.interactions=t.__tsParticlesInternals.interactions||{},t.__tsParticlesInternals.palettes=t.__tsParticlesInternals.palettes||{},t.__tsParticlesInternals.paths=t.__tsParticlesInternals.paths||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins=t.__tsParticlesInternals.plugins||{},t.__tsParticlesInternals.plugins.emittersShapes=t.__tsParticlesInternals.plugins.emittersShapes||{},t.__tsParticlesInternals.presets=t.__tsParticlesInternals.presets||{},t.__tsParticlesInternals.shapes=t.__tsParticlesInternals.shapes||{},t.__tsParticlesInternals.updaters=t.__tsParticlesInternals.updaters||{},t.__tsParticlesInternals.utils=t.__tsParticlesInternals.utils||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas=t.__tsParticlesInternals.canvas||{},t.__tsParticlesInternals.canvas.utils=t.__tsParticlesInternals.canvas.utils||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path=t.__tsParticlesInternals.path||{},t.__tsParticlesInternals.path.utils=t.__tsParticlesInternals.path.utils||{};var s="undefined"!=typeof Proxy?function(t){return new Proxy(t,{get:function(t,s){return s in t||(t[s]={}),t[s]}})}:function(t){return t};t.__tsParticlesInternals.bundles=s(t.__tsParticlesInternals.bundles),t.__tsParticlesInternals.effects=s(t.__tsParticlesInternals.effects),t.__tsParticlesInternals.interactions=s(t.__tsParticlesInternals.interactions),t.__tsParticlesInternals.palettes=s(t.__tsParticlesInternals.palettes),t.__tsParticlesInternals.paths=s(t.__tsParticlesInternals.paths),t.__tsParticlesInternals.plugins=s(t.__tsParticlesInternals.plugins),t.__tsParticlesInternals.plugins.emittersShapes=s(t.__tsParticlesInternals.plugins.emittersShapes),t.__tsParticlesInternals.presets=s(t.__tsParticlesInternals.presets),t.__tsParticlesInternals.shapes=s(t.__tsParticlesInternals.shapes),t.__tsParticlesInternals.updaters=s(t.__tsParticlesInternals.updaters),t.__tsParticlesInternals.utils=s(t.__tsParticlesInternals.utils),t.__tsParticlesInternals.canvas=s(t.__tsParticlesInternals.canvas),t.__tsParticlesInternals.path=s(t.__tsParticlesInternals.path)}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:this),function(t){t.__tsParticlesInternals=t.__tsParticlesInternals||{},t.__tsParticlesInternals.bundles=t.__tsParticlesInternals.bundles||{},function(t,s,e,a,n,i,l,r,o,c,d,_,p,u,P,h,f){"use strict";class I{angle;colors;count;decay;disableForReducedMotion;drift;flat;gravity;position;scalar;shapeOptions;shapes;spread;startVelocity;ticks;zIndex;constructor(){this.angle=90,this.count=50,this.spread=45,this.startVelocity=45,this.decay=.9,this.gravity=1,this.drift=0,this.ticks=200,this.position={x:50,y:50},this.colors=["#26ccff","#a25afd","#ff5e7e","#88ff5a","#fcff42","#ffa62d","#ff36ff"],this.shapes=["square","circle"],this.scalar=1,this.zIndex=100,this.disableForReducedMotion=!0,this.flat=!1,this.shapeOptions={}}get origin(){return{x:this.position.x/s.percentDenominator,y:this.position.y/s.percentDenominator}}set origin(t){this.position.x=t.x*s.percentDenominator,this.position.y=t.y*s.percentDenominator}get particleCount(){return this.count}set particleCount(t){this.count=t}load(t){if(s.isNull(t))return;s.loadProperty(this,"angle",t.angle);const e=t.count??t.particleCount;void 0!==e&&(this.count=e),s.loadProperty(this,"spread",t.spread),s.loadProperty(this,"startVelocity",t.startVelocity),s.loadProperty(this,"decay",t.decay),s.loadProperty(this,"flat",t.flat),s.loadProperty(this,"gravity",t.gravity),s.loadProperty(this,"drift",t.drift),s.loadProperty(this,"ticks",t.ticks);const a=t.origin;a&&!t.position&&(t.position={x:void 0===a.x?void 0:a.x*s.percentDenominator,y:void 0===a.y?void 0:a.y*s.percentDenominator});const n=t.position;n&&(void 0!==n.x&&(this.position.x=n.x),void 0!==n.y&&(this.position.y=n.y)),void 0!==t.colors&&(s.isArray(t.colors)?this.colors=[...t.colors]:this.colors=t.colors);const i=t.shapeOptions;if(void 0!==i)for(const t in i){const e=i[t];e&&(this.shapeOptions[t]=s.deepExtend(this.shapeOptions[t]??{},e))}void 0!==t.shapes&&(s.isArray(t.shapes)?this.shapes=[...t.shapes]:this.shapes=t.shapes),s.loadProperty(this,"scalar",t.scalar),s.loadProperty(this,"zIndex",t.zIndex),s.loadProperty(this,"disableForReducedMotion",t.disableForReducedMotion)}}const y=new Map;async function m(t,e){const a=new I;a.load(e.options);const n=Number.isFinite(a.ticks)&&a.ticks>0?a.ticks:void 0,i=void 0===n?0:120*s.percentDenominator/(s.defaultFps*n);let l=y.get(e.id);l instanceof Promise&&(await l,l=y.get(e.id));const r=l;if(r&&!r.destroyed){const t=r;if("addEmitter"in t)return await async function(t,s,e){await(t.addEmitter?.({startCount:s.count,position:s.position,size:{width:0,height:0},rate:{delay:0,quantity:0},life:{duration:.1,count:1},particles:{paint:{fill:{color:{value:s.colors},enable:!0}},shape:{type:s.shapes,options:s.shapeOptions},life:{count:1},opacity:{value:{min:0,max:1},animation:{enable:!0,sync:!0,speed:e,startValue:"max",destroy:"min",count:1}},size:{value:5*s.scalar},move:{angle:{value:s.spread,offset:0},drift:{min:-s.drift,max:s.drift},gravity:{acceleration:9.81*s.gravity},speed:3*s.startVelocity,decay:1-s.decay,direction:-s.angle},rotate:{value:s.flat?0:{min:0,max:360},direction:"random",animation:{enable:!s.flat,speed:60}},tilt:{direction:"random",enable:!s.flat,value:s.flat?0:{min:0,max:360},animation:{enable:!0,speed:60}},roll:{darken:{enable:!0,value:25},enable:!s.flat,speed:{min:15,max:25}},wobble:{distance:30,enable:!s.flat,speed:{min:-15,max:15}}}}))}(t,a,i),r}const o=(async()=>{const s=function(t,s,e){return{fullScreen:{enable:!s.canvas,zIndex:t.zIndex},fpsLimit:120,particles:{number:{value:0},paint:{fill:{color:{value:t.colors},enable:!0}},shape:{type:t.shapes,options:t.shapeOptions},opacity:{value:{min:0,max:1},animation:{enable:!0,sync:!0,speed:e,startValue:"max",destroy:"min",count:1}},size:{value:5*t.scalar},links:{enable:!1},life:{count:1},move:{angle:{value:t.spread,offset:0},drift:{min:-t.drift,max:t.drift},enable:!0,gravity:{enable:!0,acceleration:9.81*t.gravity},speed:3*t.startVelocity,decay:1-t.decay,direction:-t.angle,random:!0,straight:!1,outModes:{top:"none",default:"destroy"}},rotate:{value:t.flat?0:{min:0,max:360},direction:"random",animation:{enable:!t.flat,speed:60}},tilt:{direction:"random",enable:!t.flat,value:t.flat?0:{min:0,max:360},animation:{enable:!0,speed:60}},roll:{darken:{enable:!0,value:25},enable:!t.flat,speed:{min:15,max:25}},wobble:{distance:30,enable:!t.flat,speed:{min:-15,max:15}}},motion:{disable:t.disableForReducedMotion},emitters:{name:"confetti",startCount:t.count,position:t.position,size:{width:0,height:0},rate:{delay:0,quantity:0},life:{duration:.1,count:1}}}}(a,e,i),n=await t.load({id:e.id,element:e.canvas,options:s});return y.set(e.id,n),n})();return y.set(e.id,o),o}let g=null;async function b(t){return g||(g=async function(t){t.checkVersion("4.5.0"),await t.pluginManager.register(async t=>{await Promise.all([e.loadBasic(t),c.loadMotionPlugin(t),n.loadEmittersPluginSimple(t),a.loadCardSuitsShape(t),l.loadHeartShape(t),r.loadImageShape(t),d.loadPolygonShape(t),u.loadSquareShape(t),P.loadStarShape(t),i.loadEmojiShape(t),p.loadRotateUpdater(t),o.loadLifeUpdater(t),_.loadRollUpdater(t),h.loadTiltUpdater(t),f.loadWobbleUpdater(t)])})}(t),g)}async function v(t,e){let a,n;return await b(s.tsParticles),s.isString(t)?(n=t,a=e??{}):(n="confetti",a=t),m(s.tsParticles,{id:n,options:a})}v.create=async(t,e={})=>{await b(s.tsParticles);const a=t?.getAttribute("id")??"confetti";return t?.setAttribute("id",a),await m(s.tsParticles,{id:a,canvas:t??void 0,options:e}),async(n,i)=>{let l,r;return s.isString(n)?(r=n,l=i??e):(r=a,l=n),m(s.tsParticles,{id:r,canvas:t??void 0,options:l})}},v.init=async()=>{await b(s.tsParticles)},v.version="4.5.0",globalThis.confetti=v;const x=globalThis;x.__tsParticlesInternals=x.__tsParticlesInternals??{},x.confetti=v,t.confetti=v}(t.__tsParticlesInternals.bundles.confetti=t.__tsParticlesInternals.bundles.confetti||{},t.__tsParticlesInternals.engine,t.__tsParticlesInternals.bundles.basic,t.__tsParticlesInternals.shapes.cards/suits,t.__tsParticlesInternals.plugins.emitters/plugin,t.__tsParticlesInternals.shapes.emoji,t.__tsParticlesInternals.shapes.heart,t.__tsParticlesInternals.shapes.image,t.__tsParticlesInternals.updaters.life,t.__tsParticlesInternals.plugins.motion,t.__tsParticlesInternals.shapes.polygon,t.__tsParticlesInternals.updaters.roll,t.__tsParticlesInternals.updaters.rotate,t.__tsParticlesInternals.shapes.square,t.__tsParticlesInternals.shapes.star,t.__tsParticlesInternals.updaters.tilt,t.__tsParticlesInternals.updaters.wobble)}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:self),Object.assign(globalThis.window||globalThis,{confetti:(globalThis.__tsParticlesInternals.bundles.confetti||{}).confetti});