tsparticles-interaction-external-connect
Advanced tools
Comparing version 2.9.3 to 2.10.0
@@ -1,38 +0,4 @@ | ||
import { ExternalInteractorBase, colorMix, drawLine, getStyleFromHsl, getStyleFromRgb, isInArray, } from "tsparticles-engine"; | ||
import { ExternalInteractorBase, isInArray, } from "tsparticles-engine"; | ||
import { Connect } from "./Options/Classes/Connect"; | ||
function gradient(context, p1, p2, opacity) { | ||
const gradStop = Math.floor(p2.getRadius() / p1.getRadius()), color1 = p1.getFillColor(), color2 = p2.getFillColor(); | ||
if (!color1 || !color2) { | ||
return; | ||
} | ||
const sourcePos = p1.getPosition(), destPos = p2.getPosition(), midRgb = colorMix(color1, color2, p1.getRadius(), p2.getRadius()), grad = context.createLinearGradient(sourcePos.x, sourcePos.y, destPos.x, destPos.y); | ||
grad.addColorStop(0, getStyleFromHsl(color1, opacity)); | ||
grad.addColorStop(gradStop > 1 ? 1 : gradStop, getStyleFromRgb(midRgb, opacity)); | ||
grad.addColorStop(1, getStyleFromHsl(color2, opacity)); | ||
return grad; | ||
} | ||
function drawConnectLine(context, width, lineStyle, begin, end) { | ||
drawLine(context, begin, end); | ||
context.lineWidth = width; | ||
context.strokeStyle = lineStyle; | ||
context.stroke(); | ||
} | ||
function lineStyle(container, ctx, p1, p2) { | ||
const options = container.actualOptions, connectOptions = options.interactivity.modes.connect; | ||
if (!connectOptions) { | ||
return; | ||
} | ||
return gradient(ctx, p1, p2, connectOptions.links.opacity); | ||
} | ||
function drawConnection(container, p1, p2) { | ||
container.canvas.draw((ctx) => { | ||
var _a; | ||
const ls = lineStyle(container, ctx, p1, p2); | ||
if (!ls) { | ||
return; | ||
} | ||
const pos1 = p1.getPosition(), pos2 = p2.getPosition(); | ||
drawConnectLine(ctx, (_a = p1.retina.linksWidth) !== null && _a !== void 0 ? _a : 0, ls, pos1, pos2); | ||
}); | ||
} | ||
import { drawConnection } from "./Utils"; | ||
export class Connector extends ExternalInteractorBase { | ||
@@ -78,4 +44,3 @@ constructor(container) { | ||
isEnabled(particle) { | ||
var _a; | ||
const container = this.container, mouse = container.interactivity.mouse, events = ((_a = particle === null || particle === void 0 ? void 0 : particle.interactivity) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity).events; | ||
const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events; | ||
if (!(events.onHover.enable && mouse.position)) { | ||
@@ -91,3 +56,3 @@ return false; | ||
for (const source of sources) { | ||
options.connect.load(source === null || source === void 0 ? void 0 : source.connect); | ||
options.connect.load(source?.connect); | ||
} | ||
@@ -94,0 +59,0 @@ } |
@@ -21,3 +21,2 @@ import { ConnectLinks } from "./ConnectLinks"; | ||
load(data) { | ||
var _a, _b; | ||
if (!data) { | ||
@@ -29,3 +28,3 @@ return; | ||
} | ||
this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked); | ||
this.links.load(data.links ?? data.lineLinked ?? data.line_linked); | ||
if (data.radius !== undefined) { | ||
@@ -32,0 +31,0 @@ this.radius = data.radius; |
"use strict"; | ||
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { | ||
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } | ||
return new (P || (P = Promise))(function (resolve, reject) { | ||
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } | ||
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } | ||
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } | ||
step((generator = generator.apply(thisArg, _arguments || [])).next()); | ||
}); | ||
}; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
@@ -15,37 +6,3 @@ exports.Connector = void 0; | ||
const Connect_1 = require("./Options/Classes/Connect"); | ||
function gradient(context, p1, p2, opacity) { | ||
const gradStop = Math.floor(p2.getRadius() / p1.getRadius()), color1 = p1.getFillColor(), color2 = p2.getFillColor(); | ||
if (!color1 || !color2) { | ||
return; | ||
} | ||
const sourcePos = p1.getPosition(), destPos = p2.getPosition(), midRgb = (0, tsparticles_engine_1.colorMix)(color1, color2, p1.getRadius(), p2.getRadius()), grad = context.createLinearGradient(sourcePos.x, sourcePos.y, destPos.x, destPos.y); | ||
grad.addColorStop(0, (0, tsparticles_engine_1.getStyleFromHsl)(color1, opacity)); | ||
grad.addColorStop(gradStop > 1 ? 1 : gradStop, (0, tsparticles_engine_1.getStyleFromRgb)(midRgb, opacity)); | ||
grad.addColorStop(1, (0, tsparticles_engine_1.getStyleFromHsl)(color2, opacity)); | ||
return grad; | ||
} | ||
function drawConnectLine(context, width, lineStyle, begin, end) { | ||
(0, tsparticles_engine_1.drawLine)(context, begin, end); | ||
context.lineWidth = width; | ||
context.strokeStyle = lineStyle; | ||
context.stroke(); | ||
} | ||
function lineStyle(container, ctx, p1, p2) { | ||
const options = container.actualOptions, connectOptions = options.interactivity.modes.connect; | ||
if (!connectOptions) { | ||
return; | ||
} | ||
return gradient(ctx, p1, p2, connectOptions.links.opacity); | ||
} | ||
function drawConnection(container, p1, p2) { | ||
container.canvas.draw((ctx) => { | ||
var _a; | ||
const ls = lineStyle(container, ctx, p1, p2); | ||
if (!ls) { | ||
return; | ||
} | ||
const pos1 = p1.getPosition(), pos2 = p2.getPosition(); | ||
drawConnectLine(ctx, (_a = p1.retina.linksWidth) !== null && _a !== void 0 ? _a : 0, ls, pos1, pos2); | ||
}); | ||
} | ||
const Utils_1 = require("./Utils"); | ||
class Connector extends tsparticles_engine_1.ExternalInteractorBase { | ||
@@ -65,32 +22,29 @@ constructor(container) { | ||
} | ||
interact() { | ||
return __awaiter(this, void 0, void 0, function* () { | ||
const container = this.container, options = container.actualOptions; | ||
if (options.interactivity.events.onHover.enable && container.interactivity.status === "pointermove") { | ||
const mousePos = container.interactivity.mouse.position; | ||
if (!container.retina.connectModeDistance || | ||
container.retina.connectModeDistance < 0 || | ||
!container.retina.connectModeRadius || | ||
container.retina.connectModeRadius < 0 || | ||
!mousePos) { | ||
return; | ||
} | ||
const distance = Math.abs(container.retina.connectModeRadius), query = container.particles.quadTree.queryCircle(mousePos, distance, (p) => this.isEnabled(p)); | ||
let i = 0; | ||
for (const p1 of query) { | ||
const pos1 = p1.getPosition(); | ||
for (const p2 of query.slice(i + 1)) { | ||
const pos2 = p2.getPosition(), distMax = Math.abs(container.retina.connectModeDistance), xDiff = Math.abs(pos1.x - pos2.x), yDiff = Math.abs(pos1.y - pos2.y); | ||
if (xDiff < distMax && yDiff < distMax) { | ||
drawConnection(container, p1, p2); | ||
} | ||
async interact() { | ||
const container = this.container, options = container.actualOptions; | ||
if (options.interactivity.events.onHover.enable && container.interactivity.status === "pointermove") { | ||
const mousePos = container.interactivity.mouse.position; | ||
if (!container.retina.connectModeDistance || | ||
container.retina.connectModeDistance < 0 || | ||
!container.retina.connectModeRadius || | ||
container.retina.connectModeRadius < 0 || | ||
!mousePos) { | ||
return; | ||
} | ||
const distance = Math.abs(container.retina.connectModeRadius), query = container.particles.quadTree.queryCircle(mousePos, distance, (p) => this.isEnabled(p)); | ||
let i = 0; | ||
for (const p1 of query) { | ||
const pos1 = p1.getPosition(); | ||
for (const p2 of query.slice(i + 1)) { | ||
const pos2 = p2.getPosition(), distMax = Math.abs(container.retina.connectModeDistance), xDiff = Math.abs(pos1.x - pos2.x), yDiff = Math.abs(pos1.y - pos2.y); | ||
if (xDiff < distMax && yDiff < distMax) { | ||
(0, Utils_1.drawConnection)(container, p1, p2); | ||
} | ||
++i; | ||
} | ||
++i; | ||
} | ||
}); | ||
} | ||
} | ||
isEnabled(particle) { | ||
var _a; | ||
const container = this.container, mouse = container.interactivity.mouse, events = ((_a = particle === null || particle === void 0 ? void 0 : particle.interactivity) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity).events; | ||
const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events; | ||
if (!(events.onHover.enable && mouse.position)) { | ||
@@ -106,3 +60,3 @@ return false; | ||
for (const source of sources) { | ||
options.connect.load(source === null || source === void 0 ? void 0 : source.connect); | ||
options.connect.load(source?.connect); | ||
} | ||
@@ -109,0 +63,0 @@ } |
@@ -16,18 +16,7 @@ "use strict"; | ||
}; | ||
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) { | ||
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } | ||
return new (P || (P = Promise))(function (resolve, reject) { | ||
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } | ||
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } | ||
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } | ||
step((generator = generator.apply(thisArg, _arguments || [])).next()); | ||
}); | ||
}; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.loadExternalConnectInteraction = void 0; | ||
const Connector_1 = require("./Connector"); | ||
function loadExternalConnectInteraction(engine) { | ||
return __awaiter(this, void 0, void 0, function* () { | ||
yield engine.addInteractor("externalConnect", (container) => new Connector_1.Connector(container)); | ||
}); | ||
async function loadExternalConnectInteraction(engine) { | ||
await engine.addInteractor("externalConnect", (container) => new Connector_1.Connector(container)); | ||
} | ||
@@ -34,0 +23,0 @@ exports.loadExternalConnectInteraction = loadExternalConnectInteraction; |
@@ -24,3 +24,2 @@ "use strict"; | ||
load(data) { | ||
var _a, _b; | ||
if (!data) { | ||
@@ -32,3 +31,3 @@ return; | ||
} | ||
this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked); | ||
this.links.load(data.links ?? data.lineLinked ?? data.line_linked); | ||
if (data.radius !== undefined) { | ||
@@ -35,0 +34,0 @@ this.radius = data.radius; |
@@ -1,38 +0,4 @@ | ||
import { ExternalInteractorBase, colorMix, drawLine, getStyleFromHsl, getStyleFromRgb, isInArray, } from "tsparticles-engine"; | ||
import { ExternalInteractorBase, isInArray, } from "tsparticles-engine"; | ||
import { Connect } from "./Options/Classes/Connect"; | ||
function gradient(context, p1, p2, opacity) { | ||
const gradStop = Math.floor(p2.getRadius() / p1.getRadius()), color1 = p1.getFillColor(), color2 = p2.getFillColor(); | ||
if (!color1 || !color2) { | ||
return; | ||
} | ||
const sourcePos = p1.getPosition(), destPos = p2.getPosition(), midRgb = colorMix(color1, color2, p1.getRadius(), p2.getRadius()), grad = context.createLinearGradient(sourcePos.x, sourcePos.y, destPos.x, destPos.y); | ||
grad.addColorStop(0, getStyleFromHsl(color1, opacity)); | ||
grad.addColorStop(gradStop > 1 ? 1 : gradStop, getStyleFromRgb(midRgb, opacity)); | ||
grad.addColorStop(1, getStyleFromHsl(color2, opacity)); | ||
return grad; | ||
} | ||
function drawConnectLine(context, width, lineStyle, begin, end) { | ||
drawLine(context, begin, end); | ||
context.lineWidth = width; | ||
context.strokeStyle = lineStyle; | ||
context.stroke(); | ||
} | ||
function lineStyle(container, ctx, p1, p2) { | ||
const options = container.actualOptions, connectOptions = options.interactivity.modes.connect; | ||
if (!connectOptions) { | ||
return; | ||
} | ||
return gradient(ctx, p1, p2, connectOptions.links.opacity); | ||
} | ||
function drawConnection(container, p1, p2) { | ||
container.canvas.draw((ctx) => { | ||
var _a; | ||
const ls = lineStyle(container, ctx, p1, p2); | ||
if (!ls) { | ||
return; | ||
} | ||
const pos1 = p1.getPosition(), pos2 = p2.getPosition(); | ||
drawConnectLine(ctx, (_a = p1.retina.linksWidth) !== null && _a !== void 0 ? _a : 0, ls, pos1, pos2); | ||
}); | ||
} | ||
import { drawConnection } from "./Utils"; | ||
export class Connector extends ExternalInteractorBase { | ||
@@ -78,4 +44,3 @@ constructor(container) { | ||
isEnabled(particle) { | ||
var _a; | ||
const container = this.container, mouse = container.interactivity.mouse, events = ((_a = particle === null || particle === void 0 ? void 0 : particle.interactivity) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity).events; | ||
const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events; | ||
if (!(events.onHover.enable && mouse.position)) { | ||
@@ -91,3 +56,3 @@ return false; | ||
for (const source of sources) { | ||
options.connect.load(source === null || source === void 0 ? void 0 : source.connect); | ||
options.connect.load(source?.connect); | ||
} | ||
@@ -94,0 +59,0 @@ } |
@@ -21,3 +21,2 @@ import { ConnectLinks } from "./ConnectLinks"; | ||
load(data) { | ||
var _a, _b; | ||
if (!data) { | ||
@@ -29,3 +28,3 @@ return; | ||
} | ||
this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked); | ||
this.links.load(data.links ?? data.lineLinked ?? data.line_linked); | ||
if (data.radius !== undefined) { | ||
@@ -32,0 +31,0 @@ this.radius = data.radius; |
{ | ||
"name": "tsparticles-interaction-external-connect", | ||
"version": "2.9.3", | ||
"version": "2.10.0", | ||
"description": "tsParticles connect external interaction", | ||
@@ -77,4 +77,4 @@ "homepage": "https://particles.js.org", | ||
"dependencies": { | ||
"tsparticles-engine": "^2.9.3" | ||
"tsparticles-engine": "^2.10.0" | ||
} | ||
} |
@@ -7,3 +7,3 @@ /*! | ||
* How to use? : Check the GitHub README | ||
* v2.9.3 | ||
* v2.10.0 | ||
*/ | ||
@@ -95,5 +95,5 @@ (function webpackUniversalModuleDefinition(root, factory) { | ||
__webpack_require__.d(__webpack_exports__, { | ||
"Connect": () => (/* reexport */ Connect), | ||
"ConnectLinks": () => (/* reexport */ ConnectLinks), | ||
"loadExternalConnectInteraction": () => (/* binding */ loadExternalConnectInteraction) | ||
Connect: () => (/* reexport */ Connect), | ||
ConnectLinks: () => (/* reexport */ ConnectLinks), | ||
loadExternalConnectInteraction: () => (/* binding */ loadExternalConnectInteraction) | ||
}); | ||
@@ -138,3 +138,2 @@ | ||
load(data) { | ||
var _a, _b; | ||
if (!data) { | ||
@@ -146,3 +145,3 @@ return; | ||
} | ||
this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked); | ||
this.links.load(data.links ?? data.lineLinked ?? data.line_linked); | ||
if (data.radius !== undefined) { | ||
@@ -153,5 +152,4 @@ this.radius = data.radius; | ||
} | ||
;// CONCATENATED MODULE: ./dist/browser/Connector.js | ||
;// CONCATENATED MODULE: ./dist/browser/Utils.js | ||
function gradient(context, p1, p2, opacity) { | ||
@@ -189,3 +187,2 @@ const gradStop = Math.floor(p2.getRadius() / p1.getRadius()), | ||
container.canvas.draw(ctx => { | ||
var _a; | ||
const ls = lineStyle(container, ctx, p1, p2); | ||
@@ -197,5 +194,9 @@ if (!ls) { | ||
pos2 = p2.getPosition(); | ||
drawConnectLine(ctx, (_a = p1.retina.linksWidth) !== null && _a !== void 0 ? _a : 0, ls, pos1, pos2); | ||
drawConnectLine(ctx, p1.retina.linksWidth ?? 0, ls, pos1, pos2); | ||
}); | ||
} | ||
;// CONCATENATED MODULE: ./dist/browser/Connector.js | ||
class Connector extends external_commonjs_tsparticles_engine_commonjs2_tsparticles_engine_amd_tsparticles_engine_root_window_.ExternalInteractorBase { | ||
@@ -242,6 +243,5 @@ constructor(container) { | ||
isEnabled(particle) { | ||
var _a; | ||
const container = this.container, | ||
mouse = container.interactivity.mouse, | ||
events = ((_a = particle === null || particle === void 0 ? void 0 : particle.interactivity) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity).events; | ||
events = (particle?.interactivity ?? container.actualOptions.interactivity).events; | ||
if (!(events.onHover.enable && mouse.position)) { | ||
@@ -257,3 +257,3 @@ return false; | ||
for (const source of sources) { | ||
options.connect.load(source === null || source === void 0 ? void 0 : source.connect); | ||
options.connect.load(source?.connect); | ||
} | ||
@@ -260,0 +260,0 @@ } |
/*! For license information please see tsparticles.interaction.external.connect.min.js.LICENSE.txt */ | ||
!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("tsparticles-engine"));else if("function"==typeof define&&define.amd)define(["tsparticles-engine"],e);else{var n="object"==typeof exports?e(require("tsparticles-engine")):e(t.window);for(var i in n)("object"==typeof exports?exports:t)[i]=n[i]}}(this,(t=>(()=>{"use strict";var e={961:e=>{e.exports=t}},n={};function i(t){var o=n[t];if(void 0!==o)return o.exports;var r=n[t]={exports:{}};return e[t](r,r.exports,i),r.exports}i.d=(t,e)=>{for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var o={};return(()=>{i.r(o),i.d(o,{Connect:()=>n,ConnectLinks:()=>e,loadExternalConnectInteraction:()=>c});var t=i(961);class e{constructor(){this.opacity=.5}load(t){t&&void 0!==t.opacity&&(this.opacity=t.opacity)}}class n{constructor(){this.distance=80,this.links=new e,this.radius=60}get lineLinked(){return this.links}set lineLinked(t){this.links=t}get line_linked(){return this.links}set line_linked(t){this.links=t}load(t){var e,n;t&&(void 0!==t.distance&&(this.distance=t.distance),this.links.load(null!==(n=null!==(e=t.links)&&void 0!==e?e:t.lineLinked)&&void 0!==n?n:t.line_linked),void 0!==t.radius&&(this.radius=t.radius))}}function r(e,n,i,o){const r=e.actualOptions.interactivity.modes.connect;if(r)return function(e,n,i,o){const r=Math.floor(i.getRadius()/n.getRadius()),s=n.getFillColor(),a=i.getFillColor();if(!s||!a)return;const c=n.getPosition(),l=i.getPosition(),d=(0,t.colorMix)(s,a,n.getRadius(),i.getRadius()),u=e.createLinearGradient(c.x,c.y,l.x,l.y);return u.addColorStop(0,(0,t.getStyleFromHsl)(s,o)),u.addColorStop(r>1?1:r,(0,t.getStyleFromRgb)(d,o)),u.addColorStop(1,(0,t.getStyleFromHsl)(a,o)),u}(n,i,o,r.links.opacity)}function s(e,n,i){e.canvas.draw((o=>{var s;const a=r(e,o,n,i);if(!a)return;const c=n.getPosition(),l=i.getPosition();!function(e,n,i,o,r){(0,t.drawLine)(e,o,r),e.lineWidth=n,e.strokeStyle=i,e.stroke()}(o,null!==(s=n.retina.linksWidth)&&void 0!==s?s:0,a,c,l)}))}class a extends t.ExternalInteractorBase{constructor(t){super(t)}clear(){}init(){const t=this.container,e=t.actualOptions.interactivity.modes.connect;e&&(t.retina.connectModeDistance=e.distance*t.retina.pixelRatio,t.retina.connectModeRadius=e.radius*t.retina.pixelRatio)}async interact(){const t=this.container;if(t.actualOptions.interactivity.events.onHover.enable&&"pointermove"===t.interactivity.status){const e=t.interactivity.mouse.position;if(!t.retina.connectModeDistance||t.retina.connectModeDistance<0||!t.retina.connectModeRadius||t.retina.connectModeRadius<0||!e)return;const n=Math.abs(t.retina.connectModeRadius),i=t.particles.quadTree.queryCircle(e,n,(t=>this.isEnabled(t)));let o=0;for(const e of i){const n=e.getPosition();for(const r of i.slice(o+1)){const i=r.getPosition(),o=Math.abs(t.retina.connectModeDistance),a=Math.abs(n.x-i.x),c=Math.abs(n.y-i.y);a<o&&c<o&&s(t,e,r)}++o}}}isEnabled(e){var n;const i=this.container,o=i.interactivity.mouse,r=(null!==(n=null==e?void 0:e.interactivity)&&void 0!==n?n:i.actualOptions.interactivity).events;return!(!r.onHover.enable||!o.position)&&(0,t.isInArray)("connect",r.onHover.mode)}loadModeOptions(t,...e){t.connect||(t.connect=new n);for(const n of e)t.connect.load(null==n?void 0:n.connect)}reset(){}}async function c(t){await t.addInteractor("externalConnect",(t=>new a(t)))}})(),o})())); | ||
!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("tsparticles-engine"));else if("function"==typeof define&&define.amd)define(["tsparticles-engine"],e);else{var n="object"==typeof exports?e(require("tsparticles-engine")):e(t.window);for(var i in n)("object"==typeof exports?exports:t)[i]=n[i]}}(this,(t=>(()=>{"use strict";var e={961:e=>{e.exports=t}},n={};function i(t){var o=n[t];if(void 0!==o)return o.exports;var r=n[t]={exports:{}};return e[t](r,r.exports,i),r.exports}i.d=(t,e)=>{for(var n in e)i.o(e,n)&&!i.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},i.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),i.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var o={};return(()=>{i.r(o),i.d(o,{Connect:()=>n,ConnectLinks:()=>e,loadExternalConnectInteraction:()=>c});var t=i(961);class e{constructor(){this.opacity=.5}load(t){t&&void 0!==t.opacity&&(this.opacity=t.opacity)}}class n{constructor(){this.distance=80,this.links=new e,this.radius=60}get lineLinked(){return this.links}set lineLinked(t){this.links=t}get line_linked(){return this.links}set line_linked(t){this.links=t}load(t){t&&(void 0!==t.distance&&(this.distance=t.distance),this.links.load(t.links??t.lineLinked??t.line_linked),void 0!==t.radius&&(this.radius=t.radius))}}function r(e,n,i,o){const r=e.actualOptions.interactivity.modes.connect;if(r)return function(e,n,i,o){const r=Math.floor(i.getRadius()/n.getRadius()),s=n.getFillColor(),a=i.getFillColor();if(!s||!a)return;const c=n.getPosition(),l=i.getPosition(),d=(0,t.colorMix)(s,a,n.getRadius(),i.getRadius()),u=e.createLinearGradient(c.x,c.y,l.x,l.y);return u.addColorStop(0,(0,t.getStyleFromHsl)(s,o)),u.addColorStop(r>1?1:r,(0,t.getStyleFromRgb)(d,o)),u.addColorStop(1,(0,t.getStyleFromHsl)(a,o)),u}(n,i,o,r.links.opacity)}function s(e,n,i){e.canvas.draw((o=>{const s=r(e,o,n,i);if(!s)return;const a=n.getPosition(),c=i.getPosition();!function(e,n,i,o,r){(0,t.drawLine)(e,o,r),e.lineWidth=n,e.strokeStyle=i,e.stroke()}(o,n.retina.linksWidth??0,s,a,c)}))}class a extends t.ExternalInteractorBase{constructor(t){super(t)}clear(){}init(){const t=this.container,e=t.actualOptions.interactivity.modes.connect;e&&(t.retina.connectModeDistance=e.distance*t.retina.pixelRatio,t.retina.connectModeRadius=e.radius*t.retina.pixelRatio)}async interact(){const t=this.container;if(t.actualOptions.interactivity.events.onHover.enable&&"pointermove"===t.interactivity.status){const e=t.interactivity.mouse.position;if(!t.retina.connectModeDistance||t.retina.connectModeDistance<0||!t.retina.connectModeRadius||t.retina.connectModeRadius<0||!e)return;const n=Math.abs(t.retina.connectModeRadius),i=t.particles.quadTree.queryCircle(e,n,(t=>this.isEnabled(t)));let o=0;for(const e of i){const n=e.getPosition();for(const r of i.slice(o+1)){const i=r.getPosition(),o=Math.abs(t.retina.connectModeDistance),a=Math.abs(n.x-i.x),c=Math.abs(n.y-i.y);a<o&&c<o&&s(t,e,r)}++o}}}isEnabled(e){const n=this.container,i=n.interactivity.mouse,o=(e?.interactivity??n.actualOptions.interactivity).events;return!(!o.onHover.enable||!i.position)&&(0,t.isInArray)("connect",o.onHover.mode)}loadModeOptions(t,...e){t.connect||(t.connect=new n);for(const n of e)t.connect.load(n?.connect)}reset(){}}async function c(t){await t.addInteractor("externalConnect",(t=>new a(t)))}})(),o})())); |
@@ -1,1 +0,1 @@ | ||
/*! tsParticles Connect External Interaction v2.9.3 by Matteo Bruni */ | ||
/*! tsParticles Connect External Interaction v2.10.0 by Matteo Bruni */ |
import type { ConnectContainer, ConnectMode, IConnectMode } from "./Types"; | ||
import { ExternalInteractorBase } from "tsparticles-engine"; | ||
import type { IModes, Modes, Particle, RecursivePartial } from "tsparticles-engine"; | ||
import { ExternalInteractorBase, type IModes, type Modes, type Particle, type RecursivePartial } from "tsparticles-engine"; | ||
export declare class Connector extends ExternalInteractorBase<ConnectContainer> { | ||
@@ -5,0 +4,0 @@ constructor(container: ConnectContainer); |
@@ -0,4 +1,4 @@ | ||
import type { Container, Particle } from "tsparticles-engine"; | ||
import type { Connect } from "./Options/Classes/Connect"; | ||
import type { ConnectOptions } from "./Options/Classes/ConnectOptions"; | ||
import type { Container } from "tsparticles-engine"; | ||
import type { IConnect } from "./Options/Interfaces/IConnect"; | ||
@@ -18,1 +18,6 @@ export type IConnectMode = { | ||
}; | ||
export type LinkParticle = Particle & { | ||
retina: { | ||
linksWidth?: number; | ||
}; | ||
}; |
@@ -7,3 +7,3 @@ (function (factory) { | ||
else if (typeof define === "function" && define.amd) { | ||
define(["require", "exports", "tsparticles-engine", "./Options/Classes/Connect"], factory); | ||
define(["require", "exports", "tsparticles-engine", "./Options/Classes/Connect", "./Utils"], factory); | ||
} | ||
@@ -16,37 +16,3 @@ })(function (require, exports) { | ||
const Connect_1 = require("./Options/Classes/Connect"); | ||
function gradient(context, p1, p2, opacity) { | ||
const gradStop = Math.floor(p2.getRadius() / p1.getRadius()), color1 = p1.getFillColor(), color2 = p2.getFillColor(); | ||
if (!color1 || !color2) { | ||
return; | ||
} | ||
const sourcePos = p1.getPosition(), destPos = p2.getPosition(), midRgb = (0, tsparticles_engine_1.colorMix)(color1, color2, p1.getRadius(), p2.getRadius()), grad = context.createLinearGradient(sourcePos.x, sourcePos.y, destPos.x, destPos.y); | ||
grad.addColorStop(0, (0, tsparticles_engine_1.getStyleFromHsl)(color1, opacity)); | ||
grad.addColorStop(gradStop > 1 ? 1 : gradStop, (0, tsparticles_engine_1.getStyleFromRgb)(midRgb, opacity)); | ||
grad.addColorStop(1, (0, tsparticles_engine_1.getStyleFromHsl)(color2, opacity)); | ||
return grad; | ||
} | ||
function drawConnectLine(context, width, lineStyle, begin, end) { | ||
(0, tsparticles_engine_1.drawLine)(context, begin, end); | ||
context.lineWidth = width; | ||
context.strokeStyle = lineStyle; | ||
context.stroke(); | ||
} | ||
function lineStyle(container, ctx, p1, p2) { | ||
const options = container.actualOptions, connectOptions = options.interactivity.modes.connect; | ||
if (!connectOptions) { | ||
return; | ||
} | ||
return gradient(ctx, p1, p2, connectOptions.links.opacity); | ||
} | ||
function drawConnection(container, p1, p2) { | ||
container.canvas.draw((ctx) => { | ||
var _a; | ||
const ls = lineStyle(container, ctx, p1, p2); | ||
if (!ls) { | ||
return; | ||
} | ||
const pos1 = p1.getPosition(), pos2 = p2.getPosition(); | ||
drawConnectLine(ctx, (_a = p1.retina.linksWidth) !== null && _a !== void 0 ? _a : 0, ls, pos1, pos2); | ||
}); | ||
} | ||
const Utils_1 = require("./Utils"); | ||
class Connector extends tsparticles_engine_1.ExternalInteractorBase { | ||
@@ -84,3 +50,3 @@ constructor(container) { | ||
if (xDiff < distMax && yDiff < distMax) { | ||
drawConnection(container, p1, p2); | ||
(0, Utils_1.drawConnection)(container, p1, p2); | ||
} | ||
@@ -93,4 +59,3 @@ } | ||
isEnabled(particle) { | ||
var _a; | ||
const container = this.container, mouse = container.interactivity.mouse, events = ((_a = particle === null || particle === void 0 ? void 0 : particle.interactivity) !== null && _a !== void 0 ? _a : container.actualOptions.interactivity).events; | ||
const container = this.container, mouse = container.interactivity.mouse, events = (particle?.interactivity ?? container.actualOptions.interactivity).events; | ||
if (!(events.onHover.enable && mouse.position)) { | ||
@@ -106,3 +71,3 @@ return false; | ||
for (const source of sources) { | ||
options.connect.load(source === null || source === void 0 ? void 0 : source.connect); | ||
options.connect.load(source?.connect); | ||
} | ||
@@ -109,0 +74,0 @@ } |
@@ -33,3 +33,2 @@ (function (factory) { | ||
load(data) { | ||
var _a, _b; | ||
if (!data) { | ||
@@ -41,3 +40,3 @@ return; | ||
} | ||
this.links.load((_b = (_a = data.links) !== null && _a !== void 0 ? _a : data.lineLinked) !== null && _b !== void 0 ? _b : data.line_linked); | ||
this.links.load(data.links ?? data.lineLinked ?? data.line_linked); | ||
if (data.radius !== undefined) { | ||
@@ -44,0 +43,0 @@ this.radius = data.radius; |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
52
1115
332232
Updatedtsparticles-engine@^2.10.0