Refs #40 Fix chrolonogy bar update

static/public/js/filters.js

@@ -47,6 +47,10 @@ window.FilterManager = (() => {
             updated && this.updateFilter();
         }
 
+        getChronologyRange() {
+            return { min: this.#minDate, max: this.#maxDate };
+        }
+
         isFiltering() {
             if (window.chronology.isInitialized()) {
                 let chronoRange = window.chronology.getRange();

static/public/js/uiFilter.js

@@ -2,7 +2,7 @@
 $(() => {
     const INPUT_CONTAINER_CLASSES = "col-12 col-xl-3 col-md-4 col-sm-6";
 
-    function makeDoubleSlider(minValue, maxValue, serialize) {
+    function makeDoubleSlider(minValue, maxValue, actualMin, actualMax, serialize) {
         if (!serialize)
             serialize = i => i;
         let resultContainer = document.createElement("div");
@@ -15,12 +15,12 @@ $(() => {
         let minValueLabel = document.createElement("input");
         minValueLabel.className = "slider-value slider-min-value form-control";
         minValueLabel.type = "text";
-        minValueLabel.value = serialize(minValue);
+        minValueLabel.value = serialize(actualMin);
         labelRow.appendChild(minValueLabel);
         let maxValueLabel = document.createElement("input");
         maxValueLabel.className = "slider-value slider-max-value form-control";
         maxValueLabel.type = "text";
-        maxValueLabel.value = serialize(maxValue);
+        maxValueLabel.value = serialize(actualMax);
         labelRow.appendChild(maxValueLabel);
         sliderDiv.appendChild(labelRow);
         let inputContainer = document.createElement("div");
@@ -34,7 +34,7 @@ $(() => {
         input.className = "col";
         input.dataset.sliderMin = minValue ?? 0;
         input.dataset.sliderMax = maxValue ?? 100;
-        input.dataset.sliderValue = `[${input.dataset.sliderMin},${input.dataset.sliderMax}]`;
+        input.dataset.sliderValue = `[${actualMin},${actualMax}]`;
         input.dataset.sliderTooltip = "hide";
         sliderCol.appendChild(input);
         let jQueryInput = $(input);
@@ -138,7 +138,10 @@ $(() => {
 
         if (window.chronology.isInitialized()) {
             let range = window.chronology.getRange();
-            let timeSlider = makeDoubleSlider(range.min.getTime(), range.max.getTime(), i => (new Date(i)).toLocaleDateString());
+            let filteredChronology = window.FilterManager.getChronologyRange();
+            let minChronology = Math.max(filteredChronology.min, range.min.getTime());
+            let maxChronology = Math.min(filteredChronology.max, range.max.getTime());
+            let timeSlider = makeDoubleSlider(range.min.getTime(), range.max.getTime(), minChronology, maxChronology, i => (new Date(i)).toLocaleDateString());
             timeSlider.onChange(val => window.FilterManager.setChronologyRange(val.min, val.max));
             container.appendChild(timeSlider.container);
         }