UNPKG

263 kBJavaScriptView Raw
1/*!
2 * Author : Matteo Bruni - https://www.matteobruni.it
3 * MIT license: https://opensource.org/licenses/MIT
4 * Demo / Generator : https://particles.js.org/
5 * GitHub : https://www.github.com/matteobruni/tsparticles
6 * How to use? : Check the GitHub README
7 * v1.26.2
8 */
9(function webpackUniversalModuleDefinition(root, factory) {
10 if(typeof exports === 'object' && typeof module === 'object')
11 module.exports = factory();
12 else if(typeof define === 'function' && define.amd)
13 define([], factory);
14 else {
15 var a = factory();
16 for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
17 }
18})(this, function() {
19return /******/ (() => { // webpackBootstrap
20/******/ "use strict";
21/******/ // The require scope
22/******/ var __webpack_require__ = {};
23/******/
24/************************************************************************/
25/******/ /* webpack/runtime/define property getters */
26/******/ (() => {
27/******/ // define getter functions for harmony exports
28/******/ __webpack_require__.d = (exports, definition) => {
29/******/ for(var key in definition) {
30/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
31/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
32/******/ }
33/******/ }
34/******/ };
35/******/ })();
36/******/
37/******/ /* webpack/runtime/hasOwnProperty shorthand */
38/******/ (() => {
39/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
40/******/ })();
41/******/
42/******/ /* webpack/runtime/make namespace object */
43/******/ (() => {
44/******/ // define __esModule on exports
45/******/ __webpack_require__.r = (exports) => {
46/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
47/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
48/******/ }
49/******/ Object.defineProperty(exports, '__esModule', { value: true });
50/******/ };
51/******/ })();
52/******/
53/************************************************************************/
54var __webpack_exports__ = {};
55// ESM COMPAT FLAG
56__webpack_require__.r(__webpack_exports__);
57
58// EXPORTS
59__webpack_require__.d(__webpack_exports__, {
60 "AnimationStatus": () => (/* reexport */ AnimationStatus),
61 "CanvasUtils": () => (/* reexport */ CanvasUtils),
62 "Circle": () => (/* reexport */ Circle),
63 "CircleWarp": () => (/* reexport */ CircleWarp),
64 "ClickMode": () => (/* reexport */ ClickMode),
65 "CollisionMode": () => (/* reexport */ CollisionMode),
66 "ColorUtils": () => (/* reexport */ ColorUtils),
67 "Constants": () => (/* reexport */ Constants),
68 "Container": () => (/* reexport */ Container),
69 "DestroyMode": () => (/* reexport */ DestroyMode),
70 "DestroyType": () => (/* reexport */ DestroyType),
71 "DivMode": () => (/* reexport */ DivMode),
72 "DivType": () => (/* reexport */ DivType),
73 "HoverMode": () => (/* reexport */ HoverMode),
74 "InteractivityDetect": () => (/* reexport */ InteractivityDetect),
75 "MainSlim": () => (/* reexport */ MainSlim),
76 "MoveDirection": () => (/* reexport */ MoveDirection),
77 "OutMode": () => (/* reexport */ OutMode),
78 "Point": () => (/* reexport */ Point),
79 "ProcessBubbleType": () => (/* reexport */ ProcessBubbleType),
80 "Rectangle": () => (/* reexport */ Rectangle),
81 "RotateDirection": () => (/* reexport */ RotateDirection),
82 "ShapeType": () => (/* reexport */ ShapeType),
83 "SizeMode": () => (/* reexport */ SizeMode),
84 "StartValueType": () => (/* reexport */ StartValueType),
85 "ThemeMode": () => (/* reexport */ ThemeMode),
86 "Utils": () => (/* reexport */ Utils),
87 "Vector": () => (/* reexport */ Vector),
88 "pJSDom": () => (/* binding */ pJSDom),
89 "particlesJS": () => (/* binding */ particlesJS),
90 "tsParticles": () => (/* binding */ tsParticles)
91});
92
93;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/SquareDrawer.js
94class SquareDrawer {
95 getSidesCount() {
96 return 4;
97 }
98
99 draw(context, particle, radius) {
100 context.rect(-radius, -radius, radius * 2, radius * 2);
101 }
102
103}
104;// CONCATENATED MODULE: ./dist/browser/Enums/Directions/OutModeDirection.js
105var OutModeDirection;
106
107(function (OutModeDirection) {
108 OutModeDirection["bottom"] = "bottom";
109 OutModeDirection["left"] = "left";
110 OutModeDirection["right"] = "right";
111 OutModeDirection["top"] = "top";
112})(OutModeDirection || (OutModeDirection = {}));
113;// CONCATENATED MODULE: ./dist/browser/Enums/Directions/MoveDirection.js
114var MoveDirection;
115
116(function (MoveDirection) {
117 MoveDirection["bottom"] = "bottom";
118 MoveDirection["bottomLeft"] = "bottom-left";
119 MoveDirection["bottomRight"] = "bottom-right";
120 MoveDirection["left"] = "left";
121 MoveDirection["none"] = "none";
122 MoveDirection["right"] = "right";
123 MoveDirection["top"] = "top";
124 MoveDirection["topLeft"] = "top-left";
125 MoveDirection["topRight"] = "top-right";
126})(MoveDirection || (MoveDirection = {}));
127;// CONCATENATED MODULE: ./dist/browser/Enums/Directions/RotateDirection.js
128var RotateDirection;
129
130(function (RotateDirection) {
131 RotateDirection["clockwise"] = "clockwise";
132 RotateDirection["counterClockwise"] = "counter-clockwise";
133 RotateDirection["random"] = "random";
134})(RotateDirection || (RotateDirection = {}));
135;// CONCATENATED MODULE: ./dist/browser/Enums/Directions/index.js
136
137
138;// CONCATENATED MODULE: ./dist/browser/Core/Particle/Vector.js
139class Vector {
140 constructor(x, y) {
141 let defX, defY;
142
143 if (y === undefined) {
144 if (typeof x === "number") {
145 throw new Error("tsParticles - Vector not initialized correctly");
146 }
147
148 const coords = x;
149 [defX, defY] = [coords.x, coords.y];
150 } else {
151 [defX, defY] = [x, y];
152 }
153
154 this.x = defX;
155 this.y = defY;
156 }
157
158 static clone(source) {
159 return Vector.create(source.x, source.y);
160 }
161
162 static create(x, y) {
163 return new Vector(x, y);
164 }
165
166 get angle() {
167 return Math.atan2(this.y, this.x);
168 }
169
170 set angle(angle) {
171 this.updateFromAngle(angle, this.length);
172 }
173
174 get length() {
175 return Math.sqrt(Math.pow(this.x, 2) + Math.pow(this.y, 2));
176 }
177
178 set length(length) {
179 this.updateFromAngle(this.angle, length);
180 }
181
182 add(v) {
183 return Vector.create(this.x + v.x, this.y + v.y);
184 }
185
186 addTo(v) {
187 this.x += v.x;
188 this.y += v.y;
189 }
190
191 sub(v) {
192 return Vector.create(this.x - v.x, this.y - v.y);
193 }
194
195 subFrom(v) {
196 this.x -= v.x;
197 this.y -= v.y;
198 }
199
200 mult(n) {
201 return Vector.create(this.x * n, this.y * n);
202 }
203
204 multTo(n) {
205 this.x *= n;
206 this.y *= n;
207 }
208
209 div(n) {
210 return Vector.create(this.x / n, this.y / n);
211 }
212
213 divTo(n) {
214 this.x /= n;
215 this.y /= n;
216 }
217
218 distanceTo(v) {
219 return this.sub(v).length;
220 }
221
222 getLengthSq() {
223 return Math.pow(this.x, 2) + Math.pow(this.y, 2);
224 }
225
226 distanceToSq(v) {
227 return this.sub(v).getLengthSq();
228 }
229
230 manhattanDistanceTo(v) {
231 return Math.abs(v.x - this.x) + Math.abs(v.y - this.y);
232 }
233
234 copy() {
235 return Vector.clone(this);
236 }
237
238 setTo(velocity) {
239 this.x = velocity.x;
240 this.y = velocity.y;
241 }
242
243 rotate(angle) {
244 return Vector.create(this.x * Math.cos(angle) - this.y * Math.sin(angle), this.x * Math.sin(angle) + this.y * Math.cos(angle));
245 }
246
247 updateFromAngle(angle, length) {
248 this.x = Math.cos(angle) * length;
249 this.y = Math.sin(angle) * length;
250 }
251
252}
253Vector.origin = Vector.create(0, 0);
254;// CONCATENATED MODULE: ./dist/browser/Utils/NumberUtils.js
255
256
257class NumberUtils {
258 static clamp(num, min, max) {
259 return Math.min(Math.max(num, min), max);
260 }
261
262 static mix(comp1, comp2, weight1, weight2) {
263 return Math.floor((comp1 * weight1 + comp2 * weight2) / (weight1 + weight2));
264 }
265
266 static randomInRange(r) {
267 const max = NumberUtils.getRangeMax(r);
268 let min = NumberUtils.getRangeMin(r);
269
270 if (max === min) {
271 min = 0;
272 }
273
274 return Math.random() * (max - min) + min;
275 }
276
277 static getRangeValue(value) {
278 return typeof value === "number" ? value : NumberUtils.randomInRange(value);
279 }
280
281 static getRangeMin(value) {
282 return typeof value === "number" ? value : value.min;
283 }
284
285 static getRangeMax(value) {
286 return typeof value === "number" ? value : value.max;
287 }
288
289 static setRangeValue(source, value) {
290 if (source === value || value === undefined && typeof source === "number") {
291 return source;
292 }
293
294 const min = NumberUtils.getRangeMin(source),
295 max = NumberUtils.getRangeMax(source);
296 return value !== undefined ? {
297 min: Math.min(min, value),
298 max: Math.max(max, value)
299 } : NumberUtils.setRangeValue(min, max);
300 }
301
302 static getValue(options) {
303 const random = options.random;
304 const {
305 enable,
306 minimumValue
307 } = typeof random === "boolean" ? {
308 enable: random,
309 minimumValue: 0
310 } : random;
311 return enable ? NumberUtils.getRangeValue(NumberUtils.setRangeValue(options.value, minimumValue)) : NumberUtils.getRangeValue(options.value);
312 }
313
314 static getDistances(pointA, pointB) {
315 const dx = pointA.x - pointB.x;
316 const dy = pointA.y - pointB.y;
317 return {
318 dx: dx,
319 dy: dy,
320 distance: Math.sqrt(dx * dx + dy * dy)
321 };
322 }
323
324 static getDistance(pointA, pointB) {
325 return NumberUtils.getDistances(pointA, pointB).distance;
326 }
327
328 static getParticleBaseVelocity(direction) {
329 const baseVelocity = Vector.origin;
330 baseVelocity.length = 1;
331
332 switch (direction) {
333 case MoveDirection.top:
334 baseVelocity.angle = -Math.PI / 2;
335 break;
336
337 case MoveDirection.topRight:
338 baseVelocity.angle = -Math.PI / 4;
339 break;
340
341 case MoveDirection.right:
342 baseVelocity.angle = 0;
343 break;
344
345 case MoveDirection.bottomRight:
346 baseVelocity.angle = Math.PI / 4;
347 break;
348
349 case MoveDirection.bottom:
350 baseVelocity.angle = Math.PI / 2;
351 break;
352
353 case MoveDirection.bottomLeft:
354 baseVelocity.angle = 3 * Math.PI / 4;
355 break;
356
357 case MoveDirection.left:
358 baseVelocity.angle = Math.PI;
359 break;
360
361 case MoveDirection.topLeft:
362 baseVelocity.angle = -3 * Math.PI / 4;
363 break;
364
365 case MoveDirection.none:
366 default:
367 baseVelocity.angle = Math.random() * Math.PI * 2;
368 break;
369 }
370
371 return baseVelocity;
372 }
373
374 static rotateVelocity(velocity, angle) {
375 return {
376 horizontal: velocity.horizontal * Math.cos(angle) - velocity.vertical * Math.sin(angle),
377 vertical: velocity.horizontal * Math.sin(angle) + velocity.vertical * Math.cos(angle)
378 };
379 }
380
381 static collisionVelocity(v1, v2, m1, m2) {
382 return Vector.create(v1.x * (m1 - m2) / (m1 + m2) + v2.x * 2 * m2 / (m1 + m2), v1.y);
383 }
384
385}
386;// CONCATENATED MODULE: ./dist/browser/Utils/Utils.js
387var __awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
388 function adopt(value) {
389 return value instanceof P ? value : new P(function (resolve) {
390 resolve(value);
391 });
392 }
393
394 return new (P || (P = Promise))(function (resolve, reject) {
395 function fulfilled(value) {
396 try {
397 step(generator.next(value));
398 } catch (e) {
399 reject(e);
400 }
401 }
402
403 function rejected(value) {
404 try {
405 step(generator["throw"](value));
406 } catch (e) {
407 reject(e);
408 }
409 }
410
411 function step(result) {
412 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
413 }
414
415 step((generator = generator.apply(thisArg, _arguments || [])).next());
416 });
417};
418
419
420
421
422function rectSideBounce(pSide, pOtherSide, rectSide, rectOtherSide, velocity, factor) {
423 const res = {
424 bounced: false
425 };
426
427 if (pOtherSide.min >= rectOtherSide.min && pOtherSide.min <= rectOtherSide.max && pOtherSide.max >= rectOtherSide.min && pOtherSide.max <= rectOtherSide.max) {
428 if (pSide.max >= rectSide.min && pSide.max <= (rectSide.max + rectSide.min) / 2 && velocity > 0 || pSide.min <= rectSide.max && pSide.min > (rectSide.max + rectSide.min) / 2 && velocity < 0) {
429 res.velocity = velocity * -factor;
430 res.bounced = true;
431 }
432 }
433
434 return res;
435}
436
437function checkSelector(element, selectors) {
438 if (selectors instanceof Array) {
439 for (const selector of selectors) {
440 if (element.matches(selector)) {
441 return true;
442 }
443 }
444
445 return false;
446 } else {
447 return element.matches(selectors);
448 }
449}
450
451class Utils {
452 static isSsr() {
453 return typeof window === "undefined" || !window;
454 }
455
456 static get animate() {
457 return Utils.isSsr() ? callback => setTimeout(callback) : callback => (window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || window.setTimeout)(callback);
458 }
459
460 static get cancelAnimation() {
461 return Utils.isSsr() ? handle => clearTimeout(handle) : handle => (window.cancelAnimationFrame || window.webkitCancelRequestAnimationFrame || window.mozCancelRequestAnimationFrame || window.oCancelRequestAnimationFrame || window.msCancelRequestAnimationFrame || window.clearTimeout)(handle);
462 }
463
464 static isInArray(value, array) {
465 return value === array || array instanceof Array && array.indexOf(value) > -1;
466 }
467
468 static loadFont(character) {
469 return __awaiter(this, void 0, void 0, function* () {
470 try {
471 yield document.fonts.load(`${character.weight} 36px '${character.font}'`);
472 } catch (_a) {}
473 });
474 }
475
476 static arrayRandomIndex(array) {
477 return Math.floor(Math.random() * array.length);
478 }
479
480 static itemFromArray(array, index, useIndex = true) {
481 const fixedIndex = index !== undefined && useIndex ? index % array.length : Utils.arrayRandomIndex(array);
482 return array[fixedIndex];
483 }
484
485 static isPointInside(point, size, radius, direction) {
486 return Utils.areBoundsInside(Utils.calculateBounds(point, radius !== null && radius !== void 0 ? radius : 0), size, direction);
487 }
488
489 static areBoundsInside(bounds, size, direction) {
490 let inside = true;
491
492 if (!direction || direction === OutModeDirection.bottom) {
493 inside = bounds.top < size.height;
494 }
495
496 if (inside && (!direction || direction === OutModeDirection.left)) {
497 inside = bounds.right > 0;
498 }
499
500 if (inside && (!direction || direction === OutModeDirection.right)) {
501 inside = bounds.left < size.width;
502 }
503
504 if (inside && (!direction || direction === OutModeDirection.top)) {
505 inside = bounds.bottom > 0;
506 }
507
508 return inside;
509 }
510
511 static calculateBounds(point, radius) {
512 return {
513 bottom: point.y + radius,
514 left: point.x - radius,
515 right: point.x + radius,
516 top: point.y - radius
517 };
518 }
519
520 static loadImage(source) {
521 return new Promise((resolve, reject) => {
522 if (!source) {
523 reject("Error tsParticles - No image.src");
524 return;
525 }
526
527 const image = {
528 source: source,
529 type: source.substr(source.length - 3)
530 };
531 const img = new Image();
532 img.addEventListener("load", () => {
533 image.element = img;
534 resolve(image);
535 });
536 img.addEventListener("error", () => {
537 reject(`Error tsParticles - loading image: ${source}`);
538 });
539 img.src = source;
540 });
541 }
542
543 static downloadSvgImage(source) {
544 return __awaiter(this, void 0, void 0, function* () {
545 if (!source) {
546 throw new Error("Error tsParticles - No image.src");
547 }
548
549 const image = {
550 source: source,
551 type: source.substr(source.length - 3)
552 };
553
554 if (image.type !== "svg") {
555 return Utils.loadImage(source);
556 }
557
558 const response = yield fetch(image.source);
559
560 if (!response.ok) {
561 throw new Error("Error tsParticles - Image not found");
562 }
563
564 image.svgData = yield response.text();
565 return image;
566 });
567 }
568
569 static deepExtend(destination, ...sources) {
570 for (const source of sources) {
571 if (source === undefined || source === null) {
572 continue;
573 }
574
575 if (typeof source !== "object") {
576 destination = source;
577 continue;
578 }
579
580 const sourceIsArray = Array.isArray(source);
581
582 if (sourceIsArray && (typeof destination !== "object" || !destination || !Array.isArray(destination))) {
583 destination = [];
584 } else if (!sourceIsArray && (typeof destination !== "object" || !destination || Array.isArray(destination))) {
585 destination = {};
586 }
587
588 for (const key in source) {
589 if (key === "__proto__") {
590 continue;
591 }
592
593 const sourceDict = source;
594 const value = sourceDict[key];
595 const isObject = typeof value === "object";
596 const destDict = destination;
597 destDict[key] = isObject && Array.isArray(value) ? value.map(v => Utils.deepExtend(destDict[key], v)) : Utils.deepExtend(destDict[key], value);
598 }
599 }
600
601 return destination;
602 }
603
604 static isDivModeEnabled(mode, divs) {
605 return divs instanceof Array ? !!divs.find(t => t.enable && Utils.isInArray(mode, t.mode)) : Utils.isInArray(mode, divs.mode);
606 }
607
608 static divModeExecute(mode, divs, callback) {
609 if (divs instanceof Array) {
610 for (const div of divs) {
611 const divMode = div.mode;
612 const divEnabled = div.enable;
613
614 if (divEnabled && Utils.isInArray(mode, divMode)) {
615 Utils.singleDivModeExecute(div, callback);
616 }
617 }
618 } else {
619 const divMode = divs.mode;
620 const divEnabled = divs.enable;
621
622 if (divEnabled && Utils.isInArray(mode, divMode)) {
623 Utils.singleDivModeExecute(divs, callback);
624 }
625 }
626 }
627
628 static singleDivModeExecute(div, callback) {
629 const selectors = div.selectors;
630
631 if (selectors instanceof Array) {
632 for (const selector of selectors) {
633 callback(selector, div);
634 }
635 } else {
636 callback(selectors, div);
637 }
638 }
639
640 static divMode(divs, element) {
641 if (!element || !divs) {
642 return;
643 }
644
645 if (divs instanceof Array) {
646 return divs.find(d => checkSelector(element, d.selectors));
647 } else if (checkSelector(element, divs.selectors)) {
648 return divs;
649 }
650 }
651
652 static circleBounceDataFromParticle(p) {
653 return {
654 position: p.getPosition(),
655 radius: p.getRadius(),
656 mass: p.getMass(),
657 velocity: p.velocity,
658 factor: {
659 horizontal: NumberUtils.getValue(p.options.bounce.horizontal),
660 vertical: NumberUtils.getValue(p.options.bounce.vertical)
661 }
662 };
663 }
664
665 static circleBounce(p1, p2) {
666 const xVelocityDiff = p1.velocity.x;
667 const yVelocityDiff = p1.velocity.y;
668 const pos1 = p1.position;
669 const pos2 = p2.position;
670 const xDist = pos2.x - pos1.x;
671 const yDist = pos2.y - pos1.y;
672
673 if (xVelocityDiff * xDist + yVelocityDiff * yDist >= 0) {
674 const angle = -Math.atan2(pos2.y - pos1.y, pos2.x - pos1.x);
675 const m1 = p1.mass;
676 const m2 = p2.mass;
677 const u1 = p1.velocity.rotate(angle);
678 const u2 = p2.velocity.rotate(angle);
679 const v1 = NumberUtils.collisionVelocity(u1, u2, m1, m2);
680 const v2 = NumberUtils.collisionVelocity(u2, u1, m1, m2);
681 const vFinal1 = v1.rotate(-angle);
682 const vFinal2 = v2.rotate(-angle);
683 p1.velocity.x = vFinal1.x * p1.factor.horizontal;
684 p1.velocity.y = vFinal1.y * p1.factor.vertical;
685 p2.velocity.x = vFinal2.x * p2.factor.horizontal;
686 p2.velocity.y = vFinal2.y * p2.factor.vertical;
687 }
688 }
689
690 static rectBounce(particle, divBounds) {
691 const pPos = particle.getPosition();
692 const size = particle.getRadius();
693 const bounds = Utils.calculateBounds(pPos, size);
694 const resH = rectSideBounce({
695 min: bounds.left,
696 max: bounds.right
697 }, {
698 min: bounds.top,
699 max: bounds.bottom
700 }, {
701 min: divBounds.left,
702 max: divBounds.right
703 }, {
704 min: divBounds.top,
705 max: divBounds.bottom
706 }, particle.velocity.x, NumberUtils.getValue(particle.options.bounce.horizontal));
707
708 if (resH.bounced) {
709 if (resH.velocity !== undefined) {
710 particle.velocity.x = resH.velocity;
711 }
712
713 if (resH.position !== undefined) {
714 particle.position.x = resH.position;
715 }
716 }
717
718 const resV = rectSideBounce({
719 min: bounds.top,
720 max: bounds.bottom
721 }, {
722 min: bounds.left,
723 max: bounds.right
724 }, {
725 min: divBounds.top,
726 max: divBounds.bottom
727 }, {
728 min: divBounds.left,
729 max: divBounds.right
730 }, particle.velocity.y, NumberUtils.getValue(particle.options.bounce.vertical));
731
732 if (resV.bounced) {
733 if (resV.velocity !== undefined) {
734 particle.velocity.y = resV.velocity;
735 }
736
737 if (resV.position !== undefined) {
738 particle.position.y = resV.position;
739 }
740 }
741 }
742
743}
744;// CONCATENATED MODULE: ./dist/browser/Utils/Constants.js
745class Constants {}
746Constants.canvasClass = "tsparticles-canvas-el";
747Constants.randomColorValue = "random";
748Constants.midColorValue = "mid";
749Constants.touchEndEvent = "touchend";
750Constants.mouseDownEvent = "mousedown";
751Constants.mouseUpEvent = "mouseup";
752Constants.mouseMoveEvent = "mousemove";
753Constants.touchStartEvent = "touchstart";
754Constants.touchMoveEvent = "touchmove";
755Constants.mouseLeaveEvent = "mouseleave";
756Constants.mouseOutEvent = "mouseout";
757Constants.touchCancelEvent = "touchcancel";
758Constants.resizeEvent = "resize";
759Constants.visibilityChangeEvent = "visibilitychange";
760Constants.noPolygonDataLoaded = "No polygon data loaded.";
761Constants.noPolygonFound = "No polygon found, you need to specify SVG url in config.";
762;// CONCATENATED MODULE: ./dist/browser/Utils/ColorUtils.js
763
764
765
766
767function hue2rgb(p, q, t) {
768 let tCalc = t;
769
770 if (tCalc < 0) {
771 tCalc += 1;
772 }
773
774 if (tCalc > 1) {
775 tCalc -= 1;
776 }
777
778 if (tCalc < 1 / 6) {
779 return p + (q - p) * 6 * tCalc;
780 }
781
782 if (tCalc < 1 / 2) {
783 return q;
784 }
785
786 if (tCalc < 2 / 3) {
787 return p + (q - p) * (2 / 3 - tCalc) * 6;
788 }
789
790 return p;
791}
792
793function stringToRgba(input) {
794 if (input.startsWith("rgb")) {
795 const regex = /rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(,\s*([\d.]+)\s*)?\)/i;
796 const result = regex.exec(input);
797 return result ? {
798 a: result.length > 4 ? parseFloat(result[5]) : 1,
799 b: parseInt(result[3], 10),
800 g: parseInt(result[2], 10),
801 r: parseInt(result[1], 10)
802 } : undefined;
803 } else if (input.startsWith("hsl")) {
804 const regex = /hsla?\(\s*(\d+)\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.]+)\s*)?\)/i;
805 const result = regex.exec(input);
806 return result ? ColorUtils.hslaToRgba({
807 a: result.length > 4 ? parseFloat(result[5]) : 1,
808 h: parseInt(result[1], 10),
809 l: parseInt(result[3], 10),
810 s: parseInt(result[2], 10)
811 }) : undefined;
812 } else if (input.startsWith("hsv")) {
813 const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.]+)\s*)?\)/i;
814 const result = regex.exec(input);
815 return result ? ColorUtils.hsvaToRgba({
816 a: result.length > 4 ? parseFloat(result[5]) : 1,
817 h: parseInt(result[1], 10),
818 s: parseInt(result[2], 10),
819 v: parseInt(result[3], 10)
820 }) : undefined;
821 } else {
822 const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])([a-f\d])?$/i;
823 const hexFixed = input.replace(shorthandRegex, (_m, r, g, b, a) => {
824 return r + r + g + g + b + b + (a !== undefined ? a + a : "");
825 });
826 const regex = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})?$/i;
827 const result = regex.exec(hexFixed);
828 return result ? {
829 a: result[4] !== undefined ? parseInt(result[4], 16) / 0xff : 1,
830 b: parseInt(result[3], 16),
831 g: parseInt(result[2], 16),
832 r: parseInt(result[1], 16)
833 } : undefined;
834 }
835}
836
837class ColorUtils {
838 static colorToRgb(input, index, useIndex = true) {
839 var _a, _b, _c;
840
841 if (input === undefined) {
842 return;
843 }
844
845 const color = typeof input === "string" ? {
846 value: input
847 } : input;
848 let res;
849
850 if (typeof color.value === "string") {
851 if (color.value === Constants.randomColorValue) {
852 res = ColorUtils.getRandomRgbColor();
853 } else {
854 res = ColorUtils.stringToRgb(color.value);
855 }
856 } else {
857 if (color.value instanceof Array) {
858 const colorSelected = Utils.itemFromArray(color.value, index, useIndex);
859 res = ColorUtils.colorToRgb({
860 value: colorSelected
861 });
862 } else {
863 const colorValue = color.value;
864 const rgbColor = (_a = colorValue.rgb) !== null && _a !== void 0 ? _a : color.value;
865
866 if (rgbColor.r !== undefined) {
867 res = rgbColor;
868 } else {
869 const hslColor = (_b = colorValue.hsl) !== null && _b !== void 0 ? _b : color.value;
870
871 if (hslColor.h !== undefined && hslColor.l !== undefined) {
872 res = ColorUtils.hslToRgb(hslColor);
873 } else {
874 const hsvColor = (_c = colorValue.hsv) !== null && _c !== void 0 ? _c : color.value;
875
876 if (hsvColor.h !== undefined && hsvColor.v !== undefined) {
877 res = ColorUtils.hsvToRgb(hsvColor);
878 }
879 }
880 }
881 }
882 }
883
884 return res;
885 }
886
887 static colorToHsl(color, index, useIndex = true) {
888 const rgb = ColorUtils.colorToRgb(color, index, useIndex);
889 return rgb !== undefined ? ColorUtils.rgbToHsl(rgb) : undefined;
890 }
891
892 static rgbToHsl(color) {
893 const r1 = color.r / 255;
894 const g1 = color.g / 255;
895 const b1 = color.b / 255;
896 const max = Math.max(r1, g1, b1);
897 const min = Math.min(r1, g1, b1);
898 const res = {
899 h: 0,
900 l: (max + min) / 2,
901 s: 0
902 };
903
904 if (max != min) {
905 res.s = res.l < 0.5 ? (max - min) / (max + min) : (max - min) / (2.0 - max - min);
906 res.h = r1 === max ? (g1 - b1) / (max - min) : res.h = g1 === max ? 2.0 + (b1 - r1) / (max - min) : 4.0 + (r1 - g1) / (max - min);
907 }
908
909 res.l *= 100;
910 res.s *= 100;
911 res.h *= 60;
912
913 if (res.h < 0) {
914 res.h += 360;
915 }
916
917 return res;
918 }
919
920 static stringToAlpha(input) {
921 var _a;
922
923 return (_a = stringToRgba(input)) === null || _a === void 0 ? void 0 : _a.a;
924 }
925
926 static stringToRgb(input) {
927 return stringToRgba(input);
928 }
929
930 static hslToRgb(hsl) {
931 const result = {
932 b: 0,
933 g: 0,
934 r: 0
935 };
936 const hslPercent = {
937 h: hsl.h / 360,
938 l: hsl.l / 100,
939 s: hsl.s / 100
940 };
941
942 if (hslPercent.s === 0) {
943 result.b = hslPercent.l;
944 result.g = hslPercent.l;
945 result.r = hslPercent.l;
946 } else {
947 const q = hslPercent.l < 0.5 ? hslPercent.l * (1 + hslPercent.s) : hslPercent.l + hslPercent.s - hslPercent.l * hslPercent.s;
948 const p = 2 * hslPercent.l - q;
949 result.r = hue2rgb(p, q, hslPercent.h + 1 / 3);
950 result.g = hue2rgb(p, q, hslPercent.h);
951 result.b = hue2rgb(p, q, hslPercent.h - 1 / 3);
952 }
953
954 result.r = Math.floor(result.r * 255);
955 result.g = Math.floor(result.g * 255);
956 result.b = Math.floor(result.b * 255);
957 return result;
958 }
959
960 static hslaToRgba(hsla) {
961 const rgbResult = ColorUtils.hslToRgb(hsla);
962 return {
963 a: hsla.a,
964 b: rgbResult.b,
965 g: rgbResult.g,
966 r: rgbResult.r
967 };
968 }
969
970 static hslToHsv(hsl) {
971 const l = hsl.l / 100,
972 sl = hsl.s / 100;
973 const v = l + sl * Math.min(l, 1 - l),
974 sv = !v ? 0 : 2 * (1 - l / v);
975 return {
976 h: hsl.h,
977 s: sv * 100,
978 v: v * 100
979 };
980 }
981
982 static hslaToHsva(hsla) {
983 const hsvResult = ColorUtils.hslToHsv(hsla);
984 return {
985 a: hsla.a,
986 h: hsvResult.h,
987 s: hsvResult.s,
988 v: hsvResult.v
989 };
990 }
991
992 static hsvToHsl(hsv) {
993 const v = hsv.v / 100,
994 sv = hsv.s / 100;
995 const l = v * (1 - sv / 2),
996 sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
997 return {
998 h: hsv.h,
999 l: l * 100,
1000 s: sl * 100
1001 };
1002 }
1003
1004 static hsvaToHsla(hsva) {
1005 const hslResult = ColorUtils.hsvToHsl(hsva);
1006 return {
1007 a: hsva.a,
1008 h: hslResult.h,
1009 l: hslResult.l,
1010 s: hslResult.s
1011 };
1012 }
1013
1014 static hsvToRgb(hsv) {
1015 const result = {
1016 b: 0,
1017 g: 0,
1018 r: 0
1019 };
1020 const hsvPercent = {
1021 h: hsv.h / 60,
1022 s: hsv.s / 100,
1023 v: hsv.v / 100
1024 };
1025 const c = hsvPercent.v * hsvPercent.s,
1026 x = c * (1 - Math.abs(hsvPercent.h % 2 - 1));
1027 let tempRgb;
1028
1029 if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
1030 tempRgb = {
1031 r: c,
1032 g: x,
1033 b: 0
1034 };
1035 } else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
1036 tempRgb = {
1037 r: x,
1038 g: c,
1039 b: 0
1040 };
1041 } else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
1042 tempRgb = {
1043 r: 0,
1044 g: c,
1045 b: x
1046 };
1047 } else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
1048 tempRgb = {
1049 r: 0,
1050 g: x,
1051 b: c
1052 };
1053 } else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
1054 tempRgb = {
1055 r: x,
1056 g: 0,
1057 b: c
1058 };
1059 } else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
1060 tempRgb = {
1061 r: c,
1062 g: 0,
1063 b: x
1064 };
1065 }
1066
1067 if (tempRgb) {
1068 const m = hsvPercent.v - c;
1069 result.r = Math.floor((tempRgb.r + m) * 255);
1070 result.g = Math.floor((tempRgb.g + m) * 255);
1071 result.b = Math.floor((tempRgb.b + m) * 255);
1072 }
1073
1074 return result;
1075 }
1076
1077 static hsvaToRgba(hsva) {
1078 const rgbResult = ColorUtils.hsvToRgb(hsva);
1079 return {
1080 a: hsva.a,
1081 b: rgbResult.b,
1082 g: rgbResult.g,
1083 r: rgbResult.r
1084 };
1085 }
1086
1087 static rgbToHsv(rgb) {
1088 const rgbPercent = {
1089 r: rgb.r / 255,
1090 g: rgb.g / 255,
1091 b: rgb.b / 255
1092 },
1093 xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b),
1094 xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b),
1095 v = xMax,
1096 c = xMax - xMin;
1097 let h = 0;
1098
1099 if (v === rgbPercent.r) {
1100 h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
1101 } else if (v === rgbPercent.g) {
1102 h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
1103 } else if (v === rgbPercent.b) {
1104 h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
1105 }
1106
1107 const s = !v ? 0 : c / v;
1108 return {
1109 h,
1110 s: s * 100,
1111 v: v * 100
1112 };
1113 }
1114
1115 static rgbaToHsva(rgba) {
1116 const hsvResult = ColorUtils.rgbToHsv(rgba);
1117 return {
1118 a: rgba.a,
1119 h: hsvResult.h,
1120 s: hsvResult.s,
1121 v: hsvResult.v
1122 };
1123 }
1124
1125 static getRandomRgbColor(min) {
1126 const fixedMin = min !== null && min !== void 0 ? min : 0;
1127 return {
1128 b: Math.floor(NumberUtils.randomInRange(NumberUtils.setRangeValue(fixedMin, 256))),
1129 g: Math.floor(NumberUtils.randomInRange(NumberUtils.setRangeValue(fixedMin, 256))),
1130 r: Math.floor(NumberUtils.randomInRange(NumberUtils.setRangeValue(fixedMin, 256)))
1131 };
1132 }
1133
1134 static getStyleFromRgb(color, opacity) {
1135 return `rgba(${color.r}, ${color.g}, ${color.b}, ${opacity !== null && opacity !== void 0 ? opacity : 1})`;
1136 }
1137
1138 static getStyleFromHsl(color, opacity) {
1139 return `hsla(${color.h}, ${color.s}%, ${color.l}%, ${opacity !== null && opacity !== void 0 ? opacity : 1})`;
1140 }
1141
1142 static getStyleFromHsv(color, opacity) {
1143 return ColorUtils.getStyleFromHsl(ColorUtils.hsvToHsl(color), opacity);
1144 }
1145
1146 static mix(color1, color2, size1, size2) {
1147 let rgb1 = color1;
1148 let rgb2 = color2;
1149
1150 if (rgb1.r === undefined) {
1151 rgb1 = ColorUtils.hslToRgb(color1);
1152 }
1153
1154 if (rgb2.r === undefined) {
1155 rgb2 = ColorUtils.hslToRgb(color2);
1156 }
1157
1158 return {
1159 b: NumberUtils.mix(rgb1.b, rgb2.b, size1, size2),
1160 g: NumberUtils.mix(rgb1.g, rgb2.g, size1, size2),
1161 r: NumberUtils.mix(rgb1.r, rgb2.r, size1, size2)
1162 };
1163 }
1164
1165 static replaceColorSvg(image, color, opacity) {
1166 if (!image.svgData) {
1167 return "";
1168 }
1169
1170 const svgXml = image.svgData;
1171 const rgbHex = /#([0-9A-F]{3,6})/gi;
1172 return svgXml.replace(rgbHex, () => ColorUtils.getStyleFromHsl(color, opacity));
1173 }
1174
1175 static getLinkColor(p1, p2, linkColor) {
1176 var _a, _b;
1177
1178 if (linkColor === Constants.randomColorValue) {
1179 return ColorUtils.getRandomRgbColor();
1180 } else if (linkColor === "mid") {
1181 const sourceColor = (_a = p1.getFillColor()) !== null && _a !== void 0 ? _a : p1.getStrokeColor();
1182 const destColor = (_b = p2 === null || p2 === void 0 ? void 0 : p2.getFillColor()) !== null && _b !== void 0 ? _b : p2 === null || p2 === void 0 ? void 0 : p2.getStrokeColor();
1183
1184 if (sourceColor && destColor && p2) {
1185 return ColorUtils.mix(sourceColor, destColor, p1.getRadius(), p2.getRadius());
1186 } else {
1187 const hslColor = sourceColor !== null && sourceColor !== void 0 ? sourceColor : destColor;
1188
1189 if (hslColor) {
1190 return ColorUtils.hslToRgb(hslColor);
1191 }
1192 }
1193 } else {
1194 return linkColor;
1195 }
1196 }
1197
1198 static getLinkRandomColor(optColor, blink, consent) {
1199 const color = typeof optColor === "string" ? optColor : optColor.value;
1200
1201 if (color === Constants.randomColorValue) {
1202 if (consent) {
1203 return ColorUtils.colorToRgb({
1204 value: color
1205 });
1206 } else if (blink) {
1207 return Constants.randomColorValue;
1208 } else {
1209 return Constants.midColorValue;
1210 }
1211 } else {
1212 return ColorUtils.colorToRgb({
1213 value: color
1214 });
1215 }
1216 }
1217
1218 static getHslFromAnimation(animation) {
1219 return animation !== undefined ? {
1220 h: animation.h.value,
1221 s: animation.s.value,
1222 l: animation.l.value
1223 } : undefined;
1224 }
1225
1226}
1227;// CONCATENATED MODULE: ./dist/browser/Utils/CanvasUtils.js
1228
1229
1230
1231function drawLine(context, begin, end) {
1232 context.beginPath();
1233 context.moveTo(begin.x, begin.y);
1234 context.lineTo(end.x, end.y);
1235 context.closePath();
1236}
1237
1238function drawTriangle(context, p1, p2, p3) {
1239 context.beginPath();
1240 context.moveTo(p1.x, p1.y);
1241 context.lineTo(p2.x, p2.y);
1242 context.lineTo(p3.x, p3.y);
1243 context.closePath();
1244}
1245
1246class CanvasUtils {
1247 static paintBase(context, dimension, baseColor) {
1248 context.save();
1249 context.fillStyle = baseColor !== null && baseColor !== void 0 ? baseColor : "rgba(0,0,0,0)";
1250 context.fillRect(0, 0, dimension.width, dimension.height);
1251 context.restore();
1252 }
1253
1254 static clear(context, dimension) {
1255 context.clearRect(0, 0, dimension.width, dimension.height);
1256 }
1257
1258 static drawLinkLine(context, width, begin, end, maxDistance, canvasSize, warp, backgroundMask, composite, colorLine, opacity, shadow) {
1259 let drawn = false;
1260
1261 if (NumberUtils.getDistance(begin, end) <= maxDistance) {
1262 drawLine(context, begin, end);
1263 drawn = true;
1264 } else if (warp) {
1265 let pi1;
1266 let pi2;
1267 const endNE = {
1268 x: end.x - canvasSize.width,
1269 y: end.y
1270 };
1271 const d1 = NumberUtils.getDistances(begin, endNE);
1272
1273 if (d1.distance <= maxDistance) {
1274 const yi = begin.y - d1.dy / d1.dx * begin.x;
1275 pi1 = {
1276 x: 0,
1277 y: yi
1278 };
1279 pi2 = {
1280 x: canvasSize.width,
1281 y: yi
1282 };
1283 } else {
1284 const endSW = {
1285 x: end.x,
1286 y: end.y - canvasSize.height
1287 };
1288 const d2 = NumberUtils.getDistances(begin, endSW);
1289
1290 if (d2.distance <= maxDistance) {
1291 const yi = begin.y - d2.dy / d2.dx * begin.x;
1292 const xi = -yi / (d2.dy / d2.dx);
1293 pi1 = {
1294 x: xi,
1295 y: 0
1296 };
1297 pi2 = {
1298 x: xi,
1299 y: canvasSize.height
1300 };
1301 } else {
1302 const endSE = {
1303 x: end.x - canvasSize.width,
1304 y: end.y - canvasSize.height
1305 };
1306 const d3 = NumberUtils.getDistances(begin, endSE);
1307
1308 if (d3.distance <= maxDistance) {
1309 const yi = begin.y - d3.dy / d3.dx * begin.x;
1310 const xi = -yi / (d3.dy / d3.dx);
1311 pi1 = {
1312 x: xi,
1313 y: yi
1314 };
1315 pi2 = {
1316 x: pi1.x + canvasSize.width,
1317 y: pi1.y + canvasSize.height
1318 };
1319 }
1320 }
1321 }
1322
1323 if (pi1 && pi2) {
1324 drawLine(context, begin, pi1);
1325 drawLine(context, end, pi2);
1326 drawn = true;
1327 }
1328 }
1329
1330 if (!drawn) {
1331 return;
1332 }
1333
1334 context.lineWidth = width;
1335
1336 if (backgroundMask) {
1337 context.globalCompositeOperation = composite;
1338 }
1339
1340 context.strokeStyle = ColorUtils.getStyleFromRgb(colorLine, opacity);
1341
1342 if (shadow.enable) {
1343 const shadowColor = ColorUtils.colorToRgb(shadow.color);
1344
1345 if (shadowColor) {
1346 context.shadowBlur = shadow.blur;
1347 context.shadowColor = ColorUtils.getStyleFromRgb(shadowColor);
1348 }
1349 }
1350
1351 context.stroke();
1352 }
1353
1354 static drawLinkTriangle(context, pos1, pos2, pos3, backgroundMask, composite, colorTriangle, opacityTriangle) {
1355 drawTriangle(context, pos1, pos2, pos3);
1356
1357 if (backgroundMask) {
1358 context.globalCompositeOperation = composite;
1359 }
1360
1361 context.fillStyle = ColorUtils.getStyleFromRgb(colorTriangle, opacityTriangle);
1362 context.fill();
1363 }
1364
1365 static drawConnectLine(context, width, lineStyle, begin, end) {
1366 context.save();
1367 drawLine(context, begin, end);
1368 context.lineWidth = width;
1369 context.strokeStyle = lineStyle;
1370 context.stroke();
1371 context.restore();
1372 }
1373
1374 static gradient(context, p1, p2, opacity) {
1375 const gradStop = Math.floor(p2.getRadius() / p1.getRadius());
1376 const color1 = p1.getFillColor();
1377 const color2 = p2.getFillColor();
1378
1379 if (!color1 || !color2) {
1380 return;
1381 }
1382
1383 const sourcePos = p1.getPosition();
1384 const destPos = p2.getPosition();
1385 const midRgb = ColorUtils.mix(color1, color2, p1.getRadius(), p2.getRadius());
1386 const grad = context.createLinearGradient(sourcePos.x, sourcePos.y, destPos.x, destPos.y);
1387 grad.addColorStop(0, ColorUtils.getStyleFromHsl(color1, opacity));
1388 grad.addColorStop(gradStop > 1 ? 1 : gradStop, ColorUtils.getStyleFromRgb(midRgb, opacity));
1389 grad.addColorStop(1, ColorUtils.getStyleFromHsl(color2, opacity));
1390 return grad;
1391 }
1392
1393 static drawGrabLine(context, width, begin, end, colorLine, opacity) {
1394 context.save();
1395 drawLine(context, begin, end);
1396 context.strokeStyle = ColorUtils.getStyleFromRgb(colorLine, opacity);
1397 context.lineWidth = width;
1398 context.stroke();
1399 context.restore();
1400 }
1401
1402 static drawLight(container, context, mousePos) {
1403 const lightOptions = container.actualOptions.interactivity.modes.light.area;
1404 context.beginPath();
1405 context.arc(mousePos.x, mousePos.y, lightOptions.radius, 0, 2 * Math.PI);
1406 const gradientAmbientLight = context.createRadialGradient(mousePos.x, mousePos.y, 0, mousePos.x, mousePos.y, lightOptions.radius);
1407 const gradient = lightOptions.gradient;
1408 const gradientRgb = {
1409 start: ColorUtils.colorToRgb(gradient.start),
1410 stop: ColorUtils.colorToRgb(gradient.stop)
1411 };
1412
1413 if (!gradientRgb.start || !gradientRgb.stop) {
1414 return;
1415 }
1416
1417 gradientAmbientLight.addColorStop(0, ColorUtils.getStyleFromRgb(gradientRgb.start));
1418 gradientAmbientLight.addColorStop(1, ColorUtils.getStyleFromRgb(gradientRgb.stop));
1419 context.fillStyle = gradientAmbientLight;
1420 context.fill();
1421 }
1422
1423 static drawParticleShadow(container, context, particle, mousePos) {
1424 const pos = particle.getPosition();
1425 const shadowOptions = container.actualOptions.interactivity.modes.light.shadow;
1426 context.save();
1427 const radius = particle.getRadius();
1428 const sides = particle.sides;
1429 const full = Math.PI * 2 / sides;
1430 const angle = -particle.rotate.value + Math.PI / 4;
1431 const factor = 1;
1432 const dots = [];
1433
1434 for (let i = 0; i < sides; i++) {
1435 dots.push({
1436 x: pos.x + radius * Math.sin(angle + full * i) * factor,
1437 y: pos.y + radius * Math.cos(angle + full * i) * factor
1438 });
1439 }
1440
1441 const points = [];
1442 const shadowLength = shadowOptions.length;
1443
1444 for (const dot of dots) {
1445 const dotAngle = Math.atan2(mousePos.y - dot.y, mousePos.x - dot.x);
1446 const endX = dot.x + shadowLength * Math.sin(-dotAngle - Math.PI / 2);
1447 const endY = dot.y + shadowLength * Math.cos(-dotAngle - Math.PI / 2);
1448 points.push({
1449 endX: endX,
1450 endY: endY,
1451 startX: dot.x,
1452 startY: dot.y
1453 });
1454 }
1455
1456 const shadowRgb = ColorUtils.colorToRgb(shadowOptions.color);
1457
1458 if (!shadowRgb) {
1459 return;
1460 }
1461
1462 const shadowColor = ColorUtils.getStyleFromRgb(shadowRgb);
1463
1464 for (let i = points.length - 1; i >= 0; i--) {
1465 const n = i == points.length - 1 ? 0 : i + 1;
1466 context.beginPath();
1467 context.moveTo(points[i].startX, points[i].startY);
1468 context.lineTo(points[n].startX, points[n].startY);
1469 context.lineTo(points[n].endX, points[n].endY);
1470 context.lineTo(points[i].endX, points[i].endY);
1471 context.fillStyle = shadowColor;
1472 context.fill();
1473 }
1474
1475 context.restore();
1476 }
1477
1478 static drawParticle(container, context, particle, delta, fillColorValue, strokeColorValue, backgroundMask, composite, radius, opacity, shadow) {
1479 const pos = particle.getPosition();
1480 context.save();
1481 context.translate(pos.x, pos.y);
1482 context.beginPath();
1483 const angle = particle.rotate.value + (particle.options.rotate.path ? particle.velocity.angle : 0);
1484
1485 if (angle !== 0) {
1486 context.rotate(angle);
1487 }
1488
1489 if (backgroundMask) {
1490 context.globalCompositeOperation = composite;
1491 }
1492
1493 const shadowColor = particle.shadowColor;
1494
1495 if (shadow.enable && shadowColor) {
1496 context.shadowBlur = shadow.blur;
1497 context.shadowColor = ColorUtils.getStyleFromRgb(shadowColor);
1498 context.shadowOffsetX = shadow.offset.x;
1499 context.shadowOffsetY = shadow.offset.y;
1500 }
1501
1502 if (fillColorValue) {
1503 context.fillStyle = fillColorValue;
1504 }
1505
1506 const stroke = particle.stroke;
1507 context.lineWidth = particle.strokeWidth;
1508
1509 if (strokeColorValue) {
1510 context.strokeStyle = strokeColorValue;
1511 }
1512
1513 CanvasUtils.drawShape(container, context, particle, radius, opacity, delta);
1514
1515 if (stroke.width > 0) {
1516 context.stroke();
1517 }
1518
1519 if (particle.close) {
1520 context.closePath();
1521 }
1522
1523 if (particle.fill) {
1524 context.fill();
1525 }
1526
1527 context.restore();
1528 context.save();
1529 context.translate(pos.x, pos.y);
1530
1531 if (angle !== 0) {
1532 context.rotate(angle);
1533 }
1534
1535 if (backgroundMask) {
1536 context.globalCompositeOperation = composite;
1537 }
1538
1539 CanvasUtils.drawShapeAfterEffect(container, context, particle, radius, opacity, delta);
1540 context.restore();
1541 }
1542
1543 static drawShape(container, context, particle, radius, opacity, delta) {
1544 if (!particle.shape) {
1545 return;
1546 }
1547
1548 const drawer = container.drawers.get(particle.shape);
1549
1550 if (!drawer) {
1551 return;
1552 }
1553
1554 drawer.draw(context, particle, radius, opacity, delta, container.retina.pixelRatio);
1555 }
1556
1557 static drawShapeAfterEffect(container, context, particle, radius, opacity, delta) {
1558 if (!particle.shape) {
1559 return;
1560 }
1561
1562 const drawer = container.drawers.get(particle.shape);
1563
1564 if (!(drawer === null || drawer === void 0 ? void 0 : drawer.afterEffect)) {
1565 return;
1566 }
1567
1568 drawer.afterEffect(context, particle, radius, opacity, delta, container.retina.pixelRatio);
1569 }
1570
1571 static drawPlugin(context, plugin, delta) {
1572 if (plugin.draw !== undefined) {
1573 context.save();
1574 plugin.draw(context, delta);
1575 context.restore();
1576 }
1577 }
1578
1579}
1580;// CONCATENATED MODULE: ./dist/browser/Utils/Range.js
1581class Range {
1582 constructor(x, y) {
1583 this.position = {
1584 x: x,
1585 y: y
1586 };
1587 }
1588
1589}
1590;// CONCATENATED MODULE: ./dist/browser/Utils/Circle.js
1591
1592class Circle extends Range {
1593 constructor(x, y, radius) {
1594 super(x, y);
1595 this.radius = radius;
1596 }
1597
1598 contains(point) {
1599 const d = Math.pow(point.x - this.position.x, 2) + Math.pow(point.y - this.position.y, 2);
1600 return d <= this.radius * this.radius;
1601 }
1602
1603 intersects(range) {
1604 const rect = range;
1605 const circle = range;
1606 const pos1 = this.position;
1607 const pos2 = range.position;
1608 const xDist = Math.abs(pos2.x - pos1.x);
1609 const yDist = Math.abs(pos2.y - pos1.y);
1610 const r = this.radius;
1611
1612 if (circle.radius !== undefined) {
1613 const rSum = r + circle.radius;
1614 const dist = Math.sqrt(xDist * xDist + yDist + yDist);
1615 return rSum > dist;
1616 } else if (rect.size !== undefined) {
1617 const w = rect.size.width;
1618 const h = rect.size.height;
1619 const edges = Math.pow(xDist - w, 2) + Math.pow(yDist - h, 2);
1620
1621 if (xDist > r + w || yDist > r + h) {
1622 return false;
1623 }
1624
1625 if (xDist <= w || yDist <= h) {
1626 return true;
1627 }
1628
1629 return edges <= r * r;
1630 }
1631
1632 return false;
1633 }
1634
1635}
1636;// CONCATENATED MODULE: ./dist/browser/Utils/Rectangle.js
1637
1638class Rectangle extends Range {
1639 constructor(x, y, width, height) {
1640 super(x, y);
1641 this.size = {
1642 height: height,
1643 width: width
1644 };
1645 }
1646
1647 contains(point) {
1648 const w = this.size.width;
1649 const h = this.size.height;
1650 const pos = this.position;
1651 return point.x >= pos.x && point.x <= pos.x + w && point.y >= pos.y && point.y <= pos.y + h;
1652 }
1653
1654 intersects(range) {
1655 const rect = range;
1656 const circle = range;
1657 const w = this.size.width;
1658 const h = this.size.height;
1659 const pos1 = this.position;
1660 const pos2 = range.position;
1661
1662 if (circle.radius !== undefined) {
1663 return circle.intersects(this);
1664 } else if (rect.size !== undefined) {
1665 const size2 = rect.size;
1666 const w2 = size2.width;
1667 const h2 = size2.height;
1668 return pos2.x < pos1.x + w && pos2.x + w2 > pos1.x && pos2.y < pos1.y + h && pos2.y + h2 > pos1.y;
1669 }
1670
1671 return false;
1672 }
1673
1674}
1675;// CONCATENATED MODULE: ./dist/browser/Utils/CircleWarp.js
1676
1677
1678class CircleWarp extends Circle {
1679 constructor(x, y, radius, canvasSize) {
1680 super(x, y, radius);
1681 this.canvasSize = canvasSize;
1682 this.canvasSize = {
1683 height: canvasSize.height,
1684 width: canvasSize.width
1685 };
1686 }
1687
1688 contains(point) {
1689 if (super.contains(point)) {
1690 return true;
1691 }
1692
1693 const posNE = {
1694 x: point.x - this.canvasSize.width,
1695 y: point.y
1696 };
1697
1698 if (super.contains(posNE)) {
1699 return true;
1700 }
1701
1702 const posSE = {
1703 x: point.x - this.canvasSize.width,
1704 y: point.y - this.canvasSize.height
1705 };
1706
1707 if (super.contains(posSE)) {
1708 return true;
1709 }
1710
1711 const posSW = {
1712 x: point.x,
1713 y: point.y - this.canvasSize.height
1714 };
1715 return super.contains(posSW);
1716 }
1717
1718 intersects(range) {
1719 if (super.intersects(range)) {
1720 return true;
1721 }
1722
1723 const rect = range;
1724 const circle = range;
1725 const newPos = {
1726 x: range.position.x - this.canvasSize.width,
1727 y: range.position.y - this.canvasSize.height
1728 };
1729
1730 if (circle.radius !== undefined) {
1731 const biggerCircle = new Circle(newPos.x, newPos.y, circle.radius * 2);
1732 return super.intersects(biggerCircle);
1733 } else if (rect.size !== undefined) {
1734 const rectSW = new Rectangle(newPos.x, newPos.y, rect.size.width * 2, rect.size.height * 2);
1735 return super.intersects(rectSW);
1736 }
1737
1738 return false;
1739 }
1740
1741}
1742;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/ClickMode.js
1743var ClickMode;
1744
1745(function (ClickMode) {
1746 ClickMode["attract"] = "attract";
1747 ClickMode["bubble"] = "bubble";
1748 ClickMode["push"] = "push";
1749 ClickMode["remove"] = "remove";
1750 ClickMode["repulse"] = "repulse";
1751 ClickMode["pause"] = "pause";
1752 ClickMode["trail"] = "trail";
1753})(ClickMode || (ClickMode = {}));
1754;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/DestroyMode.js
1755var DestroyMode;
1756
1757(function (DestroyMode) {
1758 DestroyMode["none"] = "none";
1759 DestroyMode["split"] = "split";
1760})(DestroyMode || (DestroyMode = {}));
1761;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/DivMode.js
1762var DivMode;
1763
1764(function (DivMode) {
1765 DivMode["bounce"] = "bounce";
1766 DivMode["bubble"] = "bubble";
1767 DivMode["repulse"] = "repulse";
1768})(DivMode || (DivMode = {}));
1769;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/HoverMode.js
1770var HoverMode;
1771
1772(function (HoverMode) {
1773 HoverMode["attract"] = "attract";
1774 HoverMode["bounce"] = "bounce";
1775 HoverMode["bubble"] = "bubble";
1776 HoverMode["connect"] = "connect";
1777 HoverMode["grab"] = "grab";
1778 HoverMode["light"] = "light";
1779 HoverMode["repulse"] = "repulse";
1780 HoverMode["slow"] = "slow";
1781 HoverMode["trail"] = "trail";
1782})(HoverMode || (HoverMode = {}));
1783;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/CollisionMode.js
1784var CollisionMode;
1785
1786(function (CollisionMode) {
1787 CollisionMode["absorb"] = "absorb";
1788 CollisionMode["bounce"] = "bounce";
1789 CollisionMode["destroy"] = "destroy";
1790})(CollisionMode || (CollisionMode = {}));
1791;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/OutMode.js
1792var OutMode;
1793
1794(function (OutMode) {
1795 OutMode["bounce"] = "bounce";
1796 OutMode["bounceHorizontal"] = "bounce-horizontal";
1797 OutMode["bounceVertical"] = "bounce-vertical";
1798 OutMode["none"] = "none";
1799 OutMode["out"] = "out";
1800 OutMode["destroy"] = "destroy";
1801 OutMode["split"] = "split";
1802})(OutMode || (OutMode = {}));
1803;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/SizeMode.js
1804var SizeMode;
1805
1806(function (SizeMode) {
1807 SizeMode["precise"] = "precise";
1808 SizeMode["percent"] = "percent";
1809})(SizeMode || (SizeMode = {}));
1810;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/ThemeMode.js
1811var ThemeMode;
1812
1813(function (ThemeMode) {
1814 ThemeMode["any"] = "any";
1815 ThemeMode["dark"] = "dark";
1816 ThemeMode["light"] = "light";
1817})(ThemeMode || (ThemeMode = {}));
1818;// CONCATENATED MODULE: ./dist/browser/Enums/Modes/index.js
1819
1820
1821
1822
1823
1824
1825
1826
1827;// CONCATENATED MODULE: ./dist/browser/Enums/AnimationStatus.js
1828var AnimationStatus;
1829
1830(function (AnimationStatus) {
1831 AnimationStatus[AnimationStatus["increasing"] = 0] = "increasing";
1832 AnimationStatus[AnimationStatus["decreasing"] = 1] = "decreasing";
1833})(AnimationStatus || (AnimationStatus = {}));
1834;// CONCATENATED MODULE: ./dist/browser/Enums/Types/DestroyType.js
1835var DestroyType;
1836
1837(function (DestroyType) {
1838 DestroyType["none"] = "none";
1839 DestroyType["max"] = "max";
1840 DestroyType["min"] = "min";
1841})(DestroyType || (DestroyType = {}));
1842;// CONCATENATED MODULE: ./dist/browser/Enums/Types/ProcessBubbleType.js
1843var ProcessBubbleType;
1844
1845(function (ProcessBubbleType) {
1846 ProcessBubbleType["color"] = "color";
1847 ProcessBubbleType["opacity"] = "opacity";
1848 ProcessBubbleType["size"] = "size";
1849})(ProcessBubbleType || (ProcessBubbleType = {}));
1850;// CONCATENATED MODULE: ./dist/browser/Enums/Types/ShapeType.js
1851var ShapeType;
1852
1853(function (ShapeType) {
1854 ShapeType["char"] = "char";
1855 ShapeType["character"] = "character";
1856 ShapeType["circle"] = "circle";
1857 ShapeType["edge"] = "edge";
1858 ShapeType["image"] = "image";
1859 ShapeType["images"] = "images";
1860 ShapeType["line"] = "line";
1861 ShapeType["polygon"] = "polygon";
1862 ShapeType["square"] = "square";
1863 ShapeType["star"] = "star";
1864 ShapeType["triangle"] = "triangle";
1865})(ShapeType || (ShapeType = {}));
1866;// CONCATENATED MODULE: ./dist/browser/Enums/Types/StartValueType.js
1867var StartValueType;
1868
1869(function (StartValueType) {
1870 StartValueType["max"] = "max";
1871 StartValueType["min"] = "min";
1872 StartValueType["random"] = "random";
1873})(StartValueType || (StartValueType = {}));
1874;// CONCATENATED MODULE: ./dist/browser/Enums/Types/DivType.js
1875var DivType;
1876
1877(function (DivType) {
1878 DivType["circle"] = "circle";
1879 DivType["rectangle"] = "rectangle";
1880})(DivType || (DivType = {}));
1881;// CONCATENATED MODULE: ./dist/browser/Enums/Types/index.js
1882
1883
1884
1885
1886
1887;// CONCATENATED MODULE: ./dist/browser/Enums/InteractivityDetect.js
1888var InteractivityDetect;
1889
1890(function (InteractivityDetect) {
1891 InteractivityDetect["canvas"] = "canvas";
1892 InteractivityDetect["parent"] = "parent";
1893 InteractivityDetect["window"] = "window";
1894})(InteractivityDetect || (InteractivityDetect = {}));
1895;// CONCATENATED MODULE: ./dist/browser/Enums/index.js
1896
1897
1898
1899
1900
1901;// CONCATENATED MODULE: ./dist/browser/Utils/EventListeners.js
1902
1903
1904
1905function manageListener(element, event, handler, add, options) {
1906 if (add) {
1907 let addOptions = {
1908 passive: true
1909 };
1910
1911 if (typeof options === "boolean") {
1912 addOptions.capture = options;
1913 } else if (options !== undefined) {
1914 addOptions = options;
1915 }
1916
1917 element.addEventListener(event, handler, addOptions);
1918 } else {
1919 const removeOptions = options;
1920 element.removeEventListener(event, handler, removeOptions);
1921 }
1922}
1923
1924class EventListeners {
1925 constructor(container) {
1926 this.container = container;
1927 this.canPush = true;
1928
1929 this.mouseMoveHandler = e => this.mouseTouchMove(e);
1930
1931 this.touchStartHandler = e => this.mouseTouchMove(e);
1932
1933 this.touchMoveHandler = e => this.mouseTouchMove(e);
1934
1935 this.touchEndHandler = () => this.mouseTouchFinish();
1936
1937 this.mouseLeaveHandler = () => this.mouseTouchFinish();
1938
1939 this.touchCancelHandler = () => this.mouseTouchFinish();
1940
1941 this.touchEndClickHandler = e => this.mouseTouchClick(e);
1942
1943 this.mouseUpHandler = e => this.mouseTouchClick(e);
1944
1945 this.mouseDownHandler = () => this.mouseDown();
1946
1947 this.visibilityChangeHandler = () => this.handleVisibilityChange();
1948
1949 this.resizeHandler = () => this.handleWindowResize();
1950 }
1951
1952 addListeners() {
1953 this.manageListeners(true);
1954 }
1955
1956 removeListeners() {
1957 this.manageListeners(false);
1958 }
1959
1960 manageListeners(add) {
1961 var _a;
1962
1963 const container = this.container;
1964 const options = container.actualOptions;
1965 const detectType = options.interactivity.detectsOn;
1966 let mouseLeaveEvent = Constants.mouseLeaveEvent;
1967
1968 if (detectType === InteractivityDetect.window) {
1969 container.interactivity.element = window;
1970 mouseLeaveEvent = Constants.mouseOutEvent;
1971 } else if (detectType === InteractivityDetect.parent && container.canvas.element) {
1972 const canvasEl = container.canvas.element;
1973 container.interactivity.element = (_a = canvasEl.parentElement) !== null && _a !== void 0 ? _a : canvasEl.parentNode;
1974 } else {
1975 container.interactivity.element = container.canvas.element;
1976 }
1977
1978 const interactivityEl = container.interactivity.element;
1979
1980 if (!interactivityEl) {
1981 return;
1982 }
1983
1984 const html = interactivityEl;
1985
1986 if (options.interactivity.events.onHover.enable || options.interactivity.events.onClick.enable) {
1987 manageListener(interactivityEl, Constants.mouseMoveEvent, this.mouseMoveHandler, add);
1988 manageListener(interactivityEl, Constants.touchStartEvent, this.touchStartHandler, add);
1989 manageListener(interactivityEl, Constants.touchMoveEvent, this.touchMoveHandler, add);
1990
1991 if (!options.interactivity.events.onClick.enable) {
1992 manageListener(interactivityEl, Constants.touchEndEvent, this.touchEndHandler, add);
1993 } else {
1994 manageListener(interactivityEl, Constants.touchEndEvent, this.touchEndClickHandler, add);
1995 manageListener(interactivityEl, Constants.mouseUpEvent, this.mouseUpHandler, add);
1996 manageListener(interactivityEl, Constants.mouseDownEvent, this.mouseDownHandler, add);
1997 }
1998
1999 manageListener(interactivityEl, mouseLeaveEvent, this.mouseLeaveHandler, add);
2000 manageListener(interactivityEl, Constants.touchCancelEvent, this.touchCancelHandler, add);
2001 }
2002
2003 if (container.canvas.element) {
2004 container.canvas.element.style.pointerEvents = html === container.canvas.element ? "initial" : "none";
2005 }
2006
2007 if (options.interactivity.events.resize) {
2008 manageListener(window, Constants.resizeEvent, this.resizeHandler, add);
2009 }
2010
2011 if (document) {
2012 manageListener(document, Constants.visibilityChangeEvent, this.visibilityChangeHandler, add, false);
2013 }
2014 }
2015
2016 handleWindowResize() {
2017 var _a;
2018
2019 (_a = this.container.canvas) === null || _a === void 0 ? void 0 : _a.windowResize();
2020 }
2021
2022 handleVisibilityChange() {
2023 const container = this.container;
2024 const options = container.actualOptions;
2025 this.mouseTouchFinish();
2026
2027 if (!options.pauseOnBlur) {
2028 return;
2029 }
2030
2031 if (document === null || document === void 0 ? void 0 : document.hidden) {
2032 container.pageHidden = true;
2033 container.pause();
2034 } else {
2035 container.pageHidden = false;
2036
2037 if (container.getAnimationStatus()) {
2038 container.play(true);
2039 } else {
2040 container.draw();
2041 }
2042 }
2043 }
2044
2045 mouseDown() {
2046 const interactivity = this.container.interactivity;
2047
2048 if (interactivity) {
2049 const mouse = interactivity.mouse;
2050 mouse.clicking = true;
2051 mouse.downPosition = mouse.position;
2052 }
2053 }
2054
2055 mouseTouchMove(e) {
2056 var _a, _b, _c, _d, _e, _f, _g;
2057
2058 const container = this.container;
2059 const options = container.actualOptions;
2060
2061 if (((_a = container.interactivity) === null || _a === void 0 ? void 0 : _a.element) === undefined) {
2062 return;
2063 }
2064
2065 container.interactivity.mouse.inside = true;
2066 let pos;
2067 const canvas = container.canvas.element;
2068
2069 if (e.type.startsWith("mouse")) {
2070 this.canPush = true;
2071 const mouseEvent = e;
2072
2073 if (container.interactivity.element === window) {
2074 if (canvas) {
2075 const clientRect = canvas.getBoundingClientRect();
2076 pos = {
2077 x: mouseEvent.clientX - clientRect.left,
2078 y: mouseEvent.clientY - clientRect.top
2079 };
2080 }
2081 } else if (options.interactivity.detectsOn === InteractivityDetect.parent) {
2082 const source = mouseEvent.target;
2083 const target = mouseEvent.currentTarget;
2084 const canvasEl = container.canvas.element;
2085
2086 if (source && target && canvasEl) {
2087 const sourceRect = source.getBoundingClientRect();
2088 const targetRect = target.getBoundingClientRect();
2089 const canvasRect = canvasEl.getBoundingClientRect();
2090 pos = {
2091 x: mouseEvent.offsetX + 2 * sourceRect.left - (targetRect.left + canvasRect.left),
2092 y: mouseEvent.offsetY + 2 * sourceRect.top - (targetRect.top + canvasRect.top)
2093 };
2094 } else {
2095 pos = {
2096 x: (_b = mouseEvent.offsetX) !== null && _b !== void 0 ? _b : mouseEvent.clientX,
2097 y: (_c = mouseEvent.offsetY) !== null && _c !== void 0 ? _c : mouseEvent.clientY
2098 };
2099 }
2100 } else {
2101 if (mouseEvent.target === container.canvas.element) {
2102 pos = {
2103 x: (_d = mouseEvent.offsetX) !== null && _d !== void 0 ? _d : mouseEvent.clientX,
2104 y: (_e = mouseEvent.offsetY) !== null && _e !== void 0 ? _e : mouseEvent.clientY
2105 };
2106 }
2107 }
2108 } else {
2109 this.canPush = e.type !== "touchmove";
2110 const touchEvent = e;
2111 const lastTouch = touchEvent.touches[touchEvent.touches.length - 1];
2112 const canvasRect = canvas === null || canvas === void 0 ? void 0 : canvas.getBoundingClientRect();
2113 pos = {
2114 x: lastTouch.clientX - ((_f = canvasRect === null || canvasRect === void 0 ? void 0 : canvasRect.left) !== null && _f !== void 0 ? _f : 0),
2115 y: lastTouch.clientY - ((_g = canvasRect === null || canvasRect === void 0 ? void 0 : canvasRect.top) !== null && _g !== void 0 ? _g : 0)
2116 };
2117 }
2118
2119 const pxRatio = container.retina.pixelRatio;
2120
2121 if (pos) {
2122 pos.x *= pxRatio;
2123 pos.y *= pxRatio;
2124 }
2125
2126 container.interactivity.mouse.position = pos;
2127 container.interactivity.status = Constants.mouseMoveEvent;
2128 }
2129
2130 mouseTouchFinish() {
2131 const interactivity = this.container.interactivity;
2132
2133 if (interactivity === undefined) {
2134 return;
2135 }
2136
2137 const mouse = interactivity.mouse;
2138 delete mouse.position;
2139 delete mouse.clickPosition;
2140 delete mouse.downPosition;
2141 interactivity.status = Constants.mouseLeaveEvent;
2142 mouse.inside = false;
2143 mouse.clicking = false;
2144 }
2145
2146 mouseTouchClick(e) {
2147 const container = this.container;
2148 const options = container.actualOptions;
2149 const mouse = container.interactivity.mouse;
2150 mouse.inside = true;
2151 let handled = false;
2152 const mousePosition = mouse.position;
2153
2154 if (mousePosition === undefined || !options.interactivity.events.onClick.enable) {
2155 return;
2156 }
2157
2158 for (const [, plugin] of container.plugins) {
2159 if (plugin.clickPositionValid !== undefined) {
2160 handled = plugin.clickPositionValid(mousePosition);
2161
2162 if (handled) {
2163 break;
2164 }
2165 }
2166 }
2167
2168 if (!handled) {
2169 this.doMouseTouchClick(e);
2170 }
2171
2172 mouse.clicking = false;
2173 }
2174
2175 doMouseTouchClick(e) {
2176 const container = this.container;
2177 const options = container.actualOptions;
2178
2179 if (this.canPush) {
2180 const mousePos = container.interactivity.mouse.position;
2181
2182 if (mousePos) {
2183 container.interactivity.mouse.clickPosition = {
2184 x: mousePos.x,
2185 y: mousePos.y
2186 };
2187 } else {
2188 return;
2189 }
2190
2191 container.interactivity.mouse.clickTime = new Date().getTime();
2192 const onClick = options.interactivity.events.onClick;
2193
2194 if (onClick.mode instanceof Array) {
2195 for (const mode of onClick.mode) {
2196 this.handleClickMode(mode);
2197 }
2198 } else {
2199 this.handleClickMode(onClick.mode);
2200 }
2201 }
2202
2203 if (e.type === "touchend") {
2204 setTimeout(() => this.mouseTouchFinish(), 500);
2205 }
2206 }
2207
2208 handleClickMode(mode) {
2209 const container = this.container;
2210 const options = container.actualOptions;
2211 const pushNb = options.interactivity.modes.push.quantity;
2212 const removeNb = options.interactivity.modes.remove.quantity;
2213
2214 switch (mode) {
2215 case ClickMode.push:
2216 {
2217 if (pushNb > 0) {
2218 container.particles.push(pushNb, container.interactivity.mouse);
2219 }
2220
2221 break;
2222 }
2223
2224 case ClickMode.remove:
2225 container.particles.removeQuantity(removeNb);
2226 break;
2227
2228 case ClickMode.bubble:
2229 container.bubble.clicking = true;
2230 break;
2231
2232 case ClickMode.repulse:
2233 container.repulse.clicking = true;
2234 container.repulse.count = 0;
2235
2236 for (const particle of container.repulse.particles) {
2237 particle.velocity.setTo(particle.initialVelocity);
2238 }
2239
2240 container.repulse.particles = [];
2241 container.repulse.finish = false;
2242 setTimeout(() => {
2243 if (!container.destroyed) {
2244 container.repulse.clicking = false;
2245 }
2246 }, options.interactivity.modes.repulse.duration * 1000);
2247 break;
2248
2249 case ClickMode.attract:
2250 container.attract.clicking = true;
2251 container.attract.count = 0;
2252
2253 for (const particle of container.attract.particles) {
2254 particle.velocity.setTo(particle.initialVelocity);
2255 }
2256
2257 container.attract.particles = [];
2258 container.attract.finish = false;
2259 setTimeout(() => {
2260 if (!container.destroyed) {
2261 container.attract.clicking = false;
2262 }
2263 }, options.interactivity.modes.attract.duration * 1000);
2264 break;
2265
2266 case ClickMode.pause:
2267 if (container.getAnimationStatus()) {
2268 container.pause();
2269 } else {
2270 container.play();
2271 }
2272
2273 break;
2274 }
2275
2276 for (const [, plugin] of container.plugins) {
2277 if (plugin.handleClickMode) {
2278 plugin.handleClickMode(mode);
2279 }
2280 }
2281 }
2282
2283}
2284;// CONCATENATED MODULE: ./dist/browser/Utils/Plugins.js
2285const plugins = [];
2286const presets = new Map();
2287const drawers = new Map();
2288const pathGenerators = new Map();
2289class Plugins {
2290 static getPlugin(plugin) {
2291 return plugins.find(t => t.id === plugin);
2292 }
2293
2294 static addPlugin(plugin) {
2295 if (!Plugins.getPlugin(plugin.id)) {
2296 plugins.push(plugin);
2297 }
2298 }
2299
2300 static getAvailablePlugins(container) {
2301 const res = new Map();
2302
2303 for (const plugin of plugins) {
2304 if (!plugin.needsPlugin(container.actualOptions)) {
2305 continue;
2306 }
2307
2308 res.set(plugin.id, plugin.getPlugin(container));
2309 }
2310
2311 return res;
2312 }
2313
2314 static loadOptions(options, sourceOptions) {
2315 for (const plugin of plugins) {
2316 plugin.loadOptions(options, sourceOptions);
2317 }
2318 }
2319
2320 static getPreset(preset) {
2321 return presets.get(preset);
2322 }
2323
2324 static addPreset(presetKey, options) {
2325 if (!Plugins.getPreset(presetKey)) {
2326 presets.set(presetKey, options);
2327 }
2328 }
2329
2330 static addShapeDrawer(type, drawer) {
2331 if (!Plugins.getShapeDrawer(type)) {
2332 drawers.set(type, drawer);
2333 }
2334 }
2335
2336 static getShapeDrawer(type) {
2337 return drawers.get(type);
2338 }
2339
2340 static getSupportedShapes() {
2341 return drawers.keys();
2342 }
2343
2344 static getPathGenerator(type) {
2345 return pathGenerators.get(type);
2346 }
2347
2348 static addPathGenerator(type, pathGenerator) {
2349 if (!Plugins.getPathGenerator(type)) {
2350 pathGenerators.set(type, pathGenerator);
2351 }
2352 }
2353
2354}
2355;// CONCATENATED MODULE: ./dist/browser/Utils/Point.js
2356class Point {
2357 constructor(position, particle) {
2358 this.position = position;
2359 this.particle = particle;
2360 }
2361
2362}
2363;// CONCATENATED MODULE: ./dist/browser/Utils/QuadTree.js
2364
2365
2366
2367class QuadTree {
2368 constructor(rectangle, capacity) {
2369 this.rectangle = rectangle;
2370 this.capacity = capacity;
2371 this.points = [];
2372 this.divided = false;
2373 }
2374
2375 subdivide() {
2376 const x = this.rectangle.position.x;
2377 const y = this.rectangle.position.y;
2378 const w = this.rectangle.size.width;
2379 const h = this.rectangle.size.height;
2380 const capacity = this.capacity;
2381 this.northEast = new QuadTree(new Rectangle(x, y, w / 2, h / 2), capacity);
2382 this.northWest = new QuadTree(new Rectangle(x + w / 2, y, w / 2, h / 2), capacity);
2383 this.southEast = new QuadTree(new Rectangle(x, y + h / 2, w / 2, h / 2), capacity);
2384 this.southWest = new QuadTree(new Rectangle(x + w / 2, y + h / 2, w / 2, h / 2), capacity);
2385 this.divided = true;
2386 }
2387
2388 insert(point) {
2389 var _a, _b, _c, _d, _e;
2390
2391 if (!this.rectangle.contains(point.position)) {
2392 return false;
2393 }
2394
2395 if (this.points.length < this.capacity) {
2396 this.points.push(point);
2397 return true;
2398 }
2399
2400 if (!this.divided) {
2401 this.subdivide();
2402 }
2403
2404 return (_e = ((_a = this.northEast) === null || _a === void 0 ? void 0 : _a.insert(point)) || ((_b = this.northWest) === null || _b === void 0 ? void 0 : _b.insert(point)) || ((_c = this.southEast) === null || _c === void 0 ? void 0 : _c.insert(point)) || ((_d = this.southWest) === null || _d === void 0 ? void 0 : _d.insert(point))) !== null && _e !== void 0 ? _e : false;
2405 }
2406
2407 queryCircle(position, radius) {
2408 return this.query(new Circle(position.x, position.y, radius));
2409 }
2410
2411 queryCircleWarp(position, radius, containerOrSize) {
2412 const container = containerOrSize;
2413 const size = containerOrSize;
2414 return this.query(new CircleWarp(position.x, position.y, radius, container.canvas !== undefined ? container.canvas.size : size));
2415 }
2416
2417 queryRectangle(position, size) {
2418 return this.query(new Rectangle(position.x, position.y, size.width, size.height));
2419 }
2420
2421 query(range, found) {
2422 var _a, _b, _c, _d;
2423
2424 const res = found !== null && found !== void 0 ? found : [];
2425
2426 if (!range.intersects(this.rectangle)) {
2427 return [];
2428 } else {
2429 for (const p of this.points) {
2430 if (!range.contains(p.position)) {
2431 continue;
2432 }
2433
2434 res.push(p.particle);
2435 }
2436
2437 if (this.divided) {
2438 (_a = this.northEast) === null || _a === void 0 ? void 0 : _a.query(range, res);
2439 (_b = this.northWest) === null || _b === void 0 ? void 0 : _b.query(range, res);
2440 (_c = this.southEast) === null || _c === void 0 ? void 0 : _c.query(range, res);
2441 (_d = this.southWest) === null || _d === void 0 ? void 0 : _d.query(range, res);
2442 }
2443 }
2444
2445 return res;
2446 }
2447
2448}
2449;// CONCATENATED MODULE: ./dist/browser/Utils/index.js
2450
2451
2452
2453
2454
2455
2456
2457
2458
2459
2460
2461
2462
2463;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/TextDrawer.js
2464var TextDrawer_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
2465 function adopt(value) {
2466 return value instanceof P ? value : new P(function (resolve) {
2467 resolve(value);
2468 });
2469 }
2470
2471 return new (P || (P = Promise))(function (resolve, reject) {
2472 function fulfilled(value) {
2473 try {
2474 step(generator.next(value));
2475 } catch (e) {
2476 reject(e);
2477 }
2478 }
2479
2480 function rejected(value) {
2481 try {
2482 step(generator["throw"](value));
2483 } catch (e) {
2484 reject(e);
2485 }
2486 }
2487
2488 function step(result) {
2489 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
2490 }
2491
2492 step((generator = generator.apply(thisArg, _arguments || [])).next());
2493 });
2494};
2495
2496
2497
2498class TextDrawer {
2499 getSidesCount() {
2500 return 12;
2501 }
2502
2503 init(container) {
2504 var _a;
2505
2506 return TextDrawer_awaiter(this, void 0, void 0, function* () {
2507 const options = container.actualOptions;
2508
2509 if (Utils.isInArray(ShapeType.char, options.particles.shape.type) || Utils.isInArray(ShapeType.character, options.particles.shape.type)) {
2510 const shapeOptions = (_a = options.particles.shape.options[ShapeType.character]) !== null && _a !== void 0 ? _a : options.particles.shape.options[ShapeType.char];
2511
2512 if (shapeOptions instanceof Array) {
2513 for (const character of shapeOptions) {
2514 yield Utils.loadFont(character);
2515 }
2516 } else {
2517 if (shapeOptions !== undefined) {
2518 yield Utils.loadFont(shapeOptions);
2519 }
2520 }
2521 }
2522 });
2523 }
2524
2525 draw(context, particle, radius) {
2526 const character = particle.shapeData;
2527
2528 if (character === undefined) {
2529 return;
2530 }
2531
2532 const textData = character.value;
2533
2534 if (textData === undefined) {
2535 return;
2536 }
2537
2538 const textParticle = particle;
2539
2540 if (textParticle.text === undefined) {
2541 textParticle.text = textData instanceof Array ? Utils.itemFromArray(textData, particle.randomIndexData) : textData;
2542 }
2543
2544 const text = textParticle.text;
2545 const style = character.style;
2546 const weight = character.weight;
2547 const size = Math.round(radius) * 2;
2548 const font = character.font;
2549 const fill = particle.fill;
2550 const offsetX = text.length * radius / 2;
2551 context.font = `${style} ${weight} ${size}px "${font}"`;
2552 const pos = {
2553 x: -offsetX,
2554 y: radius / 2
2555 };
2556
2557 if (fill) {
2558 context.fillText(text, pos.x, pos.y);
2559 } else {
2560 context.strokeText(text, pos.x, pos.y);
2561 }
2562 }
2563
2564}
2565;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/ImageDrawer.js
2566var ImageDrawer_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
2567 function adopt(value) {
2568 return value instanceof P ? value : new P(function (resolve) {
2569 resolve(value);
2570 });
2571 }
2572
2573 return new (P || (P = Promise))(function (resolve, reject) {
2574 function fulfilled(value) {
2575 try {
2576 step(generator.next(value));
2577 } catch (e) {
2578 reject(e);
2579 }
2580 }
2581
2582 function rejected(value) {
2583 try {
2584 step(generator["throw"](value));
2585 } catch (e) {
2586 reject(e);
2587 }
2588 }
2589
2590 function step(result) {
2591 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
2592 }
2593
2594 step((generator = generator.apply(thisArg, _arguments || [])).next());
2595 });
2596};
2597
2598
2599
2600class ImageDrawer {
2601 constructor() {
2602 this.images = [];
2603 }
2604
2605 getSidesCount() {
2606 return 12;
2607 }
2608
2609 getImages(container) {
2610 const containerImages = this.images.filter(t => t.id === container.id);
2611
2612 if (!containerImages.length) {
2613 this.images.push({
2614 id: container.id,
2615 images: []
2616 });
2617 return this.getImages(container);
2618 }
2619
2620 return containerImages[0];
2621 }
2622
2623 addImage(container, image) {
2624 const containerImages = this.getImages(container);
2625 containerImages === null || containerImages === void 0 ? void 0 : containerImages.images.push(image);
2626 }
2627
2628 init(container) {
2629 var _a;
2630
2631 return ImageDrawer_awaiter(this, void 0, void 0, function* () {
2632 const options = container.actualOptions;
2633 const shapeOptions = options.particles.shape;
2634
2635 if (!Utils.isInArray(ShapeType.image, shapeOptions.type) && !Utils.isInArray(ShapeType.images, shapeOptions.type)) {
2636 return;
2637 }
2638
2639 const imageOptions = (_a = shapeOptions.options[ShapeType.images]) !== null && _a !== void 0 ? _a : shapeOptions.options[ShapeType.image];
2640
2641 if (imageOptions instanceof Array) {
2642 for (const optionsImage of imageOptions) {
2643 yield this.loadImageShape(container, optionsImage);
2644 }
2645 } else {
2646 yield this.loadImageShape(container, imageOptions);
2647 }
2648 });
2649 }
2650
2651 destroy() {
2652 this.images = [];
2653 }
2654
2655 loadImageShape(container, imageShape) {
2656 return ImageDrawer_awaiter(this, void 0, void 0, function* () {
2657 try {
2658 const image = imageShape.replaceColor ? yield Utils.downloadSvgImage(imageShape.src) : yield Utils.loadImage(imageShape.src);
2659
2660 if (image) {
2661 this.addImage(container, image);
2662 }
2663 } catch (_a) {
2664 console.warn(`tsParticles error - ${imageShape.src} not found`);
2665 }
2666 });
2667 }
2668
2669 draw(context, particle, radius, opacity) {
2670 var _a, _b;
2671
2672 if (!context) {
2673 return;
2674 }
2675
2676 const image = particle.image;
2677 const element = (_a = image === null || image === void 0 ? void 0 : image.data) === null || _a === void 0 ? void 0 : _a.element;
2678
2679 if (!element) {
2680 return;
2681 }
2682
2683 const ratio = (_b = image === null || image === void 0 ? void 0 : image.ratio) !== null && _b !== void 0 ? _b : 1;
2684 const pos = {
2685 x: -radius,
2686 y: -radius
2687 };
2688
2689 if (!(image === null || image === void 0 ? void 0 : image.data.svgData) || !(image === null || image === void 0 ? void 0 : image.replaceColor)) {
2690 context.globalAlpha = opacity;
2691 }
2692
2693 context.drawImage(element, pos.x, pos.y, radius * 2, radius * 2 / ratio);
2694
2695 if (!(image === null || image === void 0 ? void 0 : image.data.svgData) || !(image === null || image === void 0 ? void 0 : image.replaceColor)) {
2696 context.globalAlpha = 1;
2697 }
2698 }
2699
2700}
2701;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/LineDrawer.js
2702class LineDrawer {
2703 getSidesCount() {
2704 return 1;
2705 }
2706
2707 draw(context, particle, radius) {
2708 context.moveTo(0, -radius / 2);
2709 context.lineTo(0, radius / 2);
2710 }
2711
2712}
2713;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/CircleDrawer.js
2714class CircleDrawer {
2715 getSidesCount() {
2716 return 12;
2717 }
2718
2719 draw(context, particle, radius) {
2720 context.arc(0, 0, radius, 0, Math.PI * 2, false);
2721 }
2722
2723}
2724;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/PolygonDrawerBase.js
2725class PolygonDrawerBase {
2726 getSidesCount(particle) {
2727 var _a, _b;
2728
2729 const polygon = particle.shapeData;
2730 return (_b = (_a = polygon === null || polygon === void 0 ? void 0 : polygon.sides) !== null && _a !== void 0 ? _a : polygon === null || polygon === void 0 ? void 0 : polygon.nb_sides) !== null && _b !== void 0 ? _b : 5;
2731 }
2732
2733 draw(context, particle, radius) {
2734 const start = this.getCenter(particle, radius);
2735 const side = this.getSidesData(particle, radius);
2736 const sideCount = side.count.numerator * side.count.denominator;
2737 const decimalSides = side.count.numerator / side.count.denominator;
2738 const interiorAngleDegrees = 180 * (decimalSides - 2) / decimalSides;
2739 const interiorAngle = Math.PI - Math.PI * interiorAngleDegrees / 180;
2740
2741 if (!context) {
2742 return;
2743 }
2744
2745 context.beginPath();
2746 context.translate(start.x, start.y);
2747 context.moveTo(0, 0);
2748
2749 for (let i = 0; i < sideCount; i++) {
2750 context.lineTo(side.length, 0);
2751 context.translate(side.length, 0);
2752 context.rotate(interiorAngle);
2753 }
2754 }
2755
2756}
2757;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/TriangleDrawer.js
2758
2759class TriangleDrawer extends PolygonDrawerBase {
2760 getSidesCount() {
2761 return 3;
2762 }
2763
2764 getSidesData(particle, radius) {
2765 return {
2766 count: {
2767 denominator: 2,
2768 numerator: 3
2769 },
2770 length: radius * 2
2771 };
2772 }
2773
2774 getCenter(particle, radius) {
2775 return {
2776 x: -radius,
2777 y: radius / 1.66
2778 };
2779 }
2780
2781}
2782;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/StarDrawer.js
2783class StarDrawer {
2784 getSidesCount(particle) {
2785 var _a, _b;
2786
2787 const star = particle.shapeData;
2788 return (_b = (_a = star === null || star === void 0 ? void 0 : star.sides) !== null && _a !== void 0 ? _a : star === null || star === void 0 ? void 0 : star.nb_sides) !== null && _b !== void 0 ? _b : 5;
2789 }
2790
2791 draw(context, particle, radius) {
2792 var _a;
2793
2794 const star = particle.shapeData;
2795 const sides = this.getSidesCount(particle);
2796 const inset = (_a = star === null || star === void 0 ? void 0 : star.inset) !== null && _a !== void 0 ? _a : 2;
2797 context.moveTo(0, 0 - radius);
2798
2799 for (let i = 0; i < sides; i++) {
2800 context.rotate(Math.PI / sides);
2801 context.lineTo(0, 0 - radius * inset);
2802 context.rotate(Math.PI / sides);
2803 context.lineTo(0, 0 - radius);
2804 }
2805 }
2806
2807}
2808;// CONCATENATED MODULE: ./dist/browser/ShapeDrawers/PolygonDrawer.js
2809
2810class PolygonDrawer extends PolygonDrawerBase {
2811 getSidesData(particle, radius) {
2812 var _a, _b;
2813
2814 const polygon = particle.shapeData;
2815 const sides = (_b = (_a = polygon === null || polygon === void 0 ? void 0 : polygon.sides) !== null && _a !== void 0 ? _a : polygon === null || polygon === void 0 ? void 0 : polygon.nb_sides) !== null && _b !== void 0 ? _b : 5;
2816 return {
2817 count: {
2818 denominator: 1,
2819 numerator: sides
2820 },
2821 length: radius * 2.66 / (sides / 3)
2822 };
2823 }
2824
2825 getCenter(particle, radius) {
2826 const sides = this.getSidesCount(particle);
2827 return {
2828 x: -radius / (sides / 3.5),
2829 y: -radius / (2.66 / 3.5)
2830 };
2831 }
2832
2833}
2834;// CONCATENATED MODULE: ./dist/browser/Core/Canvas.js
2835
2836class Canvas {
2837 constructor(container) {
2838 this.container = container;
2839 this.size = {
2840 height: 0,
2841 width: 0
2842 };
2843 this.context = null;
2844 this.generatedCanvas = false;
2845 }
2846
2847 init() {
2848 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
2849
2850 this.resize();
2851 const options = this.container.actualOptions;
2852 const element = this.element;
2853
2854 if (element) {
2855 if (options.fullScreen.enable) {
2856 this.originalStyle = Utils.deepExtend({}, element.style);
2857 element.style.position = "fixed";
2858 element.style.zIndex = options.fullScreen.zIndex.toString(10);
2859 element.style.top = "0";
2860 element.style.left = "0";
2861 element.style.width = "100%";
2862 element.style.height = "100%";
2863 } else {
2864 element.style.position = (_b = (_a = this.originalStyle) === null || _a === void 0 ? void 0 : _a.position) !== null && _b !== void 0 ? _b : "";
2865 element.style.zIndex = (_d = (_c = this.originalStyle) === null || _c === void 0 ? void 0 : _c.zIndex) !== null && _d !== void 0 ? _d : "";
2866 element.style.top = (_f = (_e = this.originalStyle) === null || _e === void 0 ? void 0 : _e.top) !== null && _f !== void 0 ? _f : "";
2867 element.style.left = (_h = (_g = this.originalStyle) === null || _g === void 0 ? void 0 : _g.left) !== null && _h !== void 0 ? _h : "";
2868 element.style.width = (_k = (_j = this.originalStyle) === null || _j === void 0 ? void 0 : _j.width) !== null && _k !== void 0 ? _k : "";
2869 element.style.height = (_m = (_l = this.originalStyle) === null || _l === void 0 ? void 0 : _l.height) !== null && _m !== void 0 ? _m : "";
2870 }
2871 }
2872
2873 const cover = options.backgroundMask.cover;
2874 const color = cover.color;
2875 const trail = options.particles.move.trail;
2876 const coverRgb = ColorUtils.colorToRgb(color);
2877 this.coverColor = coverRgb !== undefined ? {
2878 r: coverRgb.r,
2879 g: coverRgb.g,
2880 b: coverRgb.b,
2881 a: cover.opacity
2882 } : undefined;
2883 this.trailFillColor = ColorUtils.colorToRgb(trail.fillColor);
2884 this.initBackground();
2885 this.paint();
2886 }
2887
2888 loadCanvas(canvas, generatedCanvas) {
2889 var _a;
2890
2891 if (!canvas.className) {
2892 canvas.className = Constants.canvasClass;
2893 }
2894
2895 if (this.generatedCanvas) {
2896 (_a = this.element) === null || _a === void 0 ? void 0 : _a.remove();
2897 }
2898
2899 this.generatedCanvas = generatedCanvas !== null && generatedCanvas !== void 0 ? generatedCanvas : this.generatedCanvas;
2900 this.element = canvas;
2901 this.originalStyle = Utils.deepExtend({}, this.element.style);
2902 this.size.height = canvas.offsetHeight;
2903 this.size.width = canvas.offsetWidth;
2904 this.context = this.element.getContext("2d");
2905 this.container.retina.init();
2906 this.initBackground();
2907 }
2908
2909 destroy() {
2910 var _a;
2911
2912 if (this.generatedCanvas) {
2913 (_a = this.element) === null || _a === void 0 ? void 0 : _a.remove();
2914 }
2915
2916 if (this.context) {
2917 CanvasUtils.clear(this.context, this.size);
2918 }
2919 }
2920
2921 paint() {
2922 const options = this.container.actualOptions;
2923
2924 if (!this.context) {
2925 return;
2926 }
2927
2928 if (options.backgroundMask.enable && options.backgroundMask.cover && this.coverColor) {
2929 CanvasUtils.clear(this.context, this.size);
2930 this.paintBase(ColorUtils.getStyleFromRgb(this.coverColor, this.coverColor.a));
2931 } else {
2932 this.paintBase();
2933 }
2934 }
2935
2936 clear() {
2937 const options = this.container.actualOptions;
2938 const trail = options.particles.move.trail;
2939
2940 if (options.backgroundMask.enable) {
2941 this.paint();
2942 } else if (trail.enable && trail.length > 0 && this.trailFillColor) {
2943 this.paintBase(ColorUtils.getStyleFromRgb(this.trailFillColor, 1 / trail.length));
2944 } else if (this.context) {
2945 CanvasUtils.clear(this.context, this.size);
2946 }
2947 }
2948
2949 windowResize() {
2950 if (!this.element) {
2951 return;
2952 }
2953
2954 const container = this.container;
2955 this.resize();
2956 container.actualOptions.setResponsive(this.size.width, container.retina.pixelRatio, container.options);
2957 container.particles.setDensity();
2958
2959 for (const [, plugin] of container.plugins) {
2960 if (plugin.resize !== undefined) {
2961 plugin.resize();
2962 }
2963 }
2964 }
2965
2966 resize() {
2967 if (!this.element) {
2968 return;
2969 }
2970
2971 const container = this.container;
2972 const pxRatio = container.retina.pixelRatio;
2973 const size = container.canvas.size;
2974 const oldSize = {
2975 width: size.width,
2976 height: size.height
2977 };
2978 size.width = this.element.offsetWidth * pxRatio;
2979 size.height = this.element.offsetHeight * pxRatio;
2980 this.element.width = size.width;
2981 this.element.height = size.height;
2982
2983 if (this.container.started) {
2984 this.resizeFactor = {
2985 width: size.width / oldSize.width,
2986 height: size.height / oldSize.height
2987 };
2988 }
2989 }
2990
2991 drawConnectLine(p1, p2) {
2992 var _a;
2993
2994 const ctx = this.context;
2995
2996 if (!ctx) {
2997 return;
2998 }
2999
3000 const lineStyle = this.lineStyle(p1, p2);
3001
3002 if (!lineStyle) {
3003 return;
3004 }
3005
3006 const pos1 = p1.getPosition();
3007 const pos2 = p2.getPosition();
3008 CanvasUtils.drawConnectLine(ctx, (_a = p1.linksWidth) !== null && _a !== void 0 ? _a : this.container.retina.linksWidth, lineStyle, pos1, pos2);
3009 }
3010
3011 drawGrabLine(particle, lineColor, opacity, mousePos) {
3012 var _a;
3013
3014 const container = this.container;
3015 const ctx = container.canvas.context;
3016
3017 if (!ctx) {
3018 return;
3019 }
3020
3021 const beginPos = particle.getPosition();
3022 CanvasUtils.drawGrabLine(ctx, (_a = particle.linksWidth) !== null && _a !== void 0 ? _a : container.retina.linksWidth, beginPos, mousePos, lineColor, opacity);
3023 }
3024
3025 drawParticleShadow(particle, mousePos) {
3026 if (!this.context) {
3027 return;
3028 }
3029
3030 CanvasUtils.drawParticleShadow(this.container, this.context, particle, mousePos);
3031 }
3032
3033 drawLinkTriangle(p1, link1, link2) {
3034 var _a;
3035
3036 const container = this.container;
3037 const options = container.actualOptions;
3038 const p2 = link1.destination;
3039 const p3 = link2.destination;
3040 const triangleOptions = p1.options.links.triangles;
3041 const opacityTriangle = (_a = triangleOptions.opacity) !== null && _a !== void 0 ? _a : (link1.opacity + link2.opacity) / 2;
3042
3043 if (opacityTriangle <= 0) {
3044 return;
3045 }
3046
3047 const pos1 = p1.getPosition();
3048 const pos2 = p2.getPosition();
3049 const pos3 = p3.getPosition();
3050 const ctx = this.context;
3051
3052 if (!ctx) {
3053 return;
3054 }
3055
3056 if (NumberUtils.getDistance(pos1, pos2) > container.retina.linksDistance || NumberUtils.getDistance(pos3, pos2) > container.retina.linksDistance || NumberUtils.getDistance(pos3, pos1) > container.retina.linksDistance) {
3057 return;
3058 }
3059
3060 let colorTriangle = ColorUtils.colorToRgb(triangleOptions.color);
3061
3062 if (!colorTriangle) {
3063 const linksOptions = p1.options.links;
3064 const linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
3065 colorTriangle = ColorUtils.getLinkColor(p1, p2, linkColor);
3066 }
3067
3068 if (!colorTriangle) {
3069 return;
3070 }
3071
3072 CanvasUtils.drawLinkTriangle(ctx, pos1, pos2, pos3, options.backgroundMask.enable, options.backgroundMask.composite, colorTriangle, opacityTriangle);
3073 }
3074
3075 drawLinkLine(p1, link) {
3076 var _a, _b;
3077
3078 const container = this.container;
3079 const options = container.actualOptions;
3080 const p2 = link.destination;
3081 let opacity = link.opacity;
3082 const pos1 = p1.getPosition();
3083 const pos2 = p2.getPosition();
3084 const ctx = this.context;
3085
3086 if (!ctx) {
3087 return;
3088 }
3089
3090 let colorLine;
3091 const twinkle = p1.options.twinkle.lines;
3092
3093 if (twinkle.enable) {
3094 const twinkleFreq = twinkle.frequency;
3095 const twinkleRgb = ColorUtils.colorToRgb(twinkle.color);
3096 const twinkling = Math.random() < twinkleFreq;
3097
3098 if (twinkling && twinkleRgb !== undefined) {
3099 colorLine = twinkleRgb;
3100 opacity = twinkle.opacity;
3101 }
3102 }
3103
3104 if (!colorLine) {
3105 const linksOptions = p1.options.links;
3106 const linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
3107 colorLine = ColorUtils.getLinkColor(p1, p2, linkColor);
3108 }
3109
3110 if (!colorLine) {
3111 return;
3112 }
3113
3114 const width = (_a = p1.linksWidth) !== null && _a !== void 0 ? _a : container.retina.linksWidth;
3115 const maxDistance = (_b = p1.linksDistance) !== null && _b !== void 0 ? _b : container.retina.linksDistance;
3116 CanvasUtils.drawLinkLine(ctx, width, pos1, pos2, maxDistance, container.canvas.size, p1.options.links.warp, options.backgroundMask.enable, options.backgroundMask.composite, colorLine, opacity, p1.options.links.shadow);
3117 }
3118
3119 drawParticle(particle, delta) {
3120 var _a, _b, _c, _d;
3121
3122 if (((_a = particle.image) === null || _a === void 0 ? void 0 : _a.loaded) === false || particle.spawning || particle.destroyed) {
3123 return;
3124 }
3125
3126 const pfColor = particle.getFillColor();
3127 const psColor = (_b = particle.getStrokeColor()) !== null && _b !== void 0 ? _b : pfColor;
3128
3129 if (!pfColor && !psColor) {
3130 return;
3131 }
3132
3133 const options = this.container.actualOptions;
3134 const pOptions = particle.options;
3135 const twinkle = pOptions.twinkle.particles;
3136 const twinkleFreq = twinkle.frequency;
3137 const twinkleRgb = ColorUtils.colorToRgb(twinkle.color);
3138 const twinkling = twinkle.enable && Math.random() < twinkleFreq;
3139 const radius = particle.getRadius();
3140 const opacity = twinkling ? twinkle.opacity : (_c = particle.bubble.opacity) !== null && _c !== void 0 ? _c : particle.opacity.value;
3141 const infectionStage = particle.infecter.infectionStage;
3142 const infection = options.infection;
3143 const infectionStages = infection.stages;
3144 const infectionColor = infectionStage !== undefined ? infectionStages[infectionStage].color : undefined;
3145 const infectionRgb = ColorUtils.colorToRgb(infectionColor);
3146 const fColor = twinkling && twinkleRgb !== undefined ? twinkleRgb : infectionRgb !== null && infectionRgb !== void 0 ? infectionRgb : pfColor ? ColorUtils.hslToRgb(pfColor) : undefined;
3147 const sColor = twinkling && twinkleRgb !== undefined ? twinkleRgb : infectionRgb !== null && infectionRgb !== void 0 ? infectionRgb : psColor ? ColorUtils.hslToRgb(psColor) : undefined;
3148 const fillColorValue = fColor !== undefined ? ColorUtils.getStyleFromRgb(fColor, opacity) : undefined;
3149
3150 if (!this.context || !fillColorValue && !sColor) {
3151 return;
3152 }
3153
3154 const strokeColorValue = sColor !== undefined ? ColorUtils.getStyleFromRgb(sColor, (_d = particle.stroke.opacity) !== null && _d !== void 0 ? _d : opacity) : fillColorValue;
3155 this.drawParticleLinks(particle);
3156
3157 if (radius > 0) {
3158 CanvasUtils.drawParticle(this.container, this.context, particle, delta, fillColorValue, strokeColorValue, options.backgroundMask.enable, options.backgroundMask.composite, radius, opacity, particle.options.shadow);
3159 }
3160 }
3161
3162 drawParticleLinks(particle) {
3163 if (!this.context) {
3164 return;
3165 }
3166
3167 const container = this.container;
3168 const particles = container.particles;
3169 const pOptions = particle.options;
3170
3171 if (particle.links.length > 0) {
3172 this.context.save();
3173 const p1Links = particle.links.filter(l => {
3174 const linkFreq = container.particles.getLinkFrequency(particle, l.destination);
3175 return linkFreq <= pOptions.links.frequency;
3176 });
3177
3178 for (const link of p1Links) {
3179 const p2 = link.destination;
3180
3181 if (pOptions.links.triangles.enable) {
3182 const links = p1Links.map(l => l.destination);
3183 const vertices = p2.links.filter(t => {
3184 const linkFreq = container.particles.getLinkFrequency(p2, t.destination);
3185 return linkFreq <= p2.options.links.frequency && links.indexOf(t.destination) >= 0;
3186 });
3187
3188 if (vertices.length) {
3189 for (const vertex of vertices) {
3190 const p3 = vertex.destination;
3191 const triangleFreq = particles.getTriangleFrequency(particle, p2, p3);
3192
3193 if (triangleFreq > pOptions.links.triangles.frequency) {
3194 continue;
3195 }
3196
3197 this.drawLinkTriangle(particle, link, vertex);
3198 }
3199 }
3200 }
3201
3202 if (link.opacity > 0 && container.retina.linksWidth > 0) {
3203 this.drawLinkLine(particle, link);
3204 }
3205 }
3206
3207 this.context.restore();
3208 }
3209 }
3210
3211 drawPlugin(plugin, delta) {
3212 if (!this.context) {
3213 return;
3214 }
3215
3216 CanvasUtils.drawPlugin(this.context, plugin, delta);
3217 }
3218
3219 drawLight(mousePos) {
3220 if (!this.context) {
3221 return;
3222 }
3223
3224 CanvasUtils.drawLight(this.container, this.context, mousePos);
3225 }
3226
3227 paintBase(baseColor) {
3228 if (!this.context) {
3229 return;
3230 }
3231
3232 CanvasUtils.paintBase(this.context, this.size, baseColor);
3233 }
3234
3235 lineStyle(p1, p2) {
3236 if (!this.context) {
3237 return;
3238 }
3239
3240 const options = this.container.actualOptions;
3241 const connectOptions = options.interactivity.modes.connect;
3242 return CanvasUtils.gradient(this.context, p1, p2, connectOptions.links.opacity);
3243 }
3244
3245 initBackground() {
3246 const options = this.container.actualOptions;
3247 const background = options.background;
3248 const element = this.element;
3249 const elementStyle = element === null || element === void 0 ? void 0 : element.style;
3250
3251 if (!elementStyle) {
3252 return;
3253 }
3254
3255 if (background.color) {
3256 const color = ColorUtils.colorToRgb(background.color);
3257 elementStyle.backgroundColor = color ? ColorUtils.getStyleFromRgb(color, background.opacity) : "";
3258 } else {
3259 elementStyle.backgroundColor = "";
3260 }
3261
3262 elementStyle.backgroundImage = background.image || "";
3263 elementStyle.backgroundPosition = background.position || "";
3264 elementStyle.backgroundRepeat = background.repeat || "";
3265 elementStyle.backgroundSize = background.size || "";
3266 }
3267
3268}
3269;// CONCATENATED MODULE: ./dist/browser/Core/Particle/Updater.js
3270
3271
3272
3273
3274function bounceHorizontal(data) {
3275 if (data.outMode === OutMode.bounce || data.outMode === OutMode.bounceHorizontal || data.outMode === "bounceHorizontal" || data.outMode === OutMode.split) {
3276 const velocity = data.particle.velocity.x;
3277 let bounced = false;
3278
3279 if (data.direction === OutModeDirection.right && data.bounds.right >= data.canvasSize.width && velocity > 0 || data.direction === OutModeDirection.left && data.bounds.left <= 0 && velocity < 0) {
3280 const newVelocity = NumberUtils.getValue(data.particle.options.bounce.horizontal);
3281 data.particle.velocity.x *= -newVelocity;
3282 bounced = true;
3283 }
3284
3285 if (!bounced) {
3286 return;
3287 }
3288
3289 const minPos = data.offset.x + data.size;
3290
3291 if (data.bounds.right >= data.canvasSize.width) {
3292 data.particle.position.x = data.canvasSize.width - minPos;
3293 } else if (data.bounds.left <= 0) {
3294 data.particle.position.x = minPos;
3295 }
3296
3297 if (data.outMode === OutMode.split) {
3298 data.particle.destroy();
3299 }
3300 }
3301}
3302
3303function bounceVertical(data) {
3304 if (data.outMode === OutMode.bounce || data.outMode === OutMode.bounceVertical || data.outMode === "bounceVertical" || data.outMode === OutMode.split) {
3305 const velocity = data.particle.velocity.y;
3306 let bounced = false;
3307
3308 if (data.direction === OutModeDirection.bottom && data.bounds.bottom >= data.canvasSize.height && velocity > 0 || data.direction === OutModeDirection.top && data.bounds.top <= 0 && velocity < 0) {
3309 const newVelocity = NumberUtils.getValue(data.particle.options.bounce.vertical);
3310 data.particle.velocity.y *= -newVelocity;
3311 bounced = true;
3312 }
3313
3314 if (!bounced) {
3315 return;
3316 }
3317
3318 const minPos = data.offset.y + data.size;
3319
3320 if (data.bounds.bottom >= data.canvasSize.height) {
3321 data.particle.position.y = data.canvasSize.height - minPos;
3322 } else if (data.bounds.top <= 0) {
3323 data.particle.position.y = minPos;
3324 }
3325
3326 if (data.outMode === OutMode.split) {
3327 data.particle.destroy();
3328 }
3329 }
3330}
3331
3332function checkDestroy(particle, destroy, value, minValue, maxValue) {
3333 switch (destroy) {
3334 case DestroyType.max:
3335 if (value >= maxValue) {
3336 particle.destroy();
3337 }
3338
3339 break;
3340
3341 case DestroyType.min:
3342 if (value <= minValue) {
3343 particle.destroy();
3344 }
3345
3346 break;
3347 }
3348}
3349
3350class Updater {
3351 constructor(container, particle) {
3352 this.container = container;
3353 this.particle = particle;
3354 }
3355
3356 update(delta) {
3357 if (this.particle.destroyed) {
3358 return;
3359 }
3360
3361 this.updateLife(delta);
3362
3363 if (this.particle.destroyed || this.particle.spawning) {
3364 return;
3365 }
3366
3367 this.updateOpacity(delta);
3368 this.updateSize(delta);
3369 this.updateAngle(delta);
3370 this.updateColor(delta);
3371 this.updateStrokeColor(delta);
3372 this.updateOutModes(delta);
3373 }
3374
3375 updateLife(delta) {
3376 const particle = this.particle;
3377 let justSpawned = false;
3378
3379 if (particle.spawning) {
3380 particle.lifeDelayTime += delta.value;
3381
3382 if (particle.lifeDelayTime >= particle.lifeDelay) {
3383 justSpawned = true;
3384 particle.spawning = false;
3385 particle.lifeDelayTime = 0;
3386 particle.lifeTime = 0;
3387 }
3388 }
3389
3390 if (particle.lifeDuration === -1) {
3391 return;
3392 }
3393
3394 if (!particle.spawning) {
3395 if (justSpawned) {
3396 particle.lifeTime = 0;
3397 } else {
3398 particle.lifeTime += delta.value;
3399 }
3400
3401 if (particle.lifeTime >= particle.lifeDuration) {
3402 particle.lifeTime = 0;
3403
3404 if (particle.livesRemaining > 0) {
3405 particle.livesRemaining--;
3406 }
3407
3408 if (particle.livesRemaining === 0) {
3409 particle.destroy();
3410 return;
3411 }
3412
3413 const canvasSize = this.container.canvas.size;
3414 particle.position.x = NumberUtils.randomInRange(NumberUtils.setRangeValue(0, canvasSize.width));
3415 particle.position.y = NumberUtils.randomInRange(NumberUtils.setRangeValue(0, canvasSize.height));
3416 particle.spawning = true;
3417 particle.lifeDelayTime = 0;
3418 particle.lifeTime = 0;
3419 particle.reset();
3420 const lifeOptions = particle.options.life;
3421 particle.lifeDelay = NumberUtils.getValue(lifeOptions.delay) * 1000;
3422 particle.lifeDuration = NumberUtils.getValue(lifeOptions.duration) * 1000;
3423 }
3424 }
3425 }
3426
3427 updateOpacity(delta) {
3428 var _a, _b;
3429
3430 const particle = this.particle;
3431 const opacityOpt = particle.options.opacity;
3432 const opacityAnim = opacityOpt.animation;
3433 const minValue = NumberUtils.getRangeMin(opacityOpt.value);
3434 const maxValue = NumberUtils.getRangeMax(opacityOpt.value);
3435
3436 if (!particle.destroyed && opacityAnim.enable && (opacityAnim.count <= 0 || particle.loops.size < opacityAnim.count)) {
3437 switch (particle.opacity.status) {
3438 case AnimationStatus.increasing:
3439 if (particle.opacity.value >= maxValue) {
3440 particle.opacity.status = AnimationStatus.decreasing;
3441 particle.loops.opacity++;
3442 } else {
3443 particle.opacity.value += ((_a = particle.opacity.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor;
3444 }
3445
3446 break;
3447
3448 case AnimationStatus.decreasing:
3449 if (particle.opacity.value <= minValue) {
3450 particle.opacity.status = AnimationStatus.increasing;
3451 particle.loops.opacity++;
3452 } else {
3453 particle.opacity.value -= ((_b = particle.opacity.velocity) !== null && _b !== void 0 ? _b : 0) * delta.factor;
3454 }
3455
3456 break;
3457 }
3458
3459 checkDestroy(particle, opacityAnim.destroy, particle.opacity.value, minValue, maxValue);
3460
3461 if (!particle.destroyed) {
3462 particle.opacity.value = NumberUtils.clamp(particle.opacity.value, minValue, maxValue);
3463 }
3464 }
3465 }
3466
3467 updateSize(delta) {
3468 var _a;
3469
3470 const container = this.container;
3471 const particle = this.particle;
3472 const sizeOpt = particle.options.size;
3473 const sizeAnim = sizeOpt.animation;
3474 const sizeVelocity = ((_a = particle.size.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor;
3475 const minValue = NumberUtils.getRangeMin(sizeOpt.value) * container.retina.pixelRatio;
3476 const maxValue = NumberUtils.getRangeMax(sizeOpt.value) * container.retina.pixelRatio;
3477
3478 if (!particle.destroyed && sizeAnim.enable && (sizeAnim.count <= 0 || particle.loops.size < sizeAnim.count)) {
3479 switch (particle.size.status) {
3480 case AnimationStatus.increasing:
3481 if (particle.size.value >= maxValue) {
3482 particle.size.status = AnimationStatus.decreasing;
3483 particle.loops.size++;
3484 } else {
3485 particle.size.value += sizeVelocity;
3486 }
3487
3488 break;
3489
3490 case AnimationStatus.decreasing:
3491 if (particle.size.value <= minValue) {
3492 particle.size.status = AnimationStatus.increasing;
3493 particle.loops.size++;
3494 } else {
3495 particle.size.value -= sizeVelocity;
3496 }
3497
3498 }
3499
3500 checkDestroy(particle, sizeAnim.destroy, particle.size.value, minValue, maxValue);
3501
3502 if (!particle.destroyed) {
3503 particle.size.value = NumberUtils.clamp(particle.size.value, minValue, maxValue);
3504 }
3505 }
3506 }
3507
3508 updateAngle(delta) {
3509 var _a;
3510
3511 const particle = this.particle;
3512 const rotate = particle.options.rotate;
3513 const rotateAnimation = rotate.animation;
3514 const speed = ((_a = particle.rotate.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor;
3515 const max = 2 * Math.PI;
3516
3517 if (rotateAnimation.enable) {
3518 switch (particle.rotate.status) {
3519 case AnimationStatus.increasing:
3520 particle.rotate.value += speed;
3521
3522 if (particle.rotate.value > max) {
3523 particle.rotate.value -= max;
3524 }
3525
3526 break;
3527
3528 case AnimationStatus.decreasing:
3529 default:
3530 particle.rotate.value -= speed;
3531
3532 if (particle.rotate.value < 0) {
3533 particle.rotate.value += max;
3534 }
3535
3536 break;
3537 }
3538 }
3539 }
3540
3541 updateColor(delta) {
3542 var _a, _b, _c;
3543
3544 const particle = this.particle;
3545 const animationOptions = particle.options.color.animation;
3546
3547 if (((_a = particle.color) === null || _a === void 0 ? void 0 : _a.h) !== undefined) {
3548 this.updateColorValue(particle, delta, particle.color.h, animationOptions.h, 360, false);
3549 }
3550
3551 if (((_b = particle.color) === null || _b === void 0 ? void 0 : _b.s) !== undefined) {
3552 this.updateColorValue(particle, delta, particle.color.s, animationOptions.s, 100, true);
3553 }
3554
3555 if (((_c = particle.color) === null || _c === void 0 ? void 0 : _c.l) !== undefined) {
3556 this.updateColorValue(particle, delta, particle.color.l, animationOptions.l, 100, true);
3557 }
3558 }
3559
3560 updateStrokeColor(delta) {
3561 var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
3562
3563 const particle = this.particle;
3564
3565 if (!particle.stroke.color) {
3566 return;
3567 }
3568
3569 const animationOptions = particle.stroke.color.animation;
3570 const valueAnimations = animationOptions;
3571
3572 if (valueAnimations.enable !== undefined) {
3573 const hue = (_b = (_a = particle.strokeColor) === null || _a === void 0 ? void 0 : _a.h) !== null && _b !== void 0 ? _b : (_c = particle.color) === null || _c === void 0 ? void 0 : _c.h;
3574
3575 if (hue) {
3576 this.updateColorValue(particle, delta, hue, valueAnimations, 360, false);
3577 }
3578 } else {
3579 const hslAnimations = animationOptions;
3580 const h = (_e = (_d = particle.strokeColor) === null || _d === void 0 ? void 0 : _d.h) !== null && _e !== void 0 ? _e : (_f = particle.color) === null || _f === void 0 ? void 0 : _f.h;
3581
3582 if (h) {
3583 this.updateColorValue(particle, delta, h, hslAnimations.h, 360, false);
3584 }
3585
3586 const s = (_h = (_g = particle.strokeColor) === null || _g === void 0 ? void 0 : _g.s) !== null && _h !== void 0 ? _h : (_j = particle.color) === null || _j === void 0 ? void 0 : _j.s;
3587
3588 if (s) {
3589 this.updateColorValue(particle, delta, s, hslAnimations.s, 100, true);
3590 }
3591
3592 const l = (_l = (_k = particle.strokeColor) === null || _k === void 0 ? void 0 : _k.l) !== null && _l !== void 0 ? _l : (_m = particle.color) === null || _m === void 0 ? void 0 : _m.l;
3593
3594 if (l) {
3595 this.updateColorValue(particle, delta, l, hslAnimations.l, 100, true);
3596 }
3597 }
3598 }
3599
3600 updateColorValue(particle, delta, value, valueAnimation, max, decrease) {
3601 var _a;
3602
3603 const colorValue = value;
3604
3605 if (!colorValue || !valueAnimation.enable) {
3606 return;
3607 }
3608
3609 const offset = NumberUtils.randomInRange(valueAnimation.offset);
3610 const velocity = ((_a = value.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor + offset * 3.6;
3611
3612 if (!decrease || colorValue.status === AnimationStatus.increasing) {
3613 colorValue.value += velocity;
3614
3615 if (decrease && colorValue.value > max) {
3616 colorValue.status = AnimationStatus.decreasing;
3617 colorValue.value -= colorValue.value % max;
3618 }
3619 } else {
3620 colorValue.value -= velocity;
3621
3622 if (colorValue.value < 0) {
3623 colorValue.status = AnimationStatus.increasing;
3624 colorValue.value += colorValue.value;
3625 }
3626 }
3627
3628 if (colorValue.value > max) {
3629 colorValue.value %= max;
3630 }
3631 }
3632
3633 updateOutModes(delta) {
3634 var _a, _b, _c, _d;
3635
3636 const outModes = this.particle.options.move.outModes;
3637 this.updateOutMode(delta, (_a = outModes.bottom) !== null && _a !== void 0 ? _a : outModes.default, OutModeDirection.bottom);
3638 this.updateOutMode(delta, (_b = outModes.left) !== null && _b !== void 0 ? _b : outModes.default, OutModeDirection.left);
3639 this.updateOutMode(delta, (_c = outModes.right) !== null && _c !== void 0 ? _c : outModes.default, OutModeDirection.right);
3640 this.updateOutMode(delta, (_d = outModes.top) !== null && _d !== void 0 ? _d : outModes.default, OutModeDirection.top);
3641 }
3642
3643 updateOutMode(delta, outMode, direction) {
3644 const container = this.container;
3645 const particle = this.particle;
3646
3647 switch (outMode) {
3648 case OutMode.bounce:
3649 case OutMode.bounceVertical:
3650 case OutMode.bounceHorizontal:
3651 case "bounceVertical":
3652 case "bounceHorizontal":
3653 case OutMode.split:
3654 this.updateBounce(delta, direction, outMode);
3655 break;
3656
3657 case OutMode.destroy:
3658 if (!Utils.isPointInside(particle.position, container.canvas.size, particle.getRadius(), direction)) {
3659 container.particles.remove(particle, true);
3660 }
3661
3662 break;
3663
3664 case OutMode.out:
3665 if (!Utils.isPointInside(particle.position, container.canvas.size, particle.getRadius(), direction)) {
3666 this.fixOutOfCanvasPosition(direction);
3667 }
3668
3669 break;
3670
3671 case OutMode.none:
3672 this.bounceNone(direction);
3673 break;
3674 }
3675 }
3676
3677 fixOutOfCanvasPosition(direction) {
3678 const container = this.container;
3679 const particle = this.particle;
3680 const wrap = particle.options.move.warp;
3681 const canvasSize = container.canvas.size;
3682 const newPos = {
3683 bottom: canvasSize.height + particle.getRadius() - particle.offset.y,
3684 left: -particle.getRadius() - particle.offset.x,
3685 right: canvasSize.width + particle.getRadius() + particle.offset.x,
3686 top: -particle.getRadius() - particle.offset.y
3687 };
3688 const sizeValue = particle.getRadius();
3689 const nextBounds = Utils.calculateBounds(particle.position, sizeValue);
3690
3691 if (direction === OutModeDirection.right && nextBounds.left > canvasSize.width - particle.offset.x) {
3692 particle.position.x = newPos.left;
3693
3694 if (!wrap) {
3695 particle.position.y = Math.random() * canvasSize.height;
3696 }
3697 } else if (direction === OutModeDirection.left && nextBounds.right < -particle.offset.x) {
3698 particle.position.x = newPos.right;
3699
3700 if (!wrap) {
3701 particle.position.y = Math.random() * canvasSize.height;
3702 }
3703 }
3704
3705 if (direction === OutModeDirection.bottom && nextBounds.top > canvasSize.height - particle.offset.y) {
3706 if (!wrap) {
3707 particle.position.x = Math.random() * canvasSize.width;
3708 }
3709
3710 particle.position.y = newPos.top;
3711 } else if (direction === OutModeDirection.top && nextBounds.bottom < -particle.offset.y) {
3712 if (!wrap) {
3713 particle.position.x = Math.random() * canvasSize.width;
3714 }
3715
3716 particle.position.y = newPos.bottom;
3717 }
3718 }
3719
3720 updateBounce(delta, direction, outMode) {
3721 const container = this.container;
3722 const particle = this.particle;
3723 let handled = false;
3724
3725 for (const [, plugin] of container.plugins) {
3726 if (plugin.particleBounce !== undefined) {
3727 handled = plugin.particleBounce(particle, delta, direction);
3728 }
3729
3730 if (handled) {
3731 break;
3732 }
3733 }
3734
3735 if (handled) {
3736 return;
3737 }
3738
3739 const pos = particle.getPosition(),
3740 offset = particle.offset,
3741 size = particle.getRadius(),
3742 bounds = Utils.calculateBounds(pos, size),
3743 canvasSize = container.canvas.size;
3744 bounceHorizontal({
3745 particle,
3746 outMode,
3747 direction,
3748 bounds,
3749 canvasSize,
3750 offset,
3751 size
3752 });
3753 bounceVertical({
3754 particle,
3755 outMode,
3756 direction,
3757 bounds,
3758 canvasSize,
3759 offset,
3760 size
3761 });
3762 }
3763
3764 bounceNone(direction) {
3765 const particle = this.particle;
3766
3767 if (particle.options.move.distance) {
3768 return;
3769 }
3770
3771 const gravityOptions = particle.options.move.gravity;
3772 const container = this.container;
3773
3774 if (!gravityOptions.enable) {
3775 if (!Utils.isPointInside(particle.position, container.canvas.size, particle.getRadius(), direction)) {
3776 container.particles.remove(particle);
3777 }
3778 } else {
3779 const position = particle.position;
3780
3781 if (gravityOptions.acceleration >= 0 && position.y > container.canvas.size.height && direction === OutModeDirection.bottom || gravityOptions.acceleration < 0 && position.y < 0 && direction === OutModeDirection.top) {
3782 container.particles.remove(particle);
3783 }
3784 }
3785 }
3786
3787}
3788;// CONCATENATED MODULE: ./dist/browser/Options/Classes/OptionsColor.js
3789class OptionsColor {
3790 constructor() {
3791 this.value = "#fff";
3792 }
3793
3794 static create(source, data) {
3795 const color = source !== null && source !== void 0 ? source : new OptionsColor();
3796
3797 if (data !== undefined) {
3798 color.load(typeof data === "string" ? {
3799 value: data
3800 } : data);
3801 }
3802
3803 return color;
3804 }
3805
3806 load(data) {
3807 if ((data === null || data === void 0 ? void 0 : data.value) === undefined) {
3808 return;
3809 }
3810
3811 this.value = data.value;
3812 }
3813
3814}
3815;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Links/LinksShadow.js
3816
3817class LinksShadow {
3818 constructor() {
3819 this.blur = 5;
3820 this.color = new OptionsColor();
3821 this.enable = false;
3822 this.color.value = "#00ff00";
3823 }
3824
3825 load(data) {
3826 if (data === undefined) {
3827 return;
3828 }
3829
3830 if (data.blur !== undefined) {
3831 this.blur = data.blur;
3832 }
3833
3834 this.color = OptionsColor.create(this.color, data.color);
3835
3836 if (data.enable !== undefined) {
3837 this.enable = data.enable;
3838 }
3839 }
3840
3841}
3842;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Links/LinksTriangle.js
3843
3844class LinksTriangle {
3845 constructor() {
3846 this.enable = false;
3847 this.frequency = 1;
3848 }
3849
3850 load(data) {
3851 if (data === undefined) {
3852 return;
3853 }
3854
3855 if (data.color !== undefined) {
3856 this.color = OptionsColor.create(this.color, data.color);
3857 }
3858
3859 if (data.enable !== undefined) {
3860 this.enable = data.enable;
3861 }
3862
3863 if (data.frequency !== undefined) {
3864 this.frequency = data.frequency;
3865 }
3866
3867 if (data.opacity !== undefined) {
3868 this.opacity = data.opacity;
3869 }
3870 }
3871
3872}
3873;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Links/Links.js
3874
3875
3876
3877class Links {
3878 constructor() {
3879 this.blink = false;
3880 this.color = new OptionsColor();
3881 this.consent = false;
3882 this.distance = 100;
3883 this.enable = false;
3884 this.frequency = 1;
3885 this.opacity = 1;
3886 this.shadow = new LinksShadow();
3887 this.triangles = new LinksTriangle();
3888 this.width = 1;
3889 this.warp = false;
3890 }
3891
3892 load(data) {
3893 if (data === undefined) {
3894 return;
3895 }
3896
3897 if (data.id !== undefined) {
3898 this.id = data.id;
3899 }
3900
3901 if (data.blink !== undefined) {
3902 this.blink = data.blink;
3903 }
3904
3905 this.color = OptionsColor.create(this.color, data.color);
3906
3907 if (data.consent !== undefined) {
3908 this.consent = data.consent;
3909 }
3910
3911 if (data.distance !== undefined) {
3912 this.distance = data.distance;
3913 }
3914
3915 if (data.enable !== undefined) {
3916 this.enable = data.enable;
3917 }
3918
3919 if (data.frequency !== undefined) {
3920 this.frequency = data.frequency;
3921 }
3922
3923 if (data.opacity !== undefined) {
3924 this.opacity = data.opacity;
3925 }
3926
3927 this.shadow.load(data.shadow);
3928 this.triangles.load(data.triangles);
3929
3930 if (data.width !== undefined) {
3931 this.width = data.width;
3932 }
3933
3934 if (data.warp !== undefined) {
3935 this.warp = data.warp;
3936 }
3937 }
3938
3939}
3940;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/Attract.js
3941class Attract {
3942 constructor() {
3943 this.enable = false;
3944 this.rotate = {
3945 x: 3000,
3946 y: 3000
3947 };
3948 }
3949
3950 get rotateX() {
3951 return this.rotate.x;
3952 }
3953
3954 set rotateX(value) {
3955 this.rotate.x = value;
3956 }
3957
3958 get rotateY() {
3959 return this.rotate.y;
3960 }
3961
3962 set rotateY(value) {
3963 this.rotate.y = value;
3964 }
3965
3966 load(data) {
3967 var _a, _b, _c, _d;
3968
3969 if (data === undefined) {
3970 return;
3971 }
3972
3973 if (data.enable !== undefined) {
3974 this.enable = data.enable;
3975 }
3976
3977 const rotateX = (_b = (_a = data.rotate) === null || _a === void 0 ? void 0 : _a.x) !== null && _b !== void 0 ? _b : data.rotateX;
3978
3979 if (rotateX !== undefined) {
3980 this.rotate.x = rotateX;
3981 }
3982
3983 const rotateY = (_d = (_c = data.rotate) === null || _c === void 0 ? void 0 : _c.y) !== null && _d !== void 0 ? _d : data.rotateY;
3984
3985 if (rotateY !== undefined) {
3986 this.rotate.y = rotateY;
3987 }
3988 }
3989
3990}
3991;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/Trail.js
3992
3993class Trail {
3994 constructor() {
3995 this.enable = false;
3996 this.length = 10;
3997 this.fillColor = new OptionsColor();
3998 this.fillColor.value = "#000000";
3999 }
4000
4001 load(data) {
4002 if (data === undefined) {
4003 return;
4004 }
4005
4006 if (data.enable !== undefined) {
4007 this.enable = data.enable;
4008 }
4009
4010 this.fillColor = OptionsColor.create(this.fillColor, data.fillColor);
4011
4012 if (data.length !== undefined) {
4013 this.length = data.length;
4014 }
4015 }
4016
4017}
4018;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Random.js
4019class Random {
4020 constructor() {
4021 this.enable = false;
4022 this.minimumValue = 0;
4023 }
4024
4025 load(data) {
4026 if (!data) {
4027 return;
4028 }
4029
4030 if (data.enable !== undefined) {
4031 this.enable = data.enable;
4032 }
4033
4034 if (data.minimumValue !== undefined) {
4035 this.minimumValue = data.minimumValue;
4036 }
4037 }
4038
4039}
4040;// CONCATENATED MODULE: ./dist/browser/Options/Classes/ValueWithRandom.js
4041
4042
4043class ValueWithRandom {
4044 constructor() {
4045 this.random = new Random();
4046 this.value = 0;
4047 }
4048
4049 load(data) {
4050 if (!data) {
4051 return;
4052 }
4053
4054 if (typeof data.random === "boolean") {
4055 this.random.enable = data.random;
4056 } else {
4057 this.random.load(data.random);
4058 }
4059
4060 if (data.value !== undefined) {
4061 this.value = NumberUtils.setRangeValue(data.value, this.random.enable ? this.random.minimumValue : undefined);
4062 }
4063 }
4064
4065}
4066;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/Path/PathDelay.js
4067
4068class PathDelay extends ValueWithRandom {
4069 constructor() {
4070 super();
4071 }
4072
4073}
4074;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/Path/Path.js
4075
4076class Path {
4077 constructor() {
4078 this.clamp = true;
4079 this.delay = new PathDelay();
4080 this.enable = false;
4081 }
4082
4083 load(data) {
4084 if (data === undefined) {
4085 return;
4086 }
4087
4088 if (data.clamp !== undefined) {
4089 this.clamp = data.clamp;
4090 }
4091
4092 this.delay.load(data.delay);
4093
4094 if (data.enable !== undefined) {
4095 this.enable = data.enable;
4096 }
4097
4098 this.generator = data.generator;
4099 }
4100
4101}
4102;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/MoveAngle.js
4103class MoveAngle {
4104 constructor() {
4105 this.offset = 45;
4106 this.value = 90;
4107 }
4108
4109 load(data) {
4110 if (data === undefined) {
4111 return;
4112 }
4113
4114 if (data.offset !== undefined) {
4115 this.offset = data.offset;
4116 }
4117
4118 if (data.value !== undefined) {
4119 this.value = data.value;
4120 }
4121 }
4122
4123}
4124;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/MoveGravity.js
4125class MoveGravity {
4126 constructor() {
4127 this.acceleration = 9.81;
4128 this.enable = false;
4129 this.maxSpeed = 50;
4130 }
4131
4132 load(data) {
4133 if (!data) {
4134 return;
4135 }
4136
4137 if (data.acceleration !== undefined) {
4138 this.acceleration = data.acceleration;
4139 }
4140
4141 if (data.enable !== undefined) {
4142 this.enable = data.enable;
4143 }
4144
4145 if (data.maxSpeed !== undefined) {
4146 this.maxSpeed = data.maxSpeed;
4147 }
4148 }
4149
4150}
4151;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/OutModes.js
4152
4153class OutModes {
4154 constructor() {
4155 this.default = OutMode.out;
4156 }
4157
4158 load(data) {
4159 var _a, _b, _c, _d;
4160
4161 if (!data) {
4162 return;
4163 }
4164
4165 if (data.default !== undefined) {
4166 this.default = data.default;
4167 }
4168
4169 this.bottom = (_a = data.bottom) !== null && _a !== void 0 ? _a : data.default;
4170 this.left = (_b = data.left) !== null && _b !== void 0 ? _b : data.default;
4171 this.right = (_c = data.right) !== null && _c !== void 0 ? _c : data.default;
4172 this.top = (_d = data.top) !== null && _d !== void 0 ? _d : data.default;
4173 }
4174
4175}
4176;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Move/Move.js
4177
4178
4179
4180
4181
4182
4183
4184
4185class Move {
4186 constructor() {
4187 this.angle = new MoveAngle();
4188 this.attract = new Attract();
4189 this.decay = 0;
4190 this.distance = 0;
4191 this.direction = MoveDirection.none;
4192 this.drift = 0;
4193 this.enable = false;
4194 this.gravity = new MoveGravity();
4195 this.path = new Path();
4196 this.outModes = new OutModes();
4197 this.random = false;
4198 this.size = false;
4199 this.speed = 2;
4200 this.straight = false;
4201 this.trail = new Trail();
4202 this.vibrate = false;
4203 this.warp = false;
4204 }
4205
4206 get collisions() {
4207 return false;
4208 }
4209
4210 set collisions(value) {}
4211
4212 get bounce() {
4213 return this.collisions;
4214 }
4215
4216 set bounce(value) {
4217 this.collisions = value;
4218 }
4219
4220 get out_mode() {
4221 return this.outMode;
4222 }
4223
4224 set out_mode(value) {
4225 this.outMode = value;
4226 }
4227
4228 get outMode() {
4229 return this.outModes.default;
4230 }
4231
4232 set outMode(value) {
4233 this.outModes.default = value;
4234 }
4235
4236 get noise() {
4237 return this.path;
4238 }
4239
4240 set noise(value) {
4241 this.path = value;
4242 }
4243
4244 load(data) {
4245 var _a, _b, _c;
4246
4247 if (data === undefined) {
4248 return;
4249 }
4250
4251 if (data.angle !== undefined) {
4252 if (typeof data.angle === "number") {
4253 this.angle.value = data.angle;
4254 } else {
4255 this.angle.load(data.angle);
4256 }
4257 }
4258
4259 this.attract.load(data.attract);
4260
4261 if (data.decay !== undefined) {
4262 this.decay = data.decay;
4263 }
4264
4265 if (data.direction !== undefined) {
4266 this.direction = data.direction;
4267 }
4268
4269 if (data.distance !== undefined) {
4270 this.distance = data.distance;
4271 }
4272
4273 if (data.drift !== undefined) {
4274 this.drift = NumberUtils.setRangeValue(data.drift);
4275 }
4276
4277 if (data.enable !== undefined) {
4278 this.enable = data.enable;
4279 }
4280
4281 this.gravity.load(data.gravity);
4282 const outMode = (_a = data.outMode) !== null && _a !== void 0 ? _a : data.out_mode;
4283
4284 if (data.outModes !== undefined || outMode !== undefined) {
4285 if (typeof data.outModes === "string" || data.outModes === undefined && outMode !== undefined) {
4286 this.outModes.load({
4287 default: (_b = data.outModes) !== null && _b !== void 0 ? _b : outMode
4288 });
4289 } else {
4290 this.outModes.load(data.outModes);
4291 }
4292 }
4293
4294 this.path.load((_c = data.path) !== null && _c !== void 0 ? _c : data.noise);
4295
4296 if (data.random !== undefined) {
4297 this.random = data.random;
4298 }
4299
4300 if (data.size !== undefined) {
4301 this.size = data.size;
4302 }
4303
4304 if (data.speed !== undefined) {
4305 this.speed = NumberUtils.setRangeValue(data.speed);
4306 }
4307
4308 if (data.straight !== undefined) {
4309 this.straight = data.straight;
4310 }
4311
4312 this.trail.load(data.trail);
4313
4314 if (data.vibrate !== undefined) {
4315 this.vibrate = data.vibrate;
4316 }
4317
4318 if (data.warp !== undefined) {
4319 this.warp = data.warp;
4320 }
4321 }
4322
4323}
4324;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Number/Density.js
4325class Density {
4326 constructor() {
4327 this.enable = false;
4328 this.area = 800;
4329 this.factor = 1000;
4330 }
4331
4332 get value_area() {
4333 return this.area;
4334 }
4335
4336 set value_area(value) {
4337 this.area = value;
4338 }
4339
4340 load(data) {
4341 var _a;
4342
4343 if (data === undefined) {
4344 return;
4345 }
4346
4347 if (data.enable !== undefined) {
4348 this.enable = data.enable;
4349 }
4350
4351 const area = (_a = data.area) !== null && _a !== void 0 ? _a : data.value_area;
4352
4353 if (area !== undefined) {
4354 this.area = area;
4355 }
4356
4357 if (data.factor !== undefined) {
4358 this.factor = data.factor;
4359 }
4360 }
4361
4362}
4363;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Number/ParticlesNumber.js
4364
4365class ParticlesNumber {
4366 constructor() {
4367 this.density = new Density();
4368 this.limit = 0;
4369 this.value = 100;
4370 }
4371
4372 get max() {
4373 return this.limit;
4374 }
4375
4376 set max(value) {
4377 this.limit = value;
4378 }
4379
4380 load(data) {
4381 var _a;
4382
4383 if (data === undefined) {
4384 return;
4385 }
4386
4387 this.density.load(data.density);
4388 const limit = (_a = data.limit) !== null && _a !== void 0 ? _a : data.max;
4389
4390 if (limit !== undefined) {
4391 this.limit = limit;
4392 }
4393
4394 if (data.value !== undefined) {
4395 this.value = data.value;
4396 }
4397 }
4398
4399}
4400;// CONCATENATED MODULE: ./dist/browser/Options/Classes/AnimationOptions.js
4401class AnimationOptions {
4402 constructor() {
4403 this.count = 0;
4404 this.enable = false;
4405 this.speed = 1;
4406 this.sync = false;
4407 }
4408
4409 load(data) {
4410 if (!data) {
4411 return;
4412 }
4413
4414 if (data.count !== undefined) {
4415 this.count = data.count;
4416 }
4417
4418 if (data.enable !== undefined) {
4419 this.enable = data.enable;
4420 }
4421
4422 if (data.speed !== undefined) {
4423 this.speed = data.speed;
4424 }
4425
4426 if (data.sync !== undefined) {
4427 this.sync = data.sync;
4428 }
4429 }
4430
4431}
4432;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Opacity/OpacityAnimation.js
4433
4434
4435class OpacityAnimation extends AnimationOptions {
4436 constructor() {
4437 super();
4438 this.destroy = DestroyType.none;
4439 this.enable = false;
4440 this.minimumValue = 0;
4441 this.speed = 2;
4442 this.startValue = StartValueType.random;
4443 this.sync = false;
4444 }
4445
4446 get opacity_min() {
4447 return this.minimumValue;
4448 }
4449
4450 set opacity_min(value) {
4451 this.minimumValue = value;
4452 }
4453
4454 load(data) {
4455 var _a;
4456
4457 if (data === undefined) {
4458 return;
4459 }
4460
4461 super.load(data);
4462
4463 if (data.destroy !== undefined) {
4464 this.destroy = data.destroy;
4465 }
4466
4467 if (data.enable !== undefined) {
4468 this.enable = data.enable;
4469 }
4470
4471 const minimumValue = (_a = data.minimumValue) !== null && _a !== void 0 ? _a : data.opacity_min;
4472
4473 if (minimumValue !== undefined) {
4474 this.minimumValue = minimumValue;
4475 }
4476
4477 if (data.speed !== undefined) {
4478 this.speed = data.speed;
4479 }
4480
4481 if (data.startValue !== undefined) {
4482 this.startValue = data.startValue;
4483 }
4484
4485 if (data.sync !== undefined) {
4486 this.sync = data.sync;
4487 }
4488 }
4489
4490}
4491;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Opacity/Opacity.js
4492
4493
4494
4495class Opacity extends ValueWithRandom {
4496 constructor() {
4497 super();
4498 this.animation = new OpacityAnimation();
4499 this.random.minimumValue = 0.1;
4500 this.value = 1;
4501 }
4502
4503 get anim() {
4504 return this.animation;
4505 }
4506
4507 set anim(value) {
4508 this.animation = value;
4509 }
4510
4511 load(data) {
4512 var _a;
4513
4514 if (!data) {
4515 return;
4516 }
4517
4518 super.load(data);
4519 const animation = (_a = data.animation) !== null && _a !== void 0 ? _a : data.anim;
4520
4521 if (animation !== undefined) {
4522 this.animation.load(animation);
4523 this.value = NumberUtils.setRangeValue(this.value, this.animation.enable ? this.animation.minimumValue : undefined);
4524 }
4525 }
4526
4527}
4528;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Shape/Shape.js
4529
4530
4531class Shape {
4532 constructor() {
4533 this.options = {};
4534 this.type = ShapeType.circle;
4535 }
4536
4537 get image() {
4538 var _a;
4539
4540 return (_a = this.options[ShapeType.image]) !== null && _a !== void 0 ? _a : this.options[ShapeType.images];
4541 }
4542
4543 set image(value) {
4544 this.options[ShapeType.image] = value;
4545 this.options[ShapeType.images] = value;
4546 }
4547
4548 get custom() {
4549 return this.options;
4550 }
4551
4552 set custom(value) {
4553 this.options = value;
4554 }
4555
4556 get images() {
4557 return this.image instanceof Array ? this.image : [this.image];
4558 }
4559
4560 set images(value) {
4561 this.image = value;
4562 }
4563
4564 get stroke() {
4565 return [];
4566 }
4567
4568 set stroke(_value) {}
4569
4570 get character() {
4571 var _a;
4572
4573 return (_a = this.options[ShapeType.character]) !== null && _a !== void 0 ? _a : this.options[ShapeType.char];
4574 }
4575
4576 set character(value) {
4577 this.options[ShapeType.character] = value;
4578 this.options[ShapeType.char] = value;
4579 }
4580
4581 get polygon() {
4582 var _a;
4583
4584 return (_a = this.options[ShapeType.polygon]) !== null && _a !== void 0 ? _a : this.options[ShapeType.star];
4585 }
4586
4587 set polygon(value) {
4588 this.options[ShapeType.polygon] = value;
4589 this.options[ShapeType.star] = value;
4590 }
4591
4592 load(data) {
4593 var _a, _b, _c;
4594
4595 if (data === undefined) {
4596 return;
4597 }
4598
4599 const options = (_a = data.options) !== null && _a !== void 0 ? _a : data.custom;
4600
4601 if (options !== undefined) {
4602 for (const shape in options) {
4603 const item = options[shape];
4604
4605 if (item !== undefined) {
4606 this.options[shape] = Utils.deepExtend((_b = this.options[shape]) !== null && _b !== void 0 ? _b : {}, item);
4607 }
4608 }
4609 }
4610
4611 this.loadShape(data.character, ShapeType.character, ShapeType.char, true);
4612 this.loadShape(data.polygon, ShapeType.polygon, ShapeType.star, false);
4613 this.loadShape((_c = data.image) !== null && _c !== void 0 ? _c : data.images, ShapeType.image, ShapeType.images, true);
4614
4615 if (data.type !== undefined) {
4616 this.type = data.type;
4617 }
4618 }
4619
4620 loadShape(item, mainKey, altKey, altOverride) {
4621 var _a, _b, _c, _d;
4622
4623 if (item === undefined) {
4624 return;
4625 }
4626
4627 if (item instanceof Array) {
4628 if (!(this.options[mainKey] instanceof Array)) {
4629 this.options[mainKey] = [];
4630
4631 if (!this.options[altKey] || altOverride) {
4632 this.options[altKey] = [];
4633 }
4634 }
4635
4636 this.options[mainKey] = Utils.deepExtend((_a = this.options[mainKey]) !== null && _a !== void 0 ? _a : [], item);
4637
4638 if (!this.options[altKey] || altOverride) {
4639 this.options[altKey] = Utils.deepExtend((_b = this.options[altKey]) !== null && _b !== void 0 ? _b : [], item);
4640 }
4641 } else {
4642 if (this.options[mainKey] instanceof Array) {
4643 this.options[mainKey] = {};
4644
4645 if (!this.options[altKey] || altOverride) {
4646 this.options[altKey] = {};
4647 }
4648 }
4649
4650 this.options[mainKey] = Utils.deepExtend((_c = this.options[mainKey]) !== null && _c !== void 0 ? _c : {}, item);
4651
4652 if (!this.options[altKey] || altOverride) {
4653 this.options[altKey] = Utils.deepExtend((_d = this.options[altKey]) !== null && _d !== void 0 ? _d : {}, item);
4654 }
4655 }
4656 }
4657
4658}
4659;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Size/SizeAnimation.js
4660
4661
4662class SizeAnimation extends AnimationOptions {
4663 constructor() {
4664 super();
4665 this.destroy = DestroyType.none;
4666 this.enable = false;
4667 this.minimumValue = 0;
4668 this.speed = 5;
4669 this.startValue = StartValueType.random;
4670 this.sync = false;
4671 }
4672
4673 get size_min() {
4674 return this.minimumValue;
4675 }
4676
4677 set size_min(value) {
4678 this.minimumValue = value;
4679 }
4680
4681 load(data) {
4682 var _a;
4683
4684 if (data === undefined) {
4685 return;
4686 }
4687
4688 super.load(data);
4689
4690 if (data.destroy !== undefined) {
4691 this.destroy = data.destroy;
4692 }
4693
4694 if (data.enable !== undefined) {
4695 this.enable = data.enable;
4696 }
4697
4698 const minimumValue = (_a = data.minimumValue) !== null && _a !== void 0 ? _a : data.size_min;
4699
4700 if (minimumValue !== undefined) {
4701 this.minimumValue = minimumValue;
4702 }
4703
4704 if (data.speed !== undefined) {
4705 this.speed = data.speed;
4706 }
4707
4708 if (data.startValue !== undefined) {
4709 this.startValue = data.startValue;
4710 }
4711
4712 if (data.sync !== undefined) {
4713 this.sync = data.sync;
4714 }
4715 }
4716
4717}
4718;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Size/Size.js
4719
4720
4721
4722class Size extends ValueWithRandom {
4723 constructor() {
4724 super();
4725 this.animation = new SizeAnimation();
4726 this.random.minimumValue = 1;
4727 this.value = 3;
4728 }
4729
4730 get anim() {
4731 return this.animation;
4732 }
4733
4734 set anim(value) {
4735 this.animation = value;
4736 }
4737
4738 load(data) {
4739 var _a;
4740
4741 if (!data) {
4742 return;
4743 }
4744
4745 super.load(data);
4746 const animation = (_a = data.animation) !== null && _a !== void 0 ? _a : data.anim;
4747
4748 if (animation !== undefined) {
4749 this.animation.load(animation);
4750 this.value = NumberUtils.setRangeValue(this.value, this.animation.enable ? this.animation.minimumValue : undefined);
4751 }
4752 }
4753
4754}
4755;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Rotate/RotateAnimation.js
4756class RotateAnimation {
4757 constructor() {
4758 this.enable = false;
4759 this.speed = 0;
4760 this.sync = false;
4761 }
4762
4763 load(data) {
4764 if (data === undefined) {
4765 return;
4766 }
4767
4768 if (data.enable !== undefined) {
4769 this.enable = data.enable;
4770 }
4771
4772 if (data.speed !== undefined) {
4773 this.speed = data.speed;
4774 }
4775
4776 if (data.sync !== undefined) {
4777 this.sync = data.sync;
4778 }
4779 }
4780
4781}
4782;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Rotate/Rotate.js
4783
4784
4785
4786class Rotate extends ValueWithRandom {
4787 constructor() {
4788 super();
4789 this.animation = new RotateAnimation();
4790 this.direction = RotateDirection.clockwise;
4791 this.path = false;
4792 this.value = 0;
4793 }
4794
4795 load(data) {
4796 if (!data) {
4797 return;
4798 }
4799
4800 super.load(data);
4801
4802 if (data.direction !== undefined) {
4803 this.direction = data.direction;
4804 }
4805
4806 this.animation.load(data.animation);
4807
4808 if (data.path !== undefined) {
4809 this.path = data.path;
4810 }
4811 }
4812
4813}
4814;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Shadow.js
4815
4816class Shadow {
4817 constructor() {
4818 this.blur = 0;
4819 this.color = new OptionsColor();
4820 this.enable = false;
4821 this.offset = {
4822 x: 0,
4823 y: 0
4824 };
4825 this.color.value = "#000000";
4826 }
4827
4828 load(data) {
4829 if (data === undefined) {
4830 return;
4831 }
4832
4833 if (data.blur !== undefined) {
4834 this.blur = data.blur;
4835 }
4836
4837 this.color = OptionsColor.create(this.color, data.color);
4838
4839 if (data.enable !== undefined) {
4840 this.enable = data.enable;
4841 }
4842
4843 if (data.offset === undefined) {
4844 return;
4845 }
4846
4847 if (data.offset.x !== undefined) {
4848 this.offset.x = data.offset.x;
4849 }
4850
4851 if (data.offset.y !== undefined) {
4852 this.offset.y = data.offset.y;
4853 }
4854 }
4855
4856}
4857;// CONCATENATED MODULE: ./dist/browser/Options/Classes/ColorAnimation.js
4858
4859class ColorAnimation {
4860 constructor() {
4861 this.count = 0;
4862 this.enable = false;
4863 this.offset = 0;
4864 this.speed = 1;
4865 this.sync = true;
4866 }
4867
4868 load(data) {
4869 if (data === undefined) {
4870 return;
4871 }
4872
4873 if (data.count !== undefined) {
4874 this.count = data.count;
4875 }
4876
4877 if (data.enable !== undefined) {
4878 this.enable = data.enable;
4879 }
4880
4881 if (data.offset !== undefined) {
4882 this.offset = NumberUtils.setRangeValue(data.offset);
4883 }
4884
4885 if (data.speed !== undefined) {
4886 this.speed = data.speed;
4887 }
4888
4889 if (data.sync !== undefined) {
4890 this.sync = data.sync;
4891 }
4892 }
4893
4894}
4895;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/HslAnimation.js
4896
4897class HslAnimation {
4898 constructor() {
4899 this.h = new ColorAnimation();
4900 this.s = new ColorAnimation();
4901 this.l = new ColorAnimation();
4902 }
4903
4904 load(data) {
4905 if (!data) {
4906 return;
4907 }
4908
4909 this.h.load(data.h);
4910 this.s.load(data.s);
4911 this.l.load(data.l);
4912 }
4913
4914}
4915;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/AnimatableColor.js
4916
4917
4918class AnimatableColor extends OptionsColor {
4919 constructor() {
4920 super();
4921 this.animation = new HslAnimation();
4922 }
4923
4924 static create(source, data) {
4925 const color = source !== null && source !== void 0 ? source : new AnimatableColor();
4926
4927 if (data !== undefined) {
4928 color.load(typeof data === "string" ? {
4929 value: data
4930 } : data);
4931 }
4932
4933 return color;
4934 }
4935
4936 load(data) {
4937 super.load(data);
4938
4939 if (!data) {
4940 return;
4941 }
4942
4943 const colorAnimation = data.animation;
4944
4945 if (colorAnimation !== undefined) {
4946 if (colorAnimation.enable !== undefined) {
4947 this.animation.h.load(colorAnimation);
4948 } else {
4949 this.animation.load(data.animation);
4950 }
4951 }
4952 }
4953
4954}
4955;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Stroke.js
4956
4957class Stroke {
4958 constructor() {
4959 this.width = 0;
4960 }
4961
4962 load(data) {
4963 if (data === undefined) {
4964 return;
4965 }
4966
4967 if (data.color !== undefined) {
4968 this.color = AnimatableColor.create(this.color, data.color);
4969 }
4970
4971 if (data.width !== undefined) {
4972 this.width = data.width;
4973 }
4974
4975 if (data.opacity !== undefined) {
4976 this.opacity = data.opacity;
4977 }
4978 }
4979
4980}
4981;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Bounce/BounceFactor.js
4982
4983class BounceFactor extends ValueWithRandom {
4984 constructor() {
4985 super();
4986 this.random.minimumValue = 0.1;
4987 this.value = 1;
4988 }
4989
4990}
4991;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Bounce/Bounce.js
4992
4993class Bounce {
4994 constructor() {
4995 this.horizontal = new BounceFactor();
4996 this.vertical = new BounceFactor();
4997 }
4998
4999 load(data) {
5000 if (!data) {
5001 return;
5002 }
5003
5004 this.horizontal.load(data.horizontal);
5005 this.vertical.load(data.vertical);
5006 }
5007
5008}
5009;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Collisions/CollisionsOverlap.js
5010class CollisionsOverlap {
5011 constructor() {
5012 this.enable = true;
5013 this.retries = 0;
5014 }
5015
5016 load(data) {
5017 if (!data) {
5018 return;
5019 }
5020
5021 if (data.enable !== undefined) {
5022 this.enable = data.enable;
5023 }
5024
5025 if (data.retries !== undefined) {
5026 this.retries = data.retries;
5027 }
5028 }
5029
5030}
5031;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Collisions/Collisions.js
5032
5033
5034
5035class Collisions {
5036 constructor() {
5037 this.bounce = new Bounce();
5038 this.enable = false;
5039 this.mode = CollisionMode.bounce;
5040 this.overlap = new CollisionsOverlap();
5041 }
5042
5043 load(data) {
5044 if (data === undefined) {
5045 return;
5046 }
5047
5048 this.bounce.load(data.bounce);
5049
5050 if (data.enable !== undefined) {
5051 this.enable = data.enable;
5052 }
5053
5054 if (data.mode !== undefined) {
5055 this.mode = data.mode;
5056 }
5057
5058 this.overlap.load(data.overlap);
5059 }
5060
5061}
5062;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Twinkle/TwinkleValues.js
5063
5064class TwinkleValues {
5065 constructor() {
5066 this.enable = false;
5067 this.frequency = 0.05;
5068 this.opacity = 1;
5069 }
5070
5071 load(data) {
5072 if (data === undefined) {
5073 return;
5074 }
5075
5076 if (data.color !== undefined) {
5077 this.color = OptionsColor.create(this.color, data.color);
5078 }
5079
5080 if (data.enable !== undefined) {
5081 this.enable = data.enable;
5082 }
5083
5084 if (data.frequency !== undefined) {
5085 this.frequency = data.frequency;
5086 }
5087
5088 if (data.opacity !== undefined) {
5089 this.opacity = data.opacity;
5090 }
5091 }
5092
5093}
5094;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Twinkle/Twinkle.js
5095
5096class Twinkle {
5097 constructor() {
5098 this.lines = new TwinkleValues();
5099 this.particles = new TwinkleValues();
5100 }
5101
5102 load(data) {
5103 if (data === undefined) {
5104 return;
5105 }
5106
5107 this.lines.load(data.lines);
5108 this.particles.load(data.particles);
5109 }
5110
5111}
5112;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Life/LifeDelay.js
5113
5114class LifeDelay extends ValueWithRandom {
5115 constructor() {
5116 super();
5117 this.sync = false;
5118 }
5119
5120 load(data) {
5121 if (!data) {
5122 return;
5123 }
5124
5125 super.load(data);
5126
5127 if (data.sync !== undefined) {
5128 this.sync = data.sync;
5129 }
5130 }
5131
5132}
5133;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Life/LifeDuration.js
5134
5135class LifeDuration extends ValueWithRandom {
5136 constructor() {
5137 super();
5138 this.random.minimumValue = 0.0001;
5139 this.sync = false;
5140 }
5141
5142 load(data) {
5143 if (data === undefined) {
5144 return;
5145 }
5146
5147 super.load(data);
5148
5149 if (data.sync !== undefined) {
5150 this.sync = data.sync;
5151 }
5152 }
5153
5154}
5155;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Life/Life.js
5156
5157
5158class Life {
5159 constructor() {
5160 this.count = 0;
5161 this.delay = new LifeDelay();
5162 this.duration = new LifeDuration();
5163 }
5164
5165 load(data) {
5166 if (data === undefined) {
5167 return;
5168 }
5169
5170 if (data.count !== undefined) {
5171 this.count = data.count;
5172 }
5173
5174 this.delay.load(data.delay);
5175 this.duration.load(data.duration);
5176 }
5177
5178}
5179;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Destroy/SplitFactor.js
5180
5181class SplitFactor extends ValueWithRandom {
5182 constructor() {
5183 super();
5184 this.value = 3;
5185 }
5186
5187}
5188;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Destroy/SplitRate.js
5189
5190class SplitRate extends ValueWithRandom {
5191 constructor() {
5192 super();
5193 this.value = {
5194 min: 4,
5195 max: 9
5196 };
5197 }
5198
5199}
5200;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Destroy/Split.js
5201
5202
5203
5204class Split {
5205 constructor() {
5206 this.count = 1;
5207 this.factor = new SplitFactor();
5208 this.rate = new SplitRate();
5209 }
5210
5211 load(data) {
5212 if (!data) {
5213 return;
5214 }
5215
5216 if (data.count !== undefined) {
5217 this.count = data.count;
5218 }
5219
5220 this.factor.load(data.factor);
5221 this.rate.load(data.rate);
5222
5223 if (data.particles !== undefined) {
5224 this.particles = Utils.deepExtend({}, data.particles);
5225 }
5226 }
5227
5228}
5229;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/Destroy/Destroy.js
5230
5231
5232class Destroy {
5233 constructor() {
5234 this.mode = DestroyMode.none;
5235 this.split = new Split();
5236 }
5237
5238 load(data) {
5239 if (!data) {
5240 return;
5241 }
5242
5243 if (data.mode !== undefined) {
5244 this.mode = data.mode;
5245 }
5246
5247 this.split.load(data.split);
5248 }
5249
5250}
5251;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Particles/ParticlesOptions.js
5252
5253
5254
5255
5256
5257
5258
5259
5260
5261
5262
5263
5264
5265
5266
5267class ParticlesOptions {
5268 constructor() {
5269 this.bounce = new Bounce();
5270 this.collisions = new Collisions();
5271 this.color = new AnimatableColor();
5272 this.destroy = new Destroy();
5273 this.life = new Life();
5274 this.links = new Links();
5275 this.move = new Move();
5276 this.number = new ParticlesNumber();
5277 this.opacity = new Opacity();
5278 this.reduceDuplicates = false;
5279 this.rotate = new Rotate();
5280 this.shadow = new Shadow();
5281 this.shape = new Shape();
5282 this.size = new Size();
5283 this.stroke = new Stroke();
5284 this.twinkle = new Twinkle();
5285 }
5286
5287 get line_linked() {
5288 return this.links;
5289 }
5290
5291 set line_linked(value) {
5292 this.links = value;
5293 }
5294
5295 get lineLinked() {
5296 return this.links;
5297 }
5298
5299 set lineLinked(value) {
5300 this.links = value;
5301 }
5302
5303 load(data) {
5304 var _a, _b, _c, _d, _e, _f, _g;
5305
5306 if (data === undefined) {
5307 return;
5308 }
5309
5310 this.bounce.load(data.bounce);
5311 this.color = AnimatableColor.create(this.color, data.color);
5312 this.destroy.load(data.destroy);
5313 this.life.load(data.life);
5314 const links = (_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked;
5315
5316 if (links !== undefined) {
5317 this.links.load(links);
5318 }
5319
5320 this.move.load(data.move);
5321 this.number.load(data.number);
5322 this.opacity.load(data.opacity);
5323
5324 if (data.reduceDuplicates !== undefined) {
5325 this.reduceDuplicates = data.reduceDuplicates;
5326 }
5327
5328 this.rotate.load(data.rotate);
5329 this.shape.load(data.shape);
5330 this.size.load(data.size);
5331 this.shadow.load(data.shadow);
5332 this.twinkle.load(data.twinkle);
5333 const collisions = (_d = (_c = data.move) === null || _c === void 0 ? void 0 : _c.collisions) !== null && _d !== void 0 ? _d : (_e = data.move) === null || _e === void 0 ? void 0 : _e.bounce;
5334
5335 if (collisions !== undefined) {
5336 this.collisions.enable = collisions;
5337 }
5338
5339 this.collisions.load(data.collisions);
5340 const strokeToLoad = (_f = data.stroke) !== null && _f !== void 0 ? _f : (_g = data.shape) === null || _g === void 0 ? void 0 : _g.stroke;
5341
5342 if (strokeToLoad === undefined) {
5343 return;
5344 }
5345
5346 if (strokeToLoad instanceof Array) {
5347 this.stroke = strokeToLoad.map(s => {
5348 const tmp = new Stroke();
5349 tmp.load(s);
5350 return tmp;
5351 });
5352 } else {
5353 if (this.stroke instanceof Array) {
5354 this.stroke = new Stroke();
5355 }
5356
5357 this.stroke.load(strokeToLoad);
5358 }
5359 }
5360
5361}
5362;// CONCATENATED MODULE: ./dist/browser/Core/Particle/Infecter.js
5363class Infecter {
5364 constructor(container) {
5365 this.container = container;
5366 }
5367
5368 startInfection(stage) {
5369 const options = this.container.actualOptions;
5370 const stages = options.infection.stages;
5371 const stagesCount = stages.length;
5372
5373 if (stage > stagesCount || stage < 0) {
5374 return;
5375 }
5376
5377 this.infectionDelay = 0;
5378 this.infectionDelayStage = stage;
5379 }
5380
5381 updateInfectionStage(stage) {
5382 const options = this.container.actualOptions;
5383 const stagesCount = options.infection.stages.length;
5384
5385 if (stage > stagesCount || stage < 0 || this.infectionStage !== undefined && this.infectionStage > stage) {
5386 return;
5387 }
5388
5389 this.infectionStage = stage;
5390 this.infectionTime = 0;
5391 }
5392
5393 updateInfection(delta) {
5394 const options = this.container.actualOptions;
5395 const infection = options.infection;
5396 const stages = options.infection.stages;
5397 const stagesCount = stages.length;
5398
5399 if (this.infectionDelay !== undefined && this.infectionDelayStage !== undefined) {
5400 const stage = this.infectionDelayStage;
5401
5402 if (stage > stagesCount || stage < 0) {
5403 return;
5404 }
5405
5406 if (this.infectionDelay > infection.delay * 1000) {
5407 this.infectionStage = stage;
5408 this.infectionTime = 0;
5409 delete this.infectionDelay;
5410 delete this.infectionDelayStage;
5411 } else {
5412 this.infectionDelay += delta;
5413 }
5414 } else {
5415 delete this.infectionDelay;
5416 delete this.infectionDelayStage;
5417 }
5418
5419 if (this.infectionStage !== undefined && this.infectionTime !== undefined) {
5420 const infectionStage = stages[this.infectionStage];
5421
5422 if (infectionStage.duration !== undefined && infectionStage.duration >= 0) {
5423 if (this.infectionTime > infectionStage.duration * 1000) {
5424 this.nextInfectionStage();
5425 } else {
5426 this.infectionTime += delta;
5427 }
5428 } else {
5429 this.infectionTime += delta;
5430 }
5431 } else {
5432 delete this.infectionStage;
5433 delete this.infectionTime;
5434 }
5435 }
5436
5437 nextInfectionStage() {
5438 const options = this.container.actualOptions;
5439 const stagesCount = options.infection.stages.length;
5440
5441 if (stagesCount <= 0 || this.infectionStage === undefined) {
5442 return;
5443 }
5444
5445 this.infectionTime = 0;
5446
5447 if (stagesCount <= ++this.infectionStage) {
5448 if (options.infection.cure) {
5449 delete this.infectionStage;
5450 delete this.infectionTime;
5451 return;
5452 } else {
5453 this.infectionStage = 0;
5454 this.infectionTime = 0;
5455 }
5456 }
5457 }
5458
5459}
5460;// CONCATENATED MODULE: ./dist/browser/Core/Particle/Mover.js
5461
5462
5463class Mover {
5464 constructor(container, particle) {
5465 this.container = container;
5466 this.particle = particle;
5467 }
5468
5469 move(delta) {
5470 const particle = this.particle;
5471 particle.bubble.inRange = false;
5472 particle.links = [];
5473
5474 for (const [, plugin] of this.container.plugins) {
5475 if (particle.destroyed) {
5476 break;
5477 }
5478
5479 if (plugin.particleUpdate) {
5480 plugin.particleUpdate(particle, delta);
5481 }
5482 }
5483
5484 if (particle.destroyed) {
5485 return;
5486 }
5487
5488 this.moveParticle(delta);
5489 this.moveParallax();
5490 }
5491
5492 moveParticle(delta) {
5493 var _a, _b;
5494
5495 const particle = this.particle;
5496 const particlesOptions = particle.options;
5497
5498 if (!particlesOptions.move.enable) {
5499 return;
5500 }
5501
5502 const container = this.container;
5503 const slowFactor = this.getProximitySpeedFactor();
5504 const baseSpeed = ((_a = particle.moveSpeed) !== null && _a !== void 0 ? _a : NumberUtils.getRangeValue(particle.options.move.speed) * container.retina.pixelRatio) * container.retina.reduceFactor;
5505 const maxSize = NumberUtils.getRangeMax(particle.options.size.value) * container.retina.pixelRatio;
5506 const sizeFactor = particlesOptions.move.size ? particle.getRadius() / maxSize : 1;
5507 const moveSpeed = baseSpeed / 2 * sizeFactor * slowFactor * delta.factor;
5508 const moveDrift = (_b = particle.moveDrift) !== null && _b !== void 0 ? _b : NumberUtils.getRangeValue(particle.options.move.drift) * container.retina.pixelRatio;
5509 this.applyPath(delta);
5510 const gravityOptions = particlesOptions.move.gravity;
5511
5512 if (gravityOptions.enable) {
5513 particle.velocity.y += gravityOptions.acceleration * delta.factor / (60 * moveSpeed);
5514 }
5515
5516 particle.velocity.x += moveDrift * delta.factor / (60 * moveSpeed);
5517 const decay = 1 - particle.options.move.decay;
5518 particle.velocity.multTo(decay);
5519 const velocity = particle.velocity.mult(moveSpeed);
5520
5521 if (gravityOptions.enable && velocity.y >= gravityOptions.maxSpeed && gravityOptions.maxSpeed > 0) {
5522 velocity.y = gravityOptions.maxSpeed;
5523 particle.velocity.y = velocity.y / moveSpeed;
5524 }
5525
5526 particle.position.addTo(velocity);
5527
5528 if (particlesOptions.move.vibrate) {
5529 particle.position.x += Math.sin(particle.position.x * Math.cos(particle.position.y));
5530 particle.position.y += Math.cos(particle.position.y * Math.sin(particle.position.x));
5531 }
5532
5533 const initialPosition = particle.initialPosition;
5534 const initialDistance = NumberUtils.getDistance(initialPosition, particle.position);
5535
5536 if (particle.maxDistance) {
5537 if (initialDistance >= particle.maxDistance && !particle.misplaced) {
5538 particle.misplaced = initialDistance > particle.maxDistance;
5539 particle.velocity.x = particle.velocity.y / 2 - particle.velocity.x;
5540 particle.velocity.y = particle.velocity.x / 2 - particle.velocity.y;
5541 } else if (initialDistance < particle.maxDistance && particle.misplaced) {
5542 particle.misplaced = false;
5543 } else if (particle.misplaced) {
5544 if (particle.position.x < initialPosition.x && particle.velocity.x < 0 || particle.position.x > initialPosition.x && particle.velocity.x > 0) {
5545 particle.velocity.x *= -Math.random();
5546 }
5547
5548 if (particle.position.y < initialPosition.y && particle.velocity.y < 0 || particle.position.y > initialPosition.y && particle.velocity.y > 0) {
5549 particle.velocity.y *= -Math.random();
5550 }
5551 }
5552 }
5553 }
5554
5555 applyPath(delta) {
5556 const particle = this.particle;
5557 const particlesOptions = particle.options;
5558 const pathOptions = particlesOptions.move.path;
5559 const pathEnabled = pathOptions.enable;
5560
5561 if (!pathEnabled) {
5562 return;
5563 }
5564
5565 const container = this.container;
5566
5567 if (particle.lastPathTime <= particle.pathDelay) {
5568 particle.lastPathTime += delta.value;
5569 return;
5570 }
5571
5572 let generator = container.pathGenerator;
5573
5574 if (pathOptions.generator) {
5575 const customGenerator = Plugins.getPathGenerator(pathOptions.generator);
5576
5577 if (customGenerator) {
5578 generator = customGenerator;
5579 }
5580 }
5581
5582 const path = generator.generate(particle);
5583 particle.velocity.addTo(path);
5584
5585 if (pathOptions.clamp) {
5586 particle.velocity.x = NumberUtils.clamp(particle.velocity.x, -1, 1);
5587 particle.velocity.y = NumberUtils.clamp(particle.velocity.y, -1, 1);
5588 }
5589
5590 particle.lastPathTime -= particle.pathDelay;
5591 }
5592
5593 moveParallax() {
5594 const container = this.container;
5595 const options = container.actualOptions;
5596
5597 if (Utils.isSsr() || !options.interactivity.events.onHover.parallax.enable) {
5598 return;
5599 }
5600
5601 const particle = this.particle;
5602 const parallaxForce = options.interactivity.events.onHover.parallax.force;
5603 const mousePos = container.interactivity.mouse.position;
5604
5605 if (!mousePos) {
5606 return;
5607 }
5608
5609 const canvasCenter = {
5610 x: container.canvas.size.width / 2,
5611 y: container.canvas.size.height / 2
5612 };
5613 const parallaxSmooth = options.interactivity.events.onHover.parallax.smooth;
5614 const factor = particle.getRadius() / parallaxForce;
5615 const tmp = {
5616 x: (mousePos.x - canvasCenter.x) * factor,
5617 y: (mousePos.y - canvasCenter.y) * factor
5618 };
5619 particle.offset.x += (tmp.x - particle.offset.x) / parallaxSmooth;
5620 particle.offset.y += (tmp.y - particle.offset.y) / parallaxSmooth;
5621 }
5622
5623 getProximitySpeedFactor() {
5624 const container = this.container;
5625 const options = container.actualOptions;
5626 const active = Utils.isInArray(HoverMode.slow, options.interactivity.events.onHover.mode);
5627
5628 if (!active) {
5629 return 1;
5630 }
5631
5632 const mousePos = this.container.interactivity.mouse.position;
5633
5634 if (!mousePos) {
5635 return 1;
5636 }
5637
5638 const particlePos = this.particle.getPosition();
5639 const dist = NumberUtils.getDistance(mousePos, particlePos);
5640 const radius = container.retina.slowModeRadius;
5641
5642 if (dist > radius) {
5643 return 1;
5644 }
5645
5646 const proximityFactor = dist / radius || 0;
5647 const slowFactor = options.interactivity.modes.slow.factor;
5648 return proximityFactor / slowFactor;
5649 }
5650
5651}
5652;// CONCATENATED MODULE: ./dist/browser/Core/Particle.js
5653
5654
5655
5656
5657
5658
5659
5660
5661class Particle {
5662 constructor(id, container, position, overrideOptions) {
5663 var _a, _b, _c, _d, _e, _f, _g, _h, _j;
5664
5665 this.id = id;
5666 this.container = container;
5667 this.links = [];
5668 this.fill = true;
5669 this.close = true;
5670 this.lastPathTime = 0;
5671 this.destroyed = false;
5672 this.unbreakable = false;
5673 this.splitCount = 0;
5674 this.misplaced = false;
5675 this.loops = {
5676 opacity: 0,
5677 size: 0
5678 };
5679 const pxRatio = container.retina.pixelRatio;
5680 const options = container.actualOptions;
5681 const particlesOptions = new ParticlesOptions();
5682 particlesOptions.load(options.particles);
5683 const shapeType = particlesOptions.shape.type;
5684 const reduceDuplicates = particlesOptions.reduceDuplicates;
5685 this.shape = shapeType instanceof Array ? Utils.itemFromArray(shapeType, this.id, reduceDuplicates) : shapeType;
5686
5687 if (overrideOptions === null || overrideOptions === void 0 ? void 0 : overrideOptions.shape) {
5688 if (overrideOptions.shape.type) {
5689 const overrideShapeType = overrideOptions.shape.type;
5690 this.shape = overrideShapeType instanceof Array ? Utils.itemFromArray(overrideShapeType, this.id, reduceDuplicates) : overrideShapeType;
5691 }
5692
5693 const shapeOptions = new Shape();
5694 shapeOptions.load(overrideOptions.shape);
5695
5696 if (this.shape) {
5697 const shapeData = shapeOptions.options[this.shape];
5698
5699 if (shapeData) {
5700 this.shapeData = Utils.deepExtend({}, shapeData instanceof Array ? Utils.itemFromArray(shapeData, this.id, reduceDuplicates) : shapeData);
5701 }
5702 }
5703 } else {
5704 const shapeData = particlesOptions.shape.options[this.shape];
5705
5706 if (shapeData) {
5707 this.shapeData = Utils.deepExtend({}, shapeData instanceof Array ? Utils.itemFromArray(shapeData, this.id, reduceDuplicates) : shapeData);
5708 }
5709 }
5710
5711 if (overrideOptions !== undefined) {
5712 particlesOptions.load(overrideOptions);
5713 }
5714
5715 if (((_a = this.shapeData) === null || _a === void 0 ? void 0 : _a.particles) !== undefined) {
5716 particlesOptions.load((_b = this.shapeData) === null || _b === void 0 ? void 0 : _b.particles);
5717 }
5718
5719 this.fill = (_d = (_c = this.shapeData) === null || _c === void 0 ? void 0 : _c.fill) !== null && _d !== void 0 ? _d : this.fill;
5720 this.close = (_f = (_e = this.shapeData) === null || _e === void 0 ? void 0 : _e.close) !== null && _f !== void 0 ? _f : this.close;
5721 this.options = particlesOptions;
5722 this.pathDelay = NumberUtils.getValue(this.options.move.path.delay) * 1000;
5723 container.retina.initParticle(this);
5724 const color = this.options.color;
5725 const sizeOptions = this.options.size;
5726 const sizeValue = NumberUtils.getValue(sizeOptions) * container.retina.pixelRatio;
5727 const randomSize = typeof sizeOptions.random === "boolean" ? sizeOptions.random : sizeOptions.random.enable;
5728 this.size = {
5729 value: sizeValue
5730 };
5731 this.direction = this.options.move.direction;
5732 this.bubble = {
5733 inRange: false
5734 };
5735 this.initialVelocity = this.calculateVelocity();
5736 this.velocity = this.initialVelocity.copy();
5737 const rotateOptions = this.options.rotate;
5738 this.rotate = {
5739 value: NumberUtils.getRangeValue(rotateOptions.value) * Math.PI / 180
5740 };
5741 let rotateDirection = rotateOptions.direction;
5742
5743 if (rotateDirection === RotateDirection.random) {
5744 const index = Math.floor(Math.random() * 2);
5745 rotateDirection = index > 0 ? RotateDirection.counterClockwise : RotateDirection.clockwise;
5746 }
5747
5748 switch (rotateDirection) {
5749 case RotateDirection.counterClockwise:
5750 case "counterClockwise":
5751 this.rotate.status = AnimationStatus.decreasing;
5752 break;
5753
5754 case RotateDirection.clockwise:
5755 this.rotate.status = AnimationStatus.increasing;
5756 break;
5757 }
5758
5759 const rotateAnimation = this.options.rotate.animation;
5760
5761 if (rotateAnimation.enable) {
5762 this.rotate.velocity = rotateAnimation.speed / 360 * container.retina.reduceFactor;
5763
5764 if (!rotateAnimation.sync) {
5765 this.rotate.velocity *= Math.random();
5766 }
5767 }
5768
5769 const sizeAnimation = this.options.size.animation;
5770
5771 if (sizeAnimation.enable) {
5772 this.size.status = AnimationStatus.increasing;
5773
5774 if (!randomSize) {
5775 switch (sizeAnimation.startValue) {
5776 case StartValueType.min:
5777 this.size.value = sizeAnimation.minimumValue * pxRatio;
5778 break;
5779
5780 case StartValueType.random:
5781 this.size.value = NumberUtils.randomInRange(NumberUtils.setRangeValue(sizeAnimation.minimumValue * pxRatio, this.size.value));
5782 break;
5783
5784 case StartValueType.max:
5785 default:
5786 this.size.status = AnimationStatus.decreasing;
5787 break;
5788 }
5789 }
5790
5791 this.size.velocity = ((_g = this.sizeAnimationSpeed) !== null && _g !== void 0 ? _g : container.retina.sizeAnimationSpeed) / 100 * container.retina.reduceFactor;
5792
5793 if (!sizeAnimation.sync) {
5794 this.size.velocity *= Math.random();
5795 }
5796 }
5797
5798 const hslColor = ColorUtils.colorToHsl(color, this.id, reduceDuplicates);
5799
5800 if (hslColor) {
5801 this.color = {
5802 h: {
5803 value: hslColor.h
5804 },
5805 s: {
5806 value: hslColor.s
5807 },
5808 l: {
5809 value: hslColor.l
5810 }
5811 };
5812 const colorAnimation = this.options.color.animation;
5813 this.setColorAnimation(colorAnimation.h, this.color.h);
5814 this.setColorAnimation(colorAnimation.s, this.color.s);
5815 this.setColorAnimation(colorAnimation.l, this.color.l);
5816 }
5817
5818 this.position = this.calcPosition(this.container, position);
5819 this.initialPosition = this.position.copy();
5820 this.offset = Vector.create(0, 0);
5821 const opacityOptions = this.options.opacity;
5822 const randomOpacity = typeof opacityOptions.random === "boolean" ? opacityOptions.random : opacityOptions.random.enable;
5823 this.opacity = {
5824 value: NumberUtils.getValue(opacityOptions)
5825 };
5826 const opacityAnimation = opacityOptions.animation;
5827
5828 if (opacityAnimation.enable) {
5829 this.opacity.status = AnimationStatus.increasing;
5830
5831 if (!randomOpacity) {
5832 switch (opacityAnimation.startValue) {
5833 case StartValueType.min:
5834 this.opacity.value = opacityAnimation.minimumValue;
5835 break;
5836
5837 case StartValueType.random:
5838 this.opacity.value = NumberUtils.randomInRange(NumberUtils.setRangeValue(opacityAnimation.minimumValue, this.opacity.value));
5839 break;
5840
5841 case StartValueType.max:
5842 default:
5843 this.opacity.status = AnimationStatus.decreasing;
5844 break;
5845 }
5846 }
5847
5848 this.opacity.velocity = opacityAnimation.speed / 100 * container.retina.reduceFactor;
5849
5850 if (!opacityAnimation.sync) {
5851 this.opacity.velocity *= Math.random();
5852 }
5853 }
5854
5855 this.sides = 24;
5856 let drawer = container.drawers.get(this.shape);
5857
5858 if (!drawer) {
5859 drawer = Plugins.getShapeDrawer(this.shape);
5860
5861 if (drawer) {
5862 container.drawers.set(this.shape, drawer);
5863 }
5864 }
5865
5866 const sideCountFunc = drawer === null || drawer === void 0 ? void 0 : drawer.getSidesCount;
5867
5868 if (sideCountFunc) {
5869 this.sides = sideCountFunc(this);
5870 }
5871
5872 const imageShape = this.loadImageShape(container, drawer);
5873
5874 if (imageShape) {
5875 this.image = imageShape.image;
5876 this.fill = imageShape.fill;
5877 this.close = imageShape.close;
5878 }
5879
5880 this.stroke = this.options.stroke instanceof Array ? Utils.itemFromArray(this.options.stroke, this.id, reduceDuplicates) : this.options.stroke;
5881 this.strokeWidth = this.stroke.width * container.retina.pixelRatio;
5882 const strokeHslColor = (_h = ColorUtils.colorToHsl(this.stroke.color)) !== null && _h !== void 0 ? _h : this.getFillColor();
5883
5884 if (strokeHslColor) {
5885 this.strokeColor = {
5886 h: {
5887 value: strokeHslColor.h
5888 },
5889 s: {
5890 value: strokeHslColor.s
5891 },
5892 l: {
5893 value: strokeHslColor.l
5894 }
5895 };
5896 const strokeColorAnimation = (_j = this.stroke.color) === null || _j === void 0 ? void 0 : _j.animation;
5897
5898 if (strokeColorAnimation && this.strokeColor) {
5899 this.setColorAnimation(strokeColorAnimation.h, this.strokeColor.h);
5900 this.setColorAnimation(strokeColorAnimation.s, this.strokeColor.s);
5901 this.setColorAnimation(strokeColorAnimation.l, this.strokeColor.l);
5902 }
5903 }
5904
5905 const lifeOptions = particlesOptions.life;
5906 this.lifeDelay = container.retina.reduceFactor ? NumberUtils.getValue(lifeOptions.delay) * (lifeOptions.delay.sync ? 1 : Math.random()) / container.retina.reduceFactor * 1000 : 0;
5907 this.lifeDelayTime = 0;
5908 this.lifeDuration = container.retina.reduceFactor ? NumberUtils.getValue(lifeOptions.duration) * (lifeOptions.duration.sync ? 1 : Math.random()) / container.retina.reduceFactor * 1000 : 0;
5909 this.lifeTime = 0;
5910 this.livesRemaining = particlesOptions.life.count;
5911 this.spawning = this.lifeDelay > 0;
5912
5913 if (this.lifeDuration <= 0) {
5914 this.lifeDuration = -1;
5915 }
5916
5917 if (this.livesRemaining <= 0) {
5918 this.livesRemaining = -1;
5919 }
5920
5921 this.shadowColor = ColorUtils.colorToRgb(this.options.shadow.color);
5922 this.updater = new Updater(container, this);
5923 this.infecter = new Infecter(container);
5924 this.mover = new Mover(container, this);
5925
5926 if (drawer && drawer.particleInit) {
5927 drawer.particleInit(container, this);
5928 }
5929 }
5930
5931 move(delta) {
5932 this.mover.move(delta);
5933 }
5934
5935 update(delta) {
5936 this.updater.update(delta);
5937 }
5938
5939 draw(delta) {
5940 this.container.canvas.drawParticle(this, delta);
5941 }
5942
5943 getPosition() {
5944 return this.position.add(this.offset);
5945 }
5946
5947 getRadius() {
5948 return this.bubble.radius || this.size.value;
5949 }
5950
5951 getMass() {
5952 const radius = this.getRadius();
5953 return Math.pow(radius, 2) * Math.PI / 2;
5954 }
5955
5956 getFillColor() {
5957 var _a;
5958
5959 return (_a = this.bubble.color) !== null && _a !== void 0 ? _a : ColorUtils.getHslFromAnimation(this.color);
5960 }
5961
5962 getStrokeColor() {
5963 var _a, _b;
5964
5965 return (_b = (_a = this.bubble.color) !== null && _a !== void 0 ? _a : ColorUtils.getHslFromAnimation(this.strokeColor)) !== null && _b !== void 0 ? _b : this.getFillColor();
5966 }
5967
5968 destroy(override) {
5969 this.destroyed = true;
5970 this.bubble.inRange = false;
5971 this.links = [];
5972
5973 if (this.unbreakable) {
5974 return;
5975 }
5976
5977 this.destroyed = true;
5978 this.bubble.inRange = false;
5979
5980 for (const [, plugin] of this.container.plugins) {
5981 if (plugin.particleDestroyed) {
5982 plugin.particleDestroyed(this, override);
5983 }
5984 }
5985
5986 if (override) {
5987 return;
5988 }
5989
5990 const destroyOptions = this.options.destroy;
5991
5992 if (destroyOptions.mode === DestroyMode.split) {
5993 this.split();
5994 }
5995 }
5996
5997 reset() {
5998 this.loops.opacity = 0;
5999 this.loops.size = 0;
6000 }
6001
6002 split() {
6003 const splitOptions = this.options.destroy.split;
6004
6005 if (splitOptions.count >= 0 && this.splitCount++ > splitOptions.count) {
6006 return;
6007 }
6008
6009 const rate = NumberUtils.getRangeValue(splitOptions.rate.value);
6010
6011 for (let i = 0; i < rate; i++) {
6012 this.container.particles.addSplitParticle(this);
6013 }
6014 }
6015
6016 setColorAnimation(colorAnimation, colorValue) {
6017 if (colorAnimation.enable) {
6018 colorValue.velocity = colorAnimation.speed / 100 * this.container.retina.reduceFactor;
6019
6020 if (colorAnimation.sync) {
6021 return;
6022 }
6023
6024 colorValue.status = AnimationStatus.increasing;
6025 colorValue.velocity *= Math.random();
6026
6027 if (colorValue.value) {
6028 colorValue.value *= Math.random();
6029 }
6030 } else {
6031 colorValue.velocity = 0;
6032 }
6033 }
6034
6035 calcPosition(container, position, tryCount = 0) {
6036 var _a, _b;
6037
6038 for (const [, plugin] of container.plugins) {
6039 const pluginPos = plugin.particlePosition !== undefined ? plugin.particlePosition(position, this) : undefined;
6040
6041 if (pluginPos !== undefined) {
6042 return Vector.create(pluginPos.x, pluginPos.y);
6043 }
6044 }
6045
6046 const pos = Vector.create((_a = position === null || position === void 0 ? void 0 : position.x) !== null && _a !== void 0 ? _a : Math.random() * container.canvas.size.width, (_b = position === null || position === void 0 ? void 0 : position.y) !== null && _b !== void 0 ? _b : Math.random() * container.canvas.size.height);
6047 const outMode = this.options.move.outMode;
6048
6049 if (Utils.isInArray(outMode, OutMode.bounce) || Utils.isInArray(outMode, OutMode.bounceHorizontal)) {
6050 if (pos.x > container.canvas.size.width - this.size.value * 2) {
6051 pos.x -= this.size.value;
6052 } else if (pos.x < this.size.value * 2) {
6053 pos.x += this.size.value;
6054 }
6055 }
6056
6057 if (Utils.isInArray(outMode, OutMode.bounce) || Utils.isInArray(outMode, OutMode.bounceVertical)) {
6058 if (pos.y > container.canvas.size.height - this.size.value * 2) {
6059 pos.y -= this.size.value;
6060 } else if (pos.y < this.size.value * 2) {
6061 pos.y += this.size.value;
6062 }
6063 }
6064
6065 if (this.checkOverlap(pos, tryCount)) {
6066 return this.calcPosition(container, undefined, tryCount + 1);
6067 }
6068
6069 return pos;
6070 }
6071
6072 checkOverlap(pos, tryCount = 0) {
6073 const overlapOptions = this.options.collisions.overlap;
6074
6075 if (!overlapOptions.enable) {
6076 const retries = overlapOptions.retries;
6077
6078 if (retries >= 0 && tryCount > retries) {
6079 throw new Error("Particle is overlapping and can't be placed");
6080 }
6081
6082 let overlaps = false;
6083
6084 for (const particle of this.container.particles.array) {
6085 if (NumberUtils.getDistance(pos, particle.position) < this.size.value + particle.size.value) {
6086 overlaps = true;
6087 break;
6088 }
6089 }
6090
6091 return overlaps;
6092 }
6093
6094 return false;
6095 }
6096
6097 calculateVelocity() {
6098 const baseVelocity = NumberUtils.getParticleBaseVelocity(this.direction);
6099 const res = baseVelocity.copy();
6100 const moveOptions = this.options.move;
6101 let rad;
6102 let radOffset = Math.PI / 4;
6103
6104 if (typeof moveOptions.angle === "number") {
6105 rad = Math.PI / 180 * moveOptions.angle;
6106 } else {
6107 rad = Math.PI / 180 * moveOptions.angle.value;
6108 radOffset = Math.PI / 180 * moveOptions.angle.offset;
6109 }
6110
6111 const range = {
6112 left: Math.sin(radOffset + rad / 2) - Math.sin(radOffset - rad / 2),
6113 right: Math.cos(radOffset + rad / 2) - Math.cos(radOffset - rad / 2)
6114 };
6115
6116 if (!moveOptions.straight || moveOptions.random) {
6117 res.x += NumberUtils.randomInRange(NumberUtils.setRangeValue(range.left, range.right)) / 2;
6118 res.y += NumberUtils.randomInRange(NumberUtils.setRangeValue(range.left, range.right)) / 2;
6119 }
6120
6121 return res;
6122 }
6123
6124 loadImageShape(container, drawer) {
6125 var _a, _b, _c, _d, _e;
6126
6127 if (!(this.shape === ShapeType.image || this.shape === ShapeType.images)) {
6128 return;
6129 }
6130
6131 const imageDrawer = drawer;
6132 const images = imageDrawer.getImages(container).images;
6133 const imageData = this.shapeData;
6134 const image = (_a = images.find(t => t.source === imageData.src)) !== null && _a !== void 0 ? _a : images[0];
6135 const color = this.getFillColor();
6136 let imageRes;
6137
6138 if (!image) {
6139 return;
6140 }
6141
6142 if (image.svgData !== undefined && imageData.replaceColor && color) {
6143 const svgColoredData = ColorUtils.replaceColorSvg(image, color, this.opacity.value);
6144 const svg = new Blob([svgColoredData], {
6145 type: "image/svg+xml"
6146 });
6147 const domUrl = URL || window.URL || window.webkitURL || window;
6148 const url = domUrl.createObjectURL(svg);
6149 const img = new Image();
6150 imageRes = {
6151 data: image,
6152 loaded: false,
6153 ratio: imageData.width / imageData.height,
6154 replaceColor: (_b = imageData.replaceColor) !== null && _b !== void 0 ? _b : imageData.replace_color,
6155 source: imageData.src
6156 };
6157 img.addEventListener("load", () => {
6158 if (this.image) {
6159 this.image.loaded = true;
6160 image.element = img;
6161 }
6162
6163 domUrl.revokeObjectURL(url);
6164 });
6165 img.addEventListener("error", () => {
6166 domUrl.revokeObjectURL(url);
6167 Utils.loadImage(imageData.src).then(img2 => {
6168 if (this.image && img2) {
6169 image.element = img2.element;
6170 this.image.loaded = true;
6171 }
6172 });
6173 });
6174 img.src = url;
6175 } else {
6176 imageRes = {
6177 data: image,
6178 loaded: true,
6179 ratio: imageData.width / imageData.height,
6180 replaceColor: (_c = imageData.replaceColor) !== null && _c !== void 0 ? _c : imageData.replace_color,
6181 source: imageData.src
6182 };
6183 }
6184
6185 if (!imageRes.ratio) {
6186 imageRes.ratio = 1;
6187 }
6188
6189 const fill = (_d = imageData.fill) !== null && _d !== void 0 ? _d : this.fill;
6190 const close = (_e = imageData.close) !== null && _e !== void 0 ? _e : this.close;
6191 return {
6192 image: imageRes,
6193 fill,
6194 close
6195 };
6196 }
6197
6198}
6199;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Grabber.js
6200
6201
6202class Grabber {
6203 constructor(container) {
6204 this.container = container;
6205 }
6206
6207 isEnabled() {
6208 const container = this.container;
6209 const mouse = container.interactivity.mouse;
6210 const events = container.actualOptions.interactivity.events;
6211
6212 if (!(events.onHover.enable && mouse.position)) {
6213 return false;
6214 }
6215
6216 const hoverMode = events.onHover.mode;
6217 return Utils.isInArray(HoverMode.grab, hoverMode);
6218 }
6219
6220 reset() {}
6221
6222 interact() {
6223 var _a;
6224
6225 const container = this.container;
6226 const options = container.actualOptions;
6227 const interactivity = options.interactivity;
6228
6229 if (interactivity.events.onHover.enable && container.interactivity.status === Constants.mouseMoveEvent) {
6230 const mousePos = container.interactivity.mouse.position;
6231
6232 if (mousePos === undefined) {
6233 return;
6234 }
6235
6236 const distance = container.retina.grabModeDistance;
6237 const query = container.particles.quadTree.queryCircle(mousePos, distance);
6238
6239 for (const particle of query) {
6240 const pos = particle.getPosition();
6241 const pointDistance = NumberUtils.getDistance(pos, mousePos);
6242
6243 if (pointDistance <= distance) {
6244 const grabLineOptions = interactivity.modes.grab.links;
6245 const lineOpacity = grabLineOptions.opacity;
6246 const opacityLine = lineOpacity - pointDistance * lineOpacity / distance;
6247
6248 if (opacityLine > 0) {
6249 const optColor = (_a = grabLineOptions.color) !== null && _a !== void 0 ? _a : particle.options.links.color;
6250
6251 if (!container.particles.grabLineColor) {
6252 const linksOptions = container.actualOptions.interactivity.modes.grab.links;
6253 container.particles.grabLineColor = ColorUtils.getLinkRandomColor(optColor, linksOptions.blink, linksOptions.consent);
6254 }
6255
6256 const colorLine = ColorUtils.getLinkColor(particle, undefined, container.particles.grabLineColor);
6257
6258 if (colorLine === undefined) {
6259 return;
6260 }
6261
6262 container.canvas.drawGrabLine(particle, colorLine, opacityLine, mousePos);
6263 }
6264 }
6265 }
6266 }
6267 }
6268
6269}
6270;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Repulser.js
6271
6272
6273
6274class Repulser {
6275 constructor(container) {
6276 this.container = container;
6277 }
6278
6279 isEnabled() {
6280 const container = this.container;
6281 const options = container.actualOptions;
6282 const mouse = container.interactivity.mouse;
6283 const events = options.interactivity.events;
6284 const divs = events.onDiv;
6285 const divRepulse = Utils.isDivModeEnabled(DivMode.repulse, divs);
6286
6287 if (!(divRepulse || events.onHover.enable && mouse.position || events.onClick.enable && mouse.clickPosition)) {
6288 return false;
6289 }
6290
6291 const hoverMode = events.onHover.mode;
6292 const clickMode = events.onClick.mode;
6293 return Utils.isInArray(HoverMode.repulse, hoverMode) || Utils.isInArray(ClickMode.repulse, clickMode) || divRepulse;
6294 }
6295
6296 reset() {}
6297
6298 interact() {
6299 const container = this.container;
6300 const options = container.actualOptions;
6301 const mouseMoveStatus = container.interactivity.status === Constants.mouseMoveEvent;
6302 const events = options.interactivity.events;
6303 const hoverEnabled = events.onHover.enable;
6304 const hoverMode = events.onHover.mode;
6305 const clickEnabled = events.onClick.enable;
6306 const clickMode = events.onClick.mode;
6307 const divs = events.onDiv;
6308
6309 if (mouseMoveStatus && hoverEnabled && Utils.isInArray(HoverMode.repulse, hoverMode)) {
6310 this.hoverRepulse();
6311 } else if (clickEnabled && Utils.isInArray(ClickMode.repulse, clickMode)) {
6312 this.clickRepulse();
6313 } else {
6314 Utils.divModeExecute(DivMode.repulse, divs, (selector, div) => this.singleSelectorRepulse(selector, div));
6315 }
6316 }
6317
6318 singleSelectorRepulse(selector, div) {
6319 const container = this.container;
6320 const query = document.querySelectorAll(selector);
6321
6322 if (!query.length) {
6323 return;
6324 }
6325
6326 query.forEach(item => {
6327 const elem = item;
6328 const pxRatio = container.retina.pixelRatio;
6329 const pos = {
6330 x: (elem.offsetLeft + elem.offsetWidth / 2) * pxRatio,
6331 y: (elem.offsetTop + elem.offsetHeight / 2) * pxRatio
6332 };
6333 const repulseRadius = elem.offsetWidth / 2 * pxRatio;
6334 const area = div.type === DivType.circle ? new Circle(pos.x, pos.y, repulseRadius) : new Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio);
6335 const divs = container.actualOptions.interactivity.modes.repulse.divs;
6336 const divRepulse = Utils.divMode(divs, elem);
6337 this.processRepulse(pos, repulseRadius, area, divRepulse);
6338 });
6339 }
6340
6341 hoverRepulse() {
6342 const container = this.container;
6343 const mousePos = container.interactivity.mouse.position;
6344
6345 if (!mousePos) {
6346 return;
6347 }
6348
6349 const repulseRadius = container.retina.repulseModeDistance;
6350 this.processRepulse(mousePos, repulseRadius, new Circle(mousePos.x, mousePos.y, repulseRadius));
6351 }
6352
6353 processRepulse(position, repulseRadius, area, divRepulse) {
6354 var _a;
6355
6356 const container = this.container;
6357 const query = container.particles.quadTree.query(area);
6358
6359 for (const particle of query) {
6360 const {
6361 dx,
6362 dy,
6363 distance
6364 } = NumberUtils.getDistances(particle.position, position);
6365 const normVec = {
6366 x: dx / distance,
6367 y: dy / distance
6368 };
6369 const velocity = ((_a = divRepulse === null || divRepulse === void 0 ? void 0 : divRepulse.speed) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity.modes.repulse.speed) * 100;
6370 const repulseFactor = NumberUtils.clamp((1 - Math.pow(distance / repulseRadius, 2)) * velocity, 0, 50);
6371 particle.position.x += normVec.x * repulseFactor;
6372 particle.position.y += normVec.y * repulseFactor;
6373 }
6374 }
6375
6376 clickRepulse() {
6377 const container = this.container;
6378
6379 if (!container.repulse.finish) {
6380 if (!container.repulse.count) {
6381 container.repulse.count = 0;
6382 }
6383
6384 container.repulse.count++;
6385
6386 if (container.repulse.count === container.particles.count) {
6387 container.repulse.finish = true;
6388 }
6389 }
6390
6391 if (container.repulse.clicking) {
6392 const repulseDistance = container.retina.repulseModeDistance;
6393 const repulseRadius = Math.pow(repulseDistance / 6, 3);
6394 const mouseClickPos = container.interactivity.mouse.clickPosition;
6395
6396 if (mouseClickPos === undefined) {
6397 return;
6398 }
6399
6400 const range = new Circle(mouseClickPos.x, mouseClickPos.y, repulseRadius);
6401 const query = container.particles.quadTree.query(range);
6402
6403 for (const particle of query) {
6404 const {
6405 dx,
6406 dy,
6407 distance
6408 } = NumberUtils.getDistances(mouseClickPos, particle.position);
6409 const d = distance * distance;
6410
6411 if (d <= repulseRadius) {
6412 container.repulse.particles.push(particle);
6413 const velocity = container.actualOptions.interactivity.modes.repulse.speed;
6414 const v = Vector.create(dx, dy);
6415 v.length = -repulseRadius * velocity / d;
6416 particle.velocity.setTo(v);
6417 }
6418 }
6419 } else if (container.repulse.clicking === false) {
6420 for (const particle of container.repulse.particles) {
6421 particle.velocity.setTo(particle.initialVelocity);
6422 }
6423
6424 container.repulse.particles = [];
6425 }
6426 }
6427
6428}
6429;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Bubbler.js
6430
6431
6432
6433function calculateBubbleValue(particleValue, modeValue, optionsValue, ratio) {
6434 if (modeValue > optionsValue) {
6435 const size = particleValue + (modeValue - optionsValue) * ratio;
6436 return NumberUtils.clamp(size, particleValue, modeValue);
6437 } else if (modeValue < optionsValue) {
6438 const size = particleValue - (optionsValue - modeValue) * ratio;
6439 return NumberUtils.clamp(size, modeValue, particleValue);
6440 }
6441}
6442
6443class Bubbler {
6444 constructor(container) {
6445 this.container = container;
6446 }
6447
6448 isEnabled() {
6449 const container = this.container;
6450 const options = container.actualOptions;
6451 const mouse = container.interactivity.mouse;
6452 const events = options.interactivity.events;
6453 const divs = events.onDiv;
6454 const divBubble = Utils.isDivModeEnabled(DivMode.bubble, divs);
6455
6456 if (!(divBubble || events.onHover.enable && mouse.position || events.onClick.enable && mouse.clickPosition)) {
6457 return false;
6458 }
6459
6460 const hoverMode = events.onHover.mode;
6461 const clickMode = events.onClick.mode;
6462 return Utils.isInArray(HoverMode.bubble, hoverMode) || Utils.isInArray(ClickMode.bubble, clickMode) || divBubble;
6463 }
6464
6465 reset(particle, force) {
6466 if (!particle.bubble.inRange || force) {
6467 delete particle.bubble.div;
6468 delete particle.bubble.opacity;
6469 delete particle.bubble.radius;
6470 delete particle.bubble.color;
6471 }
6472 }
6473
6474 interact() {
6475 const options = this.container.actualOptions;
6476 const events = options.interactivity.events;
6477 const onHover = events.onHover;
6478 const onClick = events.onClick;
6479 const hoverEnabled = onHover.enable;
6480 const hoverMode = onHover.mode;
6481 const clickEnabled = onClick.enable;
6482 const clickMode = onClick.mode;
6483 const divs = events.onDiv;
6484
6485 if (hoverEnabled && Utils.isInArray(HoverMode.bubble, hoverMode)) {
6486 this.hoverBubble();
6487 } else if (clickEnabled && Utils.isInArray(ClickMode.bubble, clickMode)) {
6488 this.clickBubble();
6489 } else {
6490 Utils.divModeExecute(DivMode.bubble, divs, (selector, div) => this.singleSelectorHover(selector, div));
6491 }
6492 }
6493
6494 singleSelectorHover(selector, div) {
6495 const container = this.container;
6496 const selectors = document.querySelectorAll(selector);
6497
6498 if (!selectors.length) {
6499 return;
6500 }
6501
6502 selectors.forEach(item => {
6503 const elem = item;
6504 const pxRatio = container.retina.pixelRatio;
6505 const pos = {
6506 x: (elem.offsetLeft + elem.offsetWidth / 2) * pxRatio,
6507 y: (elem.offsetTop + elem.offsetHeight / 2) * pxRatio
6508 };
6509 const repulseRadius = elem.offsetWidth / 2 * pxRatio;
6510 const area = div.type === DivType.circle ? new Circle(pos.x, pos.y, repulseRadius) : new Rectangle(elem.offsetLeft * pxRatio, elem.offsetTop * pxRatio, elem.offsetWidth * pxRatio, elem.offsetHeight * pxRatio);
6511 const query = container.particles.quadTree.query(area);
6512
6513 for (const particle of query) {
6514 if (!area.contains(particle.getPosition())) {
6515 continue;
6516 }
6517
6518 particle.bubble.inRange = true;
6519 const divs = container.actualOptions.interactivity.modes.bubble.divs;
6520 const divBubble = Utils.divMode(divs, elem);
6521
6522 if (!particle.bubble.div || particle.bubble.div !== elem) {
6523 this.reset(particle, true);
6524 particle.bubble.div = elem;
6525 }
6526
6527 this.hoverBubbleSize(particle, 1, divBubble);
6528 this.hoverBubbleOpacity(particle, 1, divBubble);
6529 this.hoverBubbleColor(particle, divBubble);
6530 }
6531 });
6532 }
6533
6534 process(particle, distMouse, timeSpent, data) {
6535 const container = this.container;
6536 const bubbleParam = data.bubbleObj.optValue;
6537
6538 if (bubbleParam === undefined) {
6539 return;
6540 }
6541
6542 const options = container.actualOptions;
6543 const bubbleDuration = options.interactivity.modes.bubble.duration;
6544 const bubbleDistance = container.retina.bubbleModeDistance;
6545 const particlesParam = data.particlesObj.optValue;
6546 const pObjBubble = data.bubbleObj.value;
6547 const pObj = data.particlesObj.value || 0;
6548 const type = data.type;
6549
6550 if (bubbleParam !== particlesParam) {
6551 if (!container.bubble.durationEnd) {
6552 if (distMouse <= bubbleDistance) {
6553 const obj = pObjBubble !== null && pObjBubble !== void 0 ? pObjBubble : pObj;
6554
6555 if (obj !== bubbleParam) {
6556 const value = pObj - timeSpent * (pObj - bubbleParam) / bubbleDuration;
6557
6558 if (type === ProcessBubbleType.size) {
6559 particle.bubble.radius = value;
6560 }
6561
6562 if (type === ProcessBubbleType.opacity) {
6563 particle.bubble.opacity = value;
6564 }
6565 }
6566 } else {
6567 if (type === ProcessBubbleType.size) {
6568 delete particle.bubble.radius;
6569 }
6570
6571 if (type === ProcessBubbleType.opacity) {
6572 delete particle.bubble.opacity;
6573 }
6574 }
6575 } else if (pObjBubble) {
6576 if (type === ProcessBubbleType.size) {
6577 delete particle.bubble.radius;
6578 }
6579
6580 if (type === ProcessBubbleType.opacity) {
6581 delete particle.bubble.opacity;
6582 }
6583 }
6584 }
6585 }
6586
6587 clickBubble() {
6588 const container = this.container;
6589 const options = container.actualOptions;
6590 const mouseClickPos = container.interactivity.mouse.clickPosition;
6591
6592 if (mouseClickPos === undefined) {
6593 return;
6594 }
6595
6596 const distance = container.retina.bubbleModeDistance;
6597 const query = container.particles.quadTree.queryCircle(mouseClickPos, distance);
6598
6599 for (const particle of query) {
6600 if (!container.bubble.clicking) {
6601 continue;
6602 }
6603
6604 particle.bubble.inRange = !container.bubble.durationEnd;
6605 const pos = particle.getPosition();
6606 const distMouse = NumberUtils.getDistance(pos, mouseClickPos);
6607 const timeSpent = (new Date().getTime() - (container.interactivity.mouse.clickTime || 0)) / 1000;
6608
6609 if (timeSpent > options.interactivity.modes.bubble.duration) {
6610 container.bubble.durationEnd = true;
6611 }
6612
6613 if (timeSpent > options.interactivity.modes.bubble.duration * 2) {
6614 container.bubble.clicking = false;
6615 container.bubble.durationEnd = false;
6616 }
6617
6618 const sizeData = {
6619 bubbleObj: {
6620 optValue: container.retina.bubbleModeSize,
6621 value: particle.bubble.radius
6622 },
6623 particlesObj: {
6624 optValue: NumberUtils.getRangeMax(particle.options.size.value) * container.retina.pixelRatio,
6625 value: particle.size.value
6626 },
6627 type: ProcessBubbleType.size
6628 };
6629 this.process(particle, distMouse, timeSpent, sizeData);
6630 const opacityData = {
6631 bubbleObj: {
6632 optValue: options.interactivity.modes.bubble.opacity,
6633 value: particle.bubble.opacity
6634 },
6635 particlesObj: {
6636 optValue: NumberUtils.getRangeMax(particle.options.opacity.value),
6637 value: particle.opacity.value
6638 },
6639 type: ProcessBubbleType.opacity
6640 };
6641 this.process(particle, distMouse, timeSpent, opacityData);
6642
6643 if (!container.bubble.durationEnd) {
6644 if (distMouse <= container.retina.bubbleModeDistance) {
6645 this.hoverBubbleColor(particle);
6646 } else {
6647 delete particle.bubble.color;
6648 }
6649 } else {
6650 delete particle.bubble.color;
6651 }
6652 }
6653 }
6654
6655 hoverBubble() {
6656 const container = this.container;
6657 const mousePos = container.interactivity.mouse.position;
6658
6659 if (mousePos === undefined) {
6660 return;
6661 }
6662
6663 const distance = container.retina.bubbleModeDistance;
6664 const query = container.particles.quadTree.queryCircle(mousePos, distance);
6665
6666 for (const particle of query) {
6667 particle.bubble.inRange = true;
6668 const pos = particle.getPosition();
6669 const pointDistance = NumberUtils.getDistance(pos, mousePos);
6670 const ratio = 1 - pointDistance / distance;
6671
6672 if (pointDistance <= distance) {
6673 if (ratio >= 0 && container.interactivity.status === Constants.mouseMoveEvent) {
6674 this.hoverBubbleSize(particle, ratio);
6675 this.hoverBubbleOpacity(particle, ratio);
6676 this.hoverBubbleColor(particle);
6677 }
6678 } else {
6679 this.reset(particle);
6680 }
6681
6682 if (container.interactivity.status === Constants.mouseLeaveEvent) {
6683 this.reset(particle);
6684 }
6685 }
6686 }
6687
6688 hoverBubbleSize(particle, ratio, divBubble) {
6689 const container = this.container;
6690 const modeSize = (divBubble === null || divBubble === void 0 ? void 0 : divBubble.size) ? divBubble.size * container.retina.pixelRatio : container.retina.bubbleModeSize;
6691
6692 if (modeSize === undefined) {
6693 return;
6694 }
6695
6696 const optSize = NumberUtils.getRangeMax(particle.options.size.value) * container.retina.pixelRatio;
6697 const pSize = particle.size.value;
6698 const size = calculateBubbleValue(pSize, modeSize, optSize, ratio);
6699
6700 if (size !== undefined) {
6701 particle.bubble.radius = size;
6702 }
6703 }
6704
6705 hoverBubbleOpacity(particle, ratio, divBubble) {
6706 var _a;
6707
6708 const options = this.container.actualOptions;
6709 const modeOpacity = (_a = divBubble === null || divBubble === void 0 ? void 0 : divBubble.opacity) !== null && _a !== void 0 ? _a : options.interactivity.modes.bubble.opacity;
6710
6711 if (modeOpacity === undefined) {
6712 return;
6713 }
6714
6715 const optOpacity = particle.options.opacity.value;
6716 const pOpacity = particle.opacity.value;
6717 const opacity = calculateBubbleValue(pOpacity, modeOpacity, NumberUtils.getRangeMax(optOpacity), ratio);
6718
6719 if (opacity !== undefined) {
6720 particle.bubble.opacity = opacity;
6721 }
6722 }
6723
6724 hoverBubbleColor(particle, divBubble) {
6725 var _a;
6726
6727 const options = this.container.actualOptions;
6728
6729 if (particle.bubble.color === undefined) {
6730 const modeColor = (_a = divBubble === null || divBubble === void 0 ? void 0 : divBubble.color) !== null && _a !== void 0 ? _a : options.interactivity.modes.bubble.color;
6731
6732 if (modeColor === undefined) {
6733 return;
6734 }
6735
6736 const bubbleColor = modeColor instanceof Array ? Utils.itemFromArray(modeColor) : modeColor;
6737 particle.bubble.color = ColorUtils.colorToHsl(bubbleColor);
6738 }
6739 }
6740
6741}
6742;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Connector.js
6743
6744
6745class Connector {
6746 constructor(container) {
6747 this.container = container;
6748 }
6749
6750 isEnabled() {
6751 const container = this.container;
6752 const mouse = container.interactivity.mouse;
6753 const events = container.actualOptions.interactivity.events;
6754
6755 if (!(events.onHover.enable && mouse.position)) {
6756 return false;
6757 }
6758
6759 const hoverMode = events.onHover.mode;
6760 return Utils.isInArray(HoverMode.connect, hoverMode);
6761 }
6762
6763 reset() {}
6764
6765 interact() {
6766 const container = this.container;
6767 const options = container.actualOptions;
6768
6769 if (options.interactivity.events.onHover.enable && container.interactivity.status === "mousemove") {
6770 const mousePos = container.interactivity.mouse.position;
6771
6772 if (!mousePos) {
6773 return;
6774 }
6775
6776 const distance = Math.abs(container.retina.connectModeRadius);
6777 const query = container.particles.quadTree.queryCircle(mousePos, distance);
6778 let i = 0;
6779
6780 for (const p1 of query) {
6781 const pos1 = p1.getPosition();
6782
6783 for (const p2 of query.slice(i + 1)) {
6784 const pos2 = p2.getPosition();
6785 const distMax = Math.abs(container.retina.connectModeDistance);
6786 const xDiff = Math.abs(pos1.x - pos2.x);
6787 const yDiff = Math.abs(pos1.y - pos2.y);
6788
6789 if (xDiff < distMax && yDiff < distMax) {
6790 container.canvas.drawConnectLine(p1, p2);
6791 }
6792 }
6793
6794 ++i;
6795 }
6796 }
6797 }
6798
6799}
6800;// CONCATENATED MODULE: ./dist/browser/Interactions/Particles/Linker.js
6801
6802class Linker {
6803 constructor(container) {
6804 this.container = container;
6805 }
6806
6807 isEnabled(particle) {
6808 return particle.options.links.enable;
6809 }
6810
6811 reset() {}
6812
6813 interact(p1) {
6814 var _a;
6815
6816 const container = this.container;
6817 const linkOpt1 = p1.options.links;
6818 const optOpacity = linkOpt1.opacity;
6819 const optDistance = (_a = p1.linksDistance) !== null && _a !== void 0 ? _a : container.retina.linksDistance;
6820 const canvasSize = container.canvas.size;
6821 const warp = linkOpt1.warp;
6822 const pos1 = p1.getPosition();
6823 const range = warp ? new CircleWarp(pos1.x, pos1.y, optDistance, canvasSize) : new Circle(pos1.x, pos1.y, optDistance);
6824 const query = container.particles.quadTree.query(range);
6825
6826 for (const p2 of query) {
6827 const linkOpt2 = p2.options.links;
6828
6829 if (p1 === p2 || !linkOpt2.enable || linkOpt1.id !== linkOpt2.id || p2.spawning || p2.destroyed) {
6830 continue;
6831 }
6832
6833 const pos2 = p2.getPosition();
6834 let distance = NumberUtils.getDistance(pos1, pos2);
6835
6836 if (warp) {
6837 if (distance > optDistance) {
6838 const pos2NE = {
6839 x: pos2.x - canvasSize.width,
6840 y: pos2.y
6841 };
6842 distance = NumberUtils.getDistance(pos1, pos2NE);
6843
6844 if (distance > optDistance) {
6845 const pos2SE = {
6846 x: pos2.x - canvasSize.width,
6847 y: pos2.y - canvasSize.height
6848 };
6849 distance = NumberUtils.getDistance(pos1, pos2SE);
6850
6851 if (distance > optDistance) {
6852 const pos2SW = {
6853 x: pos2.x,
6854 y: pos2.y - canvasSize.height
6855 };
6856 distance = NumberUtils.getDistance(pos1, pos2SW);
6857 }
6858 }
6859 }
6860 }
6861
6862 if (distance > optDistance) {
6863 return;
6864 }
6865
6866 const opacityLine = (1 - distance / optDistance) * optOpacity;
6867 const linksOptions = p1.options.links;
6868 let linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
6869
6870 if (!linkColor) {
6871 const optColor = linksOptions.color;
6872 linkColor = ColorUtils.getLinkRandomColor(optColor, linksOptions.blink, linksOptions.consent);
6873
6874 if (linksOptions.id !== undefined) {
6875 container.particles.linksColors.set(linksOptions.id, linkColor);
6876 } else {
6877 container.particles.linksColor = linkColor;
6878 }
6879 }
6880
6881 if (p2.links.map(t => t.destination).indexOf(p1) === -1 && p1.links.map(t => t.destination).indexOf(p2) === -1) {
6882 p1.links.push({
6883 destination: p2,
6884 opacity: opacityLine
6885 });
6886 }
6887 }
6888 }
6889
6890}
6891;// CONCATENATED MODULE: ./dist/browser/Interactions/Particles/Attractor.js
6892
6893class Attractor {
6894 constructor(container) {
6895 this.container = container;
6896 }
6897
6898 interact(p1) {
6899 var _a;
6900
6901 const container = this.container;
6902 const distance = (_a = p1.linksDistance) !== null && _a !== void 0 ? _a : container.retina.linksDistance;
6903 const pos1 = p1.getPosition();
6904 const query = container.particles.quadTree.queryCircle(pos1, distance);
6905
6906 for (const p2 of query) {
6907 if (p1 === p2 || !p2.options.move.attract.enable || p2.destroyed || p2.spawning) {
6908 continue;
6909 }
6910
6911 const pos2 = p2.getPosition();
6912 const {
6913 dx,
6914 dy
6915 } = NumberUtils.getDistances(pos1, pos2);
6916 const rotate = p1.options.move.attract.rotate;
6917 const ax = dx / (rotate.x * 1000);
6918 const ay = dy / (rotate.y * 1000);
6919 p1.velocity.x -= ax;
6920 p1.velocity.y -= ay;
6921 p2.velocity.x += ax;
6922 p2.velocity.y += ay;
6923 }
6924 }
6925
6926 isEnabled(particle) {
6927 return particle.options.move.attract.enable;
6928 }
6929
6930 reset() {}
6931
6932}
6933;// CONCATENATED MODULE: ./dist/browser/Interactions/Particles/Collider.js
6934
6935
6936
6937function bounce(p1, p2) {
6938 Utils.circleBounce(Utils.circleBounceDataFromParticle(p1), Utils.circleBounceDataFromParticle(p2));
6939}
6940
6941function destroy(p1, p2) {
6942 if (p1.getRadius() === undefined && p2.getRadius() !== undefined) {
6943 p1.destroy();
6944 } else if (p1.getRadius() !== undefined && p2.getRadius() === undefined) {
6945 p2.destroy();
6946 } else if (p1.getRadius() !== undefined && p2.getRadius() !== undefined) {
6947 if (p1.getRadius() >= p2.getRadius()) {
6948 p2.destroy();
6949 } else {
6950 p1.destroy();
6951 }
6952 }
6953}
6954
6955class Collider {
6956 constructor(container) {
6957 this.container = container;
6958 }
6959
6960 isEnabled(particle) {
6961 return particle.options.collisions.enable;
6962 }
6963
6964 reset() {}
6965
6966 interact(p1) {
6967 const container = this.container;
6968 const pos1 = p1.getPosition();
6969 const query = container.particles.quadTree.queryCircle(pos1, p1.getRadius() * 2);
6970
6971 for (const p2 of query) {
6972 if (p1 === p2 || !p2.options.collisions.enable || p1.options.collisions.mode !== p2.options.collisions.mode || p2.destroyed || p2.spawning) {
6973 continue;
6974 }
6975
6976 const pos2 = p2.getPosition();
6977 const dist = NumberUtils.getDistance(pos1, pos2);
6978 const radius1 = p1.getRadius();
6979 const radius2 = p2.getRadius();
6980 const distP = radius1 + radius2;
6981
6982 if (dist <= distP) {
6983 this.resolveCollision(p1, p2);
6984 }
6985 }
6986 }
6987
6988 resolveCollision(p1, p2) {
6989 switch (p1.options.collisions.mode) {
6990 case CollisionMode.absorb:
6991 {
6992 this.absorb(p1, p2);
6993 break;
6994 }
6995
6996 case CollisionMode.bounce:
6997 {
6998 bounce(p1, p2);
6999 break;
7000 }
7001
7002 case CollisionMode.destroy:
7003 {
7004 destroy(p1, p2);
7005 break;
7006 }
7007 }
7008 }
7009
7010 absorb(p1, p2) {
7011 const container = this.container;
7012 const fps = container.actualOptions.fpsLimit / 1000;
7013
7014 if (p1.getRadius() === undefined && p2.getRadius() !== undefined) {
7015 p1.destroy();
7016 } else if (p1.getRadius() !== undefined && p2.getRadius() === undefined) {
7017 p2.destroy();
7018 } else if (p1.getRadius() !== undefined && p2.getRadius() !== undefined) {
7019 if (p1.getRadius() >= p2.getRadius()) {
7020 const factor = NumberUtils.clamp(p1.getRadius() / p2.getRadius(), 0, p2.getRadius()) * fps;
7021 p1.size.value += factor;
7022 p2.size.value -= factor;
7023
7024 if (p2.getRadius() <= container.retina.pixelRatio) {
7025 p2.size.value = 0;
7026 p2.destroy();
7027 }
7028 } else {
7029 const factor = NumberUtils.clamp(p2.getRadius() / p1.getRadius(), 0, p1.getRadius()) * fps;
7030 p1.size.value -= factor;
7031 p2.size.value += factor;
7032
7033 if (p1.getRadius() <= container.retina.pixelRatio) {
7034 p1.size.value = 0;
7035 p1.destroy();
7036 }
7037 }
7038 }
7039 }
7040
7041}
7042;// CONCATENATED MODULE: ./dist/browser/Interactions/Particles/Infecter.js
7043class Infecter_Infecter {
7044 constructor(container) {
7045 this.container = container;
7046 }
7047
7048 isEnabled() {
7049 return this.container.actualOptions.infection.enable;
7050 }
7051
7052 reset() {}
7053
7054 interact(p1, delta) {
7055 var _a, _b;
7056
7057 const infecter1 = p1.infecter;
7058 infecter1.updateInfection(delta.value);
7059
7060 if (infecter1.infectionStage === undefined) {
7061 return;
7062 }
7063
7064 const container = this.container;
7065 const options = container.actualOptions;
7066 const infectionOptions = options.infection;
7067
7068 if (!infectionOptions.enable || infectionOptions.stages.length < 1) {
7069 return;
7070 }
7071
7072 const infectionStage1 = infectionOptions.stages[infecter1.infectionStage];
7073 const pxRatio = container.retina.pixelRatio;
7074 const radius = p1.getRadius() * 2 + infectionStage1.radius * pxRatio;
7075 const pos = p1.getPosition();
7076 const infectedStage1 = (_a = infectionStage1.infectedStage) !== null && _a !== void 0 ? _a : infecter1.infectionStage;
7077 const query = container.particles.quadTree.queryCircle(pos, radius);
7078 const infections = infectionStage1.rate;
7079 const neighbors = query.length;
7080
7081 for (const p2 of query) {
7082 if (p2 === p1 || p2.destroyed || p2.spawning || !(p2.infecter.infectionStage === undefined || p2.infecter.infectionStage !== infecter1.infectionStage)) {
7083 continue;
7084 }
7085
7086 const infecter2 = p2.infecter;
7087
7088 if (Math.random() < infections / neighbors) {
7089 if (infecter2.infectionStage === undefined) {
7090 infecter2.startInfection(infectedStage1);
7091 } else if (infecter2.infectionStage < infecter1.infectionStage) {
7092 infecter2.updateInfectionStage(infectedStage1);
7093 } else if (infecter2.infectionStage > infecter1.infectionStage) {
7094 const infectionStage2 = infectionOptions.stages[infecter2.infectionStage];
7095 const infectedStage2 = (_b = infectionStage2 === null || infectionStage2 === void 0 ? void 0 : infectionStage2.infectedStage) !== null && _b !== void 0 ? _b : infecter2.infectionStage;
7096 infecter1.updateInfectionStage(infectedStage2);
7097 }
7098 }
7099 }
7100 }
7101
7102}
7103;// CONCATENATED MODULE: ./dist/browser/Interactions/External/TrailMaker.js
7104
7105
7106class TrailMaker {
7107 constructor(container) {
7108 this.container = container;
7109 this.delay = 0;
7110 }
7111
7112 interact(delta) {
7113 if (!this.container.retina.reduceFactor) {
7114 return;
7115 }
7116
7117 const container = this.container;
7118 const options = container.actualOptions;
7119 const trailOptions = options.interactivity.modes.trail;
7120 const optDelay = trailOptions.delay * 1000 / this.container.retina.reduceFactor;
7121
7122 if (this.delay < optDelay) {
7123 this.delay += delta.value;
7124 }
7125
7126 if (this.delay >= optDelay) {
7127 container.particles.push(trailOptions.quantity, container.interactivity.mouse, trailOptions.particles);
7128 this.delay -= optDelay;
7129 }
7130 }
7131
7132 isEnabled() {
7133 const container = this.container;
7134 const options = container.actualOptions;
7135 const mouse = container.interactivity.mouse;
7136 const events = options.interactivity.events;
7137 return mouse.clicking && mouse.inside && !!mouse.position && Utils.isInArray(ClickMode.trail, events.onClick.mode) || mouse.inside && !!mouse.position && Utils.isInArray(HoverMode.trail, events.onHover.mode);
7138 }
7139
7140 reset() {}
7141
7142}
7143;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Attractor.js
7144
7145
7146class Attractor_Attractor {
7147 constructor(container) {
7148 this.container = container;
7149 }
7150
7151 isEnabled() {
7152 const container = this.container;
7153 const options = container.actualOptions;
7154 const mouse = container.interactivity.mouse;
7155 const events = options.interactivity.events;
7156
7157 if (!(events.onHover.enable && mouse.position || events.onClick.enable && mouse.clickPosition)) {
7158 return false;
7159 }
7160
7161 const hoverMode = events.onHover.mode;
7162 const clickMode = events.onClick.mode;
7163 return Utils.isInArray(HoverMode.attract, hoverMode) || Utils.isInArray(ClickMode.attract, clickMode);
7164 }
7165
7166 reset() {}
7167
7168 interact() {
7169 const container = this.container;
7170 const options = container.actualOptions;
7171 const mouseMoveStatus = container.interactivity.status === Constants.mouseMoveEvent;
7172 const events = options.interactivity.events;
7173 const hoverEnabled = events.onHover.enable;
7174 const hoverMode = events.onHover.mode;
7175 const clickEnabled = events.onClick.enable;
7176 const clickMode = events.onClick.mode;
7177
7178 if (mouseMoveStatus && hoverEnabled && Utils.isInArray(HoverMode.attract, hoverMode)) {
7179 this.hoverAttract();
7180 } else if (clickEnabled && Utils.isInArray(ClickMode.attract, clickMode)) {
7181 this.clickAttract();
7182 }
7183 }
7184
7185 hoverAttract() {
7186 const container = this.container;
7187 const mousePos = container.interactivity.mouse.position;
7188
7189 if (!mousePos) {
7190 return;
7191 }
7192
7193 const attractRadius = container.retina.attractModeDistance;
7194 this.processAttract(mousePos, attractRadius, new Circle(mousePos.x, mousePos.y, attractRadius));
7195 }
7196
7197 processAttract(position, attractRadius, area) {
7198 const container = this.container;
7199 const query = container.particles.quadTree.query(area);
7200
7201 for (const particle of query) {
7202 const {
7203 dx,
7204 dy,
7205 distance
7206 } = NumberUtils.getDistances(particle.position, position);
7207 const normVec = {
7208 x: dx / distance,
7209 y: dy / distance
7210 };
7211 const velocity = container.actualOptions.interactivity.modes.attract.speed;
7212 const attractFactor = NumberUtils.clamp((1 - Math.pow(distance / attractRadius, 2)) * velocity, 0, 50);
7213 particle.position.x -= normVec.x * attractFactor;
7214 particle.position.y -= normVec.y * attractFactor;
7215 }
7216 }
7217
7218 clickAttract() {
7219 const container = this.container;
7220
7221 if (!container.attract.finish) {
7222 if (!container.attract.count) {
7223 container.attract.count = 0;
7224 }
7225
7226 container.attract.count++;
7227
7228 if (container.attract.count === container.particles.count) {
7229 container.attract.finish = true;
7230 }
7231 }
7232
7233 if (container.attract.clicking) {
7234 const mousePos = container.interactivity.mouse.clickPosition;
7235
7236 if (!mousePos) {
7237 return;
7238 }
7239
7240 const attractRadius = container.retina.attractModeDistance;
7241 this.processAttract(mousePos, attractRadius, new Circle(mousePos.x, mousePos.y, attractRadius));
7242 } else if (container.attract.clicking === false) {
7243 container.attract.particles = [];
7244 }
7245
7246 return;
7247 }
7248
7249}
7250;// CONCATENATED MODULE: ./dist/browser/Interactions/Particles/Lighter.js
7251
7252
7253class Lighter {
7254 constructor(container) {
7255 this.container = container;
7256 }
7257
7258 interact(particle) {
7259 const container = this.container;
7260 const options = container.actualOptions;
7261
7262 if (options.interactivity.events.onHover.enable && container.interactivity.status === "mousemove") {
7263 const mousePos = this.container.interactivity.mouse.position;
7264
7265 if (mousePos) {
7266 container.canvas.drawParticleShadow(particle, mousePos);
7267 }
7268 }
7269 }
7270
7271 isEnabled() {
7272 const container = this.container;
7273 const mouse = container.interactivity.mouse;
7274 const events = container.actualOptions.interactivity.events;
7275
7276 if (!(events.onHover.enable && mouse.position)) {
7277 return false;
7278 }
7279
7280 const hoverMode = events.onHover.mode;
7281 return Utils.isInArray(HoverMode.light, hoverMode);
7282 }
7283
7284 reset() {}
7285
7286}
7287;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Lighter.js
7288
7289
7290class Lighter_Lighter {
7291 constructor(container) {
7292 this.container = container;
7293 }
7294
7295 interact() {
7296 const container = this.container;
7297 const options = container.actualOptions;
7298
7299 if (options.interactivity.events.onHover.enable && container.interactivity.status === "mousemove") {
7300 const mousePos = container.interactivity.mouse.position;
7301
7302 if (!mousePos) {
7303 return;
7304 }
7305
7306 container.canvas.drawLight(mousePos);
7307 }
7308 }
7309
7310 isEnabled() {
7311 const container = this.container;
7312 const mouse = container.interactivity.mouse;
7313 const events = container.actualOptions.interactivity.events;
7314
7315 if (!(events.onHover.enable && mouse.position)) {
7316 return false;
7317 }
7318
7319 const hoverMode = events.onHover.mode;
7320 return Utils.isInArray(HoverMode.light, hoverMode);
7321 }
7322
7323 reset() {}
7324
7325}
7326;// CONCATENATED MODULE: ./dist/browser/Interactions/External/Bouncer.js
7327
7328
7329
7330class Bouncer {
7331 constructor(container) {
7332 this.container = container;
7333 }
7334
7335 isEnabled() {
7336 const container = this.container;
7337 const options = container.actualOptions;
7338 const mouse = container.interactivity.mouse;
7339 const events = options.interactivity.events;
7340 const divs = events.onDiv;
7341 return mouse.position && events.onHover.enable && Utils.isInArray(HoverMode.bounce, events.onHover.mode) || Utils.isDivModeEnabled(DivMode.bounce, divs);
7342 }
7343
7344 interact() {
7345 const container = this.container;
7346 const options = container.actualOptions;
7347 const events = options.interactivity.events;
7348 const mouseMoveStatus = container.interactivity.status === Constants.mouseMoveEvent;
7349 const hoverEnabled = events.onHover.enable;
7350 const hoverMode = events.onHover.mode;
7351 const divs = events.onDiv;
7352
7353 if (mouseMoveStatus && hoverEnabled && Utils.isInArray(HoverMode.bounce, hoverMode)) {
7354 this.processMouseBounce();
7355 } else {
7356 Utils.divModeExecute(DivMode.bounce, divs, (selector, div) => this.singleSelectorBounce(selector, div));
7357 }
7358 }
7359
7360 reset() {}
7361
7362 processMouseBounce() {
7363 const container = this.container;
7364 const pxRatio = container.retina.pixelRatio;
7365 const tolerance = 10 * pxRatio;
7366 const mousePos = container.interactivity.mouse.position;
7367 const radius = container.retina.bounceModeDistance;
7368
7369 if (mousePos) {
7370 this.processBounce(mousePos, radius, new Circle(mousePos.x, mousePos.y, radius + tolerance));
7371 }
7372 }
7373
7374 singleSelectorBounce(selector, div) {
7375 const container = this.container;
7376 const query = document.querySelectorAll(selector);
7377
7378 if (!query.length) {
7379 return;
7380 }
7381
7382 query.forEach(item => {
7383 const elem = item;
7384 const pxRatio = container.retina.pixelRatio;
7385 const pos = {
7386 x: (elem.offsetLeft + elem.offsetWidth / 2) * pxRatio,
7387 y: (elem.offsetTop + elem.offsetHeight / 2) * pxRatio
7388 };
7389 const radius = elem.offsetWidth / 2 * pxRatio;
7390 const tolerance = 10 * pxRatio;
7391 const area = div.type === DivType.circle ? new Circle(pos.x, pos.y, radius + tolerance) : new Rectangle(elem.offsetLeft * pxRatio - tolerance, elem.offsetTop * pxRatio - tolerance, elem.offsetWidth * pxRatio + tolerance * 2, elem.offsetHeight * pxRatio + tolerance * 2);
7392 this.processBounce(pos, radius, area);
7393 });
7394 }
7395
7396 processBounce(position, radius, area) {
7397 const query = this.container.particles.quadTree.query(area);
7398
7399 for (const particle of query) {
7400 if (area instanceof Circle) {
7401 Utils.circleBounce(Utils.circleBounceDataFromParticle(particle), {
7402 position,
7403 radius,
7404 mass: Math.pow(radius, 2) * Math.PI / 2,
7405 velocity: Vector.create(0, 0),
7406 factor: {
7407 horizontal: 0,
7408 vertical: 0
7409 }
7410 });
7411 } else if (area instanceof Rectangle) {
7412 Utils.rectBounce(particle, Utils.calculateBounds(position, radius));
7413 }
7414 }
7415 }
7416
7417}
7418;// CONCATENATED MODULE: ./dist/browser/Core/Particle/InteractionManager.js
7419
7420
7421
7422
7423
7424
7425
7426
7427
7428
7429
7430
7431
7432class InteractionManager {
7433 constructor(container) {
7434 this.container = container;
7435 this.externalInteractors = [new Bouncer(container), new Bubbler(container), new Connector(container), new Grabber(container), new Lighter_Lighter(container), new Attractor_Attractor(container), new Repulser(container), new TrailMaker(container)];
7436 this.particleInteractors = [new Attractor(container), new Lighter(container), new Collider(container), new Infecter_Infecter(container), new Linker(container)];
7437 }
7438
7439 init() {}
7440
7441 externalInteract(delta) {
7442 for (const interactor of this.externalInteractors) {
7443 if (interactor.isEnabled()) {
7444 interactor.interact(delta);
7445 }
7446 }
7447 }
7448
7449 particlesInteract(particle, delta) {
7450 for (const interactor of this.externalInteractors) {
7451 interactor.reset(particle);
7452 }
7453
7454 for (const interactor of this.particleInteractors) {
7455 if (interactor.isEnabled(particle)) {
7456 interactor.interact(particle, delta);
7457 }
7458 }
7459 }
7460
7461}
7462;// CONCATENATED MODULE: ./dist/browser/Core/Particles.js
7463
7464
7465
7466
7467class Particles {
7468 constructor(container) {
7469 this.container = container;
7470 this.nextId = 0;
7471 this.array = [];
7472 this.limit = 0;
7473 this.linksFreq = new Map();
7474 this.trianglesFreq = new Map();
7475 this.interactionManager = new InteractionManager(container);
7476 const canvasSize = this.container.canvas.size;
7477 this.linksColors = new Map();
7478 this.quadTree = new QuadTree(new Rectangle(-canvasSize.width / 4, -canvasSize.height / 4, canvasSize.width * 3 / 2, canvasSize.height * 3 / 2), 4);
7479 }
7480
7481 get count() {
7482 return this.array.length;
7483 }
7484
7485 init() {
7486 const container = this.container;
7487 const options = container.actualOptions;
7488 this.linksFreq = new Map();
7489 this.trianglesFreq = new Map();
7490 let handled = false;
7491
7492 for (const particle of options.manualParticles) {
7493 const pos = particle.position ? {
7494 x: particle.position.x * container.canvas.size.width / 100,
7495 y: particle.position.y * container.canvas.size.height / 100
7496 } : undefined;
7497 this.addParticle(pos, particle.options);
7498 }
7499
7500 for (const [, plugin] of container.plugins) {
7501 if (plugin.particlesInitialization !== undefined) {
7502 handled = plugin.particlesInitialization();
7503 }
7504
7505 if (handled) {
7506 break;
7507 }
7508 }
7509
7510 if (!handled) {
7511 for (let i = this.count; i < options.particles.number.value; i++) {
7512 this.addParticle();
7513 }
7514 }
7515
7516 if (options.infection.enable) {
7517 for (let i = 0; i < options.infection.infections; i++) {
7518 const notInfected = this.array.filter(p => p.infecter.infectionStage === undefined);
7519 const infected = Utils.itemFromArray(notInfected);
7520 infected.infecter.startInfection(0);
7521 }
7522 }
7523
7524 this.interactionManager.init();
7525 container.pathGenerator.init();
7526 }
7527
7528 redraw() {
7529 this.clear();
7530 this.init();
7531 this.draw({
7532 value: 0,
7533 factor: 0
7534 });
7535 }
7536
7537 removeAt(index, quantity, override) {
7538 if (index >= 0 && index <= this.count) {
7539 for (const particle of this.array.splice(index, quantity !== null && quantity !== void 0 ? quantity : 1)) {
7540 particle.destroy(override);
7541 }
7542 }
7543 }
7544
7545 remove(particle, override) {
7546 this.removeAt(this.array.indexOf(particle), undefined, override);
7547 }
7548
7549 update(delta) {
7550 const container = this.container;
7551 const particlesToDelete = [];
7552 container.pathGenerator.update();
7553
7554 for (const [, plugin] of container.plugins) {
7555 if (plugin.update !== undefined) {
7556 plugin.update(delta);
7557 }
7558 }
7559
7560 for (const particle of this.array) {
7561 const resizeFactor = this.container.canvas.resizeFactor;
7562
7563 if (resizeFactor) {
7564 particle.position.x *= resizeFactor.width;
7565 particle.position.y *= resizeFactor.height;
7566 }
7567
7568 particle.move(delta);
7569
7570 if (particle.destroyed) {
7571 particlesToDelete.push(particle);
7572 continue;
7573 }
7574
7575 this.quadTree.insert(new Point(particle.getPosition(), particle));
7576 }
7577
7578 for (const particle of particlesToDelete) {
7579 this.remove(particle);
7580 }
7581
7582 this.interactionManager.externalInteract(delta);
7583
7584 for (const particle of this.container.particles.array) {
7585 particle.update(delta);
7586
7587 if (!particle.destroyed && !particle.spawning) {
7588 this.interactionManager.particlesInteract(particle, delta);
7589 }
7590 }
7591
7592 delete container.canvas.resizeFactor;
7593 }
7594
7595 draw(delta) {
7596 const container = this.container;
7597 container.canvas.clear();
7598 const canvasSize = this.container.canvas.size;
7599 this.quadTree = new QuadTree(new Rectangle(-canvasSize.width / 4, -canvasSize.height / 4, canvasSize.width * 3 / 2, canvasSize.height * 3 / 2), 4);
7600 this.update(delta);
7601
7602 for (const [, plugin] of container.plugins) {
7603 container.canvas.drawPlugin(plugin, delta);
7604 }
7605
7606 for (const p of this.array) {
7607 p.draw(delta);
7608 }
7609 }
7610
7611 clear() {
7612 this.array = [];
7613 }
7614
7615 push(nb, mouse, overrideOptions) {
7616 const container = this.container;
7617 const options = container.actualOptions;
7618 const limit = options.particles.number.limit * container.density;
7619 this.pushing = true;
7620
7621 if (limit > 0) {
7622 const countToRemove = this.count + nb - limit;
7623
7624 if (countToRemove > 0) {
7625 this.removeQuantity(countToRemove);
7626 }
7627 }
7628
7629 for (let i = 0; i < nb; i++) {
7630 this.addParticle(mouse === null || mouse === void 0 ? void 0 : mouse.position, overrideOptions);
7631 }
7632
7633 this.pushing = false;
7634 }
7635
7636 addParticle(position, overrideOptions) {
7637 return this.pushParticle(position, overrideOptions);
7638 }
7639
7640 addSplitParticle(parent) {
7641 const splitOptions = parent.options.destroy.split;
7642 const options = new ParticlesOptions();
7643 options.load(parent.options);
7644 const factor = NumberUtils.getRangeValue(splitOptions.factor.value);
7645 options.color.load({
7646 value: {
7647 hsl: parent.getFillColor()
7648 }
7649 });
7650
7651 if (typeof options.size.value === "number") {
7652 options.size.value /= factor;
7653 } else {
7654 options.size.value.min /= factor;
7655 options.size.value.max /= factor;
7656 }
7657
7658 options.load(splitOptions.particles);
7659 const offset = NumberUtils.setRangeValue(-parent.size.value, parent.size.value);
7660 const position = {
7661 x: parent.position.x + NumberUtils.randomInRange(offset),
7662 y: parent.position.y + NumberUtils.randomInRange(offset)
7663 };
7664 return this.pushParticle(position, options, particle => {
7665 if (particle.size.value < 0.5) {
7666 return false;
7667 }
7668
7669 particle.velocity.length = NumberUtils.randomInRange(NumberUtils.setRangeValue(parent.velocity.length, particle.velocity.length));
7670 particle.splitCount = parent.splitCount + 1;
7671 particle.unbreakable = true;
7672 setTimeout(() => {
7673 particle.unbreakable = false;
7674 }, 500);
7675 return true;
7676 });
7677 }
7678
7679 removeQuantity(quantity) {
7680 this.removeAt(0, quantity);
7681 }
7682
7683 getLinkFrequency(p1, p2) {
7684 const key = `${Math.min(p1.id, p2.id)}_${Math.max(p1.id, p2.id)}`;
7685 let res = this.linksFreq.get(key);
7686
7687 if (res === undefined) {
7688 res = Math.random();
7689 this.linksFreq.set(key, res);
7690 }
7691
7692 return res;
7693 }
7694
7695 getTriangleFrequency(p1, p2, p3) {
7696 let [id1, id2, id3] = [p1.id, p2.id, p3.id];
7697
7698 if (id1 > id2) {
7699 [id2, id1] = [id1, id2];
7700 }
7701
7702 if (id2 > id3) {
7703 [id3, id2] = [id2, id3];
7704 }
7705
7706 if (id1 > id3) {
7707 [id3, id1] = [id1, id3];
7708 }
7709
7710 const key = `${id1}_${id2}_${id3}`;
7711 let res = this.trianglesFreq.get(key);
7712
7713 if (res === undefined) {
7714 res = Math.random();
7715 this.trianglesFreq.set(key, res);
7716 }
7717
7718 return res;
7719 }
7720
7721 setDensity() {
7722 const options = this.container.actualOptions;
7723 this.applyDensity(options.particles);
7724 }
7725
7726 applyDensity(options) {
7727 var _a;
7728
7729 if (!((_a = options.number.density) === null || _a === void 0 ? void 0 : _a.enable)) {
7730 return;
7731 }
7732
7733 const numberOptions = options.number;
7734 const densityFactor = this.initDensityFactor(numberOptions.density);
7735 const optParticlesNumber = numberOptions.value;
7736 const optParticlesLimit = numberOptions.limit > 0 ? numberOptions.limit : optParticlesNumber;
7737 const particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor;
7738 const particlesCount = this.count;
7739 this.limit = numberOptions.limit * densityFactor;
7740
7741 if (particlesCount < particlesNumber) {
7742 this.push(Math.abs(particlesNumber - particlesCount), undefined, options);
7743 } else if (particlesCount > particlesNumber) {
7744 this.removeQuantity(particlesCount - particlesNumber);
7745 }
7746 }
7747
7748 initDensityFactor(densityOptions) {
7749 const container = this.container;
7750
7751 if (!container.canvas.element || !densityOptions.enable) {
7752 return 1;
7753 }
7754
7755 const canvas = container.canvas.element;
7756 const pxRatio = container.retina.pixelRatio;
7757 return canvas.width * canvas.height / (densityOptions.factor * pxRatio * pxRatio * densityOptions.area);
7758 }
7759
7760 pushParticle(position, overrideOptions, initializer) {
7761 try {
7762 const particle = new Particle(this.nextId, this.container, position, overrideOptions);
7763 let canAdd = true;
7764
7765 if (initializer) {
7766 canAdd = initializer(particle);
7767 }
7768
7769 if (!canAdd) {
7770 return;
7771 }
7772
7773 this.array.push(particle);
7774 this.nextId++;
7775 return particle;
7776 } catch (e) {
7777 console.warn(`error adding particle: ${e}`);
7778 return;
7779 }
7780 }
7781
7782}
7783;// CONCATENATED MODULE: ./dist/browser/Core/Retina.js
7784
7785class Retina {
7786 constructor(container) {
7787 this.container = container;
7788 }
7789
7790 init() {
7791 const container = this.container;
7792 const options = container.actualOptions;
7793 this.pixelRatio = !options.detectRetina || Utils.isSsr() ? 1 : window.devicePixelRatio;
7794 const motionOptions = this.container.actualOptions.motion;
7795
7796 if (motionOptions && (motionOptions.disable || motionOptions.reduce.value)) {
7797 if (Utils.isSsr() || typeof matchMedia === "undefined" || !matchMedia) {
7798 this.reduceFactor = 1;
7799 } else {
7800 const mediaQuery = matchMedia("(prefers-reduced-motion: reduce)");
7801
7802 if (mediaQuery) {
7803 this.handleMotionChange(mediaQuery);
7804
7805 const handleChange = () => {
7806 this.handleMotionChange(mediaQuery);
7807 container.refresh().catch(() => {});
7808 };
7809
7810 if (mediaQuery.addEventListener !== undefined) {
7811 mediaQuery.addEventListener("change", handleChange);
7812 } else if (mediaQuery.addListener !== undefined) {
7813 mediaQuery.addListener(handleChange);
7814 }
7815 }
7816 }
7817 } else {
7818 this.reduceFactor = 1;
7819 }
7820
7821 const ratio = this.pixelRatio;
7822
7823 if (container.canvas.element) {
7824 const element = container.canvas.element;
7825 container.canvas.size.width = element.offsetWidth * ratio;
7826 container.canvas.size.height = element.offsetHeight * ratio;
7827 }
7828
7829 const particles = options.particles;
7830 this.linksDistance = particles.links.distance * ratio;
7831 this.linksWidth = particles.links.width * ratio;
7832 this.sizeAnimationSpeed = particles.size.animation.speed * ratio;
7833 const modes = options.interactivity.modes;
7834 this.connectModeDistance = modes.connect.distance * ratio;
7835 this.connectModeRadius = modes.connect.radius * ratio;
7836 this.grabModeDistance = modes.grab.distance * ratio;
7837 this.repulseModeDistance = modes.repulse.distance * ratio;
7838 this.bounceModeDistance = modes.bounce.distance * ratio;
7839 this.attractModeDistance = modes.attract.distance * ratio;
7840 this.slowModeRadius = modes.slow.radius * ratio;
7841 this.bubbleModeDistance = modes.bubble.distance * ratio;
7842
7843 if (modes.bubble.size) {
7844 this.bubbleModeSize = modes.bubble.size * ratio;
7845 }
7846 }
7847
7848 initParticle(particle) {
7849 const particlesOptions = particle.options;
7850 const ratio = this.pixelRatio;
7851 particle.linksDistance = particlesOptions.links.distance * ratio;
7852 particle.linksWidth = particlesOptions.links.width * ratio;
7853 particle.moveDrift = NumberUtils.getRangeValue(particlesOptions.move.drift) * ratio;
7854 particle.moveSpeed = NumberUtils.getRangeValue(particlesOptions.move.speed) * ratio;
7855 particle.sizeAnimationSpeed = particlesOptions.size.animation.speed * ratio;
7856 particle.maxDistance = particlesOptions.move.distance * ratio;
7857 }
7858
7859 handleMotionChange(mediaQuery) {
7860 const options = this.container.actualOptions;
7861
7862 if (mediaQuery.matches) {
7863 const motion = options.motion;
7864 this.reduceFactor = motion.disable ? 0 : motion.reduce.value ? 1 / motion.reduce.factor : 1;
7865 } else {
7866 this.reduceFactor = 1;
7867 }
7868 }
7869
7870}
7871;// CONCATENATED MODULE: ./dist/browser/Core/FrameManager.js
7872class FrameManager {
7873 constructor(container) {
7874 this.container = container;
7875 }
7876
7877 nextFrame(timestamp) {
7878 try {
7879 const container = this.container;
7880
7881 if (container.lastFrameTime !== undefined && timestamp < container.lastFrameTime + 1000 / container.fpsLimit) {
7882 container.draw();
7883 return;
7884 }
7885
7886 const deltaValue = timestamp - container.lastFrameTime;
7887 const delta = {
7888 value: deltaValue,
7889 factor: 60 * deltaValue / 1000
7890 };
7891 container.lastFrameTime = timestamp;
7892 container.particles.draw(delta);
7893
7894 if (container.getAnimationStatus()) {
7895 container.draw();
7896 }
7897 } catch (e) {
7898 console.error("tsParticles error in animation loop", e);
7899 }
7900 }
7901
7902}
7903;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Events/ClickEvent.js
7904class ClickEvent {
7905 constructor() {
7906 this.enable = false;
7907 this.mode = [];
7908 }
7909
7910 load(data) {
7911 if (data === undefined) {
7912 return;
7913 }
7914
7915 if (data.enable !== undefined) {
7916 this.enable = data.enable;
7917 }
7918
7919 if (data.mode !== undefined) {
7920 this.mode = data.mode;
7921 }
7922 }
7923
7924}
7925;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Events/DivEvent.js
7926
7927class DivEvent {
7928 constructor() {
7929 this.selectors = [];
7930 this.enable = false;
7931 this.mode = [];
7932 this.type = DivType.circle;
7933 }
7934
7935 get elementId() {
7936 return this.ids;
7937 }
7938
7939 set elementId(value) {
7940 this.ids = value;
7941 }
7942
7943 get el() {
7944 return this.elementId;
7945 }
7946
7947 set el(value) {
7948 this.elementId = value;
7949 }
7950
7951 get ids() {
7952 return this.selectors instanceof Array ? this.selectors.map(t => t.replace("#", "")) : this.selectors.replace("#", "");
7953 }
7954
7955 set ids(value) {
7956 this.selectors = value instanceof Array ? value.map(t => `#${t}`) : `#${value}`;
7957 }
7958
7959 load(data) {
7960 var _a, _b;
7961
7962 if (data === undefined) {
7963 return;
7964 }
7965
7966 const ids = (_b = (_a = data.ids) !== null && _a !== void 0 ? _a : data.elementId) !== null && _b !== void 0 ? _b : data.el;
7967
7968 if (ids !== undefined) {
7969 this.ids = ids;
7970 }
7971
7972 if (data.selectors !== undefined) {
7973 this.selectors = data.selectors;
7974 }
7975
7976 if (data.enable !== undefined) {
7977 this.enable = data.enable;
7978 }
7979
7980 if (data.mode !== undefined) {
7981 this.mode = data.mode;
7982 }
7983
7984 if (data.type !== undefined) {
7985 this.type = data.type;
7986 }
7987 }
7988
7989}
7990;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Events/Parallax.js
7991class Parallax {
7992 constructor() {
7993 this.enable = false;
7994 this.force = 2;
7995 this.smooth = 10;
7996 }
7997
7998 load(data) {
7999 if (data === undefined) {
8000 return;
8001 }
8002
8003 if (data.enable !== undefined) {
8004 this.enable = data.enable;
8005 }
8006
8007 if (data.force !== undefined) {
8008 this.force = data.force;
8009 }
8010
8011 if (data.smooth !== undefined) {
8012 this.smooth = data.smooth;
8013 }
8014 }
8015
8016}
8017;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Events/HoverEvent.js
8018
8019class HoverEvent {
8020 constructor() {
8021 this.enable = false;
8022 this.mode = [];
8023 this.parallax = new Parallax();
8024 }
8025
8026 load(data) {
8027 if (data === undefined) {
8028 return;
8029 }
8030
8031 if (data.enable !== undefined) {
8032 this.enable = data.enable;
8033 }
8034
8035 if (data.mode !== undefined) {
8036 this.mode = data.mode;
8037 }
8038
8039 this.parallax.load(data.parallax);
8040 }
8041
8042}
8043;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Events/Events.js
8044
8045
8046
8047class Events {
8048 constructor() {
8049 this.onClick = new ClickEvent();
8050 this.onDiv = new DivEvent();
8051 this.onHover = new HoverEvent();
8052 this.resize = true;
8053 }
8054
8055 get onclick() {
8056 return this.onClick;
8057 }
8058
8059 set onclick(value) {
8060 this.onClick = value;
8061 }
8062
8063 get ondiv() {
8064 return this.onDiv;
8065 }
8066
8067 set ondiv(value) {
8068 this.onDiv = value;
8069 }
8070
8071 get onhover() {
8072 return this.onHover;
8073 }
8074
8075 set onhover(value) {
8076 this.onHover = value;
8077 }
8078
8079 load(data) {
8080 var _a, _b, _c;
8081
8082 if (data === undefined) {
8083 return;
8084 }
8085
8086 this.onClick.load((_a = data.onClick) !== null && _a !== void 0 ? _a : data.onclick);
8087 const onDiv = (_b = data.onDiv) !== null && _b !== void 0 ? _b : data.ondiv;
8088
8089 if (onDiv !== undefined) {
8090 if (onDiv instanceof Array) {
8091 this.onDiv = onDiv.map(div => {
8092 const tmp = new DivEvent();
8093 tmp.load(div);
8094 return tmp;
8095 });
8096 } else {
8097 this.onDiv = new DivEvent();
8098 this.onDiv.load(onDiv);
8099 }
8100 }
8101
8102 this.onHover.load((_c = data.onHover) !== null && _c !== void 0 ? _c : data.onhover);
8103
8104 if (data.resize !== undefined) {
8105 this.resize = data.resize;
8106 }
8107 }
8108
8109}
8110;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/BubbleBase.js
8111
8112class BubbleBase {
8113 constructor() {
8114 this.distance = 200;
8115 this.duration = 0.4;
8116 }
8117
8118 load(data) {
8119 if (data === undefined) {
8120 return;
8121 }
8122
8123 if (data.distance !== undefined) {
8124 this.distance = data.distance;
8125 }
8126
8127 if (data.duration !== undefined) {
8128 this.duration = data.duration;
8129 }
8130
8131 if (data.opacity !== undefined) {
8132 this.opacity = data.opacity;
8133 }
8134
8135 if (data.color !== undefined) {
8136 if (data.color instanceof Array) {
8137 this.color = data.color.map(s => OptionsColor.create(undefined, s));
8138 } else {
8139 if (this.color instanceof Array) {
8140 this.color = new OptionsColor();
8141 }
8142
8143 this.color = OptionsColor.create(this.color, data.color);
8144 }
8145 }
8146
8147 if (data.size !== undefined) {
8148 this.size = data.size;
8149 }
8150 }
8151
8152}
8153;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/BubbleDiv.js
8154
8155class BubbleDiv extends BubbleBase {
8156 constructor() {
8157 super();
8158 this.selectors = [];
8159 }
8160
8161 get ids() {
8162 return this.selectors instanceof Array ? this.selectors.map(t => t.replace("#", "")) : this.selectors.replace("#", "");
8163 }
8164
8165 set ids(value) {
8166 this.selectors = value instanceof Array ? value.map(t => `#${t}`) : `#${value}`;
8167 }
8168
8169 load(data) {
8170 super.load(data);
8171
8172 if (data === undefined) {
8173 return;
8174 }
8175
8176 if (data.ids !== undefined) {
8177 this.ids = data.ids;
8178 }
8179
8180 if (data.selectors !== undefined) {
8181 this.selectors = data.selectors;
8182 }
8183 }
8184
8185}
8186;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Bubble.js
8187
8188
8189class Bubble extends BubbleBase {
8190 load(data) {
8191 super.load(data);
8192
8193 if (!(data !== undefined && data.divs !== undefined)) {
8194 return;
8195 }
8196
8197 if (data.divs instanceof Array) {
8198 this.divs = data.divs.map(s => {
8199 const tmp = new BubbleDiv();
8200 tmp.load(s);
8201 return tmp;
8202 });
8203 } else {
8204 if (this.divs instanceof Array || !this.divs) {
8205 this.divs = new BubbleDiv();
8206 }
8207
8208 this.divs.load(data.divs);
8209 }
8210 }
8211
8212}
8213;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/ConnectLinks.js
8214class ConnectLinks {
8215 constructor() {
8216 this.opacity = 0.5;
8217 }
8218
8219 load(data) {
8220 if (!(data !== undefined && data.opacity !== undefined)) {
8221 return;
8222 }
8223
8224 this.opacity = data.opacity;
8225 }
8226
8227}
8228;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Connect.js
8229
8230class Connect {
8231 constructor() {
8232 this.distance = 80;
8233 this.links = new ConnectLinks();
8234 this.radius = 60;
8235 }
8236
8237 get line_linked() {
8238 return this.links;
8239 }
8240
8241 set line_linked(value) {
8242 this.links = value;
8243 }
8244
8245 get lineLinked() {
8246 return this.links;
8247 }
8248
8249 set lineLinked(value) {
8250 this.links = value;
8251 }
8252
8253 load(data) {
8254 var _a, _b;
8255
8256 if (data === undefined) {
8257 return;
8258 }
8259
8260 if (data.distance !== undefined) {
8261 this.distance = data.distance;
8262 }
8263
8264 this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked);
8265
8266 if (data.radius !== undefined) {
8267 this.radius = data.radius;
8268 }
8269 }
8270
8271}
8272;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/GrabLinks.js
8273
8274class GrabLinks {
8275 constructor() {
8276 this.blink = false;
8277 this.consent = false;
8278 this.opacity = 1;
8279 }
8280
8281 load(data) {
8282 if (data === undefined) {
8283 return;
8284 }
8285
8286 if (data.blink !== undefined) {
8287 this.blink = data.blink;
8288 }
8289
8290 if (data.color !== undefined) {
8291 this.color = OptionsColor.create(this.color, data.color);
8292 }
8293
8294 if (data.consent !== undefined) {
8295 this.consent = data.consent;
8296 }
8297
8298 if (data.opacity !== undefined) {
8299 this.opacity = data.opacity;
8300 }
8301 }
8302
8303}
8304;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Grab.js
8305
8306class Grab {
8307 constructor() {
8308 this.distance = 100;
8309 this.links = new GrabLinks();
8310 }
8311
8312 get line_linked() {
8313 return this.links;
8314 }
8315
8316 set line_linked(value) {
8317 this.links = value;
8318 }
8319
8320 get lineLinked() {
8321 return this.links;
8322 }
8323
8324 set lineLinked(value) {
8325 this.links = value;
8326 }
8327
8328 load(data) {
8329 var _a, _b;
8330
8331 if (data === undefined) {
8332 return;
8333 }
8334
8335 if (data.distance !== undefined) {
8336 this.distance = data.distance;
8337 }
8338
8339 this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked);
8340 }
8341
8342}
8343;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Remove.js
8344class Remove {
8345 constructor() {
8346 this.quantity = 2;
8347 }
8348
8349 get particles_nb() {
8350 return this.quantity;
8351 }
8352
8353 set particles_nb(value) {
8354 this.quantity = value;
8355 }
8356
8357 load(data) {
8358 var _a;
8359
8360 if (data === undefined) {
8361 return;
8362 }
8363
8364 const quantity = (_a = data.quantity) !== null && _a !== void 0 ? _a : data.particles_nb;
8365
8366 if (quantity !== undefined) {
8367 this.quantity = quantity;
8368 }
8369 }
8370
8371}
8372;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Push.js
8373class Push {
8374 constructor() {
8375 this.quantity = 4;
8376 }
8377
8378 get particles_nb() {
8379 return this.quantity;
8380 }
8381
8382 set particles_nb(value) {
8383 this.quantity = value;
8384 }
8385
8386 load(data) {
8387 var _a;
8388
8389 if (data === undefined) {
8390 return;
8391 }
8392
8393 const quantity = (_a = data.quantity) !== null && _a !== void 0 ? _a : data.particles_nb;
8394
8395 if (quantity !== undefined) {
8396 this.quantity = quantity;
8397 }
8398 }
8399
8400}
8401;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/RepulseBase.js
8402class RepulseBase {
8403 constructor() {
8404 this.distance = 200;
8405 this.duration = 0.4;
8406 this.speed = 1;
8407 }
8408
8409 load(data) {
8410 if (data === undefined) {
8411 return;
8412 }
8413
8414 if (data.distance !== undefined) {
8415 this.distance = data.distance;
8416 }
8417
8418 if (data.duration !== undefined) {
8419 this.duration = data.duration;
8420 }
8421
8422 if (data.speed !== undefined) {
8423 this.speed = data.speed;
8424 }
8425 }
8426
8427}
8428;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/RepulseDiv.js
8429
8430class RepulseDiv extends RepulseBase {
8431 constructor() {
8432 super();
8433 this.selectors = [];
8434 }
8435
8436 get ids() {
8437 if (this.selectors instanceof Array) {
8438 return this.selectors.map(t => t.replace("#", ""));
8439 } else {
8440 return this.selectors.replace("#", "");
8441 }
8442 }
8443
8444 set ids(value) {
8445 if (value instanceof Array) {
8446 this.selectors = value.map(() => `#${value}`);
8447 } else {
8448 this.selectors = `#${value}`;
8449 }
8450 }
8451
8452 load(data) {
8453 super.load(data);
8454
8455 if (data === undefined) {
8456 return;
8457 }
8458
8459 if (data.ids !== undefined) {
8460 this.ids = data.ids;
8461 }
8462
8463 if (data.selectors !== undefined) {
8464 this.selectors = data.selectors;
8465 }
8466 }
8467
8468}
8469;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Repulse.js
8470
8471
8472class Repulse extends RepulseBase {
8473 load(data) {
8474 super.load(data);
8475
8476 if ((data === null || data === void 0 ? void 0 : data.divs) === undefined) {
8477 return;
8478 }
8479
8480 if (data.divs instanceof Array) {
8481 this.divs = data.divs.map(s => {
8482 const tmp = new RepulseDiv();
8483 tmp.load(s);
8484 return tmp;
8485 });
8486 } else {
8487 if (this.divs instanceof Array || !this.divs) {
8488 this.divs = new RepulseDiv();
8489 }
8490
8491 this.divs.load(data.divs);
8492 }
8493 }
8494
8495}
8496;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Slow.js
8497class Slow {
8498 constructor() {
8499 this.factor = 3;
8500 this.radius = 200;
8501 }
8502
8503 get active() {
8504 return false;
8505 }
8506
8507 set active(_value) {}
8508
8509 load(data) {
8510 if (data === undefined) {
8511 return;
8512 }
8513
8514 if (data.factor !== undefined) {
8515 this.factor = data.factor;
8516 }
8517
8518 if (data.radius !== undefined) {
8519 this.radius = data.radius;
8520 }
8521 }
8522
8523}
8524;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Trail.js
8525
8526class Trail_Trail {
8527 constructor() {
8528 this.delay = 1;
8529 this.quantity = 1;
8530 }
8531
8532 load(data) {
8533 if (data === undefined) {
8534 return;
8535 }
8536
8537 if (data.delay !== undefined) {
8538 this.delay = data.delay;
8539 }
8540
8541 if (data.quantity !== undefined) {
8542 this.quantity = data.quantity;
8543 }
8544
8545 if (data.particles !== undefined) {
8546 this.particles = Utils.deepExtend({}, data.particles);
8547 }
8548 }
8549
8550}
8551;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Attract.js
8552class Attract_Attract {
8553 constructor() {
8554 this.distance = 200;
8555 this.duration = 0.4;
8556 this.speed = 1;
8557 }
8558
8559 load(data) {
8560 if (data === undefined) {
8561 return;
8562 }
8563
8564 if (data.distance !== undefined) {
8565 this.distance = data.distance;
8566 }
8567
8568 if (data.duration !== undefined) {
8569 this.duration = data.duration;
8570 }
8571
8572 if (data.speed !== undefined) {
8573 this.speed = data.speed;
8574 }
8575 }
8576
8577}
8578;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/LightGradient.js
8579
8580class LightGradient {
8581 constructor() {
8582 this.start = new OptionsColor();
8583 this.stop = new OptionsColor();
8584 this.start.value = "#ffffff";
8585 this.stop.value = "#000000";
8586 }
8587
8588 load(data) {
8589 if (data === undefined) {
8590 return;
8591 }
8592
8593 this.start = OptionsColor.create(this.start, data.start);
8594 this.stop = OptionsColor.create(this.stop, data.stop);
8595 }
8596
8597}
8598;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/LightArea.js
8599
8600class LightArea {
8601 constructor() {
8602 this.gradient = new LightGradient();
8603 this.radius = 1000;
8604 }
8605
8606 load(data) {
8607 if (data === undefined) {
8608 return;
8609 }
8610
8611 this.gradient.load(data.gradient);
8612
8613 if (data.radius !== undefined) {
8614 this.radius = data.radius;
8615 }
8616 }
8617
8618}
8619;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/LightShadow.js
8620
8621class LightShadow {
8622 constructor() {
8623 this.color = new OptionsColor();
8624 this.color.value = "#000000";
8625 this.length = 2000;
8626 }
8627
8628 load(data) {
8629 if (data === undefined) {
8630 return;
8631 }
8632
8633 this.color = OptionsColor.create(this.color, data.color);
8634
8635 if (data.length !== undefined) {
8636 this.length = data.length;
8637 }
8638 }
8639
8640}
8641;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Light.js
8642
8643
8644class Light {
8645 constructor() {
8646 this.area = new LightArea();
8647 this.shadow = new LightShadow();
8648 }
8649
8650 load(data) {
8651 if (data === undefined) {
8652 return;
8653 }
8654
8655 this.area.load(data.area);
8656 this.shadow.load(data.shadow);
8657 }
8658
8659}
8660;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Bounce.js
8661class Bounce_Bounce {
8662 constructor() {
8663 this.distance = 200;
8664 }
8665
8666 load(data) {
8667 if (!data) {
8668 return;
8669 }
8670
8671 if (data.distance !== undefined) {
8672 this.distance = data.distance;
8673 }
8674 }
8675
8676}
8677;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Modes/Modes.js
8678
8679
8680
8681
8682
8683
8684
8685
8686
8687
8688
8689class Modes {
8690 constructor() {
8691 this.attract = new Attract_Attract();
8692 this.bounce = new Bounce_Bounce();
8693 this.bubble = new Bubble();
8694 this.connect = new Connect();
8695 this.grab = new Grab();
8696 this.light = new Light();
8697 this.push = new Push();
8698 this.remove = new Remove();
8699 this.repulse = new Repulse();
8700 this.slow = new Slow();
8701 this.trail = new Trail_Trail();
8702 }
8703
8704 load(data) {
8705 if (data === undefined) {
8706 return;
8707 }
8708
8709 this.attract.load(data.attract);
8710 this.bubble.load(data.bubble);
8711 this.connect.load(data.connect);
8712 this.grab.load(data.grab);
8713 this.light.load(data.light);
8714 this.push.load(data.push);
8715 this.remove.load(data.remove);
8716 this.repulse.load(data.repulse);
8717 this.slow.load(data.slow);
8718 this.trail.load(data.trail);
8719 }
8720
8721}
8722;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Interactivity/Interactivity.js
8723
8724
8725
8726class Interactivity {
8727 constructor() {
8728 this.detectsOn = InteractivityDetect.canvas;
8729 this.events = new Events();
8730 this.modes = new Modes();
8731 }
8732
8733 get detect_on() {
8734 return this.detectsOn;
8735 }
8736
8737 set detect_on(value) {
8738 this.detectsOn = value;
8739 }
8740
8741 load(data) {
8742 var _a, _b, _c;
8743
8744 if (data === undefined) {
8745 return;
8746 }
8747
8748 const detectsOn = (_a = data.detectsOn) !== null && _a !== void 0 ? _a : data.detect_on;
8749
8750 if (detectsOn !== undefined) {
8751 this.detectsOn = detectsOn;
8752 }
8753
8754 this.events.load(data.events);
8755 this.modes.load(data.modes);
8756
8757 if (((_c = (_b = data.modes) === null || _b === void 0 ? void 0 : _b.slow) === null || _c === void 0 ? void 0 : _c.active) === true) {
8758 if (this.events.onHover.mode instanceof Array) {
8759 if (this.events.onHover.mode.indexOf(HoverMode.slow) < 0) {
8760 this.events.onHover.mode.push(HoverMode.slow);
8761 }
8762 } else if (this.events.onHover.mode !== HoverMode.slow) {
8763 this.events.onHover.mode = [this.events.onHover.mode, HoverMode.slow];
8764 }
8765 }
8766 }
8767
8768}
8769;// CONCATENATED MODULE: ./dist/browser/Options/Classes/BackgroundMask/BackgroundMaskCover.js
8770
8771class BackgroundMaskCover {
8772 constructor() {
8773 this.color = new OptionsColor();
8774 this.opacity = 1;
8775 }
8776
8777 load(data) {
8778 if (data === undefined) {
8779 return;
8780 }
8781
8782 if (data.color !== undefined) {
8783 this.color = OptionsColor.create(this.color, data.color);
8784 }
8785
8786 if (data.opacity !== undefined) {
8787 this.opacity = data.opacity;
8788 }
8789 }
8790
8791}
8792;// CONCATENATED MODULE: ./dist/browser/Options/Classes/BackgroundMask/BackgroundMask.js
8793
8794class BackgroundMask {
8795 constructor() {
8796 this.composite = "destination-out";
8797 this.cover = new BackgroundMaskCover();
8798 this.enable = false;
8799 }
8800
8801 load(data) {
8802 if (data === undefined) {
8803 return;
8804 }
8805
8806 if (data.composite !== undefined) {
8807 this.composite = data.composite;
8808 }
8809
8810 if (data.cover !== undefined) {
8811 const cover = data.cover;
8812 const color = typeof data.cover === "string" ? {
8813 color: data.cover
8814 } : data.cover;
8815 this.cover.load(cover.color !== undefined ? cover : {
8816 color: color
8817 });
8818 }
8819
8820 if (data.enable !== undefined) {
8821 this.enable = data.enable;
8822 }
8823 }
8824
8825}
8826;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Background/Background.js
8827
8828class Background {
8829 constructor() {
8830 this.color = new OptionsColor();
8831 this.color.value = "";
8832 this.image = "";
8833 this.position = "";
8834 this.repeat = "";
8835 this.size = "";
8836 this.opacity = 1;
8837 }
8838
8839 load(data) {
8840 if (data === undefined) {
8841 return;
8842 }
8843
8844 if (data.color !== undefined) {
8845 this.color = OptionsColor.create(this.color, data.color);
8846 }
8847
8848 if (data.image !== undefined) {
8849 this.image = data.image;
8850 }
8851
8852 if (data.position !== undefined) {
8853 this.position = data.position;
8854 }
8855
8856 if (data.repeat !== undefined) {
8857 this.repeat = data.repeat;
8858 }
8859
8860 if (data.size !== undefined) {
8861 this.size = data.size;
8862 }
8863
8864 if (data.opacity !== undefined) {
8865 this.opacity = data.opacity;
8866 }
8867 }
8868
8869}
8870;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Infection/InfectionStage.js
8871
8872class InfectionStage {
8873 constructor() {
8874 this.color = new OptionsColor();
8875 this.color.value = "#ff0000";
8876 this.radius = 0;
8877 this.rate = 1;
8878 }
8879
8880 load(data) {
8881 if (data === undefined) {
8882 return;
8883 }
8884
8885 if (data.color !== undefined) {
8886 this.color = OptionsColor.create(this.color, data.color);
8887 }
8888
8889 this.duration = data.duration;
8890 this.infectedStage = data.infectedStage;
8891
8892 if (data.radius !== undefined) {
8893 this.radius = data.radius;
8894 }
8895
8896 if (data.rate !== undefined) {
8897 this.rate = data.rate;
8898 }
8899 }
8900
8901}
8902;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Infection/Infection.js
8903
8904class Infection {
8905 constructor() {
8906 this.cure = false;
8907 this.delay = 0;
8908 this.enable = false;
8909 this.infections = 0;
8910 this.stages = [];
8911 }
8912
8913 load(data) {
8914 if (data === undefined) {
8915 return;
8916 }
8917
8918 if (data.cure !== undefined) {
8919 this.cure = data.cure;
8920 }
8921
8922 if (data.delay !== undefined) {
8923 this.delay = data.delay;
8924 }
8925
8926 if (data.enable !== undefined) {
8927 this.enable = data.enable;
8928 }
8929
8930 if (data.infections !== undefined) {
8931 this.infections = data.infections;
8932 }
8933
8934 if (data.stages === undefined) {
8935 return;
8936 }
8937
8938 this.stages = data.stages.map(t => {
8939 const s = new InfectionStage();
8940 s.load(t);
8941 return s;
8942 });
8943 }
8944
8945}
8946;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Theme/ThemeDefault.js
8947
8948class ThemeDefault {
8949 constructor() {
8950 this.mode = ThemeMode.any;
8951 this.value = false;
8952 }
8953
8954 load(data) {
8955 if (data === undefined) {
8956 return;
8957 }
8958
8959 if (data.mode !== undefined) {
8960 this.mode = data.mode;
8961 }
8962
8963 if (data.value !== undefined) {
8964 this.value = data.value;
8965 }
8966 }
8967
8968}
8969;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Theme/Theme.js
8970
8971
8972class Theme {
8973 constructor() {
8974 this.name = "";
8975 this.default = new ThemeDefault();
8976 }
8977
8978 load(data) {
8979 if (data === undefined) {
8980 return;
8981 }
8982
8983 if (data.name !== undefined) {
8984 this.name = data.name;
8985 }
8986
8987 this.default.load(data.default);
8988
8989 if (data.options !== undefined) {
8990 this.options = Utils.deepExtend({}, data.options);
8991 }
8992 }
8993
8994}
8995;// CONCATENATED MODULE: ./dist/browser/Options/Classes/FullScreen/FullScreen.js
8996class FullScreen {
8997 constructor() {
8998 this.enable = false;
8999 this.zIndex = -1;
9000 }
9001
9002 load(data) {
9003 if (!data) {
9004 return;
9005 }
9006
9007 if (data.enable !== undefined) {
9008 this.enable = data.enable;
9009 }
9010
9011 if (data.zIndex !== undefined) {
9012 this.zIndex = data.zIndex;
9013 }
9014 }
9015
9016}
9017;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Motion/MotionReduce.js
9018class MotionReduce {
9019 constructor() {
9020 this.factor = 4;
9021 this.value = true;
9022 }
9023
9024 load(data) {
9025 if (!data) {
9026 return;
9027 }
9028
9029 if (data.factor !== undefined) {
9030 this.factor = data.factor;
9031 }
9032
9033 if (data.value !== undefined) {
9034 this.value = data.value;
9035 }
9036 }
9037
9038}
9039;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Motion/Motion.js
9040
9041class Motion {
9042 constructor() {
9043 this.disable = false;
9044 this.reduce = new MotionReduce();
9045 }
9046
9047 load(data) {
9048 if (!data) {
9049 return;
9050 }
9051
9052 if (data.disable !== undefined) {
9053 this.disable = data.disable;
9054 }
9055
9056 this.reduce.load(data.reduce);
9057 }
9058
9059}
9060;// CONCATENATED MODULE: ./dist/browser/Options/Classes/ManualParticle.js
9061
9062class ManualParticle {
9063 load(data) {
9064 var _a, _b;
9065
9066 if (!data) {
9067 return;
9068 }
9069
9070 if (data.position !== undefined) {
9071 this.position = {
9072 x: (_a = data.position.x) !== null && _a !== void 0 ? _a : 50,
9073 y: (_b = data.position.y) !== null && _b !== void 0 ? _b : 50
9074 };
9075 }
9076
9077 if (data.options !== undefined) {
9078 this.options = Utils.deepExtend({}, data.options);
9079 }
9080 }
9081
9082}
9083;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Responsive.js
9084
9085class Responsive {
9086 constructor() {
9087 this.maxWidth = Infinity;
9088 this.options = {};
9089 }
9090
9091 load(data) {
9092 if (!data) {
9093 return;
9094 }
9095
9096 if (data.maxWidth !== undefined) {
9097 this.maxWidth = data.maxWidth;
9098 }
9099
9100 if (data.options !== undefined) {
9101 this.options = Utils.deepExtend({}, data.options);
9102 }
9103 }
9104
9105}
9106;// CONCATENATED MODULE: ./dist/browser/Options/Classes/Options.js
9107
9108
9109
9110
9111
9112
9113
9114
9115
9116
9117
9118
9119class Options {
9120 constructor() {
9121 this.autoPlay = true;
9122 this.background = new Background();
9123 this.backgroundMask = new BackgroundMask();
9124 this.fullScreen = new FullScreen();
9125 this.detectRetina = true;
9126 this.fpsLimit = 60;
9127 this.infection = new Infection();
9128 this.interactivity = new Interactivity();
9129 this.manualParticles = [];
9130 this.motion = new Motion();
9131 this.particles = new ParticlesOptions();
9132 this.pauseOnBlur = true;
9133 this.pauseOnOutsideViewport = true;
9134 this.responsive = [];
9135 this.themes = [];
9136 }
9137
9138 get fps_limit() {
9139 return this.fpsLimit;
9140 }
9141
9142 set fps_limit(value) {
9143 this.fpsLimit = value;
9144 }
9145
9146 get retina_detect() {
9147 return this.detectRetina;
9148 }
9149
9150 set retina_detect(value) {
9151 this.detectRetina = value;
9152 }
9153
9154 get backgroundMode() {
9155 return this.fullScreen;
9156 }
9157
9158 set backgroundMode(value) {
9159 this.fullScreen.load(value);
9160 }
9161
9162 load(data) {
9163 var _a, _b, _c;
9164
9165 if (data === undefined) {
9166 return;
9167 }
9168
9169 if (data.preset !== undefined) {
9170 if (data.preset instanceof Array) {
9171 for (const preset of data.preset) {
9172 this.importPreset(preset);
9173 }
9174 } else {
9175 this.importPreset(data.preset);
9176 }
9177 }
9178
9179 if (data.autoPlay !== undefined) {
9180 this.autoPlay = data.autoPlay;
9181 }
9182
9183 const detectRetina = (_a = data.detectRetina) !== null && _a !== void 0 ? _a : data.retina_detect;
9184
9185 if (detectRetina !== undefined) {
9186 this.detectRetina = detectRetina;
9187 }
9188
9189 const fpsLimit = (_b = data.fpsLimit) !== null && _b !== void 0 ? _b : data.fps_limit;
9190
9191 if (fpsLimit !== undefined) {
9192 this.fpsLimit = fpsLimit;
9193 }
9194
9195 if (data.pauseOnBlur !== undefined) {
9196 this.pauseOnBlur = data.pauseOnBlur;
9197 }
9198
9199 if (data.pauseOnOutsideViewport !== undefined) {
9200 this.pauseOnOutsideViewport = data.pauseOnOutsideViewport;
9201 }
9202
9203 this.background.load(data.background);
9204 this.fullScreen.load((_c = data.fullScreen) !== null && _c !== void 0 ? _c : data.backgroundMode);
9205 this.backgroundMask.load(data.backgroundMask);
9206 this.infection.load(data.infection);
9207 this.interactivity.load(data.interactivity);
9208
9209 if (data.manualParticles !== undefined) {
9210 this.manualParticles = data.manualParticles.map(t => {
9211 const tmp = new ManualParticle();
9212 tmp.load(t);
9213 return tmp;
9214 });
9215 }
9216
9217 this.motion.load(data.motion);
9218 this.particles.load(data.particles);
9219 Plugins.loadOptions(this, data);
9220
9221 if (data.responsive !== undefined) {
9222 for (const responsive of data.responsive) {
9223 const optResponsive = new Responsive();
9224 optResponsive.load(responsive);
9225 this.responsive.push(optResponsive);
9226 }
9227 }
9228
9229 this.responsive.sort((a, b) => a.maxWidth - b.maxWidth);
9230
9231 if (data.themes !== undefined) {
9232 for (const theme of data.themes) {
9233 const optTheme = new Theme();
9234 optTheme.load(theme);
9235 this.themes.push(optTheme);
9236 }
9237 }
9238 }
9239
9240 setTheme(name) {
9241 if (name) {
9242 const chosenTheme = this.themes.find(theme => theme.name === name);
9243
9244 if (chosenTheme) {
9245 this.load(chosenTheme.options);
9246 }
9247 } else {
9248 const clientDarkMode = typeof matchMedia !== "undefined" && matchMedia("(prefers-color-scheme: dark)").matches;
9249 let defaultTheme = this.themes.find(theme => theme.default.value && (theme.default.mode === ThemeMode.dark && clientDarkMode || theme.default.mode === ThemeMode.light && !clientDarkMode));
9250
9251 if (!defaultTheme) {
9252 defaultTheme = this.themes.find(theme => theme.default.value && theme.default.mode === ThemeMode.any);
9253 }
9254
9255 if (defaultTheme) {
9256 this.load(defaultTheme.options);
9257 }
9258 }
9259 }
9260
9261 importPreset(preset) {
9262 this.load(Plugins.getPreset(preset));
9263 }
9264
9265 setResponsive(width, pxRatio, defaultOptions) {
9266 var _a;
9267
9268 this.load(defaultOptions);
9269 this.load((_a = this.responsive.find(t => t.maxWidth * pxRatio > width)) === null || _a === void 0 ? void 0 : _a.options);
9270 }
9271
9272}
9273;// CONCATENATED MODULE: ./dist/browser/Core/Container.js
9274var Container_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
9275 function adopt(value) {
9276 return value instanceof P ? value : new P(function (resolve) {
9277 resolve(value);
9278 });
9279 }
9280
9281 return new (P || (P = Promise))(function (resolve, reject) {
9282 function fulfilled(value) {
9283 try {
9284 step(generator.next(value));
9285 } catch (e) {
9286 reject(e);
9287 }
9288 }
9289
9290 function rejected(value) {
9291 try {
9292 step(generator["throw"](value));
9293 } catch (e) {
9294 reject(e);
9295 }
9296 }
9297
9298 function step(result) {
9299 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
9300 }
9301
9302 step((generator = generator.apply(thisArg, _arguments || [])).next());
9303 });
9304};
9305
9306
9307
9308
9309
9310
9311
9312
9313class Container {
9314 constructor(id, sourceOptions, ...presets) {
9315 this.id = id;
9316 this.fpsLimit = 60;
9317 this.firstStart = true;
9318 this.started = false;
9319 this.destroyed = false;
9320 this.paused = true;
9321 this.lastFrameTime = 0;
9322 this.pageHidden = false;
9323 this._sourceOptions = sourceOptions;
9324 this.retina = new Retina(this);
9325 this.canvas = new Canvas(this);
9326 this.particles = new Particles(this);
9327 this.drawer = new FrameManager(this);
9328 this.pathGenerator = {
9329 generate: () => {
9330 const v = Vector.create(0, 0);
9331 v.length = Math.random();
9332 v.angle = Math.random() * Math.PI * 2;
9333 return v;
9334 },
9335 init: () => {},
9336 update: () => {}
9337 };
9338 this.interactivity = {
9339 mouse: {
9340 clicking: false,
9341 inside: false
9342 }
9343 };
9344 this.bubble = {};
9345 this.repulse = {
9346 particles: []
9347 };
9348 this.attract = {
9349 particles: []
9350 };
9351 this.plugins = new Map();
9352 this.drawers = new Map();
9353 this.density = 1;
9354 this._options = new Options();
9355 this.actualOptions = new Options();
9356
9357 for (const preset of presets) {
9358 this._options.load(Plugins.getPreset(preset));
9359 }
9360
9361 const shapes = Plugins.getSupportedShapes();
9362
9363 for (const type of shapes) {
9364 const drawer = Plugins.getShapeDrawer(type);
9365
9366 if (drawer) {
9367 this.drawers.set(type, drawer);
9368 }
9369 }
9370
9371 if (this._options) {
9372 this._options.load(this._sourceOptions);
9373 }
9374
9375 this.eventListeners = new EventListeners(this);
9376
9377 if (typeof IntersectionObserver !== "undefined" && IntersectionObserver) {
9378 this.intersectionObserver = new IntersectionObserver(entries => this.intersectionManager(entries));
9379 }
9380 }
9381
9382 get options() {
9383 return this._options;
9384 }
9385
9386 get sourceOptions() {
9387 return this._sourceOptions;
9388 }
9389
9390 play(force) {
9391 const needsUpdate = this.paused || force;
9392
9393 if (this.firstStart && !this.actualOptions.autoPlay) {
9394 this.firstStart = false;
9395 return;
9396 }
9397
9398 if (this.paused) {
9399 this.paused = false;
9400 }
9401
9402 if (needsUpdate) {
9403 for (const [, plugin] of this.plugins) {
9404 if (plugin.play) {
9405 plugin.play();
9406 }
9407 }
9408
9409 this.lastFrameTime = performance.now();
9410 }
9411
9412 this.draw();
9413 }
9414
9415 pause() {
9416 if (this.drawAnimationFrame !== undefined) {
9417 Utils.cancelAnimation(this.drawAnimationFrame);
9418 delete this.drawAnimationFrame;
9419 }
9420
9421 if (this.paused) {
9422 return;
9423 }
9424
9425 for (const [, plugin] of this.plugins) {
9426 if (plugin.pause) {
9427 plugin.pause();
9428 }
9429 }
9430
9431 if (!this.pageHidden) {
9432 this.paused = true;
9433 }
9434 }
9435
9436 draw() {
9437 this.drawAnimationFrame = Utils.animate(timestamp => this.drawer.nextFrame(timestamp));
9438 }
9439
9440 getAnimationStatus() {
9441 return !this.paused;
9442 }
9443
9444 setNoise(noiseOrGenerator, init, update) {
9445 this.setPath(noiseOrGenerator, init, update);
9446 }
9447
9448 setPath(pathOrGenerator, init, update) {
9449 if (!pathOrGenerator) {
9450 return;
9451 }
9452
9453 if (typeof pathOrGenerator === "function") {
9454 this.pathGenerator.generate = pathOrGenerator;
9455
9456 if (init) {
9457 this.pathGenerator.init = init;
9458 }
9459
9460 if (update) {
9461 this.pathGenerator.update = update;
9462 }
9463 } else {
9464 if (pathOrGenerator.generate) {
9465 this.pathGenerator.generate = pathOrGenerator.generate;
9466 }
9467
9468 if (pathOrGenerator.init) {
9469 this.pathGenerator.init = pathOrGenerator.init;
9470 }
9471
9472 if (pathOrGenerator.update) {
9473 this.pathGenerator.update = pathOrGenerator.update;
9474 }
9475 }
9476 }
9477
9478 destroy() {
9479 this.stop();
9480 this.canvas.destroy();
9481
9482 for (const [, drawer] of this.drawers) {
9483 if (drawer.destroy) {
9484 drawer.destroy(this);
9485 }
9486 }
9487
9488 for (const key of this.drawers.keys()) {
9489 this.drawers.delete(key);
9490 }
9491
9492 this.destroyed = true;
9493 }
9494
9495 exportImg(callback) {
9496 this.exportImage(callback);
9497 }
9498
9499 exportImage(callback, type, quality) {
9500 var _a;
9501
9502 return (_a = this.canvas.element) === null || _a === void 0 ? void 0 : _a.toBlob(callback, type !== null && type !== void 0 ? type : "image/png", quality);
9503 }
9504
9505 exportConfiguration() {
9506 return JSON.stringify(this.actualOptions, undefined, 2);
9507 }
9508
9509 refresh() {
9510 this.stop();
9511 return this.start();
9512 }
9513
9514 reset() {
9515 this._options = new Options();
9516 return this.refresh();
9517 }
9518
9519 stop() {
9520 if (!this.started) {
9521 return;
9522 }
9523
9524 this.firstStart = true;
9525 this.started = false;
9526 this.eventListeners.removeListeners();
9527 this.pause();
9528 this.particles.clear();
9529 this.canvas.clear();
9530
9531 if (this.interactivity.element instanceof HTMLElement && this.intersectionObserver) {
9532 this.intersectionObserver.observe(this.interactivity.element);
9533 }
9534
9535 for (const [, plugin] of this.plugins) {
9536 if (plugin.stop) {
9537 plugin.stop();
9538 }
9539 }
9540
9541 for (const key of this.plugins.keys()) {
9542 this.plugins.delete(key);
9543 }
9544
9545 this.particles.linksColors = new Map();
9546 delete this.particles.grabLineColor;
9547 delete this.particles.linksColor;
9548 }
9549
9550 loadTheme(name) {
9551 return Container_awaiter(this, void 0, void 0, function* () {
9552 this.actualOptions.setTheme(name);
9553 yield this.refresh();
9554 });
9555 }
9556
9557 start() {
9558 return Container_awaiter(this, void 0, void 0, function* () {
9559 if (this.started) {
9560 return;
9561 }
9562
9563 yield this.init();
9564 this.started = true;
9565 this.eventListeners.addListeners();
9566
9567 if (this.interactivity.element instanceof HTMLElement && this.intersectionObserver) {
9568 this.intersectionObserver.observe(this.interactivity.element);
9569 }
9570
9571 for (const [, plugin] of this.plugins) {
9572 if (plugin.startAsync !== undefined) {
9573 yield plugin.startAsync();
9574 } else if (plugin.start !== undefined) {
9575 plugin.start();
9576 }
9577 }
9578
9579 this.play();
9580 });
9581 }
9582
9583 init() {
9584 return Container_awaiter(this, void 0, void 0, function* () {
9585 this.actualOptions = new Options();
9586 this.actualOptions.load(this._options);
9587 this.retina.init();
9588 this.canvas.init();
9589 this.actualOptions.setResponsive(this.canvas.size.width, this.retina.pixelRatio, this._options);
9590 this.actualOptions.setTheme(undefined);
9591 this.fpsLimit = this.actualOptions.fpsLimit > 0 ? this.actualOptions.fpsLimit : 60;
9592 const availablePlugins = Plugins.getAvailablePlugins(this);
9593
9594 for (const [id, plugin] of availablePlugins) {
9595 this.plugins.set(id, plugin);
9596 }
9597
9598 for (const [, drawer] of this.drawers) {
9599 if (drawer.init) {
9600 yield drawer.init(this);
9601 }
9602 }
9603
9604 for (const [, plugin] of this.plugins) {
9605 if (plugin.init) {
9606 plugin.init(this.actualOptions);
9607 } else if (plugin.initAsync !== undefined) {
9608 yield plugin.initAsync(this.actualOptions);
9609 }
9610 }
9611
9612 this.canvas.resize();
9613 this.particles.init();
9614 this.particles.setDensity();
9615 });
9616 }
9617
9618 intersectionManager(entries) {
9619 if (!this.actualOptions.pauseOnOutsideViewport) {
9620 return;
9621 }
9622
9623 for (const entry of entries) {
9624 if (entry.target !== this.interactivity.element) {
9625 continue;
9626 }
9627
9628 if (entry.isIntersecting) {
9629 this.play();
9630 } else {
9631 this.pause();
9632 }
9633 }
9634 }
9635
9636}
9637;// CONCATENATED MODULE: ./dist/browser/Core/Loader.js
9638var Loader_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
9639 function adopt(value) {
9640 return value instanceof P ? value : new P(function (resolve) {
9641 resolve(value);
9642 });
9643 }
9644
9645 return new (P || (P = Promise))(function (resolve, reject) {
9646 function fulfilled(value) {
9647 try {
9648 step(generator.next(value));
9649 } catch (e) {
9650 reject(e);
9651 }
9652 }
9653
9654 function rejected(value) {
9655 try {
9656 step(generator["throw"](value));
9657 } catch (e) {
9658 reject(e);
9659 }
9660 }
9661
9662 function step(result) {
9663 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
9664 }
9665
9666 step((generator = generator.apply(thisArg, _arguments || [])).next());
9667 });
9668};
9669
9670
9671
9672const tsParticlesDom = [];
9673
9674function fetchError(statusCode) {
9675 console.error(`Error tsParticles - fetch status: ${statusCode}`);
9676 console.error("Error tsParticles - File config not found");
9677}
9678
9679class Loader {
9680 static dom() {
9681 return tsParticlesDom;
9682 }
9683
9684 static domItem(index) {
9685 const dom = Loader.dom();
9686 const item = dom[index];
9687
9688 if (item && !item.destroyed) {
9689 return item;
9690 }
9691
9692 dom.splice(index, 1);
9693 }
9694
9695 static load(tagId, options, index) {
9696 return Loader_awaiter(this, void 0, void 0, function* () {
9697 const domContainer = document.getElementById(tagId);
9698
9699 if (!domContainer) {
9700 return;
9701 }
9702
9703 return Loader.set(tagId, domContainer, options, index);
9704 });
9705 }
9706
9707 static set(id, domContainer, options, index) {
9708 return Loader_awaiter(this, void 0, void 0, function* () {
9709 const currentOptions = options instanceof Array ? Utils.itemFromArray(options, index) : options;
9710 const dom = Loader.dom();
9711 const oldIndex = dom.findIndex(v => v.id === id);
9712
9713 if (oldIndex >= 0) {
9714 const old = Loader.domItem(oldIndex);
9715
9716 if (old && !old.destroyed) {
9717 old.destroy();
9718 dom.splice(oldIndex, 1);
9719 }
9720 }
9721
9722 let canvasEl;
9723 let generatedCanvas;
9724
9725 if (domContainer.tagName.toLowerCase() === "canvas") {
9726 canvasEl = domContainer;
9727 generatedCanvas = false;
9728 } else {
9729 const existingCanvases = domContainer.getElementsByTagName("canvas");
9730
9731 if (existingCanvases.length) {
9732 canvasEl = existingCanvases[0];
9733
9734 if (!canvasEl.className) {
9735 canvasEl.className = Constants.canvasClass;
9736 }
9737
9738 generatedCanvas = false;
9739 } else {
9740 generatedCanvas = true;
9741 canvasEl = document.createElement("canvas");
9742 canvasEl.className = Constants.canvasClass;
9743 canvasEl.style.width = "100%";
9744 canvasEl.style.height = "100%";
9745 domContainer.appendChild(canvasEl);
9746 }
9747 }
9748
9749 const newItem = new Container(id, currentOptions);
9750
9751 if (oldIndex >= 0) {
9752 dom.splice(oldIndex, 0, newItem);
9753 } else {
9754 dom.push(newItem);
9755 }
9756
9757 newItem.canvas.loadCanvas(canvasEl, generatedCanvas);
9758 yield newItem.start();
9759 return newItem;
9760 });
9761 }
9762
9763 static loadJSON(tagId, jsonUrl, index) {
9764 return Loader_awaiter(this, void 0, void 0, function* () {
9765 const url = jsonUrl instanceof Array ? Utils.itemFromArray(jsonUrl, index) : jsonUrl;
9766 const response = yield fetch(url);
9767
9768 if (response.ok) {
9769 return Loader.load(tagId, yield response.json());
9770 } else {
9771 fetchError(response.status);
9772 }
9773 });
9774 }
9775
9776 static setJSON(id, domContainer, jsonUrl) {
9777 return Loader_awaiter(this, void 0, void 0, function* () {
9778 const response = yield fetch(jsonUrl);
9779
9780 if (response.ok) {
9781 const options = yield response.json();
9782 return Loader.set(id, domContainer, options);
9783 } else {
9784 fetchError(response.status);
9785 }
9786 });
9787 }
9788
9789 static setOnClickHandler(callback) {
9790 const dom = Loader.dom();
9791
9792 if (dom.length === 0) {
9793 throw new Error("Can only set click handlers after calling tsParticles.load() or tsParticles.loadJSON()");
9794 }
9795
9796 for (const domItem of dom) {
9797 const el = domItem.interactivity.element;
9798
9799 if (!el) {
9800 continue;
9801 }
9802
9803 const clickOrTouchHandler = (e, pos) => {
9804 if (domItem.destroyed) {
9805 return;
9806 }
9807
9808 const pxRatio = domItem.retina.pixelRatio;
9809 const posRetina = {
9810 x: pos.x * pxRatio,
9811 y: pos.y * pxRatio
9812 };
9813 const particles = domItem.particles.quadTree.queryCircle(posRetina, domItem.retina.sizeValue);
9814 callback(e, particles);
9815 };
9816
9817 const clickHandler = e => {
9818 if (domItem.destroyed) {
9819 return;
9820 }
9821
9822 const mouseEvent = e;
9823 const pos = {
9824 x: mouseEvent.offsetX || mouseEvent.clientX,
9825 y: mouseEvent.offsetY || mouseEvent.clientY
9826 };
9827 clickOrTouchHandler(e, pos);
9828 };
9829
9830 const touchStartHandler = () => {
9831 if (domItem.destroyed) {
9832 return;
9833 }
9834
9835 touched = true;
9836 touchMoved = false;
9837 };
9838
9839 const touchMoveHandler = () => {
9840 if (domItem.destroyed) {
9841 return;
9842 }
9843
9844 touchMoved = true;
9845 };
9846
9847 const touchEndHandler = e => {
9848 var _a, _b, _c;
9849
9850 if (domItem.destroyed) {
9851 return;
9852 }
9853
9854 if (touched && !touchMoved) {
9855 const touchEvent = e;
9856 const lastTouch = touchEvent.touches[touchEvent.touches.length - 1];
9857 const canvasRect = (_a = domItem.canvas.element) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
9858 const pos = {
9859 x: lastTouch.clientX - ((_b = canvasRect === null || canvasRect === void 0 ? void 0 : canvasRect.left) !== null && _b !== void 0 ? _b : 0),
9860 y: lastTouch.clientY - ((_c = canvasRect === null || canvasRect === void 0 ? void 0 : canvasRect.top) !== null && _c !== void 0 ? _c : 0)
9861 };
9862 clickOrTouchHandler(e, pos);
9863 }
9864
9865 touched = false;
9866 touchMoved = false;
9867 };
9868
9869 const touchCancelHandler = () => {
9870 if (domItem.destroyed) {
9871 return;
9872 }
9873
9874 touched = false;
9875 touchMoved = false;
9876 };
9877
9878 let touched = false;
9879 let touchMoved = false;
9880 el.addEventListener("click", clickHandler);
9881 el.addEventListener("touchstart", touchStartHandler);
9882 el.addEventListener("touchmove", touchMoveHandler);
9883 el.addEventListener("touchend", touchEndHandler);
9884 el.addEventListener("touchcancel", touchCancelHandler);
9885 }
9886 }
9887
9888}
9889;// CONCATENATED MODULE: ./dist/browser/main.slim.js
9890var main_slim_awaiter = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
9891 function adopt(value) {
9892 return value instanceof P ? value : new P(function (resolve) {
9893 resolve(value);
9894 });
9895 }
9896
9897 return new (P || (P = Promise))(function (resolve, reject) {
9898 function fulfilled(value) {
9899 try {
9900 step(generator.next(value));
9901 } catch (e) {
9902 reject(e);
9903 }
9904 }
9905
9906 function rejected(value) {
9907 try {
9908 step(generator["throw"](value));
9909 } catch (e) {
9910 reject(e);
9911 }
9912 }
9913
9914 function step(result) {
9915 result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
9916 }
9917
9918 step((generator = generator.apply(thisArg, _arguments || [])).next());
9919 });
9920};
9921
9922var __classPrivateFieldSet = undefined && undefined.__classPrivateFieldSet || function (receiver, privateMap, value) {
9923 if (!privateMap.has(receiver)) {
9924 throw new TypeError("attempted to set private field on non-instance");
9925 }
9926
9927 privateMap.set(receiver, value);
9928 return value;
9929};
9930
9931var __classPrivateFieldGet = undefined && undefined.__classPrivateFieldGet || function (receiver, privateMap) {
9932 if (!privateMap.has(receiver)) {
9933 throw new TypeError("attempted to get private field on non-instance");
9934 }
9935
9936 return privateMap.get(receiver);
9937};
9938
9939var _initialized;
9940
9941
9942
9943
9944
9945
9946
9947
9948
9949
9950
9951
9952class MainSlim {
9953 constructor() {
9954 _initialized.set(this, void 0);
9955
9956 __classPrivateFieldSet(this, _initialized, false);
9957
9958 const squareDrawer = new SquareDrawer();
9959 const textDrawer = new TextDrawer();
9960 const imageDrawer = new ImageDrawer();
9961 Plugins.addShapeDrawer(ShapeType.line, new LineDrawer());
9962 Plugins.addShapeDrawer(ShapeType.circle, new CircleDrawer());
9963 Plugins.addShapeDrawer(ShapeType.edge, squareDrawer);
9964 Plugins.addShapeDrawer(ShapeType.square, squareDrawer);
9965 Plugins.addShapeDrawer(ShapeType.triangle, new TriangleDrawer());
9966 Plugins.addShapeDrawer(ShapeType.star, new StarDrawer());
9967 Plugins.addShapeDrawer(ShapeType.polygon, new PolygonDrawer());
9968 Plugins.addShapeDrawer(ShapeType.char, textDrawer);
9969 Plugins.addShapeDrawer(ShapeType.character, textDrawer);
9970 Plugins.addShapeDrawer(ShapeType.image, imageDrawer);
9971 Plugins.addShapeDrawer(ShapeType.images, imageDrawer);
9972 }
9973
9974 init() {
9975 if (!__classPrivateFieldGet(this, _initialized)) {
9976 __classPrivateFieldSet(this, _initialized, true);
9977 }
9978 }
9979
9980 loadFromArray(tagId, options, index) {
9981 return main_slim_awaiter(this, void 0, void 0, function* () {
9982 return Loader.load(tagId, options, index);
9983 });
9984 }
9985
9986 load(tagId, options) {
9987 return main_slim_awaiter(this, void 0, void 0, function* () {
9988 return Loader.load(tagId, options);
9989 });
9990 }
9991
9992 set(id, element, options) {
9993 return main_slim_awaiter(this, void 0, void 0, function* () {
9994 return Loader.set(id, element, options);
9995 });
9996 }
9997
9998 loadJSON(tagId, pathConfigJson, index) {
9999 return Loader.loadJSON(tagId, pathConfigJson, index);
10000 }
10001
10002 setOnClickHandler(callback) {
10003 Loader.setOnClickHandler(callback);
10004 }
10005
10006 dom() {
10007 return Loader.dom();
10008 }
10009
10010 domItem(index) {
10011 return Loader.domItem(index);
10012 }
10013
10014 addShape(shape, drawer, init, afterEffect, destroy) {
10015 let customDrawer;
10016
10017 if (typeof drawer === "function") {
10018 customDrawer = {
10019 afterEffect: afterEffect,
10020 destroy: destroy,
10021 draw: drawer,
10022 init: init
10023 };
10024 } else {
10025 customDrawer = drawer;
10026 }
10027
10028 Plugins.addShapeDrawer(shape, customDrawer);
10029 }
10030
10031 addPreset(preset, options) {
10032 Plugins.addPreset(preset, options);
10033 }
10034
10035 addPlugin(plugin) {
10036 Plugins.addPlugin(plugin);
10037 }
10038
10039 addPathGenerator(name, generator) {
10040 Plugins.addPathGenerator(name, generator);
10041 }
10042
10043}
10044_initialized = new WeakMap();
10045;// CONCATENATED MODULE: ./dist/browser/pjs.js
10046const initPjs = main => {
10047 const particlesJS = (tagId, options) => {
10048 return main.load(tagId, options);
10049 };
10050
10051 particlesJS.load = (tagId, pathConfigJson, callback) => {
10052 main.loadJSON(tagId, pathConfigJson).then(container => {
10053 if (container) {
10054 callback(container);
10055 }
10056 });
10057 };
10058
10059 particlesJS.setOnClickHandler = callback => {
10060 main.setOnClickHandler(callback);
10061 };
10062
10063 const pJSDom = main.dom();
10064 return {
10065 particlesJS,
10066 pJSDom
10067 };
10068};
10069
10070
10071;// CONCATENATED MODULE: ./dist/browser/index.slim.js
10072
10073
10074
10075const tsParticles = new MainSlim();
10076tsParticles.init();
10077const {
10078 particlesJS,
10079 pJSDom
10080} = initPjs(tsParticles);
10081
10082
10083
10084
10085
10086
10087/******/ return __webpack_exports__;
10088/******/ })()
10089;
10090});
\No newline at end of file