ayanova/devdocs/todo.txt

@@ -76,6 +76,8 @@ TODO: LOCALIZATION
 				- already something in there for currency I think
 
 	- PLANNING
+		- Proper way to definitevely display a date in desired time zone: DATE.toLocaleString('en-GB', { timeZone: 'UTC', dateStyle: "short",timeStyle: "short", hour12: false })
+
 		- NEED to accept and display numbers and dates and times, nothing else really matters
 			- NUMBER FORMATTING REQUIRED INFO
 				- USEROPTIONS: Currency symbol 

ayanova/src/components/date-control.vue

@@ -57,7 +57,7 @@ export default {
     date: null,
     oldDate: null,
     dlgdate: false,
-    defaultLocale: window.$gz.locale.getFirstBrowserLanguage().split("-", 1)[0]
+    defaultLocale: window.$gz.locale.getBrowserFirstLanguage().split("-", 1)[0]
   }),
   props: {
     label: String,

ayanova/src/components/date-time-control.vue

@@ -94,17 +94,13 @@ export default {
         throw "DateTimeControl: $gz.locale is required and missing";
       }
     }
-
-    // this.defaultLocale = window.$gz.locale
-    //   .getFirstBrowserLanguage()
-    //   .split("-", 1);
   },
   data: () => ({
     date: null,
     oldDate: null,
     dlgdate: false,
     dlgtime: false,
-    defaultLocale: window.$gz.locale.getFirstBrowserLanguage().split("-", 1)[0],
+    defaultLocale: window.$gz.locale.getBrowserFirstLanguage().split("-", 1)[0],
     ampmFormat: window.$gz.locale.format().hour12 ? "ampm" : "24hr"
   }),
   props: {

ayanova/src/main.js

@@ -153,12 +153,22 @@ Vue.filter(
   function vueFilterShortDateAndTimeLocalized(value) {
     if (!value) return "";
 
-    var localizedDate = dayjs
+    //parse the date which is identified as utc ("2020-02-06T18:18:49.148011Z")
-      .utc(value)
+    var parsedDate = new Date(value);
-      .add(locale.format().timeZoneOffset, "hour")
+    //parsedDate now contains the correct value
-      .toDate();
+    //but any attempt to get it back out that isn't a UTC function will automatically convert to local perceived time zone
+    
+    var tzAdjustedDate = new Date();
+    tzAdjustedDate.setTime(
+      parsedDate.getTime() + locale.format().timeZoneOffset * 60 * 60 * 1000
+    );
 
-    return localizedDate.toLocaleString(
+    // var localizedDate = dayjs
+    //   .utc(value)
+    //   .add(locale.format().timeZoneOffset, "hour")
+    //   .toDate();
+
+    var ret = tzAdjustedDate.toLocaleString(
       window.$gz.locale.getBrowserLanguages(),
       {
         dateStyle: "short",
@@ -166,6 +176,19 @@ Vue.filter(
         hour12: locale.format().hour12
       }
     );
+
+    console.log("value");
+    console.log(value);
+    console.log("parsedDate");
+    console.log(parsedDate);
+    console.log("tzAdjustedDate");
+    console.log(tzAdjustedDate);
+    console.log("presented as:");
+    console.log(ret);
+    console.log("-------");
+    //debugger;
+
+    return ret;
   }
 );
 

ayanova/src/views/home-user-settings.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    User's preferred language:
+    User's preferred languages:
     {{ userLanguage }}
   </div>
 </template>
@@ -11,7 +11,7 @@ import UnderConstruction from "../components/underconstruction.vue";
 export default {
   data() {
     return {
-      userLanguage: window.$gz.locale.getFirstBrowserLanguage()
+      userLanguage: window.$gz.locale.getBrowserLanguages()
     };
   },
   components: {},