@tsparticles/engine 4.0.0-alpha.8 → 4.0.0-beta.1

package/cjs/Core/ParticlesManager.js

@@ -0,0 +1,363 @@
+import { countOffset, defaultDensityFactor, defaultRemoveQuantity, deleteCount, lengthOffset, minCount, minIndex, minLimit, spatialHashGridCellSize, squareExp, } from "./Utils/Constants.js";
+import { EventType } from "../Enums/Types/EventType.js";
+import { LimitMode } from "../Enums/Modes/LimitMode.js";
+import { Particle } from "./Particle.js";
+import { SpatialHashGrid } from "./Utils/SpatialHashGrid.js";
+import { getLogger } from "../Utils/LogUtils.js";
+import { loadParticlesOptions } from "../Utils/OptionsUtils.js";
+export class ParticlesManager {
+    checkParticlePositionPlugins;
+    grid;
+    _array;
+    _container;
+    _groupLimits;
+    _limit;
+    _maxZIndex;
+    _minZIndex;
+    _needsSort;
+    _nextId;
+    _particleResetPlugins;
+    _particleUpdatePlugins;
+    _pluginManager;
+    _pool;
+    _postParticleUpdatePlugins;
+    _postUpdatePlugins;
+    _resizeFactor;
+    _updatePlugins;
+    _zArray;
+    constructor(pluginManager, container) {
+        this._pluginManager = pluginManager;
+        this._container = container;
+        this._nextId = 0;
+        this._array = [];
+        this._zArray = [];
+        this._pool = [];
+        this._limit = 0;
+        this._groupLimits = new Map();
+        this._needsSort = false;
+        this._minZIndex = 0;
+        this._maxZIndex = 0;
+        this.grid = new SpatialHashGrid(spatialHashGridCellSize);
+        this.checkParticlePositionPlugins = [];
+        this._particleResetPlugins = [];
+        this._particleUpdatePlugins = [];
+        this._postUpdatePlugins = [];
+        this._postParticleUpdatePlugins = [];
+        this._updatePlugins = [];
+    }
+    get count() {
+        return this._array.length;
+    }
+    addParticle(position, overrideOptions, group, initializer) {
+        const limitMode = this._container.actualOptions.particles.number.limit.mode, limit = group === undefined ? this._limit : (this._groupLimits.get(group) ?? this._limit), currentCount = this.count;
+        if (limit > minLimit) {
+            switch (limitMode) {
+                case LimitMode.delete: {
+                    const countToRemove = currentCount + countOffset - limit;
+                    if (countToRemove > minCount) {
+                        this.removeQuantity(countToRemove);
+                    }
+                    break;
+                }
+                case LimitMode.wait:
+                    if (currentCount >= limit) {
+                        return;
+                    }
+                    break;
+                default:
+                    break;
+            }
+        }
+        try {
+            const particle = this._pool.pop() ?? new Particle(this._pluginManager, this._container);
+            particle.init(this._nextId, position, overrideOptions, group);
+            let canAdd = true;
+            if (initializer) {
+                canAdd = initializer(particle);
+            }
+            if (!canAdd) {
+                this._pool.push(particle);
+                return;
+            }
+            this._array.push(particle);
+            this._zArray.push(particle);
+            this._nextId++;
+            this._container.dispatchEvent(EventType.particleAdded, {
+                particle,
+            });
+            return particle;
+        }
+        catch (e) {
+            getLogger().warning(`error adding particle: ${e}`);
+        }
+        return undefined;
+    }
+    clear() {
+        this._array = [];
+        this._zArray = [];
+    }
+    destroy() {
+        this._array = [];
+        this._pool.length = 0;
+        this._zArray = [];
+        this.checkParticlePositionPlugins = [];
+        this._particleResetPlugins = [];
+        this._particleUpdatePlugins = [];
+        this._postUpdatePlugins = [];
+        this._postParticleUpdatePlugins = [];
+        this._updatePlugins = [];
+    }
+    drawParticles(delta) {
+        for (const particle of this._zArray) {
+            particle.draw(delta);
+        }
+    }
+    filter(condition) {
+        return this._array.filter(condition);
+    }
+    find(condition) {
+        return this._array.find(condition);
+    }
+    get(index) {
+        return this._array[index];
+    }
+    async init() {
+        const container = this._container, options = container.actualOptions;
+        this._minZIndex = 0;
+        this._maxZIndex = 0;
+        this._needsSort = false;
+        this.checkParticlePositionPlugins = [];
+        this._updatePlugins = [];
+        this._particleUpdatePlugins = [];
+        this._postUpdatePlugins = [];
+        this._particleResetPlugins = [];
+        this._postParticleUpdatePlugins = [];
+        this.grid = new SpatialHashGrid(spatialHashGridCellSize * container.retina.pixelRatio);
+        for (const plugin of container.plugins) {
+            if (plugin.redrawInit) {
+                await plugin.redrawInit();
+            }
+            if (plugin.checkParticlePosition) {
+                this.checkParticlePositionPlugins.push(plugin);
+            }
+            if (plugin.update) {
+                this._updatePlugins.push(plugin);
+            }
+            if (plugin.particleUpdate) {
+                this._particleUpdatePlugins.push(plugin);
+            }
+            if (plugin.postUpdate) {
+                this._postUpdatePlugins.push(plugin);
+            }
+            if (plugin.particleReset) {
+                this._particleResetPlugins.push(plugin);
+            }
+            if (plugin.postParticleUpdate) {
+                this._postParticleUpdatePlugins.push(plugin);
+            }
+        }
+        await this._container.initDrawersAndUpdaters();
+        for (const drawer of this._container.effectDrawers.values()) {
+            await drawer.init?.(container);
+        }
+        for (const drawer of this._container.shapeDrawers.values()) {
+            await drawer.init?.(container);
+        }
+        let handled = false;
+        for (const plugin of container.plugins) {
+            handled = plugin.particlesInitialization?.() ?? handled;
+            if (handled) {
+                break;
+            }
+        }
+        if (!handled) {
+            const particlesOptions = options.particles, groups = particlesOptions.groups;
+            for (const group in groups) {
+                const groupOptions = groups[group];
+                if (!groupOptions) {
+                    continue;
+                }
+                for (let i = this.count, j = 0; j < groupOptions.number.value && i < particlesOptions.number.value; i++, j++) {
+                    this.addParticle(undefined, groupOptions, group);
+                }
+            }
+            for (let i = this.count; i < particlesOptions.number.value; i++) {
+                this.addParticle();
+            }
+        }
+    }
+    push(nb, position, overrideOptions, group) {
+        for (let i = 0; i < nb; i++) {
+            this.addParticle(position, overrideOptions, group);
+        }
+    }
+    async redraw() {
+        this.clear();
+        await this.init();
+        this._container.canvas.render.drawParticles({ value: 0, factor: 0 });
+    }
+    remove(particle, group, override) {
+        this.removeAt(this._array.indexOf(particle), undefined, group, override);
+    }
+    removeAt(index, quantity = defaultRemoveQuantity, group, override) {
+        if (index < minIndex || index > this.count) {
+            return;
+        }
+        let deleted = 0;
+        for (let i = index; deleted < quantity && i < this.count; i++) {
+            if (this._removeParticle(i, group, override)) {
+                i--;
+                deleted++;
+            }
+        }
+    }
+    removeQuantity(quantity, group) {
+        this.removeAt(minIndex, quantity, group);
+    }
+    setDensity() {
+        const options = this._container.actualOptions, groups = options.particles.groups;
+        let pluginsCount = 0;
+        for (const plugin of this._container.plugins) {
+            if (plugin.particlesDensityCount) {
+                pluginsCount += plugin.particlesDensityCount();
+            }
+        }
+        for (const group in groups) {
+            const groupData = groups[group];
+            if (!groupData) {
+                continue;
+            }
+            const groupDataOptions = loadParticlesOptions(this._pluginManager, this._container, groupData);
+            this._applyDensity(groupDataOptions, pluginsCount, group);
+        }
+        this._applyDensity(options.particles, pluginsCount);
+    }
+    setLastZIndex(zIndex) {
+        this._needsSort ||= zIndex >= this._maxZIndex || (zIndex > this._minZIndex && zIndex < this._maxZIndex);
+    }
+    setResizeFactor(factor) {
+        this._resizeFactor = factor;
+    }
+    update(delta) {
+        const particlesToDelete = new Set();
+        this.grid.clear();
+        for (const plugin of this._updatePlugins) {
+            plugin.update?.(delta);
+        }
+        const resizeFactor = this._resizeFactor;
+        for (const particle of this._array) {
+            if (resizeFactor && !particle.ignoresResizeRatio) {
+                particle.position.x *= resizeFactor.width;
+                particle.position.y *= resizeFactor.height;
+                particle.initialPosition.x *= resizeFactor.width;
+                particle.initialPosition.y *= resizeFactor.height;
+            }
+            particle.ignoresResizeRatio = false;
+            for (const plugin of this._particleResetPlugins) {
+                plugin.particleReset?.(particle);
+            }
+            for (const plugin of this._particleUpdatePlugins) {
+                if (particle.destroyed) {
+                    break;
+                }
+                plugin.particleUpdate?.(particle, delta);
+            }
+            if (particle.destroyed) {
+                particlesToDelete.add(particle);
+                continue;
+            }
+            this.grid.insert(particle);
+        }
+        for (const plugin of this._postUpdatePlugins) {
+            plugin.postUpdate?.(delta);
+        }
+        for (const particle of this._array) {
+            if (particle.destroyed) {
+                particlesToDelete.add(particle);
+                continue;
+            }
+            for (const updater of this._container.particleUpdaters) {
+                updater.update(particle, delta);
+            }
+            if (!particle.destroyed && !particle.spawning) {
+                for (const plugin of this._postParticleUpdatePlugins) {
+                    plugin.postParticleUpdate?.(particle, delta);
+                }
+            }
+            else if (particle.destroyed) {
+                particlesToDelete.add(particle);
+            }
+        }
+        if (particlesToDelete.size) {
+            for (const particle of particlesToDelete) {
+                this.remove(particle);
+            }
+        }
+        delete this._resizeFactor;
+        if (this._needsSort) {
+            const zArray = this._zArray;
+            zArray.sort((a, b) => b.position.z - a.position.z || a.id - b.id);
+            const firstItem = zArray[minIndex], lastItem = zArray[zArray.length - lengthOffset];
+            if (!firstItem || !lastItem) {
+                return;
+            }
+            this._maxZIndex = firstItem.position.z;
+            this._minZIndex = lastItem.position.z;
+            this._needsSort = false;
+        }
+    }
+    _addToPool = (...particles) => {
+        this._pool.push(...particles);
+    };
+    _applyDensity = (options, pluginsCount, group, groupOptions) => {
+        const numberOptions = options.number;
+        if (!numberOptions.density.enable) {
+            if (group === undefined) {
+                this._limit = numberOptions.limit.value;
+            }
+            else if (groupOptions?.number.limit.value ?? numberOptions.limit.value) {
+                this._groupLimits.set(group, groupOptions?.number.limit.value ?? numberOptions.limit.value);
+            }
+            return;
+        }
+        const densityFactor = this._initDensityFactor(numberOptions.density), optParticlesNumber = numberOptions.value, optParticlesLimit = numberOptions.limit.value > minLimit ? numberOptions.limit.value : optParticlesNumber, particlesNumber = Math.min(optParticlesNumber, optParticlesLimit) * densityFactor + pluginsCount, particlesCount = Math.min(this.count, this.filter(t => t.group === group).length);
+        if (group === undefined) {
+            this._limit = numberOptions.limit.value * densityFactor;
+        }
+        else {
+            this._groupLimits.set(group, numberOptions.limit.value * densityFactor);
+        }
+        if (particlesCount < particlesNumber) {
+            this.push(Math.abs(particlesNumber - particlesCount), undefined, options, group);
+        }
+        else if (particlesCount > particlesNumber) {
+            this.removeQuantity(particlesCount - particlesNumber, group);
+        }
+    };
+    _initDensityFactor = densityOptions => {
+        const container = this._container;
+        if (!container.canvas.element || !densityOptions.enable) {
+            return defaultDensityFactor;
+        }
+        const canvas = container.canvas.element, pxRatio = container.retina.pixelRatio;
+        return (canvas.width * canvas.height) / (densityOptions.height * densityOptions.width * pxRatio ** squareExp);
+    };
+    _removeParticle = (index, group, override) => {
+        const particle = this._array[index];
+        if (!particle) {
+            return false;
+        }
+        if (particle.group !== group) {
+            return false;
+        }
+        const zIdx = this._zArray.indexOf(particle);
+        this._array.splice(index, deleteCount);
+        this._zArray.splice(zIdx, deleteCount);
+        particle.destroy(override);
+        this._container.dispatchEvent(EventType.particleRemoved, {
+            particle,
+        });
+        this._addToPool(particle);
+        return true;
+    };
+}

package/cjs/Core/RenderManager.js

@@ -0,0 +1,303 @@
+import { clear, drawParticle, drawParticlePlugin, paintBase, paintImage } from "../Utils/CanvasUtils.js";
+import { defaultCompositeValue, defaultTransformValue, minimumSize, zIndexFactorOffset } from "./Utils/Constants.js";
+import { getStyleFromHsl, rangeColorToHsl } from "../Utils/ColorUtils.js";
+const fColorIndex = 0, sColorIndex = 1;
+function setTransformValue(factor, newFactor, key) {
+    const newValue = newFactor[key];
+    if (newValue !== undefined) {
+        factor[key] = (factor[key] ?? defaultTransformValue) * newValue;
+    }
+}
+export class RenderManager {
+    _canvasClearPlugins;
+    _canvasManager;
+    _canvasPaintPlugins;
+    _clearDrawPlugins;
+    _colorPlugins;
+    _container;
+    _context;
+    _contextSettings;
+    _drawParticlePlugins;
+    _drawParticlesCleanupPlugins;
+    _drawParticlesSetupPlugins;
+    _drawPlugins;
+    _drawSettingsCleanupPlugins;
+    _drawSettingsSetupPlugins;
+    _pluginManager;
+    _postDrawUpdaters;
+    _preDrawUpdaters;
+    _reusableColorStyles = {};
+    _reusablePluginColors = [undefined, undefined];
+    _reusableTransform = {};
+    constructor(pluginManager, container, canvasManager) {
+        this._pluginManager = pluginManager;
+        this._container = container;
+        this._canvasManager = canvasManager;
+        this._context = null;
+        this._preDrawUpdaters = [];
+        this._postDrawUpdaters = [];
+        this._colorPlugins = [];
+        this._canvasClearPlugins = [];
+        this._canvasPaintPlugins = [];
+        this._clearDrawPlugins = [];
+        this._drawParticlePlugins = [];
+        this._drawParticlesCleanupPlugins = [];
+        this._drawParticlesSetupPlugins = [];
+        this._drawPlugins = [];
+        this._drawSettingsSetupPlugins = [];
+        this._drawSettingsCleanupPlugins = [];
+    }
+    get settings() {
+        return this._contextSettings;
+    }
+    canvasClear() {
+        if (!this._container.actualOptions.clear) {
+            return;
+        }
+        this.draw(ctx => {
+            clear(ctx, this._canvasManager.size);
+        });
+    }
+    clear() {
+        let pluginHandled = false;
+        for (const plugin of this._canvasClearPlugins) {
+            pluginHandled = plugin.canvasClear?.() ?? false;
+            if (pluginHandled) {
+                break;
+            }
+        }
+        if (pluginHandled) {
+            return;
+        }
+        this.canvasClear();
+    }
+    destroy() {
+        this.stop();
+        this._preDrawUpdaters = [];
+        this._postDrawUpdaters = [];
+        this._colorPlugins = [];
+        this._canvasClearPlugins = [];
+        this._canvasPaintPlugins = [];
+        this._clearDrawPlugins = [];
+        this._drawParticlePlugins = [];
+        this._drawParticlesCleanupPlugins = [];
+        this._drawParticlesSetupPlugins = [];
+        this._drawPlugins = [];
+        this._drawSettingsSetupPlugins = [];
+        this._drawSettingsCleanupPlugins = [];
+    }
+    draw(cb) {
+        const ctx = this._context;
+        if (!ctx) {
+            return;
+        }
+        return cb(ctx);
+    }
+    drawParticle(particle, delta) {
+        if (particle.spawning || particle.destroyed) {
+            return;
+        }
+        const radius = particle.getRadius();
+        if (radius <= minimumSize) {
+            return;
+        }
+        const pfColor = particle.getFillColor(), psColor = particle.getStrokeColor();
+        let [fColor, sColor] = this._getPluginParticleColors(particle);
+        fColor ??= pfColor;
+        sColor ??= psColor;
+        if (!fColor && !sColor) {
+            return;
+        }
+        const container = this._container, zIndexOptions = particle.options.zIndex, zIndexFactor = zIndexFactorOffset - particle.zIndexFactor, { fillOpacity, opacity, strokeOpacity } = particle.getOpacity(), transform = this._reusableTransform, colorStyles = this._reusableColorStyles, fill = fColor ? getStyleFromHsl(fColor, container.hdr, fillOpacity * opacity) : undefined, stroke = sColor ? getStyleFromHsl(sColor, container.hdr, strokeOpacity * opacity) : fill;
+        transform.a = transform.b = transform.c = transform.d = undefined;
+        colorStyles.fill = fill;
+        colorStyles.stroke = stroke;
+        this.draw((context) => {
+            for (const plugin of this._drawParticlesSetupPlugins) {
+                plugin.drawParticleSetup?.(context, particle, delta);
+            }
+            this._applyPreDrawUpdaters(context, particle, radius, opacity, colorStyles, transform);
+            drawParticle({
+                container,
+                context,
+                particle,
+                delta,
+                colorStyles,
+                radius: radius * zIndexFactor ** zIndexOptions.sizeRate,
+                opacity: opacity,
+                transform,
+            });
+            this._applyPostDrawUpdaters(particle);
+            for (const plugin of this._drawParticlesCleanupPlugins) {
+                plugin.drawParticleCleanup?.(context, particle, delta);
+            }
+        });
+    }
+    drawParticlePlugins(particle, delta) {
+        this.draw(ctx => {
+            for (const plugin of this._drawParticlePlugins) {
+                drawParticlePlugin(ctx, plugin, particle, delta);
+            }
+        });
+    }
+    drawParticles(delta) {
+        const { particles } = this._container;
+        this.clear();
+        particles.update(delta);
+        this.draw(ctx => {
+            for (const plugin of this._drawSettingsSetupPlugins) {
+                plugin.drawSettingsSetup?.(ctx, delta);
+            }
+            for (const plugin of this._drawPlugins) {
+                plugin.draw?.(ctx, delta);
+            }
+            particles.drawParticles(delta);
+            for (const plugin of this._clearDrawPlugins) {
+                plugin.clearDraw?.(ctx, delta);
+            }
+            for (const plugin of this._drawSettingsCleanupPlugins) {
+                plugin.drawSettingsCleanup?.(ctx, delta);
+            }
+        });
+    }
+    init() {
+        this.initUpdaters();
+        this.initPlugins();
+        this.paint();
+    }
+    initPlugins() {
+        this._colorPlugins = [];
+        this._canvasClearPlugins = [];
+        this._canvasPaintPlugins = [];
+        this._clearDrawPlugins = [];
+        this._drawParticlePlugins = [];
+        this._drawParticlesSetupPlugins = [];
+        this._drawParticlesCleanupPlugins = [];
+        this._drawPlugins = [];
+        this._drawSettingsSetupPlugins = [];
+        this._drawSettingsCleanupPlugins = [];
+        for (const plugin of this._container.plugins) {
+            if (plugin.particleFillColor ?? plugin.particleStrokeColor) {
+                this._colorPlugins.push(plugin);
+            }
+            if (plugin.canvasClear) {
+                this._canvasClearPlugins.push(plugin);
+            }
+            if (plugin.canvasPaint) {
+                this._canvasPaintPlugins.push(plugin);
+            }
+            if (plugin.drawParticle) {
+                this._drawParticlePlugins.push(plugin);
+            }
+            if (plugin.drawParticleSetup) {
+                this._drawParticlesSetupPlugins.push(plugin);
+            }
+            if (plugin.drawParticleCleanup) {
+                this._drawParticlesCleanupPlugins.push(plugin);
+            }
+            if (plugin.draw) {
+                this._drawPlugins.push(plugin);
+            }
+            if (plugin.drawSettingsSetup) {
+                this._drawSettingsSetupPlugins.push(plugin);
+            }
+            if (plugin.drawSettingsCleanup) {
+                this._drawSettingsCleanupPlugins.push(plugin);
+            }
+            if (plugin.clearDraw) {
+                this._clearDrawPlugins.push(plugin);
+            }
+        }
+    }
+    initUpdaters() {
+        this._preDrawUpdaters = [];
+        this._postDrawUpdaters = [];
+        for (const updater of this._container.particleUpdaters) {
+            if (updater.afterDraw) {
+                this._postDrawUpdaters.push(updater);
+            }
+            if (updater.getColorStyles ?? updater.getTransformValues ?? updater.beforeDraw) {
+                this._preDrawUpdaters.push(updater);
+            }
+        }
+    }
+    paint() {
+        let handled = false;
+        for (const plugin of this._canvasPaintPlugins) {
+            handled = plugin.canvasPaint?.() ?? false;
+            if (handled) {
+                break;
+            }
+        }
+        if (handled) {
+            return;
+        }
+        this.paintBase();
+    }
+    paintBase(baseColor) {
+        this.draw(ctx => {
+            paintBase(ctx, this._canvasManager.size, baseColor);
+        });
+    }
+    paintImage(image, opacity) {
+        this.draw(ctx => {
+            paintImage(ctx, this._canvasManager.size, image, opacity);
+        });
+    }
+    setContext(context) {
+        this._context = context;
+        if (this._context) {
+            this._context.globalCompositeOperation = defaultCompositeValue;
+        }
+    }
+    setContextSettings(settings) {
+        this._contextSettings = settings;
+    }
+    stop() {
+        this.draw(ctx => {
+            clear(ctx, this._canvasManager.size);
+        });
+    }
+    _applyPostDrawUpdaters = particle => {
+        for (const updater of this._postDrawUpdaters) {
+            updater.afterDraw?.(particle);
+        }
+    };
+    _applyPreDrawUpdaters = (ctx, particle, radius, zOpacity, colorStyles, transform) => {
+        for (const updater of this._preDrawUpdaters) {
+            if (updater.getColorStyles) {
+                const { fill, stroke } = updater.getColorStyles(particle, ctx, radius, zOpacity);
+                if (fill) {
+                    colorStyles.fill = fill;
+                }
+                if (stroke) {
+                    colorStyles.stroke = stroke;
+                }
+            }
+            if (updater.getTransformValues) {
+                const updaterTransform = updater.getTransformValues(particle);
+                for (const key in updaterTransform) {
+                    setTransformValue(transform, updaterTransform, key);
+                }
+            }
+            updater.beforeDraw?.(particle);
+        }
+    };
+    _getPluginParticleColors = particle => {
+        let fColor, sColor;
+        for (const plugin of this._colorPlugins) {
+            if (!fColor && plugin.particleFillColor) {
+                fColor = rangeColorToHsl(this._pluginManager, plugin.particleFillColor(particle));
+            }
+            if (!sColor && plugin.particleStrokeColor) {
+                sColor = rangeColorToHsl(this._pluginManager, plugin.particleStrokeColor(particle));
+            }
+            if (fColor && sColor) {
+                break;
+            }
+        }
+        this._reusablePluginColors[fColorIndex] = fColor;
+        this._reusablePluginColors[sColorIndex] = sColor;
+        return this._reusablePluginColors;
+    };
+}

package/cjs/Core/Retina.js

@@ -1,6 +1,9 @@
 import { defaultRatio, defaultReduceFactor } from "./Utils/Constants.js";
 import { getRangeValue } from "../Utils/MathUtils.js";
 export class Retina {
+    container;
+    pixelRatio;
+    reduceFactor;
     constructor(container) {
         this.container = container;
         this.pixelRatio = defaultRatio;
@@ -16,18 +19,15 @@ export class Retina {
             canvas.size.width = element.offsetWidth * ratio;
             canvas.size.height = element.offsetHeight * ratio;
         }
-        const particles = options.particles, moveOptions = particles.move;
-        this.maxSpeed = getRangeValue(moveOptions.gravity.maxSpeed) * ratio;
-        this.sizeAnimationSpeed = getRangeValue(particles.size.animation.speed) * ratio;
     }
     initParticle(particle) {
         const options = particle.options, ratio = this.pixelRatio, moveOptions = options.move, moveDistance = moveOptions.distance, props = particle.retina;
+        props.maxSpeed = getRangeValue(moveOptions.gravity.maxSpeed) * ratio;
         props.moveDrift = getRangeValue(moveOptions.drift) * ratio;
         props.moveSpeed = getRangeValue(moveOptions.speed) * ratio;
         props.sizeAnimationSpeed = getRangeValue(options.size.animation.speed) * ratio;
         const maxDistance = props.maxDistance;
-        maxDistance.horizontal = moveDistance.horizontal !== undefined ? moveDistance.horizontal * ratio : undefined;
-        maxDistance.vertical = moveDistance.vertical !== undefined ? moveDistance.vertical * ratio : undefined;
-        props.maxSpeed = getRangeValue(moveOptions.gravity.maxSpeed) * ratio;
+        maxDistance.horizontal = moveDistance.horizontal === undefined ? undefined : moveDistance.horizontal * ratio;
+        maxDistance.vertical = moveDistance.vertical === undefined ? undefined : moveDistance.vertical * ratio;
     }
 }