Fix timezone in monitor page (#796)

* Fix timezone in the monitor page * Increase package number
InternetHealthReport · May 23, 2024 · 69f39ab · 69f39ab
1 parent b02aeb9
commit 69f39ab
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 15 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ihr-website",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "private": true,
   "type": "module",
   "scripts": {

diff --git a/src/components/charts/AsInterdependenciesChart.vue b/src/components/charts/AsInterdependenciesChart.vue
@@ -181,11 +181,11 @@ const showTable = (table, selectedDate) => {
   if (props.noTable) {
     return
   }
-  if (selectedDate.length < 14) {
+  if (selectedDate.length < 16) {
     // at midnight no time is given
-    details.value.date = new Date(selectedDate + ' 00:00') //adding timezone to string...
+    details.value.date = new Date(selectedDate + ' 00:00 GMT') //adding timezone to string...
   } else {
-    details.value.date = new Date(selectedDate) //adding timezone to string...
+    details.value.date = new Date(selectedDate + ' GMT') //adding timezone to string...
   }
 
   const intervalEnd = details.value.date
@@ -637,7 +637,7 @@ const clearGraph = () => {
 }
 
 const getDateFormat = (chosenTime) => {
-  return `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${("0" + chosenTime.getHours()).slice(-2)}:${("0" + chosenTime.getMinutes()).slice(-2)}`
+  return `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${("0" + chosenTime.getUTCHours()).slice(-2)}:${("0" + chosenTime.getUTCMinutes()).slice(-2)}`
 }
 
 const bgplay = computed(() => {

diff --git a/src/components/charts/DelayAndForwardingChart.vue b/src/components/charts/DelayAndForwardingChart.vue
@@ -88,7 +88,7 @@ const apiCall = () => {
 }
 
 const showTable = (clickData) => {
-  let chosenTime = new Date(clickData.points[0].x) //adding timezone to string...
+  let chosenTime = new Date(clickData.points[0].x + ' GMT') //adding timezone to string...
 
   if (clickData.points[0].data.yaxis == 'y2') {
     details.value.activeTab = 'forwarding'
@@ -196,7 +196,7 @@ const fetchForwarding = (data) => {
 }
 
 const getDateFormat = (chosenTime) => {
-  return `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${chosenTime.getHours()}:${chosenTime.getMinutes()}`
+  return `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${("0" + chosenTime.getUTCHours()).slice(-2)}:${("0" + chosenTime.getUTCMinutes()).slice(-2)}`
 }
 
 const delayUrl = computed(() => {

diff --git a/src/components/charts/NetworkDelayChart.vue b/src/components/charts/NetworkDelayChart.vue
@@ -202,12 +202,12 @@ const showTable = (clickData) => {
   if (props.noTable) {
     return
   }
-  const chosenTime = new Date(clickData.points[0].x) //adding timezone to string...
+  const chosenTime = new Date(clickData.points[0].x + ' GMT') //adding timezone to string...
   details.value.activeTab = 'delay'
   details.value.filter = apiFilter.value.clone()
 
   details.value.delayData = {
-    dateTime: `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${chosenTime.getHours()}:${chosenTime.getMinutes()}`,
+    dateTime: `${MONTHS_SHORT[chosenTime.getMonth()]} ${chosenTime.getDate()}, ${chosenTime.getFullYear()}, ${("0" + chosenTime.getUTCHours()).slice(-2)}:${("0" + chosenTime.getUTCMinutes()).slice(-2)}`,
     startTime: new Date(chosenTime.getTime() - DELAY_ALARM_INTERVAL),
     stopTime: new Date(chosenTime.getTime() + DELAY_ALARM_INTERVAL),
     data: [],

diff --git a/src/plugins/query/IhrQuery.js b/src/plugins/query/IhrQuery.js
@@ -151,8 +151,7 @@ class Query extends QueryBase {
   }
 
   static dateFormatter(date) {
-    const dateISOString = `${date.getFullYear()}-${("0" + (date.getMonth()+1)).slice(-2)}-${("0" + date.getDate()).slice(-2)}T${("0" + date.getHours()).slice(-2)}:${("0" + date.getMinutes()).slice(-2)}:${("0" + date.getSeconds()).slice(-2)}.000Z`
-    return date == undefined ? date : dateISOString
+    return date == undefined ? date : date.toISOString()
   }
 
   //private functions

diff --git a/src/plugins/report.js b/src/plugins/report.js
@@ -1,4 +1,4 @@
-import { toRefs, ref, computed } from 'vue'
+import { ref, computed } from 'vue'
 import { PROJECT_START_DATE } from './IhrApi'
 
 class DateInterval {
@@ -27,9 +27,9 @@ export default function report(defaultTimeRange=null) {
     return defaultTimeRange ? defaultTimeRange : 3
   })
 
-  const getDateInterval = (endTimestamp, nDays) => {
-    const end = new Date(endTimestamp)
-    const begin = new Date(end)
+  const getDateInterval = (dateObj, nDays) => {
+    const end = new Date(dateObj)
+    const begin = new Date(end.getTime())
     begin.setUTCDate(begin.getUTCDate() - nDays)
     if (isNaN(begin.getTime()) || isNaN(end.getTime()))
       throw RangeError("invalid start or end")