bruce-cesium 5.4.0 → 5.4.1

package/dist/bruce-cesium.es5.js

@@ -1,6 +1,6 @@
-import { BruceEvent, Cartes, Entity as Entity$1, Carto, Geometry, MathUtils, LRUCache, Api, Calculator, ClientFile, EntityTag, EntityType, ObjectUtils, Style, ProjectViewTile, DelayQueue, EntityLod, Bounds, ZoomControl, EntityRelationType, ENVIRONMENT, EntityHistoricData, Tileset, EntityCoords, DataLab, EntitySource, MenuItem, EntityRelation, ProgramKey, ProjectView, ProjectViewBookmark, ProjectViewLegacyTile, Camera, EntityAttachment, EntityAttachmentType, EntityAttribute, AbstractApi, Session } from 'bruce-models';
+import { BruceEvent, Cartes, Entity as Entity$1, Carto, Geometry, MathUtils, LRUCache, Api, Calculator, ClientFile, EntityTag, EntityType, ObjectUtils, Style, ProjectViewTile, DelayQueue, EntityLod, Bounds, ZoomControl, EntityRelationType, ENVIRONMENT, EntityHistoricData, Tileset, EntityCoords, DataLab, EntitySource, MenuItem, EntityRelation, ProgramKey, ProjectView, ProjectViewBookmark, Camera, ProjectViewLegacyTile, EntityAttachment, EntityAttachmentType, EntityAttribute, AbstractApi, Session } from 'bruce-models';
 import * as Cesium from 'cesium';
-import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, Entity, DistanceDisplayCondition, ClassificationType, ArcType, CornerType, ShadowMode, ConstantProperty, ConstantPositionProperty, PolygonHierarchy, PolylineGraphics, ColorMaterialProperty, ColorBlendMode, HeadingPitchRoll, Transforms, Model, HorizontalOrigin, VerticalOrigin, SceneMode, GeoJsonDataSource, Primitive, Cesium3DTileFeature, Cesium3DTileStyle, Cesium3DTileColorBlendMode, HeadingPitchRange, Ion, KmlDataSource, SceneTransforms, EllipsoidTerrainProvider, IonImageryProvider, createWorldImagery, createWorldImageryAsync, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, CesiumTerrainProvider, CesiumInspector, OrthographicFrustum, defined, ClockRange, EasingFunction, NearFarScalar, EllipsoidGeodesic, sampleTerrainMostDetailed, Cesium3DTileset, PolygonPipeline, Matrix4, Matrix3, IonResource, BoundingSphere, GeometryInstance, Quaternion, ScreenSpaceEventHandler, ScreenSpaceEventType, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, PolylineDashMaterialProperty, CzmlDataSource, Intersect, Fullscreen } from 'cesium';
+import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, Entity, DistanceDisplayCondition, HorizontalOrigin, VerticalOrigin, ConstantProperty, ClassificationType, ConstantPositionProperty, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, ColorMaterialProperty, ColorBlendMode, HeadingPitchRoll, Transforms, Model, SceneMode, Primitive, Cesium3DTileFeature, GeoJsonDataSource, Cesium3DTileStyle, Cesium3DTileColorBlendMode, HeadingPitchRange, Ion, KmlDataSource, SceneTransforms, OrthographicFrustum, EasingFunction, NearFarScalar, EllipsoidTerrainProvider, CesiumInspector, defined, ClockRange, IonImageryProvider, createWorldImagery, createWorldImageryAsync, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, CesiumTerrainProvider, EllipsoidGeodesic, sampleTerrainMostDetailed, Cesium3DTileset, Matrix4, Matrix3, IonResource, PolygonPipeline, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, PolylineDashMaterialProperty, BoundingSphere, GeometryInstance, Quaternion, ScreenSpaceEventHandler, ScreenSpaceEventType, CzmlDataSource, Intersect, Fullscreen } from 'cesium';
 
 const TIME_LAG = 300;
 const POSITION_CHECK_TIMER = 950;
@@ -1368,6 +1368,9 @@ var CesiumAnimatedProperty;
     }
     CesiumAnimatedProperty.AnimatePositionSeries = AnimatePositionSeries;
     function GetSeriesPossesForHistoricEntity(viewer, heightRef, historic) {
+        if (!historic || !historic.length) {
+            return [];
+        }
         const series = [];
         for (let i = 0; i < historic.length; i++) {
             const item = historic[i];
@@ -1406,25 +1409,6 @@ var CesiumAnimatedProperty;
         return series;
     }
     CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity = GetSeriesPossesForHistoricEntity;
-    /**
-     * Animates a tileset position and heading from a series of positions over time.
-     * Unlike other animation functions that directly modify the tileset,
-     * this provides a callback with calculated values for the caller to apply.
-     *
-     * Example:
-     * ```
-     * const dispose = CesiumAnimatedProperty.AnimateTPositionSeries({
-     *    viewer: viewer,
-     *    posses: positionSeries,
-     *    onUpdate: (position, heading) => {}
-     * });
-     *
-     * // To dispose:
-     * dispose();
-     * ```
-     * @param params Animation parameters
-     * @returns Function to stop the animation
-     */
     class AnimateTPositionSeries {
         constructor(params) {
             // Cache for calculated values.
@@ -1432,23 +1416,74 @@ var CesiumAnimatedProperty;
             this.lastCalcPos3d = null;
             this.lastCalcHeading = null;
             this.removal = null;
+            // Track the timeline range for which we have data.
+            this.minDate = null;
+            this.maxDate = null;
+            // Map of positions by timestamp for quick lookup and deduplication.
+            this.positionsMap = new Map();
             this.viewer = params.viewer;
             this.onUpdate = params.onUpdate;
             this.onDone = params.onDone;
-            // No positions to animate.
-            if (!params.posses || params.posses.length === 0) {
-                return;
+            this.onRangeChangeCallback = params.onRangeChange;
+            // Initialize the positions map
+            this.positionsMap = new Map();
+            // Add initial positions
+            if (params.posses && params.posses.length > 0) {
+                this.addPositions(params.posses);
             }
-            // Order positions by date.
-            const orderedPosses = [...params.posses].sort((a, b) => {
-                return a.dateTime.getTime() - b.dateTime.getTime();
-            });
-            // Process headings - if all are null or 0, assume all are null.
-            this.positions = this.processHeadings([...orderedPosses]);
             // Set up the animation loop.
             this.removal = this.viewer.scene.postUpdate.addEventListener(() => this.update());
             this.update();
         }
+        /**
+         * Add new positions to the animation.
+         * Will deduplicate positions with the same timestamp and sort them.
+         * @param newPositions Positions to add
+         */
+        addPositions(newPositions) {
+            if (!newPositions || newPositions.length === 0) {
+                return;
+            }
+            // Add new positions to our map, overwriting any existing positions with the same timestamp
+            for (const pos of newPositions) {
+                const key = pos.dateTime.toISOString();
+                this.positionsMap.set(key, pos);
+            }
+            // Rebuild our sorted array from the map
+            this.positions = Array.from(this.positionsMap.values()).sort((a, b) => {
+                return a.dateTime.getTime() - b.dateTime.getTime();
+            });
+            // Process headings
+            this.positions = this.processHeadings([...this.positions]);
+            // Update our min/max dates
+            if (this.positions.length > 0) {
+                const first = this.positions[0];
+                const last = this.positions[this.positions.length - 1];
+                if (!this.minDate || first.dateTime < this.minDate) {
+                    this.minDate = first.dateTime;
+                }
+                if (!this.maxDate || last.dateTime > this.maxDate) {
+                    this.maxDate = last.dateTime;
+                }
+            }
+        }
+        /**
+         * Get the current date range covered by our positions.
+         */
+        getDateRange() {
+            return {
+                minDate: this.minDate,
+                maxDate: this.maxDate
+            };
+        }
+        /**
+         * Trigger the onRangeChange callback to request more data.
+         */
+        onRangeChange() {
+            if (this.onRangeChangeCallback) {
+                this.onRangeChangeCallback();
+            }
+        }
         /**
          * Stop the animation and call the onDone callback if provided.
          */
@@ -1462,9 +1497,12 @@ var CesiumAnimatedProperty;
             }
         }
         /**
-         * Update function called on each frame.
+         * Update function called on each render frame.
          */
         update() {
+            if (!this.positions || this.positions.length === 0) {
+                return;
+            }
             let now = this.viewer.scene.lastRenderTime;
             if (!now) {
                 now = this.viewer.clock.currentTime;
@@ -1506,11 +1544,19 @@ var CesiumAnimatedProperty;
             return posses;
         }
         /**
-         * Calculate the position at the given time
+         * Calculate the position at the given time.
          */
         calculatePosition(currentTimeMs) {
             const posses = this.positions;
-            // See if we're before the first position
+            // No positions to interpolate
+            if (!posses || posses.length === 0) {
+                return {
+                    pos3d: new Cartesian3(),
+                    indexLast: -1,
+                    indexNext: -1
+                };
+            }
+            // See if we're before the first position.
             if (currentTimeMs <= posses[0].dateTime.getTime()) {
                 return {
                     pos3d: posses[0].pos3d,
@@ -1518,7 +1564,7 @@ var CesiumAnimatedProperty;
                     indexNext: 0
                 };
             }
-            // See if we're after the last position
+            // See if we're after the last position.
             if (currentTimeMs >= posses[posses.length - 1].dateTime.getTime()) {
                 const lastIndex = posses.length - 1;
                 return {
@@ -1527,35 +1573,41 @@ var CesiumAnimatedProperty;
                     indexNext: lastIndex
                 };
             }
-            // Find the current position
+            // Binary search to find the closest position.
+            let start = 0;
+            let end = posses.length - 1;
             let lastIndex = 0;
-            for (let i = 1; i < posses.length; i++) {
-                let pos = posses[i];
-                if (currentTimeMs >= pos.dateTime.getTime()) {
-                    lastIndex = i;
+            while (start <= end) {
+                const mid = Math.floor((start + end) / 2);
+                const midTime = posses[mid].dateTime.getTime();
+                if (midTime <= currentTimeMs) {
+                    lastIndex = mid;
+                    start = mid + 1;
                 }
                 else {
-                    break;
+                    end = mid - 1;
                 }
             }
             const last = posses[lastIndex];
-            const next = posses[lastIndex + 1];
-            // If no next position, use the last one
-            if (!next) {
+            const nextIndex = Math.min(lastIndex + 1, posses.length - 1);
+            const next = posses[nextIndex];
+            // If we found an exact match or there's no next position.
+            if (currentTimeMs === last.dateTime.getTime() || lastIndex === nextIndex) {
                 return {
                     pos3d: last.pos3d,
                     indexLast: lastIndex,
                     indexNext: lastIndex
                 };
             }
-            // Interpolate the position
-            const progress = (currentTimeMs - last.dateTime.getTime()) /
-                (next.dateTime.getTime() - last.dateTime.getTime());
+            // Interpolate between the two closest positions.
+            const lastTime = last.dateTime.getTime();
+            const nextTime = next.dateTime.getTime();
+            const progress = (currentTimeMs - lastTime) / (nextTime - lastTime);
             const interpolatedPos = Cartesian3.lerp(last.pos3d, next.pos3d, progress, new Cartesian3());
             return {
                 pos3d: interpolatedPos,
                 indexLast: lastIndex,
-                indexNext: lastIndex + 1
+                indexNext: nextIndex
             };
         }
         /**
@@ -5238,6 +5290,12 @@ async function getStyle(api, entity, styleId) {
 
 const CESIUM_INSPECTOR_KEY = "_nextspace_inspector";
 const CESIUM_TIMELINE_KEY = "_nextspace_timeline";
+const CESIUM_TIMELINE_LIVE_KEY = "_nextspace_timeline_live";
+const CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY = "_nextspace_timeline_live_padding_forward";
+const CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY = "_nextspace_timeline_live_padding_backward";
+const CESIUM_TIMELINE_INTERVAL_KEY = "_nextspace_timeline_interval";
+const DEFAULT_LIVE_PADDING_FORWARD_SECONDS = 5 * 60;
+const DEFAULT_LIVE_PADDING_BACKWARD_SECONDS = 25 * 60;
 var ViewUtils;
 (function (ViewUtils) {
     function GatherLegacyMapTiles(params) {
@@ -5460,7 +5518,10 @@ var ViewUtils;
             currentTimeIso: clock.currentTime.toString(),
             stopTime: clock.stopTime,
             stopTimeIso: clock.stopTime.toString(),
-            areCesiumValues: clock[CESIUM_TIMELINE_KEY] != true
+            areCesiumValues: clock[CESIUM_TIMELINE_KEY] != true,
+            isLive: clock[CESIUM_TIMELINE_LIVE_KEY] == true,
+            livePaddingForwardSeconds: clock[CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY] || DEFAULT_LIVE_PADDING_FORWARD_SECONDS,
+            livePaddingBackwardSeconds: clock[CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY] || DEFAULT_LIVE_PADDING_BACKWARD_SECONDS
         };
     }
     ViewUtils.GetTimeDetails = GetTimeDetails;
@@ -5518,8 +5579,59 @@ var ViewUtils;
         }
         viewer.scene.requestRender();
         clock[CESIUM_TIMELINE_KEY] = true;
+        clock[CESIUM_TIMELINE_LIVE_KEY] = params.isLive == true;
+        clock[CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY] = params.livePaddingSeconds || DEFAULT_LIVE_PADDING_FORWARD_SECONDS;
+        clock[CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY] = params.livePaddingSeconds || DEFAULT_LIVE_PADDING_BACKWARD_SECONDS;
+        if (params.isLive) {
+            startLive(viewer);
+        }
+        else {
+            stopLive(viewer);
+        }
     }
     ViewUtils.SetTimeDetails = SetTimeDetails;
+    function startLive(viewer) {
+        if (viewer[CESIUM_TIMELINE_INTERVAL_KEY]) {
+            // Already live.
+            return;
+        }
+        const doUpdate = () => {
+            if (!viewer || viewer.isDestroyed() || !viewer.scene) {
+                stopLive(viewer);
+                return;
+            }
+            // Get the current settings.
+            const tDetails = GetTimeDetails({ viewer });
+            const clock = viewer.clock;
+            if (clock) {
+                clock.shouldAnimate = true;
+                clock.multiplier = 1;
+                clock.currentTime = JulianDate.now();
+                clock.startTime = JulianDate.addSeconds(clock.currentTime, -tDetails.livePaddingBackwardSeconds, new JulianDate());
+                clock.stopTime = JulianDate.addSeconds(clock.currentTime, tDetails.livePaddingForwardSeconds, new JulianDate());
+                clock.clockRange = ClockRange.UNBOUNDED;
+            }
+        };
+        // We'll start an interval that occasionally updates the Cesium clock to stay in the desired settings.
+        // Since it moves live (1 second per second), we don't have to worry about the ranges being out of date quickly.
+        viewer[CESIUM_TIMELINE_INTERVAL_KEY] = setInterval(() => {
+            doUpdate();
+        }, 800);
+        viewer[CESIUM_TIMELINE_LIVE_KEY] = true;
+        // Initial update.
+        doUpdate();
+    }
+    function stopLive(viewer) {
+        if (!viewer) {
+            return;
+        }
+        let interval = viewer[CESIUM_TIMELINE_INTERVAL_KEY];
+        if (interval) {
+            clearInterval(interval);
+            viewer[CESIUM_TIMELINE_INTERVAL_KEY] = null;
+        }
+        viewer[CESIUM_TIMELINE_LIVE_KEY] = false;
+    }
 })(ViewUtils || (ViewUtils = {}));
 
 const MODEL_MIN_RADIUS = 10;
@@ -17159,7 +17271,7 @@ var TilesetCadRenderManager;
             this.viewerDateTimeChangeRemoval = null;
             // Series of points to help interpolate movement when the timeline changes.
             this.historicPosses = [];
-            this.historicPossesLoading = false;
+            this.historicAnimation = null;
             this.historicPossesLoadingProm = null;
             const { viewer, register: visualsManager, getters, item } = params;
             this.viewer = viewer;
@@ -17616,7 +17728,7 @@ var TilesetCadRenderManager;
         /**
          * Monitors the Cesium Viewer and updates the root Entity based on the scene time changing.
          * If the root Entity is historic, this can allow for movement of the assembly as a whole.
-         * @parma tileset
+         * @param tileset
          */
         viewerDateTimeSub(tileset) {
             var _a, _b;
@@ -17630,60 +17742,172 @@ var TilesetCadRenderManager;
             const api = this.getters.GetBruceApi({
                 accountId: accountId
             });
-            // Returns a series of positions to use for position interpolation based on time.
-            // If the timeline range is different to the previous query, we'll re-request the data.
-            const getSeriesPosses = async () => {
+            // 'start-stop' time string that maps to a pending request.
+            // Helps us avoid repeated requests that are the same.
+            const pendingRequests = new Map();
+            /**
+             * Returns a list of historic positions for a given time range.
+             * @param startStr
+             * @param stopStr
+             * @returns
+             */
+            const getPossesForRange = async (startStr, stopStr) => {
+                const requestKey = `${startStr}-${stopStr}`;
+                if (pendingRequests.has(requestKey)) {
+                    return pendingRequests.get(requestKey);
+                }
+                const requestPromise = new Promise(async (res) => {
+                    try {
+                        const historicData = await EntityHistoricData.GetList({
+                            attrKey: null,
+                            dateTimeFrom: startStr,
+                            dateTimeTo: stopStr,
+                            entityIds: [this.rootId],
+                            api: api
+                        });
+                        const posses = CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity(this.viewer, HeightReference.NONE, historicData.recordsByIds[this.rootId]);
+                        res(posses);
+                    }
+                    catch (e) {
+                        console.error(e);
+                        res([]);
+                    }
+                    finally {
+                        pendingRequests.delete(requestKey);
+                    }
+                });
+                pendingRequests.set(requestKey, requestPromise);
+                return requestPromise;
+            };
+            /**
+             * Checks if the current timeline range is not fully loaded and requests the difference.
+             * This will call getPossesForRange() if it needs more data.
+             * @returns
+             */
+            const checkTimelineRange = async () => {
                 const minDateTime = this.viewer.clock.startTime.toString();
                 const maxDateTime = this.viewer.clock.stopTime.toString();
-                if (this.historicPossesMinDateTime == minDateTime &&
-                    this.historicPossesMaxDateTime == maxDateTime) {
-                    if (this.historicPossesLoading) {
-                        if (!await this.historicPossesLoadingProm) {
-                            return false;
-                        }
-                    }
-                    return this.historicPosses;
+                // See if the current range is within the range we already have.
+                if (this.historicPosses.length > 0 &&
+                    this.historicPossesMinDateTime &&
+                    this.historicPossesMaxDateTime &&
+                    minDateTime >= this.historicPossesMinDateTime &&
+                    maxDateTime <= this.historicPossesMaxDateTime) {
+                    return;
                 }
-                this.historicPossesMinDateTime = minDateTime;
-                this.historicPossesMaxDateTime = maxDateTime;
-                this.historicPossesLoading = true;
-                this.historicPossesLoadingProm = new Promise(async (res) => {
-                    // We'll add/remove 1 second to ensure we cover all records.
+                // See if the requested range is before or after the range we have.
+                const fetchBefore = !this.historicPossesMinDateTime || minDateTime < this.historicPossesMinDateTime;
+                const fetchAfter = !this.historicPossesMaxDateTime || maxDateTime > this.historicPossesMaxDateTime;
+                if (!fetchBefore && !fetchAfter) {
+                    // Already have the data we need.
+                    return;
+                }
+                // No known range so we need to fetch the whole thing.
+                if (!this.historicPossesMinDateTime || !this.historicPossesMaxDateTime) {
                     const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
                     const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
                     const startStr = new Date(startTmp.getTime() - 1000).toISOString();
                     const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
-                    const historicData = await EntityHistoricData.GetList({
-                        attrKey: null,
-                        dateTimeFrom: startStr,
-                        dateTimeTo: stopStr,
-                        entityIds: [this.rootId],
-                        api: api
-                    });
-                    const posses = CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity(this.viewer, HeightReference.NONE, historicData.recordsByIds[this.rootId]);
-                    if (this.historicPossesMinDateTime == minDateTime &&
-                        this.historicPossesMaxDateTime == maxDateTime) {
-                        this.historicPosses = posses;
+                    const newPositions = await getPossesForRange(startStr, stopStr);
+                    if (this.disposed) {
+                        return;
+                    }
+                    if (this.historicAnimation && this.historicAnimation.addPositions) {
+                        this.historicAnimation.addPositions(newPositions);
+                    }
+                    this.historicPossesMinDateTime = minDateTime;
+                    this.historicPossesMaxDateTime = maxDateTime;
+                }
+                else {
+                    // The data we want is before the range we've currently loaded.
+                    if (fetchBefore) {
+                        // Calculate the missing difference and request it.
+                        const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
+                        const stopTmp = new Date(this.historicPossesMinDateTime);
+                        const startStr = new Date(startTmp.getTime() - 1000).toISOString();
+                        const stopStr = stopTmp.toISOString();
+                        getPossesForRange(startStr, stopStr).then(newPositions => {
+                            if (this.disposed) {
+                                return;
+                            }
+                            this.historicPossesMinDateTime = minDateTime;
+                            if (this.historicAnimation && this.historicAnimation.addPositions) {
+                                this.historicAnimation.addPositions(newPositions);
+                            }
+                        });
+                    }
+                    // The data we want is after the range we've currently loaded.
+                    if (fetchAfter) {
+                        // Calculate the missing difference and request it.
+                        const startTmp = new Date(this.historicPossesMaxDateTime);
+                        const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
+                        const startStr = startTmp.toISOString();
+                        const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
+                        getPossesForRange(startStr, stopStr).then(newPositions => {
+                            if (this.disposed) {
+                                return;
+                            }
+                            this.historicPossesMaxDateTime = maxDateTime;
+                            if (this.historicAnimation && this.historicAnimation.addPositions) {
+                                this.historicAnimation.addPositions(newPositions);
+                            }
+                        });
+                    }
+                }
+            };
+            /**
+             * Requests the initial set of historic positions for the timeline range.
+             * This is called when the tileset is loaded and the timeline range is set.
+             * @returns
+             */
+            const getInitialPosses = async () => {
+                const minDateTime = this.viewer.clock.startTime.toString();
+                const maxDateTime = this.viewer.clock.stopTime.toString();
+                this.historicPossesLoadingProm = new Promise(async (res) => {
+                    try {
+                        if (this.disposed) {
+                            res(false);
+                            return;
+                        }
+                        const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
+                        const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
+                        const startStr = new Date(startTmp.getTime() - 1000).toISOString();
+                        const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
+                        const positions = await getPossesForRange(startStr, stopStr);
+                        if (this.disposed) {
+                            res(false);
+                            return;
+                        }
+                        this.historicPosses = positions;
                         this.historicPossesMinDateTime = minDateTime;
                         this.historicPossesMaxDateTime = maxDateTime;
-                        this.historicPossesLoading = false;
-                        res(posses);
+                        res(positions);
+                    }
+                    catch (e) {
+                        console.error(e);
+                        res(false);
                     }
-                    res(false);
                 });
                 return await this.historicPossesLoadingProm;
             };
-            getSeriesPosses().then((posses) => {
+            // Last known timeline range. Helps us detect changes.
+            let lastStartTime = this.viewer.clock.startTime.toString();
+            let lastStopTime = this.viewer.clock.stopTime.toString();
+            let clockTickRemoval;
+            getInitialPosses().then((posses) => {
                 if (this.disposed || posses === false) {
                     return;
                 }
-                let animation = new CesiumAnimatedProperty.AnimateTPositionSeries({
+                // Generate animation utility for the initial set of positions.
+                this.historicAnimation = new CesiumAnimatedProperty.AnimateTPositionSeries({
                     viewer: this.viewer,
                     posses: posses,
                     onUpdate: (pos3d, heading) => {
                         if (this.disposed) {
                             return;
                         }
+                        // Jank code that hacks the position to be different.
+                        // This can mess up our panels so we'll need to disable editing until a better system is in place.
                         const location = Cartographic.fromCartesian(pos3d);
                         const lat = Math$1.toDegrees(location.latitude);
                         const lon = Math$1.toDegrees(location.longitude);
@@ -17710,12 +17934,35 @@ var TilesetCadRenderManager;
                             }
                         };
                         this.applyCoords(tileset, coords);
+                    },
+                    onRangeChange: () => {
+                        checkTimelineRange();
+                    },
+                    onDone: () => {
+                        if (this.viewerDateTimeChangeRemoval) {
+                            this.viewerDateTimeChangeRemoval();
+                            this.viewerDateTimeChangeRemoval = null;
+                        }
+                    }
+                });
+                // When the clock changes we'll see if the range is different and queue a request for the difference.
+                clockTickRemoval = this.viewer.clock.onTick.addEventListener(() => {
+                    const startTime = this.viewer.clock.startTime.toString();
+                    const stopTime = this.viewer.clock.stopTime.toString();
+                    if (startTime !== lastStartTime || stopTime !== lastStopTime) {
+                        lastStartTime = startTime;
+                        lastStopTime = stopTime;
+                        this.historicAnimation.onRangeChange();
                     }
                 });
                 this.viewerDateTimeChangeRemoval = () => {
-                    if (animation) {
-                        animation.stop();
-                        animation = null;
+                    if (this.historicAnimation) {
+                        this.historicAnimation.stop();
+                        this.historicAnimation = null;
+                    }
+                    if (clockTickRemoval) {
+                        clockTickRemoval();
+                        clockTickRemoval = null;
                     }
                 };
             });
@@ -24676,7 +24923,8 @@ async function renderNavigator(iteration, params, bookmark, view, getters) {
             end: null,
             playing: false,
             speed: 1,
-            start: null
+            start: null,
+            live: false
         };
     }
     ViewUtils.SetTimeDetails({
@@ -24685,7 +24933,8 @@ async function renderNavigator(iteration, params, bookmark, view, getters) {
         currentTimeIso: dateTime,
         startTimeIso: timeline.start,
         stopTimeIso: timeline.end,
-        isAnimating: timeline.playing
+        isAnimating: timeline.playing,
+        isLive: timeline.live
     });
     // Newer version that has states per Entity ID + Menu Item ID.
     let states = bSettings === null || bSettings === void 0 ? void 0 : bSettings.states;
@@ -30501,7 +30750,7 @@ class WidgetViewBar extends Widget.AWidget {
     }
 }
 
-const VERSION = "5.4.0";
+const VERSION = "5.4.1";
 
-export { VERSION, CesiumViewMonitor, ViewerUtils, ViewerEventTracker, MenuItemManager, isHistoricMetadataChanged, EntityRenderEngine, EntityRenderEnginePoint, EntityRenderEnginePolyline, EntityRenderEnginePolygon, EntityRenderEngineModel3d, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, DataLabRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, GoogleSearchRenderManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, CESIUM_TIMELINE_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, CesiumEntityStyler, CesiumAnimatedProperty, CesiumAnimatedInOut, Draw3dPolygon, Draw3dPolyline, MeasureCreator, Walkthrough, Widget, VIEWER_BOOKMARKS_WIDGET_KEY, WidgetBookmarks, WidgetBranding, WidgetCursorBar, WidgetEmbeddedInfoView, WidgetInfoView, WidgetNavCompass$$1 as WidgetNavCompass, VIEWER_VIEW_BAR_WIDGET_KEY, WidgetViewBar, WidgetControlViewBar, WidgetControlViewBarSearch, VIEWER_LEFT_PANEL_WIDGET_KEY, VIEWER_LEFT_PANEL_CSS_VAR_LEFT, WidgetLeftPanel, WidgetLeftPanelTab, WidgetLeftPanelTabBookmarks };
+export { VERSION, CesiumViewMonitor, ViewerUtils, ViewerEventTracker, MenuItemManager, isHistoricMetadataChanged, EntityRenderEngine, EntityRenderEnginePoint, EntityRenderEnginePolyline, EntityRenderEnginePolygon, EntityRenderEngineModel3d, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, DataLabRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, GoogleSearchRenderManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, CESIUM_TIMELINE_KEY, CESIUM_TIMELINE_LIVE_KEY, CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY, CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY, CESIUM_TIMELINE_INTERVAL_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, CesiumEntityStyler, CesiumAnimatedProperty, CesiumAnimatedInOut, Draw3dPolygon, Draw3dPolyline, MeasureCreator, Walkthrough, Widget, VIEWER_BOOKMARKS_WIDGET_KEY, WidgetBookmarks, WidgetBranding, WidgetCursorBar, WidgetEmbeddedInfoView, WidgetInfoView, WidgetNavCompass$$1 as WidgetNavCompass, VIEWER_VIEW_BAR_WIDGET_KEY, WidgetViewBar, WidgetControlViewBar, WidgetControlViewBarSearch, VIEWER_LEFT_PANEL_WIDGET_KEY, VIEWER_LEFT_PANEL_CSS_VAR_LEFT, WidgetLeftPanel, WidgetLeftPanelTab, WidgetLeftPanelTabBookmarks };
 //# sourceMappingURL=bruce-cesium.es5.js.map