@tsparticles/interaction-external-bubble - npm Package Compare versions

Comparing version 3.4.0 to 3.5.0

cjs/index.js

@@ -17,3 +17,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadExternalBubbleInteraction = void 0;
+exports.loadExternalBubbleInteraction = loadExternalBubbleInteraction;
 const Bubbler_js_1 = require("./Bubbler.js");
@@ -25,3 +25,2 @@ async function loadExternalBubbleInteraction(engine, refresh = true) {
 }
-exports.loadExternalBubbleInteraction = loadExternalBubbleInteraction;
 __exportStar(require("./Options/Classes/BubbleBase.js"), exports);
@@ -28,0 +27,0 @@ __exportStar(require("./Options/Classes/BubbleDiv.js"), exports);

cjs/Utils.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.calculateBubbleValue = void 0;
+exports.calculateBubbleValue = calculateBubbleValue;
 const engine_1 = require("@tsparticles/engine");
@@ -15,2 +15,1 @@ function calculateBubbleValue(particleValue, modeValue, optionsValue, ratio) {
 }
-exports.calculateBubbleValue = calculateBubbleValue;

package.json

 {
   "name": "@tsparticles/interaction-external-bubble",
-  "version": "3.4.0",
+  "version": "3.5.0",
   "description": "tsParticles bubble external interaction",
@@ -90,3 +90,3 @@ "homepage": "https://particles.js.org",
   "dependencies": {
-    "@tsparticles/engine": "^3.4.0"
+    "@tsparticles/engine": "^3.5.0"
   },
@@ -93,0 +93,0 @@ "publishConfig": {

tsparticles.interaction.external.bubble.js

@@ -7,3 +7,3 @@ /*!
  * How to use? : Check the GitHub README
- * v3.4.0
+ * v3.5.0
  */
@@ -10,0 +10,0 @@ /*

tsparticles.interaction.external.bubble.min.js

 /*! For license information please see tsparticles.interaction.external.bubble.min.js.LICENSE.txt */
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var i="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var o in i)("object"==typeof exports?exports:e)[o]=i[o]}}(this,(e=>(()=>{var t={303:t=>{t.exports=e}},i={};function o(e){var n=i[e];if(void 0!==n)return n.exports;var b=i[e]={exports:{}};return t[e](b,b.exports,o),b.exports}o.d=(e,t)=>{for(var i in t)o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{o.r(n),o.d(n,{Bubble:()=>l,BubbleBase:()=>i,BubbleDiv:()=>b,loadExternalBubbleInteraction:()=>c});var e,t=o(303);class i{constructor(){this.distance=200,this.duration=.4,this.mix=!1}load(e){if(e){if(void 0!==e.distance&&(this.distance=e.distance),void 0!==e.duration&&(this.duration=e.duration),void 0!==e.mix&&(this.mix=e.mix),void 0!==e.opacity&&(this.opacity=e.opacity),void 0!==e.color){const i=(0,t.isArray)(this.color)?void 0:this.color;this.color=(0,t.executeOnSingleOrMultiple)(e.color,(e=>t.OptionsColor.create(i,e)))}void 0!==e.size&&(this.size=e.size)}}}class b extends i{constructor(){super(),this.selectors=[]}load(e){super.load(e),e&&void 0!==e.selectors&&(this.selectors=e.selectors)}}class l extends i{load(e){super.load(e),e&&(this.divs=(0,t.executeOnSingleOrMultiple)(e.divs,(e=>{const t=new b;return t.load(e),t})))}}function s(e,i,o,n){if(i>=o){const b=e+(i-o)*n;return(0,t.clamp)(b,e,i)}if(i<o){const b=e-(o-i)*n;return(0,t.clamp)(b,i,e)}}!function(e){e.color="color",e.opacity="opacity",e.size="size"}(e||(e={}));const r="bubble";class a extends t.ExternalInteractorBase{constructor(i){super(i),this._clickBubble=()=>{const i=this.container,o=i.actualOptions,n=i.interactivity.mouse.clickPosition,b=o.interactivity.modes.bubble;if(!b||!n)return;i.bubble||(i.bubble={});const l=i.retina.bubbleModeDistance;if(!l||l<0)return;const s=i.particles.quadTree.queryCircle(n,l,(e=>this.isEnabled(e))),{bubble:r}=i;for(const o of s){if(!r.clicking)continue;o.bubble.inRange=!r.durationEnd;const s=o.getPosition(),a=(0,t.getDistance)(s,n),c=((new Date).getTime()-(i.interactivity.mouse.clickTime??0))/t.millisecondsToSeconds;c>b.duration&&(r.durationEnd=!0),c>2*b.duration&&(r.clicking=!1,r.durationEnd=!1);const u={bubbleObj:{optValue:i.retina.bubbleModeSize,value:o.bubble.radius},particlesObj:{optValue:(0,t.getRangeMax)(o.options.size.value)*i.retina.pixelRatio,value:o.size.value},type:e.size};this._process(o,a,c,u);const d={bubbleObj:{optValue:b.opacity,value:o.bubble.opacity},particlesObj:{optValue:(0,t.getRangeMax)(o.options.opacity.value),value:o.opacity?.value??1},type:e.opacity};this._process(o,a,c,d),!r.durationEnd&&a<=l?this._hoverBubbleColor(o,a):delete o.bubble.color}},this._hoverBubble=()=>{const e=this.container,i=e.interactivity.mouse.position,o=e.retina.bubbleModeDistance;if(!o||o<0||!i)return;const n=e.particles.quadTree.queryCircle(i,o,(e=>this.isEnabled(e)));for(const b of n){b.bubble.inRange=!0;const n=b.getPosition(),l=(0,t.getDistance)(n,i),s=1-l/o;l<=o?s>=0&&e.interactivity.status===t.mouseMoveEvent&&(this._hoverBubbleSize(b,s),this._hoverBubbleOpacity(b,s),this._hoverBubbleColor(b,s)):this.reset(b),e.interactivity.status===t.mouseLeaveEvent&&this.reset(b)}},this._hoverBubbleColor=(e,i,o)=>{const n=this.container.actualOptions,b=o??n.interactivity.modes.bubble;if(b){if(!e.bubble.finalColor){const i=b.color;if(!i)return;const o=(0,t.itemFromSingleOrMultiple)(i);e.bubble.finalColor=(0,t.rangeColorToHsl)(o)}if(e.bubble.finalColor)if(b.mix){e.bubble.color=void 0;const o=e.getFillColor();e.bubble.color=o?(0,t.rgbToHsl)((0,t.colorMix)(o,e.bubble.finalColor,1-i,i)):e.bubble.finalColor}else e.bubble.color=e.bubble.finalColor}},this._hoverBubbleOpacity=(e,i,o)=>{const n=this.container.actualOptions,b=o?.opacity??n.interactivity.modes.bubble?.opacity;if(!b)return;const l=e.options.opacity.value,r=s(e.opacity?.value??1,b,(0,t.getRangeMax)(l),i);void 0!==r&&(e.bubble.opacity=r)},this._hoverBubbleSize=(e,i,o)=>{const n=this.container,b=o?.size?o.size*n.retina.pixelRatio:n.retina.bubbleModeSize;if(void 0===b)return;const l=(0,t.getRangeMax)(e.options.size.value)*n.retina.pixelRatio,r=s(e.size.value,b,l,i);void 0!==r&&(e.bubble.radius=r)},this._process=(t,i,o,n)=>{const b=this.container,l=n.bubbleObj.optValue,s=b.actualOptions.interactivity.modes.bubble;if(!s||void 0===l)return;const r=s.duration,a=b.retina.bubbleModeDistance,c=n.particlesObj.optValue,u=n.bubbleObj.value,d=n.particlesObj.value??0,p=n.type;if(a&&!(a<0)&&l!==c)if(b.bubble||(b.bubble={}),b.bubble.durationEnd)u&&(p===e.size&&delete t.bubble.radius,p===e.opacity&&delete t.bubble.opacity);else if(i<=a){if((u??d)!==l){const i=d-o*(d-l)/r;p===e.size&&(t.bubble.radius=i),p===e.opacity&&(t.bubble.opacity=i)}}else p===e.size&&delete t.bubble.radius,p===e.opacity&&delete t.bubble.opacity},this._singleSelectorHover=(e,i,o)=>{const n=this.container,b=document.querySelectorAll(i),l=n.actualOptions.interactivity.modes.bubble;l&&b.length&&b.forEach((i=>{const b=i,s=n.retina.pixelRatio,r={x:(b.offsetLeft+.5*b.offsetWidth)*s,y:(b.offsetTop+.5*b.offsetHeight)*s},a=.5*b.offsetWidth*s,c=o.type===t.DivType.circle?new t.Circle(r.x,r.y,a):new t.Rectangle(b.offsetLeft*s,b.offsetTop*s,b.offsetWidth*s,b.offsetHeight*s),u=n.particles.quadTree.query(c,(e=>this.isEnabled(e)));for(const i of u){if(!c.contains(i.getPosition()))continue;i.bubble.inRange=!0;const o=l.divs,n=(0,t.divMode)(o,b);i.bubble.div&&i.bubble.div===b||(this.clear(i,e,!0),i.bubble.div=b),this._hoverBubbleSize(i,1,n),this._hoverBubbleOpacity(i,1,n),this._hoverBubbleColor(i,1,n)}}))},i.bubble||(i.bubble={}),this.handleClickMode=e=>{e===r&&(i.bubble||(i.bubble={}),i.bubble.clicking=!0)}}clear(e,t,i){e.bubble.inRange&&!i||(delete e.bubble.div,delete e.bubble.opacity,delete e.bubble.radius,delete e.bubble.color)}init(){const e=this.container,t=e.actualOptions.interactivity.modes.bubble;t&&(e.retina.bubbleModeDistance=t.distance*e.retina.pixelRatio,void 0!==t.size&&(e.retina.bubbleModeSize=t.size*e.retina.pixelRatio))}interact(e){const i=this.container.actualOptions.interactivity.events,o=i.onHover,n=i.onClick,b=o.enable,l=o.mode,s=n.enable,a=n.mode,c=i.onDiv;b&&(0,t.isInArray)(r,l)?this._hoverBubble():s&&(0,t.isInArray)(r,a)?this._clickBubble():(0,t.divModeExecute)(r,c,((t,i)=>this._singleSelectorHover(e,t,i)))}isEnabled(e){const i=this.container,o=i.actualOptions,n=i.interactivity.mouse,b=(e?.interactivity??o.interactivity).events,{onClick:l,onDiv:s,onHover:a}=b,c=(0,t.isDivModeEnabled)(r,s);return!!(c||a.enable&&n.position||l.enable&&n.clickPosition)&&((0,t.isInArray)(r,a.mode)||(0,t.isInArray)(r,l.mode)||c)}loadModeOptions(e,...t){e.bubble||(e.bubble=new l);for(const i of t)e.bubble.load(i?.bubble)}reset(e){e.bubble.inRange=!1}}async function c(e,t=!0){await e.addInteractor("externalBubble",(e=>Promise.resolve(new a(e))),t)}})(),n})()));
+!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var i="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var o in i)("object"==typeof exports?exports:e)[o]=i[o]}}(this,(e=>(()=>{var t={303:t=>{t.exports=e}},i={};function o(e){var n=i[e];if(void 0!==n)return n.exports;var b=i[e]={exports:{}};return t[e](b,b.exports,o),b.exports}o.d=(e,t)=>{for(var i in t)o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};o.r(n),o.d(n,{Bubble:()=>a,BubbleBase:()=>s,BubbleDiv:()=>r,loadExternalBubbleInteraction:()=>p});var b,l=o(303);class s{constructor(){this.distance=200,this.duration=.4,this.mix=!1}load(e){if(e){if(void 0!==e.distance&&(this.distance=e.distance),void 0!==e.duration&&(this.duration=e.duration),void 0!==e.mix&&(this.mix=e.mix),void 0!==e.opacity&&(this.opacity=e.opacity),void 0!==e.color){const t=(0,l.isArray)(this.color)?void 0:this.color;this.color=(0,l.executeOnSingleOrMultiple)(e.color,(e=>l.OptionsColor.create(t,e)))}void 0!==e.size&&(this.size=e.size)}}}class r extends s{constructor(){super(),this.selectors=[]}load(e){super.load(e),e&&void 0!==e.selectors&&(this.selectors=e.selectors)}}class a extends s{load(e){super.load(e),e&&(this.divs=(0,l.executeOnSingleOrMultiple)(e.divs,(e=>{const t=new r;return t.load(e),t})))}}function c(e,t,i,o){if(t>=i){const n=e+(t-i)*o;return(0,l.clamp)(n,e,t)}if(t<i){const n=e-(i-t)*o;return(0,l.clamp)(n,t,e)}}!function(e){e.color="color",e.opacity="opacity",e.size="size"}(b||(b={}));const u="bubble";class d extends l.ExternalInteractorBase{constructor(e){super(e),this._clickBubble=()=>{const e=this.container,t=e.actualOptions,i=e.interactivity.mouse.clickPosition,o=t.interactivity.modes.bubble;if(!o||!i)return;e.bubble||(e.bubble={});const n=e.retina.bubbleModeDistance;if(!n||n<0)return;const s=e.particles.quadTree.queryCircle(i,n,(e=>this.isEnabled(e))),{bubble:r}=e;for(const t of s){if(!r.clicking)continue;t.bubble.inRange=!r.durationEnd;const s=t.getPosition(),a=(0,l.getDistance)(s,i),c=((new Date).getTime()-(e.interactivity.mouse.clickTime??0))/l.millisecondsToSeconds;c>o.duration&&(r.durationEnd=!0),c>2*o.duration&&(r.clicking=!1,r.durationEnd=!1);const u={bubbleObj:{optValue:e.retina.bubbleModeSize,value:t.bubble.radius},particlesObj:{optValue:(0,l.getRangeMax)(t.options.size.value)*e.retina.pixelRatio,value:t.size.value},type:b.size};this._process(t,a,c,u);const d={bubbleObj:{optValue:o.opacity,value:t.bubble.opacity},particlesObj:{optValue:(0,l.getRangeMax)(t.options.opacity.value),value:t.opacity?.value??1},type:b.opacity};this._process(t,a,c,d),!r.durationEnd&&a<=n?this._hoverBubbleColor(t,a):delete t.bubble.color}},this._hoverBubble=()=>{const e=this.container,t=e.interactivity.mouse.position,i=e.retina.bubbleModeDistance;if(!i||i<0||!t)return;const o=e.particles.quadTree.queryCircle(t,i,(e=>this.isEnabled(e)));for(const n of o){n.bubble.inRange=!0;const o=n.getPosition(),b=(0,l.getDistance)(o,t),s=1-b/i;b<=i?s>=0&&e.interactivity.status===l.mouseMoveEvent&&(this._hoverBubbleSize(n,s),this._hoverBubbleOpacity(n,s),this._hoverBubbleColor(n,s)):this.reset(n),e.interactivity.status===l.mouseLeaveEvent&&this.reset(n)}},this._hoverBubbleColor=(e,t,i)=>{const o=this.container.actualOptions,n=i??o.interactivity.modes.bubble;if(n){if(!e.bubble.finalColor){const t=n.color;if(!t)return;const i=(0,l.itemFromSingleOrMultiple)(t);e.bubble.finalColor=(0,l.rangeColorToHsl)(i)}if(e.bubble.finalColor)if(n.mix){e.bubble.color=void 0;const i=e.getFillColor();e.bubble.color=i?(0,l.rgbToHsl)((0,l.colorMix)(i,e.bubble.finalColor,1-t,t)):e.bubble.finalColor}else e.bubble.color=e.bubble.finalColor}},this._hoverBubbleOpacity=(e,t,i)=>{const o=this.container.actualOptions,n=i?.opacity??o.interactivity.modes.bubble?.opacity;if(!n)return;const b=e.options.opacity.value,s=c(e.opacity?.value??1,n,(0,l.getRangeMax)(b),t);void 0!==s&&(e.bubble.opacity=s)},this._hoverBubbleSize=(e,t,i)=>{const o=this.container,n=i?.size?i.size*o.retina.pixelRatio:o.retina.bubbleModeSize;if(void 0===n)return;const b=(0,l.getRangeMax)(e.options.size.value)*o.retina.pixelRatio,s=c(e.size.value,n,b,t);void 0!==s&&(e.bubble.radius=s)},this._process=(e,t,i,o)=>{const n=this.container,l=o.bubbleObj.optValue,s=n.actualOptions.interactivity.modes.bubble;if(!s||void 0===l)return;const r=s.duration,a=n.retina.bubbleModeDistance,c=o.particlesObj.optValue,u=o.bubbleObj.value,d=o.particlesObj.value??0,p=o.type;if(a&&!(a<0)&&l!==c)if(n.bubble||(n.bubble={}),n.bubble.durationEnd)u&&(p===b.size&&delete e.bubble.radius,p===b.opacity&&delete e.bubble.opacity);else if(t<=a){if((u??d)!==l){const t=d-i*(d-l)/r;p===b.size&&(e.bubble.radius=t),p===b.opacity&&(e.bubble.opacity=t)}}else p===b.size&&delete e.bubble.radius,p===b.opacity&&delete e.bubble.opacity},this._singleSelectorHover=(e,t,i)=>{const o=this.container,n=document.querySelectorAll(t),b=o.actualOptions.interactivity.modes.bubble;b&&n.length&&n.forEach((t=>{const n=t,s=o.retina.pixelRatio,r={x:(n.offsetLeft+.5*n.offsetWidth)*s,y:(n.offsetTop+.5*n.offsetHeight)*s},a=.5*n.offsetWidth*s,c=i.type===l.DivType.circle?new l.Circle(r.x,r.y,a):new l.Rectangle(n.offsetLeft*s,n.offsetTop*s,n.offsetWidth*s,n.offsetHeight*s),u=o.particles.quadTree.query(c,(e=>this.isEnabled(e)));for(const t of u){if(!c.contains(t.getPosition()))continue;t.bubble.inRange=!0;const i=b.divs,o=(0,l.divMode)(i,n);t.bubble.div&&t.bubble.div===n||(this.clear(t,e,!0),t.bubble.div=n),this._hoverBubbleSize(t,1,o),this._hoverBubbleOpacity(t,1,o),this._hoverBubbleColor(t,1,o)}}))},e.bubble||(e.bubble={}),this.handleClickMode=t=>{t===u&&(e.bubble||(e.bubble={}),e.bubble.clicking=!0)}}clear(e,t,i){e.bubble.inRange&&!i||(delete e.bubble.div,delete e.bubble.opacity,delete e.bubble.radius,delete e.bubble.color)}init(){const e=this.container,t=e.actualOptions.interactivity.modes.bubble;t&&(e.retina.bubbleModeDistance=t.distance*e.retina.pixelRatio,void 0!==t.size&&(e.retina.bubbleModeSize=t.size*e.retina.pixelRatio))}interact(e){const t=this.container.actualOptions.interactivity.events,i=t.onHover,o=t.onClick,n=i.enable,b=i.mode,s=o.enable,r=o.mode,a=t.onDiv;n&&(0,l.isInArray)(u,b)?this._hoverBubble():s&&(0,l.isInArray)(u,r)?this._clickBubble():(0,l.divModeExecute)(u,a,((t,i)=>this._singleSelectorHover(e,t,i)))}isEnabled(e){const t=this.container,i=t.actualOptions,o=t.interactivity.mouse,n=(e?.interactivity??i.interactivity).events,{onClick:b,onDiv:s,onHover:r}=n,a=(0,l.isDivModeEnabled)(u,s);return!!(a||r.enable&&o.position||b.enable&&o.clickPosition)&&((0,l.isInArray)(u,r.mode)||(0,l.isInArray)(u,b.mode)||a)}loadModeOptions(e,...t){e.bubble||(e.bubble=new a);for(const i of t)e.bubble.load(i?.bubble)}reset(e){e.bubble.inRange=!1}}async function p(e,t=!0){await e.addInteractor("externalBubble",(e=>Promise.resolve(new d(e))),t)}return n})()));

tsparticles.interaction.external.bubble.min.js.LICENSE.txt

@@ -1,1 +0,1 @@
-/*! tsParticles Bubble External Interaction v3.4.0 by Matteo Bruni */
+/*! tsParticles Bubble External Interaction v3.5.0 by Matteo Bruni */

umd/index.js

@@ -26,3 +26,3 @@ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.loadExternalBubbleInteraction = void 0;
+    exports.loadExternalBubbleInteraction = loadExternalBubbleInteraction;
     const Bubbler_js_1 = require("./Bubbler.js");
@@ -34,3 +34,2 @@ async function loadExternalBubbleInteraction(engine, refresh = true) {
     }
-    exports.loadExternalBubbleInteraction = loadExternalBubbleInteraction;
     __exportStar(require("./Options/Classes/BubbleBase.js"), exports);
@@ -37,0 +36,0 @@ __exportStar(require("./Options/Classes/BubbleDiv.js"), exports);

umd/Utils.js

@@ -12,3 +12,3 @@ (function (factory) {
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.calculateBubbleValue = void 0;
+    exports.calculateBubbleValue = calculateBubbleValue;
     const engine_1 = require("@tsparticles/engine");
@@ -25,3 +25,2 @@ function calculateBubbleValue(particleValue, modeValue, optionsValue, ratio) {
     }
-    exports.calculateBubbleValue = calculateBubbleValue;
 });

No alert changes

Worsened metrics

Total package byte prevSize

400754

decreased by-0.05%

Lines of code

2075

decreased by-0.19%

Dependency changes

• Updated@tsparticles/engine@^3.5.0