Fix flatpickr

3dcitydb · Mar 12, 2020 · 942d9f1 · 942d9f1
1 parent da02da8
commit 942d9f1
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 7 deletions.
diff --git a/3dwebclient/index.html b/3dwebclient/index.html
@@ -37,8 +37,8 @@
         <link rel="icon" type="image/png" href="../theme/img/favicon.png" sizes="16x16">
         <script src="../ThirdParty/jquery-3.3.1.min.js"></script>
         <!-- Load jquery ui datepicker FLATPICKR -->
-        <link rel="stylesheet" type="text/css" href="../ThirdParty/flatpickrv4.6.2.css">
-        <script type="text/javascript" src="../ThirdParty/flatpickrv4.6.2.js"></script>
+        <link rel="stylesheet" type="text/css" href="../ThirdParty/flatpickrv4.5.1.css">
+        <script type="text/javascript" src="../ThirdParty/flatpickrv4.5.1.js"></script>
         <!-- CesiumJS -->
         <script src="../ThirdParty/Cesium/Cesium.js"></script>
         <script src="../ThirdParty/Intersection/IntersectionAPI.js"></script>

diff --git a/3dwebclient/script.js b/3dwebclient/script.js
@@ -129,7 +129,6 @@ intiClient();
 // Store clicked entities
 var clickedEntities = {};
 
-var clockElementClicked = false;
 function intiClient() {
     // adjust cesium navigation help popup for splash window
     insertSplashInfoHelp();
@@ -233,8 +232,10 @@ function intiClient() {
     var clockElement = document.getElementsByClassName("cesium-animation-blank")[0];
     flatpickr(clockElement, {
         enableTime: true,
-        defaultDate: Cesium.JulianDate.toDate(cesiumViewer.clock.currentTime),
-        enableSeconds: true
+        defaultDate: new Date(new Date().toUTCString().substr(0, 25)), // force flatpickr to use UTC
+        enableSeconds: true,
+        time_24hr: true,
+        clickOpens: false
     });
     clockElement.addEventListener("change", function () {
         var dateValue = clockElement.value;
@@ -250,11 +251,15 @@ function intiClient() {
         cesiumViewer.timeline.resize();
     });
     clockElement.addEventListener("click", function () {
-        if (clockElementClicked) {
+        if (clockElement._flatpickr.isOpen) {
             clockElement._flatpickr.close();
+        } else {
+            clockElement._flatpickr.open();
         }
-        clockElementClicked = !clockElementClicked;
     });
+    cesiumViewer.timeline.addEventListener("click", function() {
+        clockElement._flatpickr.setDate(new Date(Cesium.JulianDate.toDate(cesiumViewer.clock.currentTime).toUTCString().substr(0, 25)));
+    })
 
     // Bring the cesium navigation help popup above the compass
     var cesiumNavHelp = document.getElementsByClassName("cesium-navigation-help")[0];