@tsparticles/interaction-particles-links 3.2.1 → 3.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/33.min.js +2 -0
- package/33.min.js.LICENSE.txt +1 -0
- package/38.min.js +2 -0
- package/38.min.js.LICENSE.txt +1 -0
- package/572.min.js +2 -0
- package/572.min.js.LICENSE.txt +1 -0
- package/905.min.js +2 -0
- package/905.min.js.LICENSE.txt +1 -0
- package/958.min.js +2 -0
- package/958.min.js.LICENSE.txt +1 -0
- package/browser/CircleWarp.js +1 -2
- package/browser/LinkInstance.js +5 -4
- package/browser/Linker.js +2 -2
- package/browser/LinksPlugin.js +14 -0
- package/browser/index.js +1 -2
- package/browser/plugin.js +1 -15
- package/cjs/CircleWarp.js +1 -2
- package/cjs/LinkInstance.js +5 -4
- package/cjs/Linker.js +3 -26
- package/cjs/LinksPlugin.js +18 -0
- package/cjs/index.js +3 -4
- package/cjs/interaction.js +1 -24
- package/cjs/plugin.js +1 -38
- package/dist_browser_LinkInstance_js.js +2 -2
- package/dist_browser_Linker_js.js +12 -2
- package/dist_browser_LinksPlugin_js.js +30 -0
- package/dist_browser_interaction_js.js +30 -0
- package/dist_browser_plugin_js.js +30 -0
- package/esm/CircleWarp.js +1 -2
- package/esm/LinkInstance.js +5 -4
- package/esm/Linker.js +2 -2
- package/esm/LinksPlugin.js +14 -0
- package/esm/index.js +1 -2
- package/esm/plugin.js +1 -15
- package/package.json +2 -2
- package/report.html +1 -1
- package/tsparticles.interaction.particles.links.js +3 -23
- package/tsparticles.interaction.particles.links.min.js +1 -1
- package/tsparticles.interaction.particles.links.min.js.LICENSE.txt +1 -1
- package/types/CircleWarp.d.ts +2 -2
- package/types/LinkInstance.d.ts +1 -1
- package/types/Linker.d.ts +1 -1
- package/types/LinksPlugin.d.ts +10 -0
- package/umd/CircleWarp.js +1 -2
- package/umd/LinkInstance.js +5 -4
- package/umd/Linker.js +4 -28
- package/umd/LinksPlugin.js +52 -0
- package/umd/index.js +17 -5
- package/umd/plugin.js +1 -15
- package/356.min.js +0 -2
- package/356.min.js.LICENSE.txt +0 -1
- package/806.min.js +0 -2
- package/806.min.js.LICENSE.txt +0 -1
- package/838.min.js +0 -2
- package/838.min.js.LICENSE.txt +0 -1
- package/dist_browser_CircleWarp_js.js +0 -30
package/33.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! For license information please see 33.min.js.LICENSE.txt */
|
|
2
|
+
(this.webpackChunk_tsparticles_interaction_particles_links=this.webpackChunk_tsparticles_interaction_particles_links||[]).push([[33],{33:(i,n,t)=>{t.d(n,{LinkInstance:()=>o});var e=t(303);function s(i,n){const t=((s=i.map((i=>i.id))).sort(((i,n)=>i-n)),s.join("_"));var s;let o=n.get(t);return void 0===o&&(o=(0,e.getRandom)(),n.set(t,o)),o}class o{constructor(i){this.container=i,this._drawLinkLine=(i,n)=>{const t=i.options.links;if(!t?.enable)return;const s=this.container,o=s.actualOptions,a=n.destination,r=i.getPosition(),l=a.getPosition();let c=n.opacity;s.canvas.draw((n=>{let d;const g=i.options.twinkle?.lines;if(g?.enable){const i=g.frequency,n=(0,e.rangeColorToRgb)(g.color);(0,e.getRandom)()<i&&n&&(d=n,c=(0,e.getRangeValue)(g.opacity))}if(!d){const n=void 0!==t.id?s.particles.linksColors.get(t.id):s.particles.linksColor;d=(0,e.getLinkColor)(i,a,n)}if(!d)return;const k=i.retina.linksWidth??0,p=i.retina.linksDistance??0,{backgroundMask:h}=o;!function(i){let n=!1;const{begin:t,end:s,maxDistance:o,context:a,canvasSize:r,width:l,backgroundMask:c,colorLine:d,opacity:g,links:k}=i;if((0,e.getDistance)(t,s)<=o)(0,e.drawLine)(a,t,s),n=!0;else if(k.warp){let i,l;const c={x:s.x-r.width,y:s.y},d=(0,e.getDistances)(t,c);if(d.distance<=o){const n=t.y-d.dy/d.dx*t.x;i={x:0,y:n},l={x:r.width,y:n}}else{const n={x:s.x,y:s.y-r.height},a=(0,e.getDistances)(t,n);if(a.distance<=o){const n=-(t.y-a.dy/a.dx*t.x)/(a.dy/a.dx);i={x:n,y:0},l={x:n,y:r.height}}else{const n={x:s.x-r.width,y:s.y-r.height},a=(0,e.getDistances)(t,n);if(a.distance<=o){const n=t.y-a.dy/a.dx*t.x;i={x:-n/(a.dy/a.dx),y:n},l={x:i.x+r.width,y:i.y+r.height}}}}i&&l&&((0,e.drawLine)(a,t,i),(0,e.drawLine)(a,s,l),n=!0)}if(!n)return;a.lineWidth=l,c.enable&&(a.globalCompositeOperation=c.composite),a.strokeStyle=(0,e.getStyleFromRgb)(d,g);const{shadow:p}=k;if(p.enable){const i=(0,e.rangeColorToRgb)(p.color);i&&(a.shadowBlur=p.blur,a.shadowColor=(0,e.getStyleFromRgb)(i))}a.stroke()}({context:n,width:k,begin:r,end:l,maxDistance:p,canvasSize:s.canvas.size,links:t,backgroundMask:h,colorLine:d,opacity:c})}))},this._drawLinkTriangle=(i,n,t)=>{const s=i.options.links;if(!s?.enable)return;const o=s.triangles;if(!o.enable)return;const a=this.container,r=a.actualOptions,l=n.destination,c=t.destination,d=o.opacity??.5*(n.opacity+t.opacity);d<=0||a.canvas.draw((n=>{const t=i.getPosition(),g=l.getPosition(),k=c.getPosition(),p=i.retina.linksDistance??0;if((0,e.getDistance)(t,g)>p||(0,e.getDistance)(k,g)>p||(0,e.getDistance)(k,t)>p)return;let h=(0,e.rangeColorToRgb)(o.color);if(!h){const n=void 0!==s.id?a.particles.linksColors.get(s.id):a.particles.linksColor;h=(0,e.getLinkColor)(i,l,n)}h&&function(i){const{context:n,pos1:t,pos2:s,pos3:o,backgroundMask:a,colorTriangle:r,opacityTriangle:l}=i;!function(i,n,t,e){i.beginPath(),i.moveTo(n.x,n.y),i.lineTo(t.x,t.y),i.lineTo(e.x,e.y),i.closePath()}(n,t,s,o),a.enable&&(n.globalCompositeOperation=a.composite),n.fillStyle=(0,e.getStyleFromRgb)(r,l),n.fill()}({context:n,pos1:t,pos2:g,pos3:k,backgroundMask:r.backgroundMask,colorTriangle:h,opacityTriangle:d})}))},this._drawTriangles=(i,n,t,e)=>{const s=t.destination;if(!i.links?.triangles.enable||!s.options.links?.triangles.enable)return;const o=s.links?.filter((i=>{const n=this._getLinkFrequency(s,i.destination);return s.options.links&&n<=s.options.links.frequency&&e.findIndex((n=>n.destination===i.destination))>=0}));if(o?.length)for(const e of o){const o=e.destination;this._getTriangleFrequency(n,s,o)>i.links.triangles.frequency||this._drawLinkTriangle(n,t,e)}},this._getLinkFrequency=(i,n)=>s([i,n],this._freqs.links),this._getTriangleFrequency=(i,n,t)=>s([i,n,t],this._freqs.triangles),this._freqs={links:new Map,triangles:new Map}}drawParticle(i,n){const{links:t,options:e}=n;if(!t?.length)return;const s=t.filter((i=>e.links&&(e.links.frequency>=1||this._getLinkFrequency(n,i.destination)<=e.links.frequency)));for(const i of s)this._drawTriangles(e,n,i,s),i.opacity>0&&(n.retina.linksWidth??0)>0&&this._drawLinkLine(n,i)}async init(){this._freqs.links=new Map,this._freqs.triangles=new Map,await Promise.resolve()}particleCreated(i){if(i.links=[],!i.options.links)return;const n=this.container.retina.pixelRatio,{retina:t}=i,{distance:e,width:s}=i.options.links;t.linksDistance=e*n,t.linksWidth=s*n}particleDestroyed(i){i.links=[]}}}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tsParticles Links Particles Interaction v3.3.0 by Matteo Bruni */
|
package/38.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! For license information please see 38.min.js.LICENSE.txt */
|
|
2
|
+
(this.webpackChunk_tsparticles_interaction_particles_links=this.webpackChunk_tsparticles_interaction_particles_links||[]).push([[38],{38:(i,t,n)=>{n.d(t,{Linker:()=>l});var s=n(303);class e extends s.Circle{constructor(i,t,n,s){super(i,t,n),this.canvasSize=s,this.canvasSize={...s}}contains(i){const{width:t,height:n}=this.canvasSize,{x:s,y:e}=i;return super.contains(i)||super.contains({x:s-t,y:e})||super.contains({x:s-t,y:e-n})||super.contains({x:s,y:e-n})}intersects(i){if(super.intersects(i))return!0;const t=i,n=i,e={x:i.position.x-this.canvasSize.width,y:i.position.y-this.canvasSize.height};if(void 0!==n.radius){const i=new s.Circle(e.x,e.y,2*n.radius);return super.intersects(i)}if(void 0!==t.size){const i=new s.Rectangle(e.x,e.y,2*t.size.width,2*t.size.height);return super.intersects(i)}return!1}}var o=n(983);const r=0,a=0;function c(i,t,n,e,o){const{dx:r,dy:a,distance:c}=(0,s.getDistances)(i,t);if(!o||c<=n)return c;const l={x:Math.abs(r),y:Math.abs(a)},h=Math.min(l.x,e.width-l.x),p=Math.min(l.y,e.height-l.y);return Math.sqrt(h**2+p**2)}class l extends s.ParticlesInteractorBase{constructor(i){super(i),this._setColor=i=>{if(!i.options.links)return;const t=this.linkContainer,n=i.options.links;let e=void 0===n.id?t.particles.linksColor:t.particles.linksColors.get(n.id);if(e)return;const o=n.color;e=(0,s.getLinkRandomColor)(o,n.blink,n.consent),void 0===n.id?t.particles.linksColor=e:t.particles.linksColors.set(n.id,e)},this.linkContainer=i}clear(){}init(){this.linkContainer.particles.linksColor=void 0,this.linkContainer.particles.linksColors=new Map}interact(i){if(!i.options.links)return;i.links=[];const t=i.getPosition(),n=this.container,o=n.canvas.size;if(t.x<r||t.y<a||t.x>o.width||t.y>o.height)return;const l=i.options.links,h=l.opacity,p=i.retina.linksDistance??0,d=l.warp;let k;k=d?new e(t.x,t.y,p,o):new s.Circle(t.x,t.y,p);const u=n.particles.quadTree.query(k);for(const n of u){const s=n.options.links;if(i===n||!s?.enable||l.id!==s.id||n.spawning||n.destroyed||!n.links||i.links.some((i=>i.destination===n))||n.links.some((t=>t.destination===i)))continue;const e=n.getPosition();if(e.x<r||e.y<a||e.x>o.width||e.y>o.height)continue;const k=c(t,e,p,o,d&&s.warp);if(k>p)continue;const u=(1-k/p)*h;this._setColor(i),i.links.push({destination:n,opacity:u})}}isEnabled(i){return!!i.options.links?.enable}loadParticlesOptions(i,...t){i.links||(i.links=new o.q);for(const n of t)i.links.load(n?.links)}reset(){}}}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tsParticles Links Particles Interaction v3.3.0 by Matteo Bruni */
|
package/572.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! For license information please see 572.min.js.LICENSE.txt */
|
|
2
|
+
(this.webpackChunk_tsparticles_interaction_particles_links=this.webpackChunk_tsparticles_interaction_particles_links||[]).push([[572],{572:(n,t,i)=>{async function a(n,t=!0){await n.addInteractor("particlesLinks",(async n=>{const{Linker:t}=await i.e(38).then(i.bind(i,38));return new t(n)}),t)}i.d(t,{loadLinksInteraction:()=>a})}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tsParticles Links Particles Interaction v3.3.0 by Matteo Bruni */
|
package/905.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! For license information please see 905.min.js.LICENSE.txt */
|
|
2
|
+
(this.webpackChunk_tsparticles_interaction_particles_links=this.webpackChunk_tsparticles_interaction_particles_links||[]).push([[905],{905:(i,n,t)=>{async function a(i,n=!0){const{LinksPlugin:a}=await t.e(958).then(t.bind(t,958)),s=new a;await i.addPlugin(s,n)}t.d(n,{loadLinksPlugin:()=>a})}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tsParticles Links Particles Interaction v3.3.0 by Matteo Bruni */
|
package/958.min.js
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/*! For license information please see 958.min.js.LICENSE.txt */
|
|
2
|
+
(this.webpackChunk_tsparticles_interaction_particles_links=this.webpackChunk_tsparticles_interaction_particles_links||[]).push([[958],{958:(n,i,t)=>{t.d(i,{LinksPlugin:()=>s});class s{constructor(){this.id="links"}async getPlugin(n){const{LinkInstance:i}=await t.e(33).then(t.bind(t,33));return new i(n)}loadOptions(){}needsPlugin(){return!0}}}}]);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tsParticles Links Particles Interaction v3.3.0 by Matteo Bruni */
|
package/browser/CircleWarp.js
CHANGED
|
@@ -7,8 +7,7 @@ export class CircleWarp extends Circle {
|
|
|
7
7
|
this.canvasSize = { ...canvasSize };
|
|
8
8
|
}
|
|
9
9
|
contains(point) {
|
|
10
|
-
const { width, height } = this.canvasSize;
|
|
11
|
-
const { x, y } = point;
|
|
10
|
+
const { width, height } = this.canvasSize, { x, y } = point;
|
|
12
11
|
return (super.contains(point) ||
|
|
13
12
|
super.contains({ x: x - width, y }) ||
|
|
14
13
|
super.contains({ x: x - width, y: y - height }) ||
|
package/browser/LinkInstance.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { getDistance, getLinkColor, getRandom, getRangeValue, rangeColorToRgb, } from "@tsparticles/engine";
|
|
2
2
|
import { drawLinkLine, drawLinkTriangle, setLinkFrequency } from "./Utils.js";
|
|
3
|
-
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5;
|
|
3
|
+
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5, maxFrequency = 1;
|
|
4
4
|
export class LinkInstance {
|
|
5
5
|
constructor(container) {
|
|
6
6
|
this.container = container;
|
|
@@ -119,19 +119,20 @@ export class LinkInstance {
|
|
|
119
119
|
triangles: new Map(),
|
|
120
120
|
};
|
|
121
121
|
}
|
|
122
|
-
|
|
122
|
+
drawParticle(context, particle) {
|
|
123
123
|
const { links, options } = particle;
|
|
124
124
|
if (!links?.length) {
|
|
125
125
|
return;
|
|
126
126
|
}
|
|
127
|
-
const p1Links = links.filter((l) => options.links &&
|
|
127
|
+
const p1Links = links.filter((l) => options.links &&
|
|
128
|
+
(options.links.frequency >= maxFrequency ||
|
|
129
|
+
this._getLinkFrequency(particle, l.destination) <= options.links.frequency));
|
|
128
130
|
for (const link of p1Links) {
|
|
129
131
|
this._drawTriangles(options, particle, link, p1Links);
|
|
130
132
|
if (link.opacity > minOpacity && (particle.retina.linksWidth ?? minWidth) > minWidth) {
|
|
131
133
|
this._drawLinkLine(particle, link);
|
|
132
134
|
}
|
|
133
135
|
}
|
|
134
|
-
await Promise.resolve();
|
|
135
136
|
}
|
|
136
137
|
async init() {
|
|
137
138
|
this._freqs.links = new Map();
|
package/browser/Linker.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { Circle, ParticlesInteractorBase, getDistances, getLinkRandomColor, } from "@tsparticles/engine";
|
|
2
|
+
import { CircleWarp } from "./CircleWarp.js";
|
|
2
3
|
import { Links } from "./Options/Classes/Links.js";
|
|
3
4
|
const squarePower = 2, opacityOffset = 1, origin = {
|
|
4
5
|
x: 0,
|
|
@@ -49,7 +50,7 @@ export class Linker extends ParticlesInteractorBase {
|
|
|
49
50
|
this.linkContainer.particles.linksColor = undefined;
|
|
50
51
|
this.linkContainer.particles.linksColors = new Map();
|
|
51
52
|
}
|
|
52
|
-
|
|
53
|
+
interact(p1) {
|
|
53
54
|
if (!p1.options.links) {
|
|
54
55
|
return;
|
|
55
56
|
}
|
|
@@ -61,7 +62,6 @@ export class Linker extends ParticlesInteractorBase {
|
|
|
61
62
|
const linkOpt1 = p1.options.links, optOpacity = linkOpt1.opacity, optDistance = p1.retina.linksDistance ?? minDistance, warp = linkOpt1.warp;
|
|
62
63
|
let range;
|
|
63
64
|
if (warp) {
|
|
64
|
-
const { CircleWarp } = await import("./CircleWarp.js");
|
|
65
65
|
range = new CircleWarp(pos1.x, pos1.y, optDistance, canvasSize);
|
|
66
66
|
}
|
|
67
67
|
else {
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export class LinksPlugin {
|
|
2
|
+
constructor() {
|
|
3
|
+
this.id = "links";
|
|
4
|
+
}
|
|
5
|
+
async getPlugin(container) {
|
|
6
|
+
const { LinkInstance } = await import("./LinkInstance.js");
|
|
7
|
+
return new LinkInstance(container);
|
|
8
|
+
}
|
|
9
|
+
loadOptions() {
|
|
10
|
+
}
|
|
11
|
+
needsPlugin() {
|
|
12
|
+
return true;
|
|
13
|
+
}
|
|
14
|
+
}
|
package/browser/index.js
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { loadLinksInteraction } from "./interaction.js";
|
|
2
|
-
import { loadLinksPlugin } from "./plugin.js";
|
|
3
1
|
export async function loadParticlesLinksInteraction(engine, refresh = true) {
|
|
2
|
+
const { loadLinksInteraction } = await import("./interaction.js"), { loadLinksPlugin } = await import("./plugin.js");
|
|
4
3
|
await loadLinksInteraction(engine, refresh);
|
|
5
4
|
await loadLinksPlugin(engine, refresh);
|
|
6
5
|
}
|
package/browser/plugin.js
CHANGED
|
@@ -1,18 +1,4 @@
|
|
|
1
|
-
class LinksPlugin {
|
|
2
|
-
constructor() {
|
|
3
|
-
this.id = "links";
|
|
4
|
-
}
|
|
5
|
-
async getPlugin(container) {
|
|
6
|
-
const { LinkInstance } = await import("./LinkInstance.js");
|
|
7
|
-
return new LinkInstance(container);
|
|
8
|
-
}
|
|
9
|
-
loadOptions() {
|
|
10
|
-
}
|
|
11
|
-
needsPlugin() {
|
|
12
|
-
return true;
|
|
13
|
-
}
|
|
14
|
-
}
|
|
15
1
|
export async function loadLinksPlugin(engine, refresh = true) {
|
|
16
|
-
const plugin = new LinksPlugin();
|
|
2
|
+
const { LinksPlugin } = await import("./LinksPlugin.js"), plugin = new LinksPlugin();
|
|
17
3
|
await engine.addPlugin(plugin, refresh);
|
|
18
4
|
}
|
package/cjs/CircleWarp.js
CHANGED
|
@@ -10,8 +10,7 @@ class CircleWarp extends engine_1.Circle {
|
|
|
10
10
|
this.canvasSize = { ...canvasSize };
|
|
11
11
|
}
|
|
12
12
|
contains(point) {
|
|
13
|
-
const { width, height } = this.canvasSize;
|
|
14
|
-
const { x, y } = point;
|
|
13
|
+
const { width, height } = this.canvasSize, { x, y } = point;
|
|
15
14
|
return (super.contains(point) ||
|
|
16
15
|
super.contains({ x: x - width, y }) ||
|
|
17
16
|
super.contains({ x: x - width, y: y - height }) ||
|
package/cjs/LinkInstance.js
CHANGED
|
@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.LinkInstance = void 0;
|
|
4
4
|
const engine_1 = require("@tsparticles/engine");
|
|
5
5
|
const Utils_js_1 = require("./Utils.js");
|
|
6
|
-
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5;
|
|
6
|
+
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5, maxFrequency = 1;
|
|
7
7
|
class LinkInstance {
|
|
8
8
|
constructor(container) {
|
|
9
9
|
this.container = container;
|
|
@@ -122,19 +122,20 @@ class LinkInstance {
|
|
|
122
122
|
triangles: new Map(),
|
|
123
123
|
};
|
|
124
124
|
}
|
|
125
|
-
|
|
125
|
+
drawParticle(context, particle) {
|
|
126
126
|
const { links, options } = particle;
|
|
127
127
|
if (!links?.length) {
|
|
128
128
|
return;
|
|
129
129
|
}
|
|
130
|
-
const p1Links = links.filter((l) => options.links &&
|
|
130
|
+
const p1Links = links.filter((l) => options.links &&
|
|
131
|
+
(options.links.frequency >= maxFrequency ||
|
|
132
|
+
this._getLinkFrequency(particle, l.destination) <= options.links.frequency));
|
|
131
133
|
for (const link of p1Links) {
|
|
132
134
|
this._drawTriangles(options, particle, link, p1Links);
|
|
133
135
|
if (link.opacity > minOpacity && (particle.retina.linksWidth ?? minWidth) > minWidth) {
|
|
134
136
|
this._drawLinkLine(particle, link);
|
|
135
137
|
}
|
|
136
138
|
}
|
|
137
|
-
await Promise.resolve();
|
|
138
139
|
}
|
|
139
140
|
async init() {
|
|
140
141
|
this._freqs.links = new Map();
|
package/cjs/Linker.js
CHANGED
|
@@ -1,30 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
3
|
exports.Linker = void 0;
|
|
27
4
|
const engine_1 = require("@tsparticles/engine");
|
|
5
|
+
const CircleWarp_js_1 = require("./CircleWarp.js");
|
|
28
6
|
const Links_js_1 = require("./Options/Classes/Links.js");
|
|
29
7
|
const squarePower = 2, opacityOffset = 1, origin = {
|
|
30
8
|
x: 0,
|
|
@@ -75,7 +53,7 @@ class Linker extends engine_1.ParticlesInteractorBase {
|
|
|
75
53
|
this.linkContainer.particles.linksColor = undefined;
|
|
76
54
|
this.linkContainer.particles.linksColors = new Map();
|
|
77
55
|
}
|
|
78
|
-
|
|
56
|
+
interact(p1) {
|
|
79
57
|
if (!p1.options.links) {
|
|
80
58
|
return;
|
|
81
59
|
}
|
|
@@ -87,8 +65,7 @@ class Linker extends engine_1.ParticlesInteractorBase {
|
|
|
87
65
|
const linkOpt1 = p1.options.links, optOpacity = linkOpt1.opacity, optDistance = p1.retina.linksDistance ?? minDistance, warp = linkOpt1.warp;
|
|
88
66
|
let range;
|
|
89
67
|
if (warp) {
|
|
90
|
-
|
|
91
|
-
range = new CircleWarp(pos1.x, pos1.y, optDistance, canvasSize);
|
|
68
|
+
range = new CircleWarp_js_1.CircleWarp(pos1.x, pos1.y, optDistance, canvasSize);
|
|
92
69
|
}
|
|
93
70
|
else {
|
|
94
71
|
range = new engine_1.Circle(pos1.x, pos1.y, optDistance);
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.LinksPlugin = void 0;
|
|
4
|
+
class LinksPlugin {
|
|
5
|
+
constructor() {
|
|
6
|
+
this.id = "links";
|
|
7
|
+
}
|
|
8
|
+
async getPlugin(container) {
|
|
9
|
+
const { LinkInstance } = await import("./LinkInstance.js");
|
|
10
|
+
return new LinkInstance(container);
|
|
11
|
+
}
|
|
12
|
+
loadOptions() {
|
|
13
|
+
}
|
|
14
|
+
needsPlugin() {
|
|
15
|
+
return true;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
exports.LinksPlugin = LinksPlugin;
|
package/cjs/index.js
CHANGED
|
@@ -15,11 +15,10 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
15
15
|
};
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
exports.loadParticlesLinksInteraction = void 0;
|
|
18
|
-
const interaction_js_1 = require("./interaction.js");
|
|
19
|
-
const plugin_js_1 = require("./plugin.js");
|
|
20
18
|
async function loadParticlesLinksInteraction(engine, refresh = true) {
|
|
21
|
-
await (
|
|
22
|
-
await (
|
|
19
|
+
const { loadLinksInteraction } = await import("./interaction.js"), { loadLinksPlugin } = await import("./plugin.js");
|
|
20
|
+
await loadLinksInteraction(engine, refresh);
|
|
21
|
+
await loadLinksPlugin(engine, refresh);
|
|
23
22
|
}
|
|
24
23
|
exports.loadParticlesLinksInteraction = loadParticlesLinksInteraction;
|
|
25
24
|
__exportStar(require("./Options/Classes/Links.js"), exports);
|
package/cjs/interaction.js
CHANGED
|
@@ -1,32 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
3
|
exports.loadLinksInteraction = void 0;
|
|
27
4
|
async function loadLinksInteraction(engine, refresh = true) {
|
|
28
5
|
await engine.addInteractor("particlesLinks", async (container) => {
|
|
29
|
-
const { Linker } = await
|
|
6
|
+
const { Linker } = await import("./Linker.js");
|
|
30
7
|
return new Linker(container);
|
|
31
8
|
}, refresh);
|
|
32
9
|
}
|
package/cjs/plugin.js
CHANGED
|
@@ -1,45 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
-
if (k2 === undefined) k2 = k;
|
|
4
|
-
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
-
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
-
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
-
}
|
|
8
|
-
Object.defineProperty(o, k2, desc);
|
|
9
|
-
}) : (function(o, m, k, k2) {
|
|
10
|
-
if (k2 === undefined) k2 = k;
|
|
11
|
-
o[k2] = m[k];
|
|
12
|
-
}));
|
|
13
|
-
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
-
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
-
}) : function(o, v) {
|
|
16
|
-
o["default"] = v;
|
|
17
|
-
});
|
|
18
|
-
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
-
if (mod && mod.__esModule) return mod;
|
|
20
|
-
var result = {};
|
|
21
|
-
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
-
__setModuleDefault(result, mod);
|
|
23
|
-
return result;
|
|
24
|
-
};
|
|
25
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
3
|
exports.loadLinksPlugin = void 0;
|
|
27
|
-
class LinksPlugin {
|
|
28
|
-
constructor() {
|
|
29
|
-
this.id = "links";
|
|
30
|
-
}
|
|
31
|
-
async getPlugin(container) {
|
|
32
|
-
const { LinkInstance } = await Promise.resolve().then(() => __importStar(require("./LinkInstance.js")));
|
|
33
|
-
return new LinkInstance(container);
|
|
34
|
-
}
|
|
35
|
-
loadOptions() {
|
|
36
|
-
}
|
|
37
|
-
needsPlugin() {
|
|
38
|
-
return true;
|
|
39
|
-
}
|
|
40
|
-
}
|
|
41
4
|
async function loadLinksPlugin(engine, refresh = true) {
|
|
42
|
-
const plugin = new LinksPlugin();
|
|
5
|
+
const { LinksPlugin } = await import("./LinksPlugin.js"), plugin = new LinksPlugin();
|
|
43
6
|
await engine.addPlugin(plugin, refresh);
|
|
44
7
|
}
|
|
45
8
|
exports.loadLinksPlugin = loadLinksPlugin;
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Demo / Generator : https://particles.js.org/
|
|
5
5
|
* GitHub : https://www.github.com/matteobruni/tsparticles
|
|
6
6
|
* How to use? : Check the GitHub README
|
|
7
|
-
* v3.
|
|
7
|
+
* v3.3.0
|
|
8
8
|
*/
|
|
9
9
|
"use strict";
|
|
10
10
|
/*
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
\**************************************/
|
|
24
24
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
25
|
|
|
26
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ LinkInstance: () => (/* binding */ LinkInstance)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst minOpacity = 0,\n minWidth = 0,\n minDistance = 0,\n half = 0.5;\nclass LinkInstance {\n constructor(container) {\n this.container = container;\n this._drawLinkLine = (p1, link) => {\n const p1LinksOptions = p1.options.links;\n if (!p1LinksOptions?.enable) {\n return;\n }\n const container = this.container,\n options = container.actualOptions,\n p2 = link.destination,\n pos1 = p1.getPosition(),\n pos2 = p2.getPosition();\n let opacity = link.opacity;\n container.canvas.draw(ctx => {\n let colorLine;\n const twinkle = p1.options.twinkle?.lines;\n if (twinkle?.enable) {\n const twinkleFreq = twinkle.frequency,\n twinkleRgb = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToRgb)(twinkle.color),\n twinkling = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRandom)() < twinkleFreq;\n if (twinkling && twinkleRgb) {\n colorLine = twinkleRgb;\n opacity = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(twinkle.opacity);\n }\n }\n if (!colorLine) {\n const linkColor = p1LinksOptions.id !== undefined ? container.particles.linksColors.get(p1LinksOptions.id) : container.particles.linksColor;\n colorLine = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getLinkColor)(p1, p2, linkColor);\n }\n if (!colorLine) {\n return;\n }\n const width = p1.retina.linksWidth ?? minWidth,\n maxDistance = p1.retina.linksDistance ?? minDistance,\n {\n backgroundMask\n } = options;\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawLinkLine)({\n context: ctx,\n width,\n begin: pos1,\n end: pos2,\n maxDistance,\n canvasSize: container.canvas.size,\n links: p1LinksOptions,\n backgroundMask: backgroundMask,\n colorLine,\n opacity\n });\n });\n };\n this._drawLinkTriangle = (p1, link1, link2) => {\n const linksOptions = p1.options.links;\n if (!linksOptions?.enable) {\n return;\n }\n const triangleOptions = linksOptions.triangles;\n if (!triangleOptions.enable) {\n return;\n }\n const container = this.container,\n options = container.actualOptions,\n p2 = link1.destination,\n p3 = link2.destination,\n opacityTriangle = triangleOptions.opacity ?? (link1.opacity + link2.opacity) * half;\n if (opacityTriangle <= minOpacity) {\n return;\n }\n container.canvas.draw(ctx => {\n const pos1 = p1.getPosition(),\n pos2 = p2.getPosition(),\n pos3 = p3.getPosition(),\n linksDistance = p1.retina.linksDistance ?? minDistance;\n if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos1, pos2) > linksDistance || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos3, pos2) > linksDistance || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos3, pos1) > linksDistance) {\n return;\n }\n let colorTriangle = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToRgb)(triangleOptions.color);\n if (!colorTriangle) {\n const linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;\n colorTriangle = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getLinkColor)(p1, p2, linkColor);\n }\n if (!colorTriangle) {\n return;\n }\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawLinkTriangle)({\n context: ctx,\n pos1,\n pos2,\n pos3,\n backgroundMask: options.backgroundMask,\n colorTriangle,\n opacityTriangle\n });\n });\n };\n this._drawTriangles = (options, p1, link, p1Links) => {\n const p2 = link.destination;\n if (!(options.links?.triangles.enable && p2.options.links?.triangles.enable)) {\n return;\n }\n const vertices = p2.links?.filter(t => {\n const linkFreq = this._getLinkFrequency(p2, t.destination),\n minCount = 0;\n return p2.options.links && linkFreq <= p2.options.links.frequency && p1Links.findIndex(l => l.destination === t.destination) >= minCount;\n });\n if (!vertices?.length) {\n return;\n }\n for (const vertex of vertices) {\n const p3 = vertex.destination,\n triangleFreq = this._getTriangleFrequency(p1, p2, p3);\n if (triangleFreq > options.links.triangles.frequency) {\n continue;\n }\n this._drawLinkTriangle(p1, link, vertex);\n }\n };\n this._getLinkFrequency = (p1, p2) => {\n return (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.setLinkFrequency)([p1, p2], this._freqs.links);\n };\n this._getTriangleFrequency = (p1, p2, p3) => {\n return (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.setLinkFrequency)([p1, p2, p3], this._freqs.triangles);\n };\n this._freqs = {\n links: new Map(),\n triangles: new Map()\n };\n }\n
|
|
26
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ LinkInstance: () => (/* binding */ LinkInstance)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst minOpacity = 0,\n minWidth = 0,\n minDistance = 0,\n half = 0.5,\n maxFrequency = 1;\nclass LinkInstance {\n constructor(container) {\n this.container = container;\n this._drawLinkLine = (p1, link) => {\n const p1LinksOptions = p1.options.links;\n if (!p1LinksOptions?.enable) {\n return;\n }\n const container = this.container,\n options = container.actualOptions,\n p2 = link.destination,\n pos1 = p1.getPosition(),\n pos2 = p2.getPosition();\n let opacity = link.opacity;\n container.canvas.draw(ctx => {\n let colorLine;\n const twinkle = p1.options.twinkle?.lines;\n if (twinkle?.enable) {\n const twinkleFreq = twinkle.frequency,\n twinkleRgb = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToRgb)(twinkle.color),\n twinkling = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRandom)() < twinkleFreq;\n if (twinkling && twinkleRgb) {\n colorLine = twinkleRgb;\n opacity = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(twinkle.opacity);\n }\n }\n if (!colorLine) {\n const linkColor = p1LinksOptions.id !== undefined ? container.particles.linksColors.get(p1LinksOptions.id) : container.particles.linksColor;\n colorLine = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getLinkColor)(p1, p2, linkColor);\n }\n if (!colorLine) {\n return;\n }\n const width = p1.retina.linksWidth ?? minWidth,\n maxDistance = p1.retina.linksDistance ?? minDistance,\n {\n backgroundMask\n } = options;\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawLinkLine)({\n context: ctx,\n width,\n begin: pos1,\n end: pos2,\n maxDistance,\n canvasSize: container.canvas.size,\n links: p1LinksOptions,\n backgroundMask: backgroundMask,\n colorLine,\n opacity\n });\n });\n };\n this._drawLinkTriangle = (p1, link1, link2) => {\n const linksOptions = p1.options.links;\n if (!linksOptions?.enable) {\n return;\n }\n const triangleOptions = linksOptions.triangles;\n if (!triangleOptions.enable) {\n return;\n }\n const container = this.container,\n options = container.actualOptions,\n p2 = link1.destination,\n p3 = link2.destination,\n opacityTriangle = triangleOptions.opacity ?? (link1.opacity + link2.opacity) * half;\n if (opacityTriangle <= minOpacity) {\n return;\n }\n container.canvas.draw(ctx => {\n const pos1 = p1.getPosition(),\n pos2 = p2.getPosition(),\n pos3 = p3.getPosition(),\n linksDistance = p1.retina.linksDistance ?? minDistance;\n if ((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos1, pos2) > linksDistance || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos3, pos2) > linksDistance || (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistance)(pos3, pos1) > linksDistance) {\n return;\n }\n let colorTriangle = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.rangeColorToRgb)(triangleOptions.color);\n if (!colorTriangle) {\n const linkColor = linksOptions.id !== undefined ? container.particles.linksColors.get(linksOptions.id) : container.particles.linksColor;\n colorTriangle = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getLinkColor)(p1, p2, linkColor);\n }\n if (!colorTriangle) {\n return;\n }\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawLinkTriangle)({\n context: ctx,\n pos1,\n pos2,\n pos3,\n backgroundMask: options.backgroundMask,\n colorTriangle,\n opacityTriangle\n });\n });\n };\n this._drawTriangles = (options, p1, link, p1Links) => {\n const p2 = link.destination;\n if (!(options.links?.triangles.enable && p2.options.links?.triangles.enable)) {\n return;\n }\n const vertices = p2.links?.filter(t => {\n const linkFreq = this._getLinkFrequency(p2, t.destination),\n minCount = 0;\n return p2.options.links && linkFreq <= p2.options.links.frequency && p1Links.findIndex(l => l.destination === t.destination) >= minCount;\n });\n if (!vertices?.length) {\n return;\n }\n for (const vertex of vertices) {\n const p3 = vertex.destination,\n triangleFreq = this._getTriangleFrequency(p1, p2, p3);\n if (triangleFreq > options.links.triangles.frequency) {\n continue;\n }\n this._drawLinkTriangle(p1, link, vertex);\n }\n };\n this._getLinkFrequency = (p1, p2) => {\n return (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.setLinkFrequency)([p1, p2], this._freqs.links);\n };\n this._getTriangleFrequency = (p1, p2, p3) => {\n return (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.setLinkFrequency)([p1, p2, p3], this._freqs.triangles);\n };\n this._freqs = {\n links: new Map(),\n triangles: new Map()\n };\n }\n drawParticle(context, particle) {\n const {\n links,\n options\n } = particle;\n if (!links?.length) {\n return;\n }\n const p1Links = links.filter(l => options.links && (options.links.frequency >= maxFrequency || this._getLinkFrequency(particle, l.destination) <= options.links.frequency));\n for (const link of p1Links) {\n this._drawTriangles(options, particle, link, p1Links);\n if (link.opacity > minOpacity && (particle.retina.linksWidth ?? minWidth) > minWidth) {\n this._drawLinkLine(particle, link);\n }\n }\n }\n async init() {\n this._freqs.links = new Map();\n this._freqs.triangles = new Map();\n await Promise.resolve();\n }\n particleCreated(particle) {\n particle.links = [];\n if (!particle.options.links) {\n return;\n }\n const ratio = this.container.retina.pixelRatio,\n {\n retina\n } = particle,\n {\n distance,\n width\n } = particle.options.links;\n retina.linksDistance = distance * ratio;\n retina.linksWidth = width * ratio;\n }\n particleDestroyed(particle) {\n particle.links = [];\n }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/LinkInstance.js?");
|
|
27
27
|
|
|
28
28
|
/***/ }),
|
|
29
29
|
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Demo / Generator : https://particles.js.org/
|
|
5
5
|
* GitHub : https://www.github.com/matteobruni/tsparticles
|
|
6
6
|
* How to use? : Check the GitHub README
|
|
7
|
-
* v3.
|
|
7
|
+
* v3.3.0
|
|
8
8
|
*/
|
|
9
9
|
"use strict";
|
|
10
10
|
/*
|
|
@@ -17,13 +17,23 @@
|
|
|
17
17
|
*/
|
|
18
18
|
(this["webpackChunk_tsparticles_interaction_particles_links"] = this["webpackChunk_tsparticles_interaction_particles_links"] || []).push([["dist_browser_Linker_js"],{
|
|
19
19
|
|
|
20
|
+
/***/ "./dist/browser/CircleWarp.js":
|
|
21
|
+
/*!************************************!*\
|
|
22
|
+
!*** ./dist/browser/CircleWarp.js ***!
|
|
23
|
+
\************************************/
|
|
24
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
|
+
|
|
26
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ CircleWarp: () => (/* binding */ CircleWarp)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n\nconst double = 2;\nclass CircleWarp extends _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle {\n constructor(x, y, radius, canvasSize) {\n super(x, y, radius);\n this.canvasSize = canvasSize;\n this.canvasSize = {\n ...canvasSize\n };\n }\n contains(point) {\n const {\n width,\n height\n } = this.canvasSize,\n {\n x,\n y\n } = point;\n return super.contains(point) || super.contains({\n x: x - width,\n y\n }) || super.contains({\n x: x - width,\n y: y - height\n }) || super.contains({\n x,\n y: y - height\n });\n }\n intersects(range) {\n if (super.intersects(range)) {\n return true;\n }\n const rect = range,\n circle = range,\n newPos = {\n x: range.position.x - this.canvasSize.width,\n y: range.position.y - this.canvasSize.height\n };\n if (circle.radius !== undefined) {\n const biggerCircle = new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(newPos.x, newPos.y, circle.radius * double);\n return super.intersects(biggerCircle);\n } else if (rect.size !== undefined) {\n const rectSW = new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Rectangle(newPos.x, newPos.y, rect.size.width * double, rect.size.height * double);\n return super.intersects(rectSW);\n }\n return false;\n }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/CircleWarp.js?");
|
|
27
|
+
|
|
28
|
+
/***/ }),
|
|
29
|
+
|
|
20
30
|
/***/ "./dist/browser/Linker.js":
|
|
21
31
|
/*!********************************!*\
|
|
22
32
|
!*** ./dist/browser/Linker.js ***!
|
|
23
33
|
\********************************/
|
|
24
34
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
35
|
|
|
26
|
-
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Linker: () => (/* binding */ Linker)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var
|
|
36
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ Linker: () => (/* binding */ Linker)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _CircleWarp_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CircleWarp.js */ \"./dist/browser/CircleWarp.js\");\n/* harmony import */ var _Options_Classes_Links_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Options/Classes/Links.js */ \"./dist/browser/Options/Classes/Links.js\");\n\n\n\nconst squarePower = 2,\n opacityOffset = 1,\n origin = {\n x: 0,\n y: 0\n },\n minDistance = 0;\nfunction getLinkDistance(pos1, pos2, optDistance, canvasSize, warp) {\n const {\n dx,\n dy,\n distance\n } = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getDistances)(pos1, pos2);\n if (!warp || distance <= optDistance) {\n return distance;\n }\n const absDiffs = {\n x: Math.abs(dx),\n y: Math.abs(dy)\n },\n warpDistances = {\n x: Math.min(absDiffs.x, canvasSize.width - absDiffs.x),\n y: Math.min(absDiffs.y, canvasSize.height - absDiffs.y)\n };\n return Math.sqrt(warpDistances.x ** squarePower + warpDistances.y ** squarePower);\n}\nclass Linker extends _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.ParticlesInteractorBase {\n constructor(container) {\n super(container);\n this._setColor = p1 => {\n if (!p1.options.links) {\n return;\n }\n const container = this.linkContainer,\n linksOptions = p1.options.links;\n let linkColor = linksOptions.id === undefined ? container.particles.linksColor : container.particles.linksColors.get(linksOptions.id);\n if (linkColor) {\n return;\n }\n const optColor = linksOptions.color;\n linkColor = (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getLinkRandomColor)(optColor, linksOptions.blink, linksOptions.consent);\n if (linksOptions.id === undefined) {\n container.particles.linksColor = linkColor;\n } else {\n container.particles.linksColors.set(linksOptions.id, linkColor);\n }\n };\n this.linkContainer = container;\n }\n clear() {}\n init() {\n this.linkContainer.particles.linksColor = undefined;\n this.linkContainer.particles.linksColors = new Map();\n }\n interact(p1) {\n if (!p1.options.links) {\n return;\n }\n p1.links = [];\n const pos1 = p1.getPosition(),\n container = this.container,\n canvasSize = container.canvas.size;\n if (pos1.x < origin.x || pos1.y < origin.y || pos1.x > canvasSize.width || pos1.y > canvasSize.height) {\n return;\n }\n const linkOpt1 = p1.options.links,\n optOpacity = linkOpt1.opacity,\n optDistance = p1.retina.linksDistance ?? minDistance,\n warp = linkOpt1.warp;\n let range;\n if (warp) {\n range = new _CircleWarp_js__WEBPACK_IMPORTED_MODULE_1__.CircleWarp(pos1.x, pos1.y, optDistance, canvasSize);\n } else {\n range = new _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.Circle(pos1.x, pos1.y, optDistance);\n }\n const query = container.particles.quadTree.query(range);\n for (const p2 of query) {\n const linkOpt2 = p2.options.links;\n 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)) {\n continue;\n }\n const pos2 = p2.getPosition();\n if (pos2.x < origin.x || pos2.y < origin.y || pos2.x > canvasSize.width || pos2.y > canvasSize.height) {\n continue;\n }\n const distance = getLinkDistance(pos1, pos2, optDistance, canvasSize, warp && linkOpt2.warp);\n if (distance > optDistance) {\n continue;\n }\n const opacityLine = (opacityOffset - distance / optDistance) * optOpacity;\n this._setColor(p1);\n p1.links.push({\n destination: p2,\n opacity: opacityLine\n });\n }\n }\n isEnabled(particle) {\n return !!particle.options.links?.enable;\n }\n loadParticlesOptions(options, ...sources) {\n if (!options.links) {\n options.links = new _Options_Classes_Links_js__WEBPACK_IMPORTED_MODULE_2__.Links();\n }\n for (const source of sources) {\n options.links.load(source?.links);\n }\n }\n reset() {}\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/Linker.js?");
|
|
27
37
|
|
|
28
38
|
/***/ })
|
|
29
39
|
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Author : Matteo Bruni
|
|
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
|
+
* v3.3.0
|
|
8
|
+
*/
|
|
9
|
+
"use strict";
|
|
10
|
+
/*
|
|
11
|
+
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
|
|
12
|
+
* This devtool is neither made for production nor for readable output files.
|
|
13
|
+
* It uses "eval()" calls to create a separate source file in the browser devtools.
|
|
14
|
+
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
|
|
15
|
+
* or disable the default devtool with "devtool: false".
|
|
16
|
+
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
|
|
17
|
+
*/
|
|
18
|
+
(this["webpackChunk_tsparticles_interaction_particles_links"] = this["webpackChunk_tsparticles_interaction_particles_links"] || []).push([["dist_browser_LinksPlugin_js"],{
|
|
19
|
+
|
|
20
|
+
/***/ "./dist/browser/LinksPlugin.js":
|
|
21
|
+
/*!*************************************!*\
|
|
22
|
+
!*** ./dist/browser/LinksPlugin.js ***!
|
|
23
|
+
\*************************************/
|
|
24
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
|
+
|
|
26
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ LinksPlugin: () => (/* binding */ LinksPlugin)\n/* harmony export */ });\nclass LinksPlugin {\n constructor() {\n this.id = \"links\";\n }\n async getPlugin(container) {\n const {\n LinkInstance\n } = await __webpack_require__.e(/*! import() */ \"dist_browser_LinkInstance_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./LinkInstance.js */ \"./dist/browser/LinkInstance.js\"));\n return new LinkInstance(container);\n }\n loadOptions() {}\n needsPlugin() {\n return true;\n }\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/LinksPlugin.js?");
|
|
27
|
+
|
|
28
|
+
/***/ })
|
|
29
|
+
|
|
30
|
+
}]);
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Author : Matteo Bruni
|
|
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
|
+
* v3.3.0
|
|
8
|
+
*/
|
|
9
|
+
"use strict";
|
|
10
|
+
/*
|
|
11
|
+
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
|
|
12
|
+
* This devtool is neither made for production nor for readable output files.
|
|
13
|
+
* It uses "eval()" calls to create a separate source file in the browser devtools.
|
|
14
|
+
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
|
|
15
|
+
* or disable the default devtool with "devtool: false".
|
|
16
|
+
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
|
|
17
|
+
*/
|
|
18
|
+
(this["webpackChunk_tsparticles_interaction_particles_links"] = this["webpackChunk_tsparticles_interaction_particles_links"] || []).push([["dist_browser_interaction_js"],{
|
|
19
|
+
|
|
20
|
+
/***/ "./dist/browser/interaction.js":
|
|
21
|
+
/*!*************************************!*\
|
|
22
|
+
!*** ./dist/browser/interaction.js ***!
|
|
23
|
+
\*************************************/
|
|
24
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
|
+
|
|
26
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ loadLinksInteraction: () => (/* binding */ loadLinksInteraction)\n/* harmony export */ });\nasync function loadLinksInteraction(engine, refresh = true) {\n await engine.addInteractor(\"particlesLinks\", async container => {\n const {\n Linker\n } = await __webpack_require__.e(/*! import() */ \"dist_browser_Linker_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./Linker.js */ \"./dist/browser/Linker.js\"));\n return new Linker(container);\n }, refresh);\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/interaction.js?");
|
|
27
|
+
|
|
28
|
+
/***/ })
|
|
29
|
+
|
|
30
|
+
}]);
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Author : Matteo Bruni
|
|
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
|
+
* v3.3.0
|
|
8
|
+
*/
|
|
9
|
+
"use strict";
|
|
10
|
+
/*
|
|
11
|
+
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
|
|
12
|
+
* This devtool is neither made for production nor for readable output files.
|
|
13
|
+
* It uses "eval()" calls to create a separate source file in the browser devtools.
|
|
14
|
+
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
|
|
15
|
+
* or disable the default devtool with "devtool: false".
|
|
16
|
+
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
|
|
17
|
+
*/
|
|
18
|
+
(this["webpackChunk_tsparticles_interaction_particles_links"] = this["webpackChunk_tsparticles_interaction_particles_links"] || []).push([["dist_browser_plugin_js"],{
|
|
19
|
+
|
|
20
|
+
/***/ "./dist/browser/plugin.js":
|
|
21
|
+
/*!********************************!*\
|
|
22
|
+
!*** ./dist/browser/plugin.js ***!
|
|
23
|
+
\********************************/
|
|
24
|
+
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
25
|
+
|
|
26
|
+
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ loadLinksPlugin: () => (/* binding */ loadLinksPlugin)\n/* harmony export */ });\nasync function loadLinksPlugin(engine, refresh = true) {\n const {\n LinksPlugin\n } = await __webpack_require__.e(/*! import() */ \"dist_browser_LinksPlugin_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./LinksPlugin.js */ \"./dist/browser/LinksPlugin.js\")),\n plugin = new LinksPlugin();\n await engine.addPlugin(plugin, refresh);\n}\n\n//# sourceURL=webpack://@tsparticles/interaction-particles-links/./dist/browser/plugin.js?");
|
|
27
|
+
|
|
28
|
+
/***/ })
|
|
29
|
+
|
|
30
|
+
}]);
|
package/esm/CircleWarp.js
CHANGED
|
@@ -7,8 +7,7 @@ export class CircleWarp extends Circle {
|
|
|
7
7
|
this.canvasSize = { ...canvasSize };
|
|
8
8
|
}
|
|
9
9
|
contains(point) {
|
|
10
|
-
const { width, height } = this.canvasSize;
|
|
11
|
-
const { x, y } = point;
|
|
10
|
+
const { width, height } = this.canvasSize, { x, y } = point;
|
|
12
11
|
return (super.contains(point) ||
|
|
13
12
|
super.contains({ x: x - width, y }) ||
|
|
14
13
|
super.contains({ x: x - width, y: y - height }) ||
|
package/esm/LinkInstance.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { getDistance, getLinkColor, getRandom, getRangeValue, rangeColorToRgb, } from "@tsparticles/engine";
|
|
2
2
|
import { drawLinkLine, drawLinkTriangle, setLinkFrequency } from "./Utils.js";
|
|
3
|
-
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5;
|
|
3
|
+
const minOpacity = 0, minWidth = 0, minDistance = 0, half = 0.5, maxFrequency = 1;
|
|
4
4
|
export class LinkInstance {
|
|
5
5
|
constructor(container) {
|
|
6
6
|
this.container = container;
|
|
@@ -119,19 +119,20 @@ export class LinkInstance {
|
|
|
119
119
|
triangles: new Map(),
|
|
120
120
|
};
|
|
121
121
|
}
|
|
122
|
-
|
|
122
|
+
drawParticle(context, particle) {
|
|
123
123
|
const { links, options } = particle;
|
|
124
124
|
if (!links?.length) {
|
|
125
125
|
return;
|
|
126
126
|
}
|
|
127
|
-
const p1Links = links.filter((l) => options.links &&
|
|
127
|
+
const p1Links = links.filter((l) => options.links &&
|
|
128
|
+
(options.links.frequency >= maxFrequency ||
|
|
129
|
+
this._getLinkFrequency(particle, l.destination) <= options.links.frequency));
|
|
128
130
|
for (const link of p1Links) {
|
|
129
131
|
this._drawTriangles(options, particle, link, p1Links);
|
|
130
132
|
if (link.opacity > minOpacity && (particle.retina.linksWidth ?? minWidth) > minWidth) {
|
|
131
133
|
this._drawLinkLine(particle, link);
|
|
132
134
|
}
|
|
133
135
|
}
|
|
134
|
-
await Promise.resolve();
|
|
135
136
|
}
|
|
136
137
|
async init() {
|
|
137
138
|
this._freqs.links = new Map();
|