finishes trails page

web/src/lib/components/base/double_slider.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
     import * as noUiSlider from "noUiSlider";
     import "nouislider/dist/nouislider.css";
-    import { onMount } from "svelte";
+    import { createEventDispatcher, onMount } from "svelte";
 
     export let minValue = 0;
     export let maxValue = 100;
@@ -11,6 +11,8 @@
 
     let sliderContainer: any;
 
+    const dispatch = createEventDispatcher();
+
     onMount(() => {
         const updateValues = (values: string[]) => {
             currentMin = parseFloat(values[0]);
@@ -27,6 +29,10 @@
         });
 
         sliderContainer.noUiSlider.on("update", updateValues);
+
+        sliderContainer.noUiSlider.on("set", () => {
+            dispatch("set", [currentMin, currentMax]);
+        });
     });
 </script>