@tsparticles/shape-emoji
Advanced tools
Comparing version 3.0.0-beta.5 to 3.0.0
@@ -10,3 +10,3 @@ import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, } from "@tsparticles/engine"; | ||
for (const [, emojiData] of this._emojiShapeDict) { | ||
emojiData?.close(); | ||
emojiData instanceof ImageBitmap && emojiData?.close(); | ||
} | ||
@@ -55,12 +55,29 @@ } | ||
} | ||
const canvasSize = getRangeMax(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize); | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
const canvasSize = getRangeMax(particle.size.value) * 2; | ||
let emojiData; | ||
if (typeof OffscreenCanvas !== "undefined") { | ||
const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
emojiData = canvas.transferToImageBitmap(); | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
const emojiData = canvas.transferToImageBitmap(); | ||
else { | ||
const canvas = document.createElement("canvas"); | ||
canvas.width = canvasSize; | ||
canvas.height = canvasSize; | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
emojiData = canvas; | ||
} | ||
this._emojiShapeDict.set(key, emojiData); | ||
@@ -67,0 +84,0 @@ particle.emojiData = emojiData; |
@@ -13,3 +13,3 @@ "use strict"; | ||
for (const [, emojiData] of this._emojiShapeDict) { | ||
emojiData?.close(); | ||
emojiData instanceof ImageBitmap && emojiData?.close(); | ||
} | ||
@@ -58,12 +58,29 @@ } | ||
} | ||
const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize); | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2; | ||
let emojiData; | ||
if (typeof OffscreenCanvas !== "undefined") { | ||
const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
emojiData = canvas.transferToImageBitmap(); | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
const emojiData = canvas.transferToImageBitmap(); | ||
else { | ||
const canvas = document.createElement("canvas"); | ||
canvas.width = canvasSize; | ||
canvas.height = canvasSize; | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
emojiData = canvas; | ||
} | ||
this._emojiShapeDict.set(key, emojiData); | ||
@@ -70,0 +87,0 @@ particle.emojiData = emojiData; |
@@ -10,3 +10,3 @@ import { executeOnSingleOrMultiple, getRangeMax, isInArray, itemFromSingleOrMultiple, loadFont, } from "@tsparticles/engine"; | ||
for (const [, emojiData] of this._emojiShapeDict) { | ||
emojiData?.close(); | ||
emojiData instanceof ImageBitmap && emojiData?.close(); | ||
} | ||
@@ -55,12 +55,29 @@ } | ||
} | ||
const canvasSize = getRangeMax(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize); | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
const canvasSize = getRangeMax(particle.size.value) * 2; | ||
let emojiData; | ||
if (typeof OffscreenCanvas !== "undefined") { | ||
const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
emojiData = canvas.transferToImageBitmap(); | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
const emojiData = canvas.transferToImageBitmap(); | ||
else { | ||
const canvas = document.createElement("canvas"); | ||
canvas.width = canvasSize; | ||
canvas.height = canvasSize; | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value)); | ||
emojiData = canvas; | ||
} | ||
this._emojiShapeDict.set(key, emojiData); | ||
@@ -67,0 +84,0 @@ particle.emojiData = emojiData; |
{ | ||
"name": "@tsparticles/shape-emoji", | ||
"version": "3.0.0-beta.5", | ||
"version": "3.0.0", | ||
"description": "tsParticles emoji shape", | ||
@@ -62,3 +62,3 @@ "homepage": "https://particles.js.org", | ||
"dependencies": { | ||
"@tsparticles/engine": "^3.0.0-beta.5" | ||
"@tsparticles/engine": "^3.0.0" | ||
}, | ||
@@ -65,0 +65,0 @@ "publishConfig": { |
@@ -7,3 +7,3 @@ /*! | ||
* How to use? : Check the GitHub README | ||
* v3.0.0-beta.5 | ||
* v3.0.0 | ||
*/ | ||
@@ -110,3 +110,3 @@ (function webpackUniversalModuleDefinition(root, factory) { | ||
for (const [, emojiData] of this._emojiShapeDict) { | ||
emojiData?.close(); | ||
emojiData instanceof ImageBitmap && emojiData?.close(); | ||
} | ||
@@ -162,13 +162,29 @@ } | ||
} | ||
const canvasSize = (0,engine_root_window_.getRangeMax)(particle.size.value) * 2, | ||
canvas = new OffscreenCanvas(canvasSize, canvasSize); | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
const canvasSize = (0,engine_root_window_.getRangeMax)(particle.size.value) * 2; | ||
let emojiData; | ||
if (typeof OffscreenCanvas !== "undefined") { | ||
const canvas = new OffscreenCanvas(canvasSize, canvasSize), | ||
context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value)); | ||
emojiData = canvas.transferToImageBitmap(); | ||
} else { | ||
const canvas = document.createElement("canvas"); | ||
canvas.width = canvasSize; | ||
canvas.height = canvasSize; | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value)); | ||
emojiData = canvas; | ||
} | ||
context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value)); | ||
const emojiData = canvas.transferToImageBitmap(); | ||
this._emojiShapeDict.set(key, emojiData); | ||
@@ -175,0 +191,0 @@ particle.emojiData = emojiData; |
/*! For license information please see tsparticles.shape.emoji.min.js.LICENSE.txt */ | ||
!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var o="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var a in o)("object"==typeof exports?exports:e)[a]=o[a]}}(this,(e=>(()=>{"use strict";var t={533:t=>{t.exports=e}},o={};function a(e){var i=o[e];if(void 0!==i)return i.exports;var n=o[e]={exports:{}};return t[e](n,n.exports,a),n.exports}a.d=(e,t)=>{for(var o in t)a.o(t,o)&&!a.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{a.r(i),a.d(i,{loadEmojiShape:()=>r});var e=a(533);const t=["emoji"],o='"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"';class n{constructor(){this._emojiShapeDict=new Map}destroy(){for(const[,e]of this._emojiShapeDict)e?.close()}draw(e){const{context:t,particle:o,radius:a,opacity:i}=e,n=o.emojiData;n&&(t.globalAlpha=i,t.drawImage(n,-a,-a,2*a,2*a),t.globalAlpha=1)}async init(a){const i=a.actualOptions;if(t.find((t=>(0,e.isInArray)(t,i.particles.shape.type)))){const a=[(0,e.loadFont)(o)],n=t.map((e=>i.particles.shape.options[e])).find((e=>!!e));n&&(0,e.executeOnSingleOrMultiple)(n,(t=>{t.font&&a.push((0,e.loadFont)(t.font))})),await Promise.all(a)}}particleDestroy(e){delete e.emojiData}particleInit(t,a){if(!a.emojiData){const t=a.shapeData;if(!t?.value)return;const i=(0,e.itemFromSingleOrMultiple)(t.value,a.randomIndexData),n=t.font??o;if(!i)return;const r=`${i}_${n}`,s=this._emojiShapeDict.get(r);if(s)return void(a.emojiData=s);const l=2*(0,e.getRangeMax)(a.size.value),p=new OffscreenCanvas(l,l),c=p.getContext("2d");if(!c)return;c.font=`400 ${2*(0,e.getRangeMax)(a.size.value)}px ${n}`,c.textBaseline="middle",c.textAlign="center",c.fillText(i,(0,e.getRangeMax)(a.size.value),(0,e.getRangeMax)(a.size.value));const f=p.transferToImageBitmap();this._emojiShapeDict.set(r,f),a.emojiData=f}}}async function r(e,o=!0){await e.addShape(t,new n,o)}})(),i})())); | ||
!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var o="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var a in o)("object"==typeof exports?exports:e)[a]=o[a]}}(this,(e=>(()=>{"use strict";var t={533:t=>{t.exports=e}},o={};function a(e){var i=o[e];if(void 0!==i)return i.exports;var n=o[e]={exports:{}};return t[e](n,n.exports,a),n.exports}a.d=(e,t)=>{for(var o in t)a.o(t,o)&&!a.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{a.r(i),a.d(i,{loadEmojiShape:()=>r});var e=a(533);const t=["emoji"],o='"Twemoji Mozilla", Apple Color Emoji, "Segoe UI Emoji", "Noto Color Emoji", "EmojiOne Color"';class n{constructor(){this._emojiShapeDict=new Map}destroy(){for(const[,e]of this._emojiShapeDict)e instanceof ImageBitmap&&e?.close()}draw(e){const{context:t,particle:o,radius:a,opacity:i}=e,n=o.emojiData;n&&(t.globalAlpha=i,t.drawImage(n,-a,-a,2*a,2*a),t.globalAlpha=1)}async init(a){const i=a.actualOptions;if(t.find((t=>(0,e.isInArray)(t,i.particles.shape.type)))){const a=[(0,e.loadFont)(o)],n=t.map((e=>i.particles.shape.options[e])).find((e=>!!e));n&&(0,e.executeOnSingleOrMultiple)(n,(t=>{t.font&&a.push((0,e.loadFont)(t.font))})),await Promise.all(a)}}particleDestroy(e){delete e.emojiData}particleInit(t,a){if(!a.emojiData){const t=a.shapeData;if(!t?.value)return;const i=(0,e.itemFromSingleOrMultiple)(t.value,a.randomIndexData),n=t.font??o;if(!i)return;const r=`${i}_${n}`,s=this._emojiShapeDict.get(r);if(s)return void(a.emojiData=s);const l=2*(0,e.getRangeMax)(a.size.value);let p;if("undefined"!=typeof OffscreenCanvas){const t=new OffscreenCanvas(l,l),o=t.getContext("2d");if(!o)return;o.font=`400 ${2*(0,e.getRangeMax)(a.size.value)}px ${n}`,o.textBaseline="middle",o.textAlign="center",o.fillText(i,(0,e.getRangeMax)(a.size.value),(0,e.getRangeMax)(a.size.value)),p=t.transferToImageBitmap()}else{const t=document.createElement("canvas");t.width=l,t.height=l;const o=t.getContext("2d");if(!o)return;o.font=`400 ${2*(0,e.getRangeMax)(a.size.value)}px ${n}`,o.textBaseline="middle",o.textAlign="center",o.fillText(i,(0,e.getRangeMax)(a.size.value),(0,e.getRangeMax)(a.size.value)),p=t}this._emojiShapeDict.set(r,p),a.emojiData=p}}}async function r(e,o=!0){await e.addShape(t,new n,o)}})(),i})())); |
@@ -1,1 +0,1 @@ | ||
/*! tsParticles Emoji Shape v3.0.0-beta.5 by Matteo Bruni */ | ||
/*! tsParticles Emoji Shape v3.0.0 by Matteo Bruni */ |
import type { Particle } from "@tsparticles/engine"; | ||
export interface EmojiParticle extends Particle { | ||
emojiData?: ImageBitmap; | ||
emojiData?: ImageBitmap | HTMLCanvasElement; | ||
} |
@@ -22,3 +22,3 @@ (function (factory) { | ||
for (const [, emojiData] of this._emojiShapeDict) { | ||
emojiData?.close(); | ||
emojiData instanceof ImageBitmap && emojiData?.close(); | ||
} | ||
@@ -67,12 +67,29 @@ } | ||
} | ||
const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize); | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2; | ||
let emojiData; | ||
if (typeof OffscreenCanvas !== "undefined") { | ||
const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
emojiData = canvas.transferToImageBitmap(); | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
const emojiData = canvas.transferToImageBitmap(); | ||
else { | ||
const canvas = document.createElement("canvas"); | ||
canvas.width = canvasSize; | ||
canvas.height = canvasSize; | ||
const context = canvas.getContext("2d"); | ||
if (!context) { | ||
return; | ||
} | ||
context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`; | ||
context.textBaseline = "middle"; | ||
context.textAlign = "center"; | ||
context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value)); | ||
emojiData = canvas; | ||
} | ||
this._emojiShapeDict.set(key, emojiData); | ||
@@ -79,0 +96,0 @@ particle.emojiData = emojiData; |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
310376
639
1
Updated@tsparticles/engine@^3.0.0