@mapvx/web-js 1.0.0

package/dist/es/controllers/routeController.js

@@ -0,0 +1,1050 @@
+import { MarkerAttribute } from "../domain/models/marker";
+import { NavFunctions, compareLatLng } from "../utils/nav-functions";
+import { createPositionsForStops, createStops } from "../utils/utils";
+import { createRouteInstance } from "../domain/models/routeInstance";
+/**
+ * Default padding values for auto-fit by place feature.
+ * Used when padding is not explicitly provided in the animation configuration.
+ */
+const DEFAULT_AUTO_FIT_PADDING = {
+    top: 150,
+    right: 150,
+    bottom: 150,
+    left: 150,
+};
+/**
+ * Represents the controller for routes on the map.
+ * Supports multiple simultaneous routes with independent customizations,
+ * animations, and lifecycle management.
+ * @group Routes
+ */
+export class RouteController {
+    constructor(map) {
+        this.routes = new Map();
+        this.mapvxMap = map;
+    }
+    get map() {
+        return this.mapvxMap.map;
+    }
+    /**
+     * Resolve a route instance by ID, or fall back to the last added route.
+     */
+    resolveInstance(routeId) {
+        const id = routeId !== null && routeId !== void 0 ? routeId : this.lastAddedRouteId;
+        return id ? this.routes.get(id) : undefined;
+    }
+    /**
+     * Add MapLibre sources and layers for a single route instance.
+     */
+    addSourcesAndLayersForRoute(instance) {
+        this.map.addSource(instance.aheadId, {
+            type: "geojson",
+            data: instance.aheadSourceData,
+        });
+        this.map.addLayer({
+            id: instance.aheadId,
+            type: "line",
+            source: instance.aheadId,
+            layout: {
+                "line-join": "round",
+                "line-cap": "round",
+            },
+        });
+        this.map.addSource(instance.behindId, {
+            type: "geojson",
+            data: instance.behindSourceData,
+        });
+        this.map.addLayer({
+            id: instance.behindId,
+            type: "line",
+            source: instance.behindId,
+            layout: {
+                "line-join": "round",
+                "line-cap": "round",
+            },
+        });
+        this.map.addSource(instance.currentId, {
+            type: "geojson",
+            data: instance.currentSourceData,
+        });
+        this.map.addLayer({
+            id: instance.currentId,
+            type: "line",
+            source: instance.currentId,
+            layout: {
+                "line-join": "round",
+                "line-cap": "round",
+            },
+        });
+    }
+    /**
+     * Remove MapLibre sources and layers for a single route instance.
+     */
+    removeSourcesAndLayersForRoute(instance) {
+        const ids = [instance.aheadId, instance.behindId, instance.currentId];
+        for (const id of ids) {
+            try {
+                this.map.removeLayer(id);
+            }
+            catch (_a) {
+                // Layer may not exist
+            }
+            try {
+                this.map.removeSource(id);
+            }
+            catch (_b) {
+                // Source may not exist
+            }
+        }
+    }
+    /**
+     * Re-add sources and layers for all active routes.
+     * Should be called when the map style is reloaded.
+     */
+    addSourcesAndLayers() {
+        for (const instance of this.routes.values()) {
+            this.addSourcesAndLayersForRoute(instance);
+        }
+    }
+    /**
+     * Add a route to the map.
+     * @param route The route to add.
+     * @param drawConfig The draw configuration for the route.
+     */
+    addRoute(route, drawConfig) {
+        const instance = createRouteInstance(route);
+        this.routes.set(instance.id, instance);
+        this.lastAddedRouteId = instance.id;
+        this.addSourcesAndLayersForRoute(instance);
+        this.setSourceData(instance, instance.aheadId, route.steps);
+        this.setLayerPaint(instance.aheadId, drawConfig);
+        this.updateLayerFilter(instance.aheadId);
+    }
+    /**
+     * Update the visual progress of a route based on an external user position.
+     * Splits the route into behind (already traveled) and ahead (remaining) sections
+     * at the point on the route closest to the given position.
+     *
+     * @param routeId The ID of the route to update.
+     * @param position The current user position (will be projected onto the route).
+     * @param behindDrawConfig The draw configuration for the behind (traveled) portion.
+     */
+    updateRouteProgress(routeId, position, behindDrawConfig) {
+        const instance = this.routes.get(routeId);
+        if (!instance)
+            return;
+        const route = instance.route;
+        const steps = route.steps;
+        // Find the closest point on the route to the position
+        let bestDist = Infinity;
+        let bestStepIndex = 0;
+        let bestCoordIndex = 0;
+        let bestFraction = 0;
+        for (let s = 0; s < steps.length; s++) {
+            const coords = steps[s].coordinates;
+            for (let c = 0; c < coords.length - 1; c++) {
+                const a = coords[c];
+                const b = coords[c + 1];
+                const { fraction, dist } = this.projectPointToSegment(position, a, b);
+                if (dist < bestDist) {
+                    bestDist = dist;
+                    bestStepIndex = s;
+                    bestCoordIndex = c;
+                    bestFraction = fraction;
+                }
+            }
+        }
+        // Build behind features: all complete steps before the best step,
+        // plus the partial segment of the current step up to the projected point
+        const behindFeatures = [];
+        for (let s = 0; s < bestStepIndex; s++) {
+            behindFeatures.push({
+                type: "Feature",
+                properties: { floor_key: this.getFloorKeyForStep(steps[s]) },
+                geometry: {
+                    type: "LineString",
+                    coordinates: steps[s].geoJsonCoordinates,
+                },
+            });
+        }
+        // Partial behind feature for the current step (up to projected point)
+        const currentStep = steps[bestStepIndex];
+        const currentCoords = currentStep.coordinates;
+        const partialBehindCoords = [];
+        for (let c = 0; c <= bestCoordIndex; c++) {
+            partialBehindCoords.push([currentCoords[c].lng, currentCoords[c].lat]);
+        }
+        // Add the projected point
+        const a = currentCoords[bestCoordIndex];
+        const b = currentCoords[Math.min(bestCoordIndex + 1, currentCoords.length - 1)];
+        const projLat = a.lat + bestFraction * (b.lat - a.lat);
+        const projLng = a.lng + bestFraction * (b.lng - a.lng);
+        partialBehindCoords.push([projLng, projLat]);
+        if (partialBehindCoords.length >= 2) {
+            behindFeatures.push({
+                type: "Feature",
+                properties: { floor_key: this.getFloorKeyForStep(currentStep) },
+                geometry: { type: "LineString", coordinates: partialBehindCoords },
+            });
+        }
+        // Build ahead features: partial remainder of current step + all remaining steps
+        const aheadFeatures = [];
+        const partialAheadCoords = [[projLng, projLat]];
+        for (let c = bestCoordIndex + 1; c < currentCoords.length; c++) {
+            partialAheadCoords.push([currentCoords[c].lng, currentCoords[c].lat]);
+        }
+        if (partialAheadCoords.length >= 2) {
+            aheadFeatures.push({
+                type: "Feature",
+                properties: { floor_key: this.getFloorKeyForStep(currentStep) },
+                geometry: { type: "LineString", coordinates: partialAheadCoords },
+            });
+        }
+        for (let s = bestStepIndex + 1; s < steps.length; s++) {
+            aheadFeatures.push({
+                type: "Feature",
+                properties: { floor_key: this.getFloorKeyForStep(steps[s]) },
+                geometry: {
+                    type: "LineString",
+                    coordinates: steps[s].geoJsonCoordinates,
+                },
+            });
+        }
+        // Update sources
+        instance.behindSourceData.features = behindFeatures;
+        const behindSource = this.map.getSource(instance.behindId);
+        behindSource === null || behindSource === void 0 ? void 0 : behindSource.setData(instance.behindSourceData);
+        instance.aheadSourceData.features = aheadFeatures;
+        const aheadSource = this.map.getSource(instance.aheadId);
+        aheadSource === null || aheadSource === void 0 ? void 0 : aheadSource.setData(instance.aheadSourceData);
+        // Ensure paint is set on the behind layer
+        this.setLayerPaint(instance.behindId, behindDrawConfig);
+        this.updateLayerFilter(instance.behindId);
+        this.updateLayerFilter(instance.aheadId);
+    }
+    /**
+     * Project a point onto a line segment and return the clamped fraction and squared distance.
+     */
+    projectPointToSegment(p, a, b) {
+        const dx = b.lng - a.lng;
+        const dy = b.lat - a.lat;
+        const lenSq = dx * dx + dy * dy;
+        if (lenSq === 0) {
+            const ddx = p.lng - a.lng;
+            const ddy = p.lat - a.lat;
+            return { fraction: 0, dist: ddx * ddx + ddy * ddy };
+        }
+        let t = ((p.lng - a.lng) * dx + (p.lat - a.lat) * dy) / lenSq;
+        t = Math.max(0, Math.min(1, t));
+        const projLng = a.lng + t * dx;
+        const projLat = a.lat + t * dy;
+        const ddx = p.lng - projLng;
+        const ddy = p.lat - projLat;
+        return { fraction: t, dist: ddx * ddx + ddy * ddy };
+    }
+    setSourceData(instance, id, steps) {
+        const features = this.createFeaturesFrom(steps);
+        const source = this.map.getSource(id);
+        if (id === instance.aheadId) {
+            instance.aheadSourceData.features = features;
+            source === null || source === void 0 ? void 0 : source.setData(instance.aheadSourceData);
+        }
+        else if (id === instance.behindId) {
+            instance.behindSourceData.features = features;
+            source === null || source === void 0 ? void 0 : source.setData(instance.behindSourceData);
+        }
+    }
+    setCurrentSourceData(instance, step) {
+        instance.currentSourceData.properties = {
+            floor_key: this.getFloorKeyForStep(step),
+        };
+        const coordinate = step === null || step === void 0 ? void 0 : step.coordinates[0];
+        if (coordinate != null) {
+            instance.currentSourceData.geometry.coordinates = [[coordinate.lng, coordinate.lat]];
+        }
+        else {
+            instance.currentSourceData.geometry.coordinates = [];
+        }
+        const source = this.map.getSource(instance.currentId);
+        source === null || source === void 0 ? void 0 : source.setData(instance.currentSourceData);
+    }
+    setLayerPaint(layerId, drawConfig) {
+        const paintConfig = this.preparePaintForLayer(drawConfig);
+        for (const property in paintConfig) {
+            this.map.setPaintProperty(layerId, property, paintConfig[property]);
+        }
+    }
+    preparePaintForLayer(drawConfig) {
+        if ("color" in drawConfig.routeStyle) {
+            // Check for propriety unique to SolidStyle
+            return {
+                "line-color": drawConfig.routeStyle.color,
+                "line-gradient": null,
+                "line-width": drawConfig.polylineWidth,
+            };
+        }
+        else {
+            // Is GradienteStyle
+            const { colors, positions } = drawConfig.routeStyle;
+            let positionsToUse = positions;
+            if (positionsToUse == null) {
+                positionsToUse = createPositionsForStops(colors.length);
+            }
+            if (positionsToUse.length !== colors.length) {
+                throw new Error("Error: position array has different length than colors array");
+            }
+            const stops = createStops(positionsToUse, colors);
+            const gradient = [
+                "interpolate",
+                ["linear"],
+                ["line-progress"],
+                ...stops,
+            ];
+            return {
+                "line-color": null,
+                "line-gradient": gradient,
+                "line-width": drawConfig.polylineWidth,
+            };
+        }
+    }
+    /**
+     * Update the filter of the layer referenced with a ID.
+     *
+     * @see {@link https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#setfilter}
+     * @param layerId The ID for the layer.
+     */
+    updateLayerFilter(layerId, floorId) {
+        const newFloorId = floorId !== null && floorId !== void 0 ? floorId : this.mapvxMap.getCurrentFloor();
+        if (newFloorId === undefined)
+            return;
+        if (this.map.getStyle().layers.some((layer) => layer.id === layerId)) {
+            this.map.setFilter(layerId, ["==", ["get", "floor_key"], newFloorId]);
+        }
+    }
+    /**
+     * Determines the correct floor_key for a route step.
+     * Outdoor steps (without startInsideFloor) should use the outdoor floor key,
+     * not the current floor which might be indoor.
+     * Elevator steps are always drawn on startInsideFloor; floor is updated to endInsideFloor
+     * only when the step completes (see prepareForNextStep / animateStep).
+     * @param step The route step to determine the floor_key for
+     * @returns The floor_key string to use for the step
+     */
+    getFloorKeyForStep(step) {
+        var _a, _b, _c, _d, _e, _f, _g;
+        if (!step) {
+            return this.mapvxMap.getCurrentFloor();
+        }
+        // If step has startInsideFloor, use it (unless it's a non-elevator floor change step)
+        if (((_b = (_a = step.startInsideFloor) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0) {
+            // If step changes floors (different start and end) and is not an elevator step,
+            // use endInsideFloor so the step is drawn on the destination floor.
+            // Elevator steps are drawn on startInsideFloor; floor updates on step completion.
+            if (((_d = (_c = step.endInsideFloor) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) > 0 &&
+                step.startInsideFloor !== step.endInsideFloor &&
+                !step.elevatorStep) {
+                return step.endInsideFloor;
+            }
+            return step.startInsideFloor;
+        }
+        // If step has endInsideFloor but no startInsideFloor (entering building), use endInsideFloor
+        if (((_f = (_e = step.endInsideFloor) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0) > 0) {
+            return step.endInsideFloor;
+        }
+        // If step is outdoor (no startInsideFloor and no endInsideFloor), use outdoor floor key
+        const innerFloors = this.mapvxMap.getInnerFloors();
+        const outdoorFloor = innerFloors.find((floor) => floor.reachableFromGPS === true);
+        return (_g = outdoorFloor === null || outdoorFloor === void 0 ? void 0 : outdoorFloor.key) !== null && _g !== void 0 ? _g : "";
+    }
+    createFeaturesFrom(steps) {
+        const features = steps.map((step) => {
+            return {
+                type: "Feature",
+                properties: { floor_key: this.getFloorKeyForStep(step) },
+                geometry: {
+                    type: "LineString",
+                    coordinates: step.geoJsonCoordinates,
+                },
+            };
+        });
+        return features;
+    }
+    /**
+     * Update the layers for all active routes.
+     * @param floorId The floor ID to update the layers for.
+     */
+    updateRouteLayers(floorId) {
+        for (const instance of this.routes.values()) {
+            this.updateLayerFilter(instance.aheadId, floorId);
+            this.updateLayerFilter(instance.behindId, floorId);
+            this.updateLayerFilter(instance.currentId, floorId);
+        }
+    }
+    /**
+     * Update the visibility of route markers for all active routes.
+     * @param floorId The floor ID to update the visibility for.
+     */
+    updateRouteMarkerVisibility(floorId) {
+        var _a, _b, _c;
+        for (const instance of this.routes.values()) {
+            ((_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.floorId) === floorId
+                ? (_b = instance.routeMarker) === null || _b === void 0 ? void 0 : _b.show(this.map)
+                : (_c = instance.routeMarker) === null || _c === void 0 ? void 0 : _c.hide();
+        }
+    }
+    updatePlaceFloorForRouting(instance, placeId, floorKey) {
+        var _a;
+        if (placeId && floorKey) {
+            this.mapvxMap.updatePlaceAndFloorForRouting(placeId, floorKey);
+            this.updateRouteLayers(floorKey);
+            (_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.setFloor(floorKey);
+            this.updateRouteMarkerVisibility(floorKey);
+        }
+    }
+    /**
+     * Start the animation of a route.
+     * @param route The route to animate.
+     * @param drawConfig The draw configuration for the route.
+     * @param animationConfig The animation configuration for the route.
+     */
+    startAnimating(route, drawConfig, animationConfig) {
+        var _a, _b, _c;
+        const instance = createRouteInstance(route);
+        this.routes.set(instance.id, instance);
+        this.lastAddedRouteId = instance.id;
+        instance.animationStatus = "STARTED";
+        instance.route = route;
+        const firstStep = route.steps[0];
+        this.addSourcesAndLayersForRoute(instance);
+        this.updatePlaceFloorForRouting(instance, firstStep.startInsidePlace, firstStep.startInsideFloor);
+        this.setSourceData(instance, instance.aheadId, route.steps);
+        this.setSourceData(instance, instance.behindId, []);
+        instance.currentSourceData.properties = {
+            floor_key: this.getFloorKeyForStep(firstStep),
+        };
+        instance.currentSourceData.geometry.coordinates = [
+            [firstStep.coordinates[0].lng, firstStep.coordinates[0].lat],
+        ];
+        this.setLayerPaint(instance.aheadId, drawConfig.aheadConfig);
+        this.setLayerPaint(instance.behindId, drawConfig.behindConfig);
+        this.setLayerPaint(instance.currentId, drawConfig.behindConfig);
+        instance.animationConfig = animationConfig;
+        instance.routeMarker = new MarkerAttribute({
+            coordinate: firstStep.startLocation,
+            floorId: firstStep.startInsideFloor,
+            icon: drawConfig.routeIcon,
+            rotationAlignment: "map",
+        });
+        instance.routeMarker.addToMap(this.map);
+        // Auto-fit by place if enabled
+        if (((_a = animationConfig.autoFitByPlace) === null || _a === void 0 ? void 0 : _a.enabled) && route.steps.length > 0) {
+            if (firstStep.startInsidePlace) {
+                instance.currentPlaceId = firstStep.startInsidePlace;
+                const fitOptions = {
+                    padding: (_b = animationConfig.autoFitByPlace.padding) !== null && _b !== void 0 ? _b : DEFAULT_AUTO_FIT_PADDING,
+                };
+                this.mapvxMap.fitRouteByPlace(route, firstStep.startInsidePlace, fitOptions);
+            }
+        }
+        (_c = animationConfig.callBack) === null || _c === void 0 ? void 0 : _c.call(animationConfig, { isFinished: false, step: firstStep });
+        instance.conditions = {
+            index: 0,
+            coordinatesIndex: 0,
+            iconRotation: 0,
+            rotatingIcon: true,
+            startTime: undefined,
+            progress: 0,
+            resetTime: false,
+            waitStartTime: undefined,
+            animationId: requestAnimationFrame((time) => this.animateStep(time, instance)),
+            onFinish: (time) => this.prepareForNextStep(time, instance),
+        };
+    }
+    clearRouteInstance(instance) {
+        var _a;
+        (_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.remove();
+        instance.routeMarker = undefined;
+        this.setSourceData(instance, instance.aheadId, []);
+        this.setSourceData(instance, instance.behindId, []);
+        instance.currentSourceData.geometry.coordinates = [];
+        const source = this.map.getSource(instance.currentId);
+        source === null || source === void 0 ? void 0 : source.setData(instance.currentSourceData);
+        if ((instance.animationStatus === "STARTED" || instance.stepAnimationStatus === "ANIMATING") &&
+            instance.conditions != null) {
+            cancelAnimationFrame(instance.conditions.animationId);
+        }
+        instance.animationStatus = "NO_ROUTE";
+        instance.stepAnimationStatus = "NO_ROUTE";
+        instance.conditions = undefined;
+        instance.animationConfig = undefined;
+        instance.currentPlaceId = undefined;
+    }
+    /**
+     * Remove a route from the map.
+     * @param routeId The ID of the route to remove. If not provided, removes the last added route.
+     */
+    removeRoute(routeId) {
+        const instance = this.resolveInstance(routeId);
+        if (!instance)
+            return;
+        this.clearRouteInstance(instance);
+        this.removeSourcesAndLayersForRoute(instance);
+        this.routes.delete(instance.id);
+        if (this.lastAddedRouteId === instance.id) {
+            const remaining = [...this.routes.keys()];
+            this.lastAddedRouteId = remaining.length > 0 ? remaining[remaining.length - 1] : undefined;
+        }
+    }
+    /**
+     * Remove all routes from the map.
+     */
+    removeAllRoutes() {
+        for (const instance of this.routes.values()) {
+            this.clearRouteInstance(instance);
+            this.removeSourcesAndLayersForRoute(instance);
+        }
+        this.routes.clear();
+        this.lastAddedRouteId = undefined;
+    }
+    /**
+     * Get the IDs of all active routes on the map.
+     * @returns Array of route IDs.
+     */
+    getRouteIds() {
+        return [...this.routes.keys()];
+    }
+    internalPause(instance) {
+        if (instance.animationStatus != "STARTED")
+            return;
+        if (instance.conditions == null)
+            return;
+        cancelAnimationFrame(instance.conditions.animationId);
+        instance.animationStatus = "PAUSED";
+    }
+    /**
+     * Pause the animation of a route.
+     * @param routeId The ID of the route. If not provided, pauses the last added route.
+     */
+    pauseAnimation(routeId) {
+        const instance = this.resolveInstance(routeId);
+        if (!instance)
+            return;
+        this.internalPause(instance);
+    }
+    internalResume(instance) {
+        if (instance.animationStatus != "PAUSED")
+            return;
+        if (instance.conditions == null)
+            return;
+        instance.conditions.resetTime = true;
+        instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+        instance.animationStatus = "STARTED";
+    }
+    /**
+     * Resume the animation of a route.
+     * @param routeId The ID of the route. If not provided, resumes the last added route.
+     */
+    resumeAnimation(routeId) {
+        const instance = this.resolveInstance(routeId);
+        if (!instance)
+            return;
+        this.internalResume(instance);
+    }
+    /**
+     * Restart the animation of a route.
+     * @param routeId The ID of the route. If not provided, restarts the last added route.
+     */
+    restartAnimation(routeId) {
+        var _a, _b, _c, _d, _e;
+        const instance = this.resolveInstance(routeId);
+        if (!instance) {
+            throw new Error("Does not exist animated route to restart");
+        }
+        if (instance.animationStatus === "NO_ROUTE") {
+            throw new Error("Does not exist animated route to restart");
+        }
+        if (instance.conditions == null ||
+            instance.animationConfig == null ||
+            instance.route == null ||
+            instance.routeMarker == null) {
+            throw new Error("Error: conditions and animationConfig should not be null at this point");
+        }
+        if (instance.animationStatus === "STARTED") {
+            cancelAnimationFrame(instance.conditions.animationId);
+        }
+        instance.animationStatus = "STARTED";
+        const firstStep = instance.route.steps[0];
+        this.updatePlaceFloorForRouting(instance, firstStep.startInsidePlace, firstStep.startInsideFloor);
+        this.setSourceData(instance, instance.aheadId, instance.route.steps);
+        this.setSourceData(instance, instance.behindId, []);
+        instance.currentSourceData.properties = {
+            floor_key: this.getFloorKeyForStep(firstStep),
+        };
+        instance.currentSourceData.geometry.coordinates = [
+            [firstStep.coordinates[0].lng, firstStep.coordinates[0].lat],
+        ];
+        const source = this.map.getSource(instance.currentId);
+        source === null || source === void 0 ? void 0 : source.setData(instance.currentSourceData);
+        (_a = this.setMarkerRotation(instance, 0)) === null || _a === void 0 ? void 0 : _a.setLngLat(firstStep.startLocation).addTo(this.map);
+        // Auto-fit by place if enabled
+        if (((_b = instance.animationConfig.autoFitByPlace) === null || _b === void 0 ? void 0 : _b.enabled) && instance.route.steps.length > 0) {
+            if (firstStep.startInsidePlace) {
+                instance.currentPlaceId = firstStep.startInsidePlace;
+                const fitOptions = {
+                    padding: (_c = instance.animationConfig.autoFitByPlace.padding) !== null && _c !== void 0 ? _c : DEFAULT_AUTO_FIT_PADDING,
+                };
+                this.mapvxMap.fitRouteByPlace(instance.route, firstStep.startInsidePlace, fitOptions);
+            }
+        }
+        (_e = (_d = instance.animationConfig).callBack) === null || _e === void 0 ? void 0 : _e.call(_d, { isFinished: false, step: firstStep });
+        instance.conditions = {
+            index: 0,
+            coordinatesIndex: 0,
+            iconRotation: 0,
+            rotatingIcon: true,
+            startTime: undefined,
+            progress: 0,
+            resetTime: false,
+            waitStartTime: undefined,
+            animationId: requestAnimationFrame((time) => this.animateStep(time, instance)),
+            onFinish: (time) => this.prepareForNextStep(time, instance),
+        };
+    }
+    /**
+     * Stop the animation of a route.
+     * @param routeId The ID of the route. If not provided, stops the last added route.
+     */
+    stopAnimation(routeId) {
+        const instance = this.resolveInstance(routeId);
+        if (!instance)
+            return;
+        if (instance.animationStatus == "FINISHED") {
+            return;
+        }
+        // todo hacer cosas para detener animación
+        instance.animationStatus = "FINISHED";
+    }
+    /**
+     * Add a step animation to a route.
+     * @param route The route to animate.
+     * @param drawConfig The draw configuration for the route.
+     * @param animationConfig The animation configuration for the route.
+     */
+    addStepAnimation(route, drawConfig, animationConfig) {
+        var _a, _b, _c;
+        const instance = createRouteInstance(route);
+        this.routes.set(instance.id, instance);
+        this.lastAddedRouteId = instance.id;
+        instance.stepAnimationStatus = "WAITING";
+        instance.route = route;
+        const firstStep = route.steps[0];
+        this.addSourcesAndLayersForRoute(instance);
+        this.updatePlaceFloorForRouting(instance, firstStep.startInsidePlace, firstStep.startInsideFloor);
+        this.setSourceData(instance, instance.aheadId, route.steps);
+        this.setSourceData(instance, instance.behindId, []);
+        this.setCurrentSourceData(instance, firstStep);
+        this.setLayerPaint(instance.aheadId, drawConfig.aheadConfig);
+        this.setLayerPaint(instance.behindId, drawConfig.behindConfig);
+        this.setLayerPaint(instance.currentId, drawConfig.behindConfig);
+        instance.animationConfig = animationConfig;
+        instance.routeMarker = new MarkerAttribute({
+            coordinate: firstStep.startLocation,
+            floorId: firstStep.startInsideFloor,
+            icon: drawConfig.routeIcon,
+            rotationAlignment: "map",
+        });
+        instance.routeMarker.addToMap(this.map);
+        this.cameraFollow(instance, firstStep.startLocation);
+        // Auto-fit by place if enabled
+        if (((_a = animationConfig.autoFitByPlace) === null || _a === void 0 ? void 0 : _a.enabled) && route.steps.length > 0) {
+            if (firstStep.startInsidePlace) {
+                instance.currentPlaceId = firstStep.startInsidePlace;
+                const fitOptions = {
+                    padding: (_b = animationConfig.autoFitByPlace.padding) !== null && _b !== void 0 ? _b : DEFAULT_AUTO_FIT_PADDING,
+                };
+                this.mapvxMap.fitRouteByPlace(route, firstStep.startInsidePlace, fitOptions);
+            }
+        }
+        (_c = animationConfig.callBack) === null || _c === void 0 ? void 0 : _c.call(animationConfig, { isFinished: false, step: firstStep });
+        instance.conditions = {
+            index: 0,
+            coordinatesIndex: 0,
+            iconRotation: 0,
+            rotatingIcon: true,
+            startTime: undefined,
+            progress: 0,
+            resetTime: false,
+            waitStartTime: undefined,
+            animationId: 0,
+            isStepByStep: true,
+            onFinish: () => {
+                var _a, _b, _c, _d;
+                if (instance.conditions == null ||
+                    instance.animationConfig == null ||
+                    instance.route == null) {
+                    throw new Error("Error: conditions, animationConfig or route should not be null at this point");
+                }
+                let { index } = instance.conditions;
+                index++;
+                const behindSteps = instance.route.steps.slice(0, index);
+                const aheadSteps = instance.route.steps.slice(index);
+                const step = instance.route.steps[index];
+                this.setSourceData(instance, instance.behindId, behindSteps);
+                this.setSourceData(instance, instance.aheadId, aheadSteps);
+                this.setCurrentSourceData(instance, step);
+                instance.conditions.index = index;
+                if (index < route.steps.length) {
+                    const nextStep = route.steps[index];
+                    // Auto-fit by place if enabled and place changed
+                    if (((_a = animationConfig.autoFitByPlace) === null || _a === void 0 ? void 0 : _a.enabled) && nextStep && instance.route != null) {
+                        const stepPlaceId = nextStep.startInsidePlace || nextStep.endInsidePlace;
+                        if (stepPlaceId && stepPlaceId !== instance.currentPlaceId) {
+                            instance.currentPlaceId = stepPlaceId;
+                            const fitOptions = {
+                                padding: (_b = animationConfig.autoFitByPlace.padding) !== null && _b !== void 0 ? _b : DEFAULT_AUTO_FIT_PADDING,
+                            };
+                            this.mapvxMap.fitRouteByPlace(instance.route, stepPlaceId, fitOptions);
+                        }
+                    }
+                    (_c = animationConfig.callBack) === null || _c === void 0 ? void 0 : _c.call(animationConfig, { isFinished: false, step: nextStep });
+                }
+                else {
+                    (_d = animationConfig.callBack) === null || _d === void 0 ? void 0 : _d.call(animationConfig, { isFinished: true, step: null });
+                }
+                instance.stepAnimationStatus = "WAITING";
+            },
+        };
+    }
+    /**
+     * Animate the next step of a route.
+     * @param routeId The ID of the route. If not provided, uses the last added route.
+     */
+    nextStepAnimation(routeId) {
+        const instance = this.resolveInstance(routeId);
+        if (!instance) {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.stepAnimationStatus === "NO_ROUTE") {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.conditions == null || instance.animationConfig == null || instance.route == null) {
+            throw new Error("Error: conditions, animationConfig or route should not be null at this point");
+        }
+        if (instance.stepAnimationStatus === "ANIMATING") {
+            cancelAnimationFrame(instance.conditions.animationId);
+        }
+        instance.stepAnimationStatus = "ANIMATING";
+        const { index } = instance.conditions;
+        if (index < instance.route.steps.length) {
+            instance.conditions.coordinatesIndex = 0;
+            instance.conditions.startTime = undefined;
+            instance.conditions.progress = 0;
+            instance.conditions.rotatingIcon = true;
+            instance.conditions.waitStartTime = undefined;
+            instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+        }
+        else {
+            throw new Error("Error: Does not exist next step to animate");
+        }
+    }
+    /**
+     * Go to the previous step of a route.
+     * @param routeId The ID of the route. If not provided, uses the last added route.
+     */
+    previousStepAnimation(routeId) {
+        var _a, _b, _c, _d;
+        const instance = this.resolveInstance(routeId);
+        if (!instance) {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.stepAnimationStatus === "NO_ROUTE") {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.conditions == null || instance.animationConfig == null || instance.route == null) {
+            throw new Error("Error: conditions, animationConfig or route should not be null at this point");
+        }
+        if (instance.stepAnimationStatus === "ANIMATING") {
+            cancelAnimationFrame(instance.conditions.animationId);
+        }
+        instance.stepAnimationStatus = "WAITING";
+        let { index } = instance.conditions;
+        if (index > 0) {
+            index--;
+            const behindSteps = instance.route.steps.slice(0, index);
+            const aheadSteps = instance.route.steps.slice(index);
+            const step = instance.route.steps[index];
+            this.setSourceData(instance, instance.behindId, behindSteps);
+            this.setSourceData(instance, instance.aheadId, aheadSteps);
+            this.setCurrentSourceData(instance, step);
+            if (step.startInsideFloor != step.endInsideFloor && step.startInsideFloor) {
+                this.updatePlaceFloorForRouting(instance, step.startInsidePlace, step.startInsideFloor);
+            }
+            instance.conditions.index = index;
+            instance.conditions.coordinatesIndex = 0;
+            instance.conditions.startTime = undefined;
+            instance.conditions.progress = 0;
+            instance.conditions.rotatingIcon = true;
+            instance.conditions.waitStartTime = undefined;
+            this.setMarkerLngLat(instance, step.startLocation);
+            const previous = behindSteps.at(-1);
+            if (previous != null) {
+                const coordinates = previous.coordinates.slice(-2);
+                const angle = NavFunctions.bearingInDegBetween(coordinates[0], coordinates[1]);
+                this.setMarkerRotation(instance, angle);
+            }
+            else {
+                this.setMarkerRotation(instance, 0);
+            }
+            // Auto-fit by place if enabled and place changed
+            if (((_a = instance.animationConfig.autoFitByPlace) === null || _a === void 0 ? void 0 : _a.enabled) && step && instance.route != null) {
+                const stepPlaceId = step.startInsidePlace || step.endInsidePlace;
+                if (stepPlaceId && stepPlaceId !== instance.currentPlaceId) {
+                    instance.currentPlaceId = stepPlaceId;
+                    const fitOptions = {
+                        padding: (_b = instance.animationConfig.autoFitByPlace.padding) !== null && _b !== void 0 ? _b : DEFAULT_AUTO_FIT_PADDING,
+                    };
+                    this.mapvxMap.fitRouteByPlace(instance.route, stepPlaceId, fitOptions);
+                }
+            }
+            (_d = (_c = instance.animationConfig).callBack) === null || _d === void 0 ? void 0 : _d.call(_c, {
+                isFinished: false,
+                step,
+            });
+        }
+        else {
+            throw new Error("previous step doesn't exists to animate");
+        }
+    }
+    /**
+     * Center on the current step of a route.
+     * @param routeId The ID of the route. If not provided, uses the last added route.
+     */
+    centerOnCurrentStep(routeId) {
+        var _a;
+        const instance = this.resolveInstance(routeId);
+        if (!instance) {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.stepAnimationStatus === "NO_ROUTE") {
+            throw new Error("Error: Does not exist step animation");
+        }
+        if (instance.conditions == null || instance.animationConfig == null || instance.route == null) {
+            throw new Error("Error: conditions, animationConfig or route should not be null at this point");
+        }
+        const currentMarkerPosition = (_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.getLngLat();
+        if (currentMarkerPosition) {
+            this.map.panTo(currentMarkerPosition);
+        }
+        else {
+            throw new Error("Error: marker has no position set");
+        }
+    }
+    prepareForNextStep(timestamp, instance) {
+        var _a, _b, _c, _d, _e, _f;
+        if (instance.conditions == null || instance.animationConfig == null || instance.route == null) {
+            throw new Error("Error: conditions, animationConfig or route should not be null at this point");
+        }
+        const { index } = instance.conditions;
+        const behindSteps = instance.route.steps.slice(0, index + 1);
+        const aheadSteps = instance.route.steps.slice(index + 1);
+        this.setSourceData(instance, instance.behindId, behindSteps);
+        this.setSourceData(instance, instance.aheadId, aheadSteps);
+        instance.currentSourceData.geometry.coordinates = [];
+        if (index + 1 < instance.route.steps.length) {
+            const step = instance.route.steps[index + 1];
+            instance.currentSourceData.geometry.coordinates.push([
+                step.startLocation.lng,
+                step.startLocation.lat,
+            ]);
+            instance.currentSourceData.properties = {
+                floor_key: this.getFloorKeyForStep(step),
+            };
+            instance.conditions.startTime = timestamp;
+            instance.conditions.index++;
+            instance.conditions.coordinatesIndex = 0;
+            instance.conditions.progress = 0;
+            instance.conditions.rotatingIcon = true;
+            if (!compareLatLng(instance.route.steps[index].endLocation, step.startLocation))
+                instance.conditions.nextFloorFirstStepIndex = index + 2;
+            instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+            // Auto-fit by place if enabled and place changed
+            if (((_a = instance.animationConfig.autoFitByPlace) === null || _a === void 0 ? void 0 : _a.enabled) && step && instance.route != null) {
+                const stepPlaceId = step.startInsidePlace || step.endInsidePlace;
+                if (stepPlaceId && stepPlaceId !== instance.currentPlaceId) {
+                    instance.currentPlaceId = stepPlaceId;
+                    const fitOptions = {
+                        padding: (_b = instance.animationConfig.autoFitByPlace.padding) !== null && _b !== void 0 ? _b : DEFAULT_AUTO_FIT_PADDING,
+                    };
+                    this.mapvxMap.fitRouteByPlace(instance.route, stepPlaceId, fitOptions);
+                }
+            }
+            (_d = (_c = instance.animationConfig).callBack) === null || _d === void 0 ? void 0 : _d.call(_c, {
+                isFinished: false,
+                step: instance.route.steps[index + 1],
+            });
+        }
+        else {
+            // finishes animation
+            (_f = (_e = instance.animationConfig).callBack) === null || _f === void 0 ? void 0 : _f.call(_e, { isFinished: true, step: null });
+            instance.animationStatus = "FINISHED";
+        }
+    }
+    animateStep(timestamp, instance) {
+        var _a, _b;
+        if (instance.conditions == null || instance.animationConfig == null || instance.route == null) {
+            throw new Error("Error: conditions and animationConfig should not be null at this point");
+        }
+        let { startTime, resetTime, progress } = instance.conditions;
+        const { coordinatesIndex, iconRotation, index, onFinish, rotatingIcon, waitStartTime } = instance.conditions;
+        const { stepTime, minimumSpeed, iconRotationTime, changeFloorTime } = instance.animationConfig;
+        if (startTime == null) {
+            instance.conditions.startTime = timestamp;
+            instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+            return;
+        }
+        if (resetTime) {
+            startTime = timestamp - progress;
+            instance.conditions.startTime = startTime;
+            resetTime = false;
+            instance.conditions.resetTime = resetTime;
+        }
+        else {
+            progress = timestamp - startTime;
+            instance.conditions.progress = progress;
+        }
+        const progressInSeconds = progress / 1000;
+        const step = instance.route.steps[index];
+        if (step.coordinates.length <= 0) {
+            onFinish === null || onFinish === void 0 ? void 0 : onFinish(timestamp);
+            return;
+        }
+        const start = step.coordinates[coordinatesIndex];
+        const end = step.coordinates[coordinatesIndex + 1];
+        if (start != null && end != null) {
+            if (rotatingIcon) {
+                const angle = NavFunctions.bearingInDegBetween(start, end);
+                if (iconRotationTime === 0 ||
+                    instance.conditions.nextFloorFirstStepIndex === index ||
+                    Math.abs(angle - instance.conditions.iconRotation) < 15) {
+                    instance.conditions.nextFloorFirstStepIndex = undefined;
+                    this.setMarkerRotation(instance, angle);
+                    instance.conditions.startTime = timestamp;
+                    instance.conditions.rotatingIcon = false;
+                    instance.conditions.iconRotation = angle;
+                    instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                    return;
+                }
+                else if (progressInSeconds < iconRotationTime) {
+                    const intermediateAngle = NavFunctions.intermediateAngleBetween(iconRotation, angle, progressInSeconds / iconRotationTime);
+                    this.setMarkerRotation(instance, intermediateAngle);
+                    instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                    return;
+                }
+                else {
+                    this.setMarkerRotation(instance, angle);
+                    instance.conditions.startTime = timestamp;
+                    instance.conditions.rotatingIcon = false;
+                    instance.conditions.iconRotation = angle;
+                    instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                    return;
+                }
+            }
+            const distance = NavFunctions.distance(start, end);
+            const speed = Math.max(step.distance / stepTime, minimumSpeed !== null && minimumSpeed !== void 0 ? minimumSpeed : 0);
+            if (speed * progressInSeconds > distance) {
+                instance.currentSourceData.geometry.coordinates.push([end.lng, end.lat]);
+                const source = this.map.getSource(instance.currentId);
+                source === null || source === void 0 ? void 0 : source.setData(instance.currentSourceData);
+                if (coordinatesIndex + 2 < step.coordinates.length) {
+                    const next = step.coordinates[coordinatesIndex + 2];
+                    if (!compareLatLng(end, next)) {
+                        if (instance.conditions.isStepByStep) {
+                            instance.conditions.rotatingIcon = true;
+                        }
+                        else {
+                            const nextAngle = NavFunctions.bearingInDegBetween(end, next);
+                            instance.conditions.iconRotation = nextAngle;
+                            (_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.setRotation(nextAngle);
+                        }
+                    }
+                    instance.conditions.startTime = timestamp;
+                    instance.conditions.progress = 0;
+                    instance.conditions.coordinatesIndex++;
+                    instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                    return;
+                }
+                else if (step.startInsideFloor !== step.endInsideFloor) {
+                    if (waitStartTime == null) {
+                        instance.conditions.waitStartTime = timestamp;
+                        instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                        return;
+                    }
+                    if (timestamp - waitStartTime < changeFloorTime * 1000) {
+                        instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+                        return;
+                    }
+                    else {
+                        this.updatePlaceFloorForRouting(instance, step.endInsidePlace, step.endInsideFloor);
+                        this.setMarkerLngLat(instance, step.endLocation);
+                        instance.conditions.waitStartTime = undefined;
+                        onFinish === null || onFinish === void 0 ? void 0 : onFinish(timestamp);
+                        return;
+                    }
+                }
+                else {
+                    onFinish === null || onFinish === void 0 ? void 0 : onFinish(timestamp);
+                    return;
+                }
+            }
+            const fraction = (speed * progressInSeconds) / distance;
+            const point = distance === 0
+                ? end
+                : NavFunctions.intermediatePointBetween(start, end, Math.min(fraction, 1));
+            instance.currentSourceData.geometry.coordinates.push([point.lng, point.lat]);
+            const source = this.map.getSource(instance.currentId);
+            source === null || source === void 0 ? void 0 : source.setData(instance.currentSourceData);
+            this.setMarkerLngLat(instance, point);
+            (_b = instance.routeMarker) === null || _b === void 0 ? void 0 : _b.addTo(this.map);
+            instance.conditions.animationId = requestAnimationFrame((time) => this.animateStep(time, instance));
+            return;
+        }
+        else {
+            onFinish === null || onFinish === void 0 ? void 0 : onFinish(timestamp);
+            return;
+        }
+    }
+    setMarkerLngLat(instance, point) {
+        var _a, _b;
+        if ((_a = instance.conditions) === null || _a === void 0 ? void 0 : _a.isStepByStep) {
+            this.cameraFollow(instance, point);
+        }
+        (_b = instance.routeMarker) === null || _b === void 0 ? void 0 : _b.setLngLat(point);
+    }
+    setMarkerRotation(instance, angle) {
+        var _a, _b, _c, _d;
+        if ((_a = instance.conditions) === null || _a === void 0 ? void 0 : _a.isStepByStep) {
+            this.mapvxMap.updateCamera({
+                duration: (_b = instance.animationConfig) === null || _b === void 0 ? void 0 : _b.iconRotationTime,
+                animate: true,
+                bearing: angle,
+                center: (_c = instance.routeMarker) === null || _c === void 0 ? void 0 : _c.getLngLat(),
+            });
+        }
+        return (_d = instance.routeMarker) === null || _d === void 0 ? void 0 : _d.setRotation(angle);
+    }
+    setMarkerFloor(floorId, routeId) {
+        var _a;
+        const instance = this.resolveInstance(routeId);
+        (_a = instance === null || instance === void 0 ? void 0 : instance.routeMarker) === null || _a === void 0 ? void 0 : _a.setFloor(floorId);
+    }
+    cameraFollow(instance, point) {
+        var _a, _b;
+        this.mapvxMap.updateCamera({
+            center: point,
+            animate: true,
+            bearing: (_a = instance.routeMarker) === null || _a === void 0 ? void 0 : _a.getRotation(),
+            duration: (_b = instance.animationConfig) === null || _b === void 0 ? void 0 : _b.iconRotationTime,
+        });
+    }
+}
+//# sourceMappingURL=routeController.js.map