LP1840782 Date function to get timezone-aware parts
authorBill Erickson <berickxx@gmail.com>
Fri, 23 Aug 2019 20:20:39 +0000 (16:20 -0400)
committerBill Erickson <berickxx@gmail.com>
Fri, 23 Aug 2019 20:24:12 +0000 (16:24 -0400)
Adds a function (and sandbox example) that returns a date chopped up
into parts (year, month, day, hour, minute) matching the requested time
zone.

Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/share/util/date.ts
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts

index bf146c7..c8a9ffd 100644 (file)
@@ -7,6 +7,14 @@ interface DateFormatOptions {
     withTime?: boolean; // defaults to FALSE
 }
 
+class DateParts {
+    year: number;
+    month: number;
+    day: number;
+    hour: number;
+    minute: number;
+}
+
 export class DateUtil {
 
     // Returns a YYYY-MM-DD string in the local time zone matching
@@ -71,4 +79,38 @@ export class DateUtil {
 
         return new Intl.DateTimeFormat(locale, formatOps).format(date);
     }
+
+    // Returns the each part of a date as descrete values from the
+    // provided date, translated into the requested time zone.
+    static dateToParts(date: Date, timeZone: string): DateParts {
+
+        const formatOps: any = {
+            hour12: false,
+            year: 'numeric',
+            month: 'numeric',
+            day: 'numeric',
+            hour: 'numeric',
+            minute: 'numeric'
+        };
+
+        if (timeZone) {
+            // Defaults to browser time zone.
+            formatOps.timeZone = timeZone;
+        }
+
+        // The locale "en-US" is used here because it allows the
+        // formatter to produce numeric values that are parseable by JS
+        // Date objects / components.
+        const formatter = Intl.DateTimeFormat('en-US', formatOps);
+        const parts = formatter.formatToParts();
+        const response: DateParts = new DateParts();
+
+        ['year', 'month', 'day', 'hour', 'minute'].forEach(datePart =>
+            response[datePart] = parts.filter(p => p.type === datePart)[0].value
+        );
+
+        return response;
+    }
 }
+
+
index bf5e15e..c0fb1ce 100644 (file)
           [(ngModel)]="withDate" (change)="setDateString()"/>
         <label class="form-check-label">Include Date</label>
       </div>
-    </div>
-    <div class="col-lg-2">
       <div class="form-check">
         <input class="form-check-input" type="checkbox" 
           [(ngModel)]="withTime" (change)="setDateString()"/>
         <label class="form-check-label">Include Time</label>
       </div>
     </div>
-    <div class="col-lg-4 font-weight-bold text-primary">{{dateString}}</div>
+    <div class="col-lg-6 font-weight-bold text-primary">
+      <div>{{dateString}}</div>
+      <div>{{dateParts | json}}</div>
+    </div>
   </div>
 </div>
 
index 69645be..072965f 100644 (file)
@@ -51,6 +51,7 @@ export class SandboxComponent implements OnInit {
     withDate = true;
     withTime = false;
     dateString: string;
+    dateParts: any;
     dateNow: string;
 
     // @ViewChild('helloStr') private helloStr: StringComponent;
@@ -407,7 +408,9 @@ export class SandboxComponent implements OnInit {
             withTime: this.withTime
         };
 
-        this.dateString = DateUtil.dateToLocaleString(new Date(), options);
+        const d = new Date();
+        this.dateString = DateUtil.dateToLocaleString(d, options);
+        this.dateParts = DateUtil.dateToParts(d, this.dateTimeZone);
     }
 }