@tsparticles/shape-emoji 3.0.0-beta.5 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/browser/EmojiDrawer.js +27 -10
  2. package/cjs/EmojiDrawer.js +27 -10
  3. package/esm/EmojiDrawer.js +27 -10
  4. package/package.json +2 -2
  5. package/report.html +2 -2
  6. package/tsparticles.shape.emoji.js +28 -12
  7. package/tsparticles.shape.emoji.min.js +1 -1
  8. package/tsparticles.shape.emoji.min.js.LICENSE.txt +1 -1
  9. package/types/EmojiParticle.d.ts +1 -1
  10. package/umd/EmojiDrawer.js +27 -10
package/browser/EmojiDrawer.js CHANGED
@@ -7,7 +7,7 @@ export class EmojiDrawer {
7
7
  }
8
8
  destroy() {
9
9
  for (const [, emojiData] of this._emojiShapeDict) {
10
- emojiData?.close();
10
+ emojiData instanceof ImageBitmap && emojiData?.close();
11
11
  }
12
12
  }
13
13
  draw(data) {
@@ -51,16 +51,33 @@ export class EmojiDrawer {
51
51
  particle.emojiData = existingData;
52
52
  return;
53
53
  }
54
- const canvasSize = getRangeMax(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize);
55
- const context = canvas.getContext("2d");
56
- if (!context) {
57
- return;
54
+ const canvasSize = getRangeMax(particle.size.value) * 2;
55
+ let emojiData;
56
+ if (typeof OffscreenCanvas !== "undefined") {
57
+ const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d");
58
+ if (!context) {
59
+ return;
60
+ }
61
+ context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
62
+ context.textBaseline = "middle";
63
+ context.textAlign = "center";
64
+ context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
65
+ emojiData = canvas.transferToImageBitmap();
66
+ }
67
+ else {
68
+ const canvas = document.createElement("canvas");
69
+ canvas.width = canvasSize;
70
+ canvas.height = canvasSize;
71
+ const context = canvas.getContext("2d");
72
+ if (!context) {
73
+ return;
74
+ }
75
+ context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
76
+ context.textBaseline = "middle";
77
+ context.textAlign = "center";
78
+ context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
79
+ emojiData = canvas;
58
80
  }
59
- context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
60
- context.textBaseline = "middle";
61
- context.textAlign = "center";
62
- context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
63
- const emojiData = canvas.transferToImageBitmap();
64
81
  this._emojiShapeDict.set(key, emojiData);
65
82
  particle.emojiData = emojiData;
66
83
  }
package/cjs/EmojiDrawer.js CHANGED
@@ -10,7 +10,7 @@ class EmojiDrawer {
10
10
  }
11
11
  destroy() {
12
12
  for (const [, emojiData] of this._emojiShapeDict) {
13
- emojiData?.close();
13
+ emojiData instanceof ImageBitmap && emojiData?.close();
14
14
  }
15
15
  }
16
16
  draw(data) {
@@ -54,16 +54,33 @@ class EmojiDrawer {
54
54
  particle.emojiData = existingData;
55
55
  return;
56
56
  }
57
- const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize);
58
- const context = canvas.getContext("2d");
59
- if (!context) {
60
- return;
57
+ const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2;
58
+ let emojiData;
59
+ if (typeof OffscreenCanvas !== "undefined") {
60
+ const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d");
61
+ if (!context) {
62
+ return;
63
+ }
64
+ context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
65
+ context.textBaseline = "middle";
66
+ context.textAlign = "center";
67
+ context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
68
+ emojiData = canvas.transferToImageBitmap();
69
+ }
70
+ else {
71
+ const canvas = document.createElement("canvas");
72
+ canvas.width = canvasSize;
73
+ canvas.height = canvasSize;
74
+ const context = canvas.getContext("2d");
75
+ if (!context) {
76
+ return;
77
+ }
78
+ context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
79
+ context.textBaseline = "middle";
80
+ context.textAlign = "center";
81
+ context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
82
+ emojiData = canvas;
61
83
  }
62
- context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
63
- context.textBaseline = "middle";
64
- context.textAlign = "center";
65
- context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
66
- const emojiData = canvas.transferToImageBitmap();
67
84
  this._emojiShapeDict.set(key, emojiData);
68
85
  particle.emojiData = emojiData;
69
86
  }
package/esm/EmojiDrawer.js CHANGED
@@ -7,7 +7,7 @@ export class EmojiDrawer {
7
7
  }
8
8
  destroy() {
9
9
  for (const [, emojiData] of this._emojiShapeDict) {
10
- emojiData?.close();
10
+ emojiData instanceof ImageBitmap && emojiData?.close();
11
11
  }
12
12
  }
13
13
  draw(data) {
@@ -51,16 +51,33 @@ export class EmojiDrawer {
51
51
  particle.emojiData = existingData;
52
52
  return;
53
53
  }
54
- const canvasSize = getRangeMax(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize);
55
- const context = canvas.getContext("2d");
56
- if (!context) {
57
- return;
54
+ const canvasSize = getRangeMax(particle.size.value) * 2;
55
+ let emojiData;
56
+ if (typeof OffscreenCanvas !== "undefined") {
57
+ const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d");
58
+ if (!context) {
59
+ return;
60
+ }
61
+ context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
62
+ context.textBaseline = "middle";
63
+ context.textAlign = "center";
64
+ context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
65
+ emojiData = canvas.transferToImageBitmap();
66
+ }
67
+ else {
68
+ const canvas = document.createElement("canvas");
69
+ canvas.width = canvasSize;
70
+ canvas.height = canvasSize;
71
+ const context = canvas.getContext("2d");
72
+ if (!context) {
73
+ return;
74
+ }
75
+ context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
76
+ context.textBaseline = "middle";
77
+ context.textAlign = "center";
78
+ context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
79
+ emojiData = canvas;
58
80
  }
59
- context.font = `400 ${getRangeMax(particle.size.value) * 2}px ${font}`;
60
- context.textBaseline = "middle";
61
- context.textAlign = "center";
62
- context.fillText(emoji, getRangeMax(particle.size.value), getRangeMax(particle.size.value));
63
- const emojiData = canvas.transferToImageBitmap();
64
81
  this._emojiShapeDict.set(key, emojiData);
65
82
  particle.emojiData = emojiData;
66
83
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tsparticles/shape-emoji",
3
- "version": "3.0.0-beta.5",
3
+ "version": "3.0.1",
4
4
  "description": "tsParticles emoji shape",
5
5
  "homepage": "https://particles.js.org",
6
6
  "repository": {
@@ -59,7 +59,7 @@
59
59
  "./package.json": "./package.json"
60
60
  },
61
61
  "dependencies": {
62
- "@tsparticles/engine": "^3.0.0-beta.5"
62
+ "@tsparticles/engine": "^3.0.1"
63
63
  },
64
64
  "publishConfig": {
65
65
  "access": "public"
package/report.html CHANGED
@@ -3,7 +3,7 @@
3
3
  <head>
4
4
  <meta charset="UTF-8"/>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
6
- <title>@tsparticles/shape-emoji [3 Dec 2023 at 18:42]</title>
6
+ <title>@tsparticles/shape-emoji [6 Dec 2023 at 09:41]</title>
7
7
  <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
8
8
 
9
9
  <script>
@@ -31,7 +31,7 @@
31
31
  <body>
32
32
  <div id="app"></div>
33
33
  <script>
34
- window.chartData = [{"label":"tsparticles.shape.emoji.js","isAsset":true,"statSize":2757,"parsedSize":6661,"gzipSize":2187,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":2715,"groups":[{"id":27,"label":"index.js + 1 modules (concatenated)","path":"./dist/browser/index.js + 1 modules (concatenated)","statSize":2715,"parsedSize":6661,"gzipSize":2187,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser","statSize":2715,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/index.js","statSize":189,"parsedSize":463,"gzipSize":152,"inaccurateSizes":true},{"id":null,"label":"EmojiDrawer.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/EmojiDrawer.js","statSize":2526,"parsedSize":6197,"gzipSize":2034,"inaccurateSizes":true}],"parsedSize":6661,"gzipSize":2187,"inaccurateSizes":true}]}],"parsedSize":6661,"gzipSize":2187},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.shape.emoji":true}}];
34
+ window.chartData = [{"label":"tsparticles.shape.emoji.js","isAsset":true,"statSize":3420,"parsedSize":7389,"gzipSize":2283,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":3378,"groups":[{"id":335,"label":"index.js + 1 modules (concatenated)","path":"./dist/browser/index.js + 1 modules (concatenated)","statSize":3378,"parsedSize":7389,"gzipSize":2283,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser","statSize":3378,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/index.js","statSize":189,"parsedSize":413,"gzipSize":127,"inaccurateSizes":true},{"id":null,"label":"EmojiDrawer.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/EmojiDrawer.js","statSize":3189,"parsedSize":6975,"gzipSize":2155,"inaccurateSizes":true}],"parsedSize":7389,"gzipSize":2283,"inaccurateSizes":true}]}],"parsedSize":7389,"gzipSize":2283},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.shape.emoji":true}}];
35
35
  window.entrypoints = ["tsparticles.shape.emoji","tsparticles.shape.emoji.min"];
36
36
  window.defaultSizes = "parsed";
37
37
  </script>
package/tsparticles.shape.emoji.js CHANGED
@@ -4,7 +4,7 @@
4
4
  * Demo / Generator : https://particles.js.org/
5
5
  * GitHub : https://www.github.com/matteobruni/tsparticles
6
6
  * How to use? : Check the GitHub README
7
- * v3.0.0-beta.5
7
+ * v3.0.1
8
8
  */
9
9
  (function webpackUniversalModuleDefinition(root, factory) {
10
10
  if(typeof exports === 'object' && typeof module === 'object')
@@ -106,7 +106,7 @@ class EmojiDrawer {
106
106
  }
107
107
  destroy() {
108
108
  for (const [, emojiData] of this._emojiShapeDict) {
109
- emojiData?.close();
109
+ emojiData instanceof ImageBitmap && emojiData?.close();
110
110
  }
111
111
  }
112
112
  draw(data) {
@@ -157,17 +157,33 @@ class EmojiDrawer {
157
157
  particle.emojiData = existingData;
158
158
  return;
159
159
  }
160
- const canvasSize = (0,engine_root_window_.getRangeMax)(particle.size.value) * 2,
161
- canvas = new OffscreenCanvas(canvasSize, canvasSize);
162
- const context = canvas.getContext("2d");
163
- if (!context) {
164
- return;
160
+ const canvasSize = (0,engine_root_window_.getRangeMax)(particle.size.value) * 2;
161
+ let emojiData;
162
+ if (typeof OffscreenCanvas !== "undefined") {
163
+ const canvas = new OffscreenCanvas(canvasSize, canvasSize),
164
+ context = canvas.getContext("2d");
165
+ if (!context) {
166
+ return;
167
+ }
168
+ context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`;
169
+ context.textBaseline = "middle";
170
+ context.textAlign = "center";
171
+ context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value));
172
+ emojiData = canvas.transferToImageBitmap();
173
+ } else {
174
+ const canvas = document.createElement("canvas");
175
+ canvas.width = canvasSize;
176
+ canvas.height = canvasSize;
177
+ const context = canvas.getContext("2d");
178
+ if (!context) {
179
+ return;
180
+ }
181
+ context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`;
182
+ context.textBaseline = "middle";
183
+ context.textAlign = "center";
184
+ context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value));
185
+ emojiData = canvas;
165
186
  }
166
- context.font = `400 ${(0,engine_root_window_.getRangeMax)(particle.size.value) * 2}px ${font}`;
167
- context.textBaseline = "middle";
168
- context.textAlign = "center";
169
- context.fillText(emoji, (0,engine_root_window_.getRangeMax)(particle.size.value), (0,engine_root_window_.getRangeMax)(particle.size.value));
170
- const emojiData = canvas.transferToImageBitmap();
171
187
  this._emojiShapeDict.set(key, emojiData);
172
188
  particle.emojiData = emojiData;
173
189
  }
package/tsparticles.shape.emoji.min.js CHANGED
@@ -1,2 +1,2 @@
1
1
  /*! For license information please see tsparticles.shape.emoji.min.js.LICENSE.txt */
2
- !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})()));
2
+ !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})()));
package/tsparticles.shape.emoji.min.js.LICENSE.txt CHANGED
@@ -1 +1 @@
1
- /*! tsParticles Emoji Shape v3.0.0-beta.5 by Matteo Bruni */
1
+ /*! tsParticles Emoji Shape v3.0.1 by Matteo Bruni */
package/types/EmojiParticle.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import type { Particle } from "@tsparticles/engine";
2
2
  export interface EmojiParticle extends Particle {
3
- emojiData?: ImageBitmap;
3
+ emojiData?: ImageBitmap | HTMLCanvasElement;
4
4
  }
package/umd/EmojiDrawer.js CHANGED
@@ -19,7 +19,7 @@
19
19
  }
20
20
  destroy() {
21
21
  for (const [, emojiData] of this._emojiShapeDict) {
22
- emojiData?.close();
22
+ emojiData instanceof ImageBitmap && emojiData?.close();
23
23
  }
24
24
  }
25
25
  draw(data) {
@@ -63,16 +63,33 @@
63
63
  particle.emojiData = existingData;
64
64
  return;
65
65
  }
66
- const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2, canvas = new OffscreenCanvas(canvasSize, canvasSize);
67
- const context = canvas.getContext("2d");
68
- if (!context) {
69
- return;
66
+ const canvasSize = (0, engine_1.getRangeMax)(particle.size.value) * 2;
67
+ let emojiData;
68
+ if (typeof OffscreenCanvas !== "undefined") {
69
+ const canvas = new OffscreenCanvas(canvasSize, canvasSize), context = canvas.getContext("2d");
70
+ if (!context) {
71
+ return;
72
+ }
73
+ context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
74
+ context.textBaseline = "middle";
75
+ context.textAlign = "center";
76
+ context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
77
+ emojiData = canvas.transferToImageBitmap();
78
+ }
79
+ else {
80
+ const canvas = document.createElement("canvas");
81
+ canvas.width = canvasSize;
82
+ canvas.height = canvasSize;
83
+ const context = canvas.getContext("2d");
84
+ if (!context) {
85
+ return;
86
+ }
87
+ context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
88
+ context.textBaseline = "middle";
89
+ context.textAlign = "center";
90
+ context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
91
+ emojiData = canvas;
70
92
  }
71
- context.font = `400 ${(0, engine_1.getRangeMax)(particle.size.value) * 2}px ${font}`;
72
- context.textBaseline = "middle";
73
- context.textAlign = "center";
74
- context.fillText(emoji, (0, engine_1.getRangeMax)(particle.size.value), (0, engine_1.getRangeMax)(particle.size.value));
75
- const emojiData = canvas.transferToImageBitmap();
76
93
  this._emojiShapeDict.set(key, emojiData);
77
94
  particle.emojiData = emojiData;
78
95
  }