@tsparticles/interaction-particles-links 3.0.0-alpha.0 → 3.0.0-beta.0

package/tsparticles.interaction.particles.links.js

@@ -4,7 +4,7 @@
  * Demo / Generator : https://particles.js.org/
  * GitHub : https://www.github.com/matteobruni/tsparticles
  * How to use? : Check the GitHub README
- * v3.0.0-alpha.0
+ * v3.0.0-beta.0
  */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
@@ -91,10 +91,10 @@ __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, {
-  "Links": () => (/* reexport */ Links),
-  "LinksShadow": () => (/* reexport */ LinksShadow),
-  "LinksTriangle": () => (/* reexport */ LinksTriangle),
-  "loadParticlesLinksInteraction": () => (/* binding */ loadParticlesLinksInteraction)
+  Links: () => (/* reexport */ Links),
+  LinksShadow: () => (/* reexport */ LinksShadow),
+  LinksTriangle: () => (/* reexport */ LinksTriangle),
+  loadParticlesLinksInteraction: () => (/* binding */ loadParticlesLinksInteraction)
 });
 
 // EXTERNAL MODULE: external {"commonjs":"@tsparticles/engine","commonjs2":"@tsparticles/engine","amd":"@tsparticles/engine","root":"window"}
@@ -105,31 +105,29 @@ class CircleWarp extends engine_root_window_.Circle {
   constructor(x, y, radius, canvasSize) {
     super(x, y, radius);
     this.canvasSize = canvasSize;
-    this.canvasSize = Object.assign({}, canvasSize);
+    this.canvasSize = {
+      ...canvasSize
+    };
   }
   contains(point) {
-    if (super.contains(point)) {
-      return true;
-    }
-    const posNE = {
-      x: point.x - this.canvasSize.width,
-      y: point.y
-    };
-    if (super.contains(posNE)) {
-      return true;
-    }
-    const posSE = {
-      x: point.x - this.canvasSize.width,
-      y: point.y - this.canvasSize.height
-    };
-    if (super.contains(posSE)) {
-      return true;
-    }
-    const posSW = {
-      x: point.x,
-      y: point.y - this.canvasSize.height
-    };
-    return super.contains(posSW);
+    const {
+      width,
+      height
+    } = this.canvasSize;
+    const {
+      x,
+      y
+    } = point;
+    return super.contains(point) || super.contains({
+      x: x - width,
+      y
+    }) || super.contains({
+      x: x - width,
+      y: y - height
+    }) || super.contains({
+      x,
+      y: y - height
+    });
   }
   intersects(range) {
     if (super.intersects(range)) {
@@ -258,36 +256,45 @@ class Links {
 
 
 function getLinkDistance(pos1, pos2, optDistance, canvasSize, warp) {
-  let distance = (0,engine_root_window_.getDistance)(pos1, pos2);
+  const {
+    dx,
+    dy,
+    distance
+  } = (0,engine_root_window_.getDistances)(pos1, pos2);
   if (!warp || distance <= optDistance) {
     return distance;
   }
-  const pos2NE = {
-    x: pos2.x - canvasSize.width,
-    y: pos2.y
-  };
-  distance = (0,engine_root_window_.getDistance)(pos1, pos2NE);
-  if (distance <= optDistance) {
-    return distance;
-  }
-  const pos2SE = {
-    x: pos2.x - canvasSize.width,
-    y: pos2.y - canvasSize.height
-  };
-  distance = (0,engine_root_window_.getDistance)(pos1, pos2SE);
-  if (distance <= optDistance) {
-    return distance;
-  }
-  const pos2SW = {
-    x: pos2.x,
-    y: pos2.y - canvasSize.height
-  };
-  distance = (0,engine_root_window_.getDistance)(pos1, pos2SW);
-  return distance;
+  const absDiffs = {
+      x: Math.abs(dx),
+      y: Math.abs(dy)
+    },
+    warpDistances = {
+      x: Math.min(absDiffs.x, canvasSize.width - absDiffs.x),
+      y: Math.min(absDiffs.y, canvasSize.height - absDiffs.y)
+    };
+  return Math.sqrt(warpDistances.x ** 2 + warpDistances.y ** 2);
 }
 class Linker extends engine_root_window_.ParticlesInteractorBase {
   constructor(container) {
     super(container);
+    this._setColor = p1 => {
+      if (!p1.options.links) {
+        return;
+      }
+      const container = this.linkContainer,
+        linksOptions = p1.options.links;
+      let linkColor = linksOptions.id === undefined ? container.particles.linksColor : container.particles.linksColors.get(linksOptions.id);
+      if (linkColor) {
+        return;
+      }
+      const optColor = linksOptions.color;
+      linkColor = (0,engine_root_window_.getLinkRandomColor)(optColor, linksOptions.blink, linksOptions.consent);
+      if (linksOptions.id === undefined) {
+        container.particles.linksColor = linkColor;
+      } else {
+        container.particles.linksColors.set(linksOptions.id, linkColor);
+      }
+    };
     this.linkContainer = container;
   }
   clear() {}
@@ -296,7 +303,6 @@ class Linker extends engine_root_window_.ParticlesInteractorBase {
     this.linkContainer.particles.linksColors = new Map();
   }
   async interact(p1) {
-    var _a;
     if (!p1.options.links) {
       return;
     }
@@ -309,13 +315,13 @@ class Linker extends engine_root_window_.ParticlesInteractorBase {
     }
     const linkOpt1 = p1.options.links,
       optOpacity = linkOpt1.opacity,
-      optDistance = (_a = p1.retina.linksDistance) !== null && _a !== void 0 ? _a : 0,
+      optDistance = p1.retina.linksDistance ?? 0,
       warp = linkOpt1.warp,
       range = warp ? new CircleWarp(pos1.x, pos1.y, optDistance, canvasSize) : new engine_root_window_.Circle(pos1.x, pos1.y, optDistance),
       query = container.particles.quadTree.query(range);
     for (const p2 of query) {
       const linkOpt2 = p2.options.links;
-      if (p1 === p2 || !(linkOpt2 === null || linkOpt2 === void 0 ? void 0 : linkOpt2.enable) || linkOpt1.id !== linkOpt2.id || p2.spawning || p2.destroyed || !p2.links || p1.links.map(t => t.destination).indexOf(p2) !== -1 || p2.links.map(t => t.destination).indexOf(p1) !== -1) {
+      if (p1 === p2 || !linkOpt2?.enable || linkOpt1.id !== linkOpt2.id || p2.spawning || p2.destroyed || !p2.links || p1.links.some(t => t.destination === p2) || p2.links.some(t => t.destination === p1)) {
         continue;
       }
       const pos2 = p2.getPosition();
@@ -324,10 +330,10 @@ class Linker extends engine_root_window_.ParticlesInteractorBase {
       }
       const distance = getLinkDistance(pos1, pos2, optDistance, canvasSize, warp && linkOpt2.warp);
       if (distance > optDistance) {
-        return;
+        continue;
       }
       const opacityLine = (1 - distance / optDistance) * optOpacity;
-      this.setColor(p1);
+      this._setColor(p1);
       p1.links.push({
         destination: p2,
         opacity: opacityLine
@@ -335,51 +341,43 @@ class Linker extends engine_root_window_.ParticlesInteractorBase {
     }
   }
   isEnabled(particle) {
-    var _a;
-    return !!((_a = particle.options.links) === null || _a === void 0 ? void 0 : _a.enable);
+    return !!particle.options.links?.enable;
   }
   loadParticlesOptions(options, ...sources) {
-    var _a, _b;
     if (!options.links) {
       options.links = new Links();
     }
     for (const source of sources) {
-      options.links.load((_b = (_a = source === null || source === void 0 ? void 0 : source.links) !== null && _a !== void 0 ? _a : source === null || source === void 0 ? void 0 : source.lineLinked) !== null && _b !== void 0 ? _b : source === null || source === void 0 ? void 0 : source.line_linked);
+      options.links.load(source?.links ?? source?.lineLinked ?? source?.line_linked);
     }
   }
   reset() {}
-  setColor(p1) {
-    if (!p1.options.links) {
-      return;
-    }
-    const container = this.linkContainer,
-      linksOptions = p1.options.links;
-    let linkColor = linksOptions.id === undefined ? container.particles.linksColor : container.particles.linksColors.get(linksOptions.id);
-    if (linkColor) {
-      return;
-    }
-    const optColor = linksOptions.color;
-    linkColor = (0,engine_root_window_.getLinkRandomColor)(optColor, linksOptions.blink, linksOptions.consent);
-    if (linksOptions.id === undefined) {
-      container.particles.linksColor = linkColor;
-    } else {
-      container.particles.linksColors.set(linksOptions.id, linkColor);
-    }
-  }
 }
 ;// CONCATENATED MODULE: ./dist/browser/interaction.js
 
-async function loadInteraction(engine) {
-  await engine.addInteractor("particlesLinks", container => new Linker(container));
+async function loadLinksInteraction(engine, refresh = true) {
+  await engine.addInteractor("particlesLinks", container => new Linker(container), refresh);
 }
 ;// CONCATENATED MODULE: ./dist/browser/Utils.js
 
-function drawLinkLine(context, width, begin, end, maxDistance, canvasSize, warp, backgroundMask, composite, colorLine, opacity, shadow) {
+function drawLinkLine(params) {
   let drawn = false;
+  const {
+    begin,
+    end,
+    maxDistance,
+    context,
+    canvasSize,
+    width,
+    backgroundMask,
+    colorLine,
+    opacity,
+    links
+  } = params;
   if ((0,engine_root_window_.getDistance)(begin, end) <= maxDistance) {
     (0,engine_root_window_.drawLine)(context, begin, end);
     drawn = true;
-  } else if (warp) {
+  } else if (links.warp) {
     let pi1;
     let pi2;
     const endNE = {
@@ -444,10 +442,13 @@ function drawLinkLine(context, width, begin, end, maxDistance, canvasSize, warp,
     return;
   }
   context.lineWidth = width;
-  if (backgroundMask) {
-    context.globalCompositeOperation = composite;
+  if (backgroundMask.enable) {
+    context.globalCompositeOperation = backgroundMask.composite;
   }
   context.strokeStyle = (0,engine_root_window_.getStyleFromRgb)(colorLine, opacity);
+  const {
+    shadow
+  } = links;
   if (shadow.enable) {
     const shadowColor = (0,engine_root_window_.rangeColorToRgb)(shadow.color);
     if (shadowColor) {
@@ -457,17 +458,23 @@ function drawLinkLine(context, width, begin, end, maxDistance, canvasSize, warp,
   }
   context.stroke();
 }
-function drawLinkTriangle(context, pos1, pos2, pos3, backgroundMask, composite, colorTriangle, opacityTriangle) {
+function drawLinkTriangle(params) {
+  const {
+    context,
+    pos1,
+    pos2,
+    pos3,
+    backgroundMask,
+    colorTriangle,
+    opacityTriangle
+  } = params;
   (0,engine_root_window_.drawTriangle)(context, pos1, pos2, pos3);
-  if (backgroundMask) {
-    context.globalCompositeOperation = composite;
+  if (backgroundMask.enable) {
+    context.globalCompositeOperation = backgroundMask.composite;
   }
   context.fillStyle = (0,engine_root_window_.getStyleFromRgb)(colorTriangle, opacityTriangle);
   context.fill();
 }
-;// CONCATENATED MODULE: ./dist/browser/LinkInstance.js
-
-
 function getLinkKey(ids) {
   ids.sort((a, b) => a - b);
   return ids.join("_");
@@ -481,25 +488,150 @@ function setLinkFrequency(particles, dictionary) {
   }
   return res;
 }
+;// CONCATENATED MODULE: ./dist/browser/LinkInstance.js
+
+
 class LinkInstance {
   constructor(container) {
     this.container = container;
+    this._drawLinkLine = (p1, link) => {
+      const p1LinksOptions = p1.options.links;
+      if (!p1LinksOptions?.enable) {
+        return;
+      }
+      const container = this.container,
+        options = container.actualOptions,
+        p2 = link.destination,
+        pos1 = p1.getPosition(),
+        pos2 = p2.getPosition();
+      let opacity = link.opacity;
+      container.canvas.draw(ctx => {
+        let colorLine;
+        const twinkle = p1.options.twinkle?.lines;
+        if (twinkle?.enable) {
+          const twinkleFreq = twinkle.frequency,
+            twinkleRgb = (0,engine_root_window_.rangeColorToRgb)(twinkle.color),
+            twinkling = (0,engine_root_window_.getRandom)() < twinkleFreq;
+          if (twinkling && twinkleRgb) {
+            colorLine = twinkleRgb;
+            opacity = (0,engine_root_window_.getRangeValue)(twinkle.opacity);
+          }
+        }
+        if (!colorLine) {
+          const linkColor = p1LinksOptions.id !== undefined ? container.particles.linksColors.get(p1LinksOptions.id) : container.particles.linksColor;
+          colorLine = (0,engine_root_window_.getLinkColor)(p1, p2, linkColor);
+        }
+        if (!colorLine) {
+          return;
+        }
+        const width = p1.retina.linksWidth ?? 0,
+          maxDistance = p1.retina.linksDistance ?? 0,
+          {
+            backgroundMask
+          } = options;
+        drawLinkLine({
+          context: ctx,
+          width,
+          begin: pos1,
+          end: pos2,
+          maxDistance,
+          canvasSize: container.canvas.size,
+          links: p1LinksOptions,
+          backgroundMask: backgroundMask,
+          colorLine,
+          opacity
+        });
+      });
+    };
+    this._drawLinkTriangle = (p1, link1, link2) => {
+      const linksOptions = p1.options.links;
+      if (!linksOptions?.enable) {
+        return;
+      }
+      const triangleOptions = linksOptions.triangles;
+      if (!triangleOptions.enable) {
+        return;
+      }
+      const container = this.container,
+        options = container.actualOptions,
+        p2 = link1.destination,
+        p3 = link2.destination,
+        opacityTriangle = triangleOptions.opacity ?? (link1.opacity + link2.opacity) / 2;
+      if (opacityTriangle <= 0) {
+        return;
+      }
+      container.canvas.draw(ctx => {
+        const pos1 = p1.getPosition(),
+          pos2 = p2.getPosition(),
+          pos3 = p3.getPosition(),
+          linksDistance = p1.retina.linksDistance ?? 0;
+        if ((0,engine_root_window_.getDistance)(pos1, pos2) > linksDistance || (0,engine_root_window_.getDistance)(pos3, pos2) > linksDistance || (0,engine_root_window_.getDistance)(pos3, pos1) > linksDistance) {
+          return;
+        }
+        let colorTriangle = (0,engine_root_window_.rangeColorToRgb)(triangleOptions.color);
+        if (!colorTriangle) {
+          const linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
+          colorTriangle = (0,engine_root_window_.getLinkColor)(p1, p2, linkColor);
+        }
+        if (!colorTriangle) {
+          return;
+        }
+        drawLinkTriangle({
+          context: ctx,
+          pos1,
+          pos2,
+          pos3,
+          backgroundMask: options.backgroundMask,
+          colorTriangle,
+          opacityTriangle
+        });
+      });
+    };
+    this._drawTriangles = (options, p1, link, p1Links) => {
+      const p2 = link.destination;
+      if (!(options.links?.triangles.enable && p2.options.links?.triangles.enable)) {
+        return;
+      }
+      const vertices = p2.links?.filter(t => {
+        const linkFreq = this._getLinkFrequency(p2, t.destination);
+        return p2.options.links && linkFreq <= p2.options.links.frequency && p1Links.findIndex(l => l.destination === t.destination) >= 0;
+      });
+      if (!vertices?.length) {
+        return;
+      }
+      for (const vertex of vertices) {
+        const p3 = vertex.destination,
+          triangleFreq = this._getTriangleFrequency(p1, p2, p3);
+        if (triangleFreq > options.links.triangles.frequency) {
+          continue;
+        }
+        this._drawLinkTriangle(p1, link, vertex);
+      }
+    };
+    this._getLinkFrequency = (p1, p2) => {
+      return setLinkFrequency([p1, p2], this._freqs.links);
+    };
+    this._getTriangleFrequency = (p1, p2, p3) => {
+      return setLinkFrequency([p1, p2, p3], this._freqs.triangles);
+    };
     this._freqs = {
       links: new Map(),
       triangles: new Map()
     };
   }
   drawParticle(context, particle) {
-    var _a;
-    const pOptions = particle.options;
-    if (!particle.links || particle.links.length <= 0) {
+    const {
+      links,
+      options
+    } = particle;
+    if (!links || links.length <= 0) {
       return;
     }
-    const p1Links = particle.links.filter(l => pOptions.links && this.getLinkFrequency(particle, l.destination) <= pOptions.links.frequency);
+    const p1Links = links.filter(l => options.links && this._getLinkFrequency(particle, l.destination) <= options.links.frequency);
     for (const link of p1Links) {
-      this.drawTriangles(pOptions, particle, link, p1Links);
-      if (link.opacity > 0 && ((_a = particle.retina.linksWidth) !== null && _a !== void 0 ? _a : 0) > 0) {
-        this.drawLinkLine(particle, link);
+      this._drawTriangles(options, particle, link, p1Links);
+      if (link.opacity > 0 && (particle.retina.linksWidth ?? 0) > 0) {
+        this._drawLinkLine(particle, link);
       }
     }
   }
@@ -512,112 +644,20 @@ class LinkInstance {
     if (!particle.options.links) {
       return;
     }
-    const ratio = this.container.retina.pixelRatio;
-    particle.retina.linksDistance = particle.options.links.distance * ratio;
-    particle.retina.linksWidth = particle.options.links.width * ratio;
+    const ratio = this.container.retina.pixelRatio,
+      {
+        retina
+      } = particle,
+      {
+        distance,
+        width
+      } = particle.options.links;
+    retina.linksDistance = distance * ratio;
+    retina.linksWidth = width * ratio;
   }
   particleDestroyed(particle) {
     particle.links = [];
   }
-  drawLinkLine(p1, link) {
-    const container = this.container,
-      options = container.actualOptions,
-      p2 = link.destination,
-      pos1 = p1.getPosition(),
-      pos2 = p2.getPosition();
-    let opacity = link.opacity;
-    container.canvas.draw(ctx => {
-      var _a, _b, _c;
-      if (!p1.options.links) {
-        return;
-      }
-      let colorLine;
-      const twinkle = (_a = p1.options.twinkle) === null || _a === void 0 ? void 0 : _a.lines;
-      if (twinkle === null || twinkle === void 0 ? void 0 : twinkle.enable) {
-        const twinkleFreq = twinkle.frequency,
-          twinkleRgb = (0,engine_root_window_.rangeColorToRgb)(twinkle.color),
-          twinkling = (0,engine_root_window_.getRandom)() < twinkleFreq;
-        if (twinkling && twinkleRgb) {
-          colorLine = twinkleRgb;
-          opacity = (0,engine_root_window_.getRangeValue)(twinkle.opacity);
-        }
-      }
-      if (!colorLine) {
-        const linksOptions = p1.options.links,
-          linkColor = (linksOptions === null || linksOptions === void 0 ? void 0 : linksOptions.id) !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
-        colorLine = (0,engine_root_window_.getLinkColor)(p1, p2, linkColor);
-      }
-      if (!colorLine) {
-        return;
-      }
-      const width = (_b = p1.retina.linksWidth) !== null && _b !== void 0 ? _b : 0,
-        maxDistance = (_c = p1.retina.linksDistance) !== null && _c !== void 0 ? _c : 0;
-      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);
-    });
-  }
-  drawLinkTriangle(p1, link1, link2) {
-    var _a;
-    if (!p1.options.links) {
-      return;
-    }
-    const container = this.container,
-      options = container.actualOptions,
-      p2 = link1.destination,
-      p3 = link2.destination,
-      triangleOptions = p1.options.links.triangles,
-      opacityTriangle = (_a = triangleOptions.opacity) !== null && _a !== void 0 ? _a : (link1.opacity + link2.opacity) / 2;
-    if (opacityTriangle <= 0) {
-      return;
-    }
-    container.canvas.draw(ctx => {
-      var _a;
-      const pos1 = p1.getPosition(),
-        pos2 = p2.getPosition(),
-        pos3 = p3.getPosition(),
-        linksDistance = (_a = p1.retina.linksDistance) !== null && _a !== void 0 ? _a : 0;
-      if ((0,engine_root_window_.getDistance)(pos1, pos2) > linksDistance || (0,engine_root_window_.getDistance)(pos3, pos2) > linksDistance || (0,engine_root_window_.getDistance)(pos3, pos1) > linksDistance) {
-        return;
-      }
-      let colorTriangle = (0,engine_root_window_.rangeColorToRgb)(triangleOptions.color);
-      if (!colorTriangle) {
-        const linksOptions = p1.options.links,
-          linkColor = (linksOptions === null || linksOptions === void 0 ? void 0 : linksOptions.id) !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;
-        colorTriangle = (0,engine_root_window_.getLinkColor)(p1, p2, linkColor);
-      }
-      if (!colorTriangle) {
-        return;
-      }
-      drawLinkTriangle(ctx, pos1, pos2, pos3, options.backgroundMask.enable, options.backgroundMask.composite, colorTriangle, opacityTriangle);
-    });
-  }
-  drawTriangles(options, p1, link, p1Links) {
-    var _a, _b, _c;
-    const p2 = link.destination;
-    if (!(((_a = options.links) === null || _a === void 0 ? void 0 : _a.triangles.enable) && ((_b = p2.options.links) === null || _b === void 0 ? void 0 : _b.triangles.enable))) {
-      return;
-    }
-    const vertices = (_c = p2.links) === null || _c === void 0 ? void 0 : _c.filter(t => {
-      const linkFreq = this.getLinkFrequency(p2, t.destination);
-      return p2.options.links && linkFreq <= p2.options.links.frequency && p1Links.findIndex(l => l.destination === t.destination) >= 0;
-    });
-    if (!(vertices === null || vertices === void 0 ? void 0 : vertices.length)) {
-      return;
-    }
-    for (const vertex of vertices) {
-      const p3 = vertex.destination,
-        triangleFreq = this.getTriangleFrequency(p1, p2, p3);
-      if (triangleFreq > options.links.triangles.frequency) {
-        continue;
-      }
-      this.drawLinkTriangle(p1, link, vertex);
-    }
-  }
-  getLinkFrequency(p1, p2) {
-    return setLinkFrequency([p1, p2], this._freqs.links);
-  }
-  getTriangleFrequency(p1, p2, p3) {
-    return setLinkFrequency([p1, p2, p3], this._freqs.triangles);
-  }
 }
 ;// CONCATENATED MODULE: ./dist/browser/plugin.js
 
@@ -633,16 +673,16 @@ class LinksPlugin {
     return true;
   }
 }
-async function loadPlugin(engine) {
+async function loadLinksPlugin(engine, refresh = true) {
   const plugin = new LinksPlugin();
-  await engine.addPlugin(plugin);
+  await engine.addPlugin(plugin, refresh);
 }
 ;// CONCATENATED MODULE: ./dist/browser/index.js
 
 
-async function loadParticlesLinksInteraction(engine) {
-  await loadInteraction(engine);
-  await loadPlugin(engine);
+async function loadParticlesLinksInteraction(engine, refresh = true) {
+  await loadLinksInteraction(engine, refresh);
+  await loadLinksPlugin(engine, refresh);
 }
 
 

package/tsparticles.interaction.particles.links.min.js

@@ -1,2 +1,2 @@
 /*! For license information please see tsparticles.interaction.particles.links.min.js.LICENSE.txt */
-!function(i,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var n="object"==typeof exports?t(require("@tsparticles/engine")):t(i.window);for(var e in n)("object"==typeof exports?exports:i)[e]=n[e]}}(this,(i=>(()=>{"use strict";var t={533:t=>{t.exports=i}},n={};function e(i){var s=n[i];if(void 0!==s)return s.exports;var o=n[i]={exports:{}};return t[i](o,o.exports,e),o.exports}e.d=(i,t)=>{for(var n in t)e.o(t,n)&&!e.o(i,n)&&Object.defineProperty(i,n,{enumerable:!0,get:t[n]})},e.o=(i,t)=>Object.prototype.hasOwnProperty.call(i,t),e.r=i=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(i,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(i,"__esModule",{value:!0})};var s={};return(()=>{e.r(s),e.d(s,{Links:()=>r,LinksShadow:()=>n,LinksTriangle:()=>o,loadParticlesLinksInteraction:()=>h});var i=e(533);class t extends i.Circle{constructor(i,t,n,e){super(i,t,n),this.canvasSize=e,this.canvasSize=Object.assign({},e)}contains(i){if(super.contains(i))return!0;const t={x:i.x-this.canvasSize.width,y:i.y};if(super.contains(t))return!0;const n={x:i.x-this.canvasSize.width,y:i.y-this.canvasSize.height};if(super.contains(n))return!0;const e={x:i.x,y:i.y-this.canvasSize.height};return super.contains(e)}intersects(t){if(super.intersects(t))return!0;const n=t,e=t,s={x:t.position.x-this.canvasSize.width,y:t.position.y-this.canvasSize.height};if(void 0!==e.radius){const t=new i.Circle(s.x,s.y,2*e.radius);return super.intersects(t)}if(void 0!==n.size){const t=new i.Rectangle(s.x,s.y,2*n.size.width,2*n.size.height);return super.intersects(t)}return!1}}class n{constructor(){this.blur=5,this.color=new i.OptionsColor,this.color.value="#000",this.enable=!1}load(t){t&&(void 0!==t.blur&&(this.blur=t.blur),this.color=i.OptionsColor.create(this.color,t.color),void 0!==t.enable&&(this.enable=t.enable))}}class o{constructor(){this.enable=!1,this.frequency=1}load(t){t&&(void 0!==t.color&&(this.color=i.OptionsColor.create(this.color,t.color)),void 0!==t.enable&&(this.enable=t.enable),void 0!==t.frequency&&(this.frequency=t.frequency),void 0!==t.opacity&&(this.opacity=t.opacity))}}class r{constructor(){this.blink=!1,this.color=new i.OptionsColor,this.color.value="#fff",this.consent=!1,this.distance=100,this.enable=!1,this.frequency=1,this.opacity=1,this.shadow=new n,this.triangles=new o,this.width=1,this.warp=!1}load(t){t&&(void 0!==t.id&&(this.id=t.id),void 0!==t.blink&&(this.blink=t.blink),this.color=i.OptionsColor.create(this.color,t.color),void 0!==t.consent&&(this.consent=t.consent),void 0!==t.distance&&(this.distance=t.distance),void 0!==t.enable&&(this.enable=t.enable),void 0!==t.frequency&&(this.frequency=t.frequency),void 0!==t.opacity&&(this.opacity=t.opacity),this.shadow.load(t.shadow),this.triangles.load(t.triangles),void 0!==t.width&&(this.width=t.width),void 0!==t.warp&&(this.warp=t.warp))}}function l(t,n,e,s,o){let r=(0,i.getDistance)(t,n);if(!o||r<=e)return r;const l={x:n.x-s.width,y:n.y};if(r=(0,i.getDistance)(t,l),r<=e)return r;const a={x:n.x-s.width,y:n.y-s.height};if(r=(0,i.getDistance)(t,a),r<=e)return r;const c={x:n.x,y:n.y-s.height};return r=(0,i.getDistance)(t,c),r}class a extends i.ParticlesInteractorBase{constructor(i){super(i),this.linkContainer=i}clear(){}init(){this.linkContainer.particles.linksColor=void 0,this.linkContainer.particles.linksColors=new Map}async interact(n){var e;if(!n.options.links)return;n.links=[];const s=n.getPosition(),o=this.container,r=o.canvas.size;if(s.x<0||s.y<0||s.x>r.width||s.y>r.height)return;const a=n.options.links,c=a.opacity,d=null!==(e=n.retina.linksDistance)&&void 0!==e?e:0,u=a.warp,h=u?new t(s.x,s.y,d,r):new i.Circle(s.x,s.y,d),p=o.particles.quadTree.query(h);for(const i of p){const t=i.options.links;if(n===i||!(null==t?void 0:t.enable)||a.id!==t.id||i.spawning||i.destroyed||!i.links||-1!==n.links.map((i=>i.destination)).indexOf(i)||-1!==i.links.map((i=>i.destination)).indexOf(n))continue;const e=i.getPosition();if(e.x<0||e.y<0||e.x>r.width||e.y>r.height)continue;const o=l(s,e,d,r,u&&t.warp);if(o>d)return;const h=(1-o/d)*c;this.setColor(n),n.links.push({destination:i,opacity:h})}}isEnabled(i){var t;return!!(null===(t=i.options.links)||void 0===t?void 0:t.enable)}loadParticlesOptions(i,...t){var n,e;i.links||(i.links=new r);for(const s of t)i.links.load(null!==(e=null!==(n=null==s?void 0:s.links)&&void 0!==n?n:null==s?void 0:s.lineLinked)&&void 0!==e?e:null==s?void 0:s.line_linked)}reset(){}setColor(t){if(!t.options.links)return;const n=this.linkContainer,e=t.options.links;let s=void 0===e.id?n.particles.linksColor:n.particles.linksColors.get(e.id);if(s)return;const o=e.color;s=(0,i.getLinkRandomColor)(o,e.blink,e.consent),void 0===e.id?n.particles.linksColor=s:n.particles.linksColors.set(e.id,s)}}function c(t,n){const e=((s=t.map((i=>i.id))).sort(((i,t)=>i-t)),s.join("_"));var s;let o=n.get(e);return void 0===o&&(o=(0,i.getRandom)(),n.set(e,o)),o}class d{constructor(i){this.container=i,this._freqs={links:new Map,triangles:new Map}}drawParticle(i,t){var n;const e=t.options;if(!t.links||t.links.length<=0)return;const s=t.links.filter((i=>e.links&&this.getLinkFrequency(t,i.destination)<=e.links.frequency));for(const i of s)this.drawTriangles(e,t,i,s),i.opacity>0&&(null!==(n=t.retina.linksWidth)&&void 0!==n?n:0)>0&&this.drawLinkLine(t,i)}async init(){this._freqs.links=new Map,this._freqs.triangles=new Map}particleCreated(i){if(i.links=[],!i.options.links)return;const t=this.container.retina.pixelRatio;i.retina.linksDistance=i.options.links.distance*t,i.retina.linksWidth=i.options.links.width*t}particleDestroyed(i){i.links=[]}drawLinkLine(t,n){const e=this.container,s=e.actualOptions,o=n.destination,r=t.getPosition(),l=o.getPosition();let a=n.opacity;e.canvas.draw((n=>{var c,d,u;if(!t.options.links)return;let h;const p=null===(c=t.options.twinkle)||void 0===c?void 0:c.lines;if(null==p?void 0:p.enable){const t=p.frequency,n=(0,i.rangeColorToRgb)(p.color);(0,i.getRandom)()<t&&n&&(h=n,a=(0,i.getRangeValue)(p.opacity))}if(!h){const n=t.options.links,s=void 0!==(null==n?void 0:n.id)?e.particles.linksColors.get(n.id):e.particles.linksColor;h=(0,i.getLinkColor)(t,o,s)}if(!h)return;const y=null!==(d=t.retina.linksWidth)&&void 0!==d?d:0,g=null!==(u=t.retina.linksDistance)&&void 0!==u?u:0;!function(t,n,e,s,o,r,l,a,c,d,u,h){let p=!1;if((0,i.getDistance)(e,s)<=o)(0,i.drawLine)(t,e,s),p=!0;else if(l){let n,l;const a={x:s.x-r.width,y:s.y},c=(0,i.getDistances)(e,a);if(c.distance<=o){const i=e.y-c.dy/c.dx*e.x;n={x:0,y:i},l={x:r.width,y:i}}else{const t={x:s.x,y:s.y-r.height},a=(0,i.getDistances)(e,t);if(a.distance<=o){const i=-(e.y-a.dy/a.dx*e.x)/(a.dy/a.dx);n={x:i,y:0},l={x:i,y:r.height}}else{const t={x:s.x-r.width,y:s.y-r.height},a=(0,i.getDistances)(e,t);if(a.distance<=o){const i=e.y-a.dy/a.dx*e.x;n={x:-i/(a.dy/a.dx),y:i},l={x:n.x+r.width,y:n.y+r.height}}}}n&&l&&((0,i.drawLine)(t,e,n),(0,i.drawLine)(t,s,l),p=!0)}if(p){if(t.lineWidth=n,a&&(t.globalCompositeOperation=c),t.strokeStyle=(0,i.getStyleFromRgb)(d,u),h.enable){const n=(0,i.rangeColorToRgb)(h.color);n&&(t.shadowBlur=h.blur,t.shadowColor=(0,i.getStyleFromRgb)(n))}t.stroke()}}(n,y,r,l,g,e.canvas.size,t.options.links.warp,s.backgroundMask.enable,s.backgroundMask.composite,h,a,t.options.links.shadow)}))}drawLinkTriangle(t,n,e){var s;if(!t.options.links)return;const o=this.container,r=o.actualOptions,l=n.destination,a=e.destination,c=t.options.links.triangles,d=null!==(s=c.opacity)&&void 0!==s?s:(n.opacity+e.opacity)/2;d<=0||o.canvas.draw((n=>{var e;const s=t.getPosition(),u=l.getPosition(),h=a.getPosition(),p=null!==(e=t.retina.linksDistance)&&void 0!==e?e:0;if((0,i.getDistance)(s,u)>p||(0,i.getDistance)(h,u)>p||(0,i.getDistance)(h,s)>p)return;let y=(0,i.rangeColorToRgb)(c.color);if(!y){const n=t.options.links,e=void 0!==(null==n?void 0:n.id)?o.particles.linksColors.get(n.id):o.particles.linksColor;y=(0,i.getLinkColor)(t,l,e)}y&&function(t,n,e,s,o,r,l,a){(0,i.drawTriangle)(t,n,e,s),o&&(t.globalCompositeOperation=r),t.fillStyle=(0,i.getStyleFromRgb)(l,a),t.fill()}(n,s,u,h,r.backgroundMask.enable,r.backgroundMask.composite,y,d)}))}drawTriangles(i,t,n,e){var s,o,r;const l=n.destination;if(!(null===(s=i.links)||void 0===s?void 0:s.triangles.enable)||!(null===(o=l.options.links)||void 0===o?void 0:o.triangles.enable))return;const a=null===(r=l.links)||void 0===r?void 0:r.filter((i=>{const t=this.getLinkFrequency(l,i.destination);return l.options.links&&t<=l.options.links.frequency&&e.findIndex((t=>t.destination===i.destination))>=0}));if(null==a?void 0:a.length)for(const e of a){const s=e.destination;this.getTriangleFrequency(t,l,s)>i.links.triangles.frequency||this.drawLinkTriangle(t,n,e)}}getLinkFrequency(i,t){return c([i,t],this._freqs.links)}getTriangleFrequency(i,t,n){return c([i,t,n],this._freqs.triangles)}}class u{constructor(){this.id="links"}getPlugin(i){return new d(i)}loadOptions(){}needsPlugin(){return!0}}async function h(i){await async function(i){await i.addInteractor("particlesLinks",(i=>new a(i)))}(i),await async function(i){const t=new u;await i.addPlugin(t)}(i)}})(),s})()));
+!function(i,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var n="object"==typeof exports?t(require("@tsparticles/engine")):t(i.window);for(var e in n)("object"==typeof exports?exports:i)[e]=n[e]}}(this,(i=>(()=>{"use strict";var t={533:t=>{t.exports=i}},n={};function e(i){var s=n[i];if(void 0!==s)return s.exports;var o=n[i]={exports:{}};return t[i](o,o.exports,e),o.exports}e.d=(i,t)=>{for(var n in t)e.o(t,n)&&!e.o(i,n)&&Object.defineProperty(i,n,{enumerable:!0,get:t[n]})},e.o=(i,t)=>Object.prototype.hasOwnProperty.call(i,t),e.r=i=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(i,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(i,"__esModule",{value:!0})};var s={};return(()=>{e.r(s),e.d(s,{Links:()=>r,LinksShadow:()=>n,LinksTriangle:()=>o,loadParticlesLinksInteraction:()=>p});var i=e(533);class t extends i.Circle{constructor(i,t,n,e){super(i,t,n),this.canvasSize=e,this.canvasSize={...e}}contains(i){const{width:t,height:n}=this.canvasSize,{x:e,y:s}=i;return super.contains(i)||super.contains({x:e-t,y:s})||super.contains({x:e-t,y:s-n})||super.contains({x:e,y:s-n})}intersects(t){if(super.intersects(t))return!0;const n=t,e=t,s={x:t.position.x-this.canvasSize.width,y:t.position.y-this.canvasSize.height};if(void 0!==e.radius){const t=new i.Circle(s.x,s.y,2*e.radius);return super.intersects(t)}if(void 0!==n.size){const t=new i.Rectangle(s.x,s.y,2*n.size.width,2*n.size.height);return super.intersects(t)}return!1}}class n{constructor(){this.blur=5,this.color=new i.OptionsColor,this.color.value="#000",this.enable=!1}load(t){t&&(void 0!==t.blur&&(this.blur=t.blur),this.color=i.OptionsColor.create(this.color,t.color),void 0!==t.enable&&(this.enable=t.enable))}}class o{constructor(){this.enable=!1,this.frequency=1}load(t){t&&(void 0!==t.color&&(this.color=i.OptionsColor.create(this.color,t.color)),void 0!==t.enable&&(this.enable=t.enable),void 0!==t.frequency&&(this.frequency=t.frequency),void 0!==t.opacity&&(this.opacity=t.opacity))}}class r{constructor(){this.blink=!1,this.color=new i.OptionsColor,this.color.value="#fff",this.consent=!1,this.distance=100,this.enable=!1,this.frequency=1,this.opacity=1,this.shadow=new n,this.triangles=new o,this.width=1,this.warp=!1}load(t){t&&(void 0!==t.id&&(this.id=t.id),void 0!==t.blink&&(this.blink=t.blink),this.color=i.OptionsColor.create(this.color,t.color),void 0!==t.consent&&(this.consent=t.consent),void 0!==t.distance&&(this.distance=t.distance),void 0!==t.enable&&(this.enable=t.enable),void 0!==t.frequency&&(this.frequency=t.frequency),void 0!==t.opacity&&(this.opacity=t.opacity),this.shadow.load(t.shadow),this.triangles.load(t.triangles),void 0!==t.width&&(this.width=t.width),void 0!==t.warp&&(this.warp=t.warp))}}function a(t,n,e,s,o){const{dx:r,dy:a,distance:l}=(0,i.getDistances)(t,n);if(!o||l<=e)return l;const c={x:Math.abs(r),y:Math.abs(a)},d=Math.min(c.x,s.width-c.x),h=Math.min(c.y,s.height-c.y);return Math.sqrt(d**2+h**2)}class l extends i.ParticlesInteractorBase{constructor(t){super(t),this._setColor=t=>{if(!t.options.links)return;const n=this.linkContainer,e=t.options.links;let s=void 0===e.id?n.particles.linksColor:n.particles.linksColors.get(e.id);if(s)return;const o=e.color;s=(0,i.getLinkRandomColor)(o,e.blink,e.consent),void 0===e.id?n.particles.linksColor=s:n.particles.linksColors.set(e.id,s)},this.linkContainer=t}clear(){}init(){this.linkContainer.particles.linksColor=void 0,this.linkContainer.particles.linksColors=new Map}async interact(n){if(!n.options.links)return;n.links=[];const e=n.getPosition(),s=this.container,o=s.canvas.size;if(e.x<0||e.y<0||e.x>o.width||e.y>o.height)return;const r=n.options.links,l=r.opacity,c=n.retina.linksDistance??0,d=r.warp,h=d?new t(e.x,e.y,c,o):new i.Circle(e.x,e.y,c),p=s.particles.quadTree.query(h);for(const i of p){const t=i.options.links;if(n===i||!t?.enable||r.id!==t.id||i.spawning||i.destroyed||!i.links||n.links.some((t=>t.destination===i))||i.links.some((i=>i.destination===n)))continue;const s=i.getPosition();if(s.x<0||s.y<0||s.x>o.width||s.y>o.height)continue;const h=a(e,s,c,o,d&&t.warp);if(h>c)continue;const p=(1-h/c)*l;this._setColor(n),n.links.push({destination:i,opacity:p})}}isEnabled(i){return!!i.options.links?.enable}loadParticlesOptions(i,...t){i.links||(i.links=new r);for(const n of t)i.links.load(n?.links??n?.lineLinked??n?.line_linked)}reset(){}}function c(t,n){const e=((s=t.map((i=>i.id))).sort(((i,t)=>i-t)),s.join("_"));var s;let o=n.get(e);return void 0===o&&(o=(0,i.getRandom)(),n.set(e,o)),o}class d{constructor(t){this.container=t,this._drawLinkLine=(t,n)=>{const e=t.options.links;if(!e?.enable)return;const s=this.container,o=s.actualOptions,r=n.destination,a=t.getPosition(),l=r.getPosition();let c=n.opacity;s.canvas.draw((n=>{let d;const h=t.options.twinkle?.lines;if(h?.enable){const t=h.frequency,n=(0,i.rangeColorToRgb)(h.color);(0,i.getRandom)()<t&&n&&(d=n,c=(0,i.getRangeValue)(h.opacity))}if(!d){const n=void 0!==e.id?s.particles.linksColors.get(e.id):s.particles.linksColor;d=(0,i.getLinkColor)(t,r,n)}if(!d)return;const p=t.retina.linksWidth??0,u=t.retina.linksDistance??0,{backgroundMask:y}=o;!function(t){let n=!1;const{begin:e,end:s,maxDistance:o,context:r,canvasSize:a,width:l,backgroundMask:c,colorLine:d,opacity:h,links:p}=t;if((0,i.getDistance)(e,s)<=o)(0,i.drawLine)(r,e,s),n=!0;else if(p.warp){let t,l;const c={x:s.x-a.width,y:s.y},d=(0,i.getDistances)(e,c);if(d.distance<=o){const i=e.y-d.dy/d.dx*e.x;t={x:0,y:i},l={x:a.width,y:i}}else{const n={x:s.x,y:s.y-a.height},r=(0,i.getDistances)(e,n);if(r.distance<=o){const i=-(e.y-r.dy/r.dx*e.x)/(r.dy/r.dx);t={x:i,y:0},l={x:i,y:a.height}}else{const n={x:s.x-a.width,y:s.y-a.height},r=(0,i.getDistances)(e,n);if(r.distance<=o){const i=e.y-r.dy/r.dx*e.x;t={x:-i/(r.dy/r.dx),y:i},l={x:t.x+a.width,y:t.y+a.height}}}}t&&l&&((0,i.drawLine)(r,e,t),(0,i.drawLine)(r,s,l),n=!0)}if(!n)return;r.lineWidth=l,c.enable&&(r.globalCompositeOperation=c.composite),r.strokeStyle=(0,i.getStyleFromRgb)(d,h);const{shadow:u}=p;if(u.enable){const t=(0,i.rangeColorToRgb)(u.color);t&&(r.shadowBlur=u.blur,r.shadowColor=(0,i.getStyleFromRgb)(t))}r.stroke()}({context:n,width:p,begin:a,end:l,maxDistance:u,canvasSize:s.canvas.size,links:e,backgroundMask:y,colorLine:d,opacity:c})}))},this._drawLinkTriangle=(t,n,e)=>{const s=t.options.links;if(!s?.enable)return;const o=s.triangles;if(!o.enable)return;const r=this.container,a=r.actualOptions,l=n.destination,c=e.destination,d=o.opacity??(n.opacity+e.opacity)/2;d<=0||r.canvas.draw((n=>{const e=t.getPosition(),h=l.getPosition(),p=c.getPosition(),u=t.retina.linksDistance??0;if((0,i.getDistance)(e,h)>u||(0,i.getDistance)(p,h)>u||(0,i.getDistance)(p,e)>u)return;let y=(0,i.rangeColorToRgb)(o.color);if(!y){const n=void 0!==s.id?r.particles.linksColors.get(s.id):r.particles.linksColor;y=(0,i.getLinkColor)(t,l,n)}y&&function(t){const{context:n,pos1:e,pos2:s,pos3:o,backgroundMask:r,colorTriangle:a,opacityTriangle:l}=t;(0,i.drawTriangle)(n,e,s,o),r.enable&&(n.globalCompositeOperation=r.composite),n.fillStyle=(0,i.getStyleFromRgb)(a,l),n.fill()}({context:n,pos1:e,pos2:h,pos3:p,backgroundMask:a.backgroundMask,colorTriangle:y,opacityTriangle:d})}))},this._drawTriangles=(i,t,n,e)=>{const s=n.destination;if(!i.links?.triangles.enable||!s.options.links?.triangles.enable)return;const o=s.links?.filter((i=>{const t=this._getLinkFrequency(s,i.destination);return s.options.links&&t<=s.options.links.frequency&&e.findIndex((t=>t.destination===i.destination))>=0}));if(o?.length)for(const e of o){const o=e.destination;this._getTriangleFrequency(t,s,o)>i.links.triangles.frequency||this._drawLinkTriangle(t,n,e)}},this._getLinkFrequency=(i,t)=>c([i,t],this._freqs.links),this._getTriangleFrequency=(i,t,n)=>c([i,t,n],this._freqs.triangles),this._freqs={links:new Map,triangles:new Map}}drawParticle(i,t){const{links:n,options:e}=t;if(!n||n.length<=0)return;const s=n.filter((i=>e.links&&this._getLinkFrequency(t,i.destination)<=e.links.frequency));for(const i of s)this._drawTriangles(e,t,i,s),i.opacity>0&&(t.retina.linksWidth??0)>0&&this._drawLinkLine(t,i)}async init(){this._freqs.links=new Map,this._freqs.triangles=new Map}particleCreated(i){if(i.links=[],!i.options.links)return;const t=this.container.retina.pixelRatio,{retina:n}=i,{distance:e,width:s}=i.options.links;n.linksDistance=e*t,n.linksWidth=s*t}particleDestroyed(i){i.links=[]}}class h{constructor(){this.id="links"}getPlugin(i){return new d(i)}loadOptions(){}needsPlugin(){return!0}}async function p(i,t=!0){await async function(i,t=!0){await i.addInteractor("particlesLinks",(i=>new l(i)),t)}(i,t),await async function(i,t=!0){const n=new h;await i.addPlugin(n,t)}(i,t)}})(),s})()));

package/tsparticles.interaction.particles.links.min.js.LICENSE.txt

@@ -1,8 +1 @@
-/*!
- * Author : Matteo Bruni
- * MIT license: https://opensource.org/licenses/MIT
- * Demo / Generator : https://particles.js.org/
- * GitHub : https://www.github.com/matteobruni/tsparticles
- * How to use? : Check the GitHub README
- * v3.0.0-alpha.0
- */
+/*! tsParticles Links Particles Interaction v3.0.0-beta.0 by Matteo Bruni */

package/types/CircleWarp.d.ts

@@ -1,5 +1,4 @@
-import { Circle } from "@tsparticles/engine";
-import type { ICoordinates, IDimension, Range } from "@tsparticles/engine";
+import { Circle, type ICoordinates, type IDimension, type Range } from "@tsparticles/engine";
 export declare class CircleWarp extends Circle {
     private readonly canvasSize;
     constructor(x: number, y: number, radius: number, canvasSize: IDimension);